Android GridView with different items inside - android

I followed the Hello grid view turtorial at here. I was wondering is there a way to add buttons along side the images in a grid view? if so how can i do it?

You could try something like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/RelativeLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="300dp"
android:columnWidth="90dp"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center"
/>
<Button
android:id="#+id/bAdd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Add RES"
android:layout_below="#+id/gridview" />
</RelativeLayout>
Hope that helps.

Related

How to set the screens size of Grid view to match all screen sizes?

Here i have used a gridview but it is not changing according to the screen size.I think there is a problem with height.the xml used for gridview is given below.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:background="#drawable/bg"
android:orientation="vertical" >
<GridView
android:id="#+id/gridView1"
android:numColumns="3"
android:gravity="center"
android:paddingTop="20dp"
android:horizontalSpacing="10dp"
android:verticalSpacing="10dp"
android:stretchMode="columnWidth"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/linearLayout1"
android:layout_centerVertical="true"
>
</GridView>
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
<com.assuretech.ku.HorizontalMenuBar
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</RelativeLayout>
From what I can see. You need to close the RelativeLayout at the end. I've included my screenshot of your code with it closed. I changed the background to red to see the text.
I guess you are looking for
numColumns = "auto_fit"
as GridView attribute
Firstly you must be using some layout to put your gridview in. Do the following:
Make height and width of the layout to fill parent:
android:layout_width="fill_parent"
android:layout_height="fill_parent"
then, set height and width of your gridview to fill_parent as well.
Well, this is just a supposed solution that you might have been working this way
Hope this works for you.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="30dp">
<GridView
android:id="#+id/grid_images"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnWidth="100dp"
android:gravity="center"
android:horizontalSpacing="10dp"
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:verticalSpacing="15dp">
</GridView>
</LinearLayout>

GridView height spacing

For some reason I dont understand, there is a spacing between my grid's rows while I clearly have set vertical spacing to 0. I tried playing with different width and height settings in both my grid's xml and in the image's xml (the grid component).
this is what i have:
and this is what i want:
you can see grid xml and the image xml below:
grid:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<GridView
android:id="#+id/gridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:columnWidth="144dp"
android:horizontalSpacing="0dp"
android:verticalSpacing="0dp"
android:numColumns="auto_fit"
android:stretchMode="spacingWidthUniform" >
</GridView>
</RelativeLayout>
image:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" />
</RelativeLayout>
I guess follwoing one of the optins will solve ut issue :
set imageview.setAdjustViewBounds(true); in adapter
Or
<GridView
android:stretchMode="none">
</GridView>
Try this
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/MyGrid"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="0dp"
android:verticalSpacing="2dp"
android:horizontalSpacing="2dp"
android:clipChildren="true"
android:alwaysDrawnWithCache="true"
android:numColumns="auto_fit"
android:columnWidth="100dp"
android:stretchMode="columnWidth"
android:gravity="center_horizontal"/>

Simple GridView to view pics in android

I have GridView that displayes image from a JSON
[Image]
My xml for grid view is ::
restaurant_desc_photos.xml
<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/listview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="auto_fit"
android:columnWidth="90dp"
android:horizontalSpacing="10dp"
android:verticalSpacing="10dp"
android:gravity="center"
android:stretchMode="columnWidth" >
</GridView>
grid_view_image.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+id/flag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="#000000"
android:padding="1dp" />
</RelativeLayout>
How to make make changes so that i could reflect my output as ::
Horizontal scrolling is also important here
Any IDEAS
Thanks
Only way to do it is use two way grid view library use this following link for library
https://github.com/jess-anders/two-way-gridview
1) add that library to the project
2) change the package names accordingly in the xml layout where you will be inserting the horizontal scroll view
snippet:
<com.future.android.app.library.slidinggridview.TwoWayGridView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#id/fragment_product_twgv_grid"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="5dp"
android:visibility="gone"
app:cacheColorHint="#ffe8e8e8"
app:columnWidth="300dp"
app:horizontalSpacing="10.0dip"
app:numColumns="auto_fit"
app:numRows="2"
app:rowHeight="290dp"
android:fastScrollEnabled="true"
app:scrollDirectionLandscape="horizontal"
app:scrollDirectionPortrait="vertical"
app:stretchMode="spacingWidthUniform"
app:verticalSpacing="10.0dip" />
you can set the number of columns accordingly and width and height too.

adding button to a gridview in android

I know that it may be a silly question...but I'm new to android...I have an gridview layout in my project and I used "android developer" code for writing the code...so the xml code of layout is like this :
<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnWidth="90dp"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center"
/>
now I want to add a button to the gridview but I can't do it with drag and drop...I've tried to write the xml code of adding button but I've got this error :
"Error in an XML file: aborting build."
can anyone help me with this problem ?
If you want the Button to be below the GridView, use something like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:orientation="vertical" >
<GridView
android:id="#+id/gridFriends"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:clipChildren="true"
android:columnWidth="100dp"
android:gravity="center"
android:numColumns="auto_fit"
android:scrollbars="none"
android:stretchMode="columnWidth" >
</GridView>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingBottom="5dp"
android:paddingLeft="9dp"
android:paddingRight="9dp"
android:paddingTop="5dp" >
<ImageButton
android:id="#+id/imgbtnDemo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
android:background="#null"
android:gravity="center"
android:src="#drawable/ic_contact_picture" >
</ImageButton>
</LinearLayout>
</LinearLayout>
If you want a Button in every cell in the GridView, you will have to use a Custom GridView that uses an Adapter. An exmaple XML snippet for the custom cell in the GridView:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainContainer"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp" >
<FrameLayout
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:gravity="center" >
<ImageView
android:id="#+id/imgProfilePicture"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:src="#null" />
<ImageButton
android:id="#+id/imgbtnDemo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
android:background="#null"
android:gravity="center"
android:src="#drawable/ic_contact_picture" >
</ImageButton>
</FrameLayout>
</RelativeLayout>
NOTE: In the XMLS snippets in the post, I am using ImageButton's. Change them and any necessary attributes to that of a Button. It is merely an illustration. You should be able to connect the dots though. ;-)
if you are familiar with the concept of custom ListViews, with a few modifications, you will be able to implement a custom GridView too. If you are not familiar with custom ListViews or GridViews, follow this tutorial to see how to create a custom GridView: http://www.coderzheaven.com/2012/02/29/custom-gridview-in-android-a-simple-example/.
Or use this Google Search for more tutorials on custom GridView's.
And this is a link to an answer of mine on SO. It has the complete solution. Use what logic suits your purpose.

Android XML Layout Help: How to layout UI so an ad is always visible

I have playing around with my XML layout for what seems like weeks now, and i just cannot get it to work how i would like it to.
I would like the admob ad to always been visible at the bottom of the screen, I have tried to do it like this, but because the gridview is graphically intensive i think the admob ad is being left behind somewhat.(It only shows 30% of the time, roughly)
Hopefully someone will be able to show me how to lay it out correctly. I.E Force the ad at the bottom of the screen!
Thanks
Lucy
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView android:id="#+id/ImageView03"
android:src="#drawable/banner_gallery"
android:layout_height="60dp"
android:layout_width="fill_parent"></ImageView>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview" android:layout_width="fill_parent"
android:layout_height="fill_parent" android:columnWidth="90dp"
android:numColumns="auto_fit" android:verticalSpacing="7dp"
android:horizontalSpacing="7dp" android:stretchMode="columnWidth"
android:gravity="center" android:layout_gravity="bottom"
android:layout_marginTop="10dp"></GridView>
<RelativeLayout
android:layout_marginTop="-50dip"
android:gravity="bottom"
android:layout_height="wrap_content"
android:layout_width="fill_parent">
<com.admob.android.ads.AdView
android:id="#+id/ad"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</RelativeLayout>
</LinearLayout>
Use Relative Layout as parent layout instead of linear layout and use android:layout_alignParentBottom="true" to the relative layout of addview
Try something like this. You only need one RelativeLayout and then layout the different views according to each other,
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView android:id="#+id/ImageView03"
android:src="#drawable/banner_gallery"
android:layout_height="60dp"
android:layout_alignParentTop="true"
android:layout_width="fill_parent"/>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview" android:layout_width="fill_parent"
android:layout_height="fill_parent" android:columnWidth="90dp"
android:numColumns="auto_fit" android:verticalSpacing="7dp"
android:horizontalSpacing="7dp" android:stretchMode="columnWidth"
android:layout_below="#id/ImageView03"
android:layout_above="#id/ad"
android:layout_marginTop="10dp"/>
<com.admob.android.ads.AdView
android:layout_alignParentBottom="true"
android:id="#+id/ad"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>

Categories

Resources