Filling the whole screen with Gridview items

Question

I have a GridView (with 2 columns and 2 rows) and want to stretch the rows to fill the whole screen. It should look the same on all devices.

That means I don't want some empty space under the last row. So I searched a little bit and found a solution to set the minimum height of the GridView dynamically with following code:

DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);

int width = metrics.widthPixels;
int height = metrics.heightPixels;

In addition I added these lines of code in my Adapter:

gridView = inflater.inflate(R.layout.act_main_menu_sub, null);
gridView.setMinimumHeight(ActMainMenu.height/2);

But now it looks like this:

The View is scrollable now and the items have the same size. But it doesn't fit on the screen.

Here is the code of my layout including the GridView:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          xmlns:app="http://schemas.android.com/apk/res-auto"
          android:id="@+id/layout_main_menu"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:background="#b2b2b2"
          android:orientation="vertical">

<!-- android:layout_height="wrap_content" -->
<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:fitsSystemWindows="true"
    android:minHeight="?attr/actionBarSize"
    android:padding="2dp"
    app:titleMarginStart="20dp"
    app:titleTextAppearance="@style/MyMaterialTheme.Base.TitleTextStyle"
    app:titleTextColor="@color/textColorPrimary">

    <TextView
        android:id="@+id/toolbar_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="MASTERFITNESS TRAINERSCHULUNG"
        android:textColor="@android:color/white"
        android:textStyle="bold|italic"/>

</android.support.v7.widget.Toolbar>


<!--android:columnWidth="160dp"-->
<GridView
    android:id="@+id/grid_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="10dp"
    android:gravity="center"
    android:horizontalSpacing="20dp"
    android:numColumns="2"
    android:stretchMode="columnWidth"
    android:verticalSpacing="20dp"></GridView>

</LinearLayout>

What is the problem here?

Maybe inside gridView.setMinimumHeight(ActMainMenu.height/2) you have to take in account the padding, did you try? — Beppi's, Jan 22 '17 at 15:32

score 1 · Accepted Answer · edited May 23 '17 at 11:46

The problem with your 2nd screen shots in the height calculation. metrics.heightPixels gives you the full height of the screen, including the toolbar and any margins you have. These should 1st be subtracted out, then divide the screen in half.

    DisplayMetrics metrics = new DisplayMetrics();
    getWindowManager().getDefaultDisplay().getMetrics(metrics);

    // your layout has 10dp margin (top & bottom) + 20 dp between grid items, 10+10+20=40
    int marginSizeDp = 40;
    float scale = metrics.density;
    int marginSizePx = Math.round (marginSizeDp * scale);

    int appBarHeight = getAppBarHeight();

    int height = metrics.heightPixels;
    int minHt = Math.round((height - marginSizePx - appBarHeight)/2);
    gridView.setMinimumHeight(minHt);

Get the toolbar height thanks to AZ13 at https://stackoverflow.com/a/7167086/7292819

    // returns height of app bar in pixels
    private int getAppBarHeight() {
        final TypedArray styledAttributes = getTheme().obtainStyledAttributes(
                new int[] { android.R.attr.actionBarSize });
        int appBarHeight = (int) styledAttributes.getDimension(0, 0);
        styledAttributes.recycle();

        return appBarHeight;
    }

Truthfully, if this layout is static (there's only 4 items, no scrolling, little or no changing of the content of each item), I probably wouldn't bother with a GridView & adapter. A RelativeLayout or GridLayout might be better.

Thank you. I decided to use LinearLayout with weights. This works very well. Thank you for your tip. — Deno Agüero, Apr 01 '17 at 13:12
I was thinking about that last night after I finished this answer. Was going to add weighted LinearLayout this morning. You will get warnings about nested weights but I don't think performance will be affected much on a simple layout like this. — Gary99, Apr 01 '17 at 13:27

Filling the whole screen with Gridview items

1 Answers1