GridView height spacing - android

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"/>

Related

Center gridlayout in linearlayout

I have a Gridlayout inside a Linearlayout and want the Gridlayout to be horizontally centered (ie. same distance to the left and right):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/outerLinearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="10pt"
android:paddingRight="10pt"
android:orientation="vertical"
android:gravity="center"
tools:context=".MainActivity">
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:columnWidth="200px"
android:horizontalSpacing="0dp"
android:numColumns="auto_fit"
android:stretchMode="none"
android:verticalSpacing="0dp" />
<Button
android:id="#+id/startButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Start..."/>
</LinearLayout>
The Gridlayout is centered, but does not appear to be so, since it does not tightly wrap its content (there is still "empty space" inside the Gridlayout on the right side), even though layout_width="wrap_content" is set.
you need to use stretchMode as spacing width uniform instead of none. Set gravity as center.
There are two more options in StretchMode. Check this link
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/gridview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:columnWidth="200px"
android:gravity="center"
android:horizontalSpacing="0dp"
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:verticalSpacing="0dp" />

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>

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.

Android GridView with different items inside

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.

Center elements in GridView

I have GridView with 6 images in 2 columns. I want to display this 6 images in the middle of the screen. I set gravity properties to center but this center elements only horizontally. GridView takes whole screen.
<GridView
android:id="#+id/gridview"
android:layout_above="#id/ad" android:layout_alignParentTop="true"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="2"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:background="#ffffff"
android:gravity="center"
/>
Here is what I did to get the items in the gridview to center (notice the stretchmode, columnwidth, gravity and horizontal and vertical spacing):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:padding="5dp" >
<GridView
android:id="#+id/gridview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnWidth="100dp"
android:gravity="center"
android:horizontalSpacing="10dp"
android:numColumns="3"
android:stretchMode="spacingWidthUniform"
android:verticalSpacing="10dp" />
</LinearLayout>
It took me a while to figure it out, but messing with those different values I was able to get them to center.
Try wrapping your GridView in a LinearLayout that has it's child elements centered and change your gridview's layout_height to "wrap_content". ex:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:gravity="center"
android:layout_gravity="center">
<GridView
android:id="#+id/homeGridView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:numColumns="3"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center" />
</LinearLayout>
Need to set the following attributes:
android:stretchMode="columnWidth"
...and...
android:gravity="center"
well, in case you are using a custom adapter thing to inflate single rowview inside your gridview then try to add android:gravity="center" to the layout of your single_row.. this will do the trick hopefully :)
i.e,
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical" >
<ImageView
android:id="#+id/ivClrBlock"
android:layout_width="88dp"
android:layout_height="88dp"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
/>
<TextView
android:id="#+id/tvClrName"
android:layout_width="88dp"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:gravity="center"
android:text="#string/color_name"
android:textSize="15sp" />
</LinearLayout>
Issue occurred when I updated the gridview adapter from:
gridView = inflater.inflate(R.layout.mobile, null);
to
gridView = inflater.inflate(R.layout.mobile, parent, false);
so I just reversed back using a try catch if the old (null) version failed.
Try to change this:
android:layout_height="fill_parent"
into
android:layout_height="wrap_content"
You are now telling your grid view to fill it's parent height and width fully.
Here is my answer:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/linearLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<GridView
android:id="#+id/gridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnWidth="100dip"
android:gravity="center"
android:numColumns="3"
android:stretchMode="spacingWidthUniform"
android:verticalSpacing="10dip" />
</LinearLayout>
Don't use padding or horizontalSpacing if you don't need it as it may cause problems with other views.
Note also that fill_parent is already deprecated.
I hope this will solve your problem:
<LinearLayout
android:layout_gravity="center_horizontal"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<GridLayout
android:id="#+id/gridlayou4x3"
android:rowCount="4"
android:columnCount="3"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="80"
android:minWidth="25px"
android:minHeight="25px" />
</LinearLayout>
I found that you just have the gridlayout wrap content on height and width.
android:layout_centerHorizontal="true"
It will center itself for the size it needs but if you have it matching the parent. You are technically centering it based with a lot of parent empty space offsetting your children.

Categories

Resources