Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to center GridView correctly?

I have been trying and trying and no such luck. I have lucked at all other answers on here as well related to centering GridView and also no luck. This is my GridView xml:

<GridView
        android:id="@+id/calendar_grid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:numColumns="7"
        android:columnWidth="40dp"
        android:verticalSpacing="1dp"
        android:horizontalSpacing="1dp"
        android:paddingTop="2dp"
        android:stretchMode="columnWidth"
        android:layout_gravity="right"
        android:gravity="right"
        android:background="#696969" ></GridView>

I have tried every combination I can think of, but not much has worked. At least its not consistent between devices. This is an image of what it always does.

enter image description here

As you can see on the right side of the GridView, there is spacing. I try to constantly change that, and it almost never works. Using android:stretchMode does change it, but it messes up the spacing I have between the cells, so thats not working. Using Gravity also fails as you can see. I've tried all the other values for it and it still changes nothing. It's stuck to the left. I also find it weird that trying to change the size of android:columnWidth from anything under 40 it does nothing either. And when I increase 40 to 45, it also changes nothing. But changing it to 50 makes the space on the right go away. But when putting it on my phone, the spacing is there! I skipped this like 2 weeks ago to continue working on other stuff but it looks like I have yet to solve this issue or even understand why nothing I try works.

If it helps anyone help me out here I can also provide the xml for what makes the cells. But I am not sure if it matters. But here it is:

<?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:orientation="vertical" >
    <TextView 
        android:id="@+id/day_num"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textSize="10dp"
        android:background="#000000"
        android:height="35dp"
        android:gravity="center_vertical|center_horizontal" />


</LinearLayout>

If it helps, the GridView's parent is a LinearLayout with this:

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:layout_weight="0"
    android:gravity="center" >

There is also a sibling with a weight of 1, but I don't think that should be effecting is as the weight of 0 makes that part set its space first.

EDIT:

So I have kept playing with it, very annoyed, especially since not that many people seem to have this issue, but it looks like no matter how small I make the columnWidth, the GridView barely gets any smaller. In fact, that same gap you see is what it stays at until I go to 50dp. But when I go in portrait mode the gap reappears, so I raise it up to 90dp (I tried under that, didn't change anything), and it goes away. Weird thing is the GridView doesn't change besides the filling of the gap. So I could make it 200dp, and it would look perfect on my screen dimen, and any other smaller screen. Once I go to a tablet, I suspect I would need to increase that more, but the point is, this is weird behavior. Has anyone encountered this?

like image 281
Andy Avatar asked Jul 19 '12 04:07

Andy


People also ask

How to center GridView in android studio?

You would just need to use android:layout_gravity="center" as its LinearLayout's child. Hope it helps.

How do you align grid items in Center flutter?

There is a very simple way. Just set shrinkWrap: true which makes the GridView to take minimum space and wrap the GridView with Center widget.


4 Answers

You may want to put your GridView inside a RelativeLayout and then set GridView's layout_centerInParent property to true. something like this:

<?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/calendar_grid"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:numColumns="7"
            android:columnWidth="40dp"
            android:verticalSpacing="1dp"
            android:horizontalSpacing="1dp"
            android:paddingTop="2dp"
            android:stretchMode="columnWidth"
            android:background="#696969"
            android:layout_centerInParent="true" />

</RelativeLayout>

RelativeLayout gives you much better control over positions of children.

like image 148
Aleks G Avatar answered Oct 05 '22 11:10

Aleks G


Here is my working configuration:

        <GridView
        android:id="@+id/gridView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:cacheColorHint="@color/white"
        android:verticalSpacing="10dp"
        android:horizontalSpacing="10dp"
        android:numColumns="3"
        android:padding="5dp"
        android:scrollbars="none"
        android:stretchMode="columnWidth"
        android:gravity="center"
        />
like image 29
Roger Alien Avatar answered Oct 05 '22 12:10

Roger Alien


you need to set Gravity of Parent Layout of TextView or LayoutGravity of TextView, Plz change Cell Layout as follows:

<?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:orientation="vertical" 
    android:gravity="center_vertical|center_horizontal" >
    <TextView 
        android:id="@+id/day_num"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textSize="10dp"
        android:background="#000000"
        android:height="35dp"
        />


</LinearLayout>
like image 44
jeet Avatar answered Oct 05 '22 10:10

jeet


I've encountered the same problem and RelativeLayout with centerInParent did not help either.

Basically, the division may contain a remainder that will be cut off according to the screen width.

so, the only way to center the GridView was to calculate a width that would fit with no remainder and use the remainder value as the padding.

WindowManager manager = window.getWindowManager();
int  screenWidth      = manager.getDefaultDisplay().getWidth();
int contentWidth      = screenWidth;

while( 0 != contentWidth%COLUMN_NUMBER ) contentWidth--;

columnWidth = contentWidth / COLUMN_NUMBER;
int padding = screenWidth - contentWidth;

then, when you create your GridView:

gridView.setColumnWidth(columnWidth);
gridView.setPadding(padding / 2, 0, padding / 2, 0);
like image 42
shi Avatar answered Oct 05 '22 10:10

shi