How to center ImageView in GridLayout?

Question

I have a full screen grid layout with 8 rows of 7 ImageView. I need all the rows centered without spaces between them (now I have as result the image I uploaded). The space must be only on the top and on the bottom. I already tried to find a solution on the Internet but I haven't found one.

XML:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <GridLayout
        android:id="@+id/gameGrid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerVertical="true"
        android:rowCount="8"
        android:columnCount="7"
        >
        <!-- ROW 1-1 -->
        <ImageView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:id="@+id/cellR1-1"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            app:srcCompat="@drawable/dl"
            />
        <!-- ROW 1-2 -->
        <ImageView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:id="@+id/cellR1-2"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            app:srcCompat="@drawable/dl"
            />
        <!-- ROW ... -->
    </GridLayout>
</RelativeLayout>

I tried as solution to set all the ImageViews height same as the width but my code didn't worked:

void setGrid(){
    //setting the cell height as the cell widht
    int imagWidth = cell[0][0].getLayoutParams().width;
    for(int r=0;r<rowCount;r++)
        for(int c=0;c<columnCount;c++) {
            cell[r][c].getLayoutParams().height = imagWidth;
            cell[r][c].requestLayout();
        }
}

Image:

There is something you know.I'm sure you can do with gridLayout. How about recyclerview ?. You need to search recyclerview and GridLayoutManager. You can some answers https://stackoverflow.com/questions/40587168/simple-android-grid-example-using-recyclerview-with-gridlayoutmanager-like-the — Volkan Sonmez, Mar 10 '19 at 20:35
You've stated what you desire to achieve- but what is your code producing right now? That way we can try to fix it. — Shane Sepac, Mar 10 '19 at 21:01
the image i uploaded. If you are referring to the code that i wrote to fix it changes nothing(see image) — Lorenzo, Mar 10 '19 at 21:06

score 1 · Answer 1 · answered Mar 11 '19 at 06:32

It might be helpful to you, use the RecyclerView instead of GridLayout

RecyclerView.LayoutManager recyclerViewLayoutManager = new GridLayoutManager(getApplicationContext(), 7); // 7 means how many column you want you can change according to your requirement.
recyclerView.setLayoutManager(recyclerViewLayoutManager);

Masoud Mokhtari · Accepted Answer · 2019-03-11T06:57:21.870

Try using RecyclerView with GridLayoutManager like below:

GridLayoutManager layoutManager = new GridLayoutManager(getContext(), 7);
            YourAdapter adapter = new YourAdapter();
            recyclerView.setLayoutManager(layoutManager);
            recyclerView.setAdapter(adapter);

            int spacing = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 16,
                    Objects.requireNonNull(getContext()).getResources().getDisplayMetrics());
            recyclerView.addItemDecoration(new RecyclerView.ItemDecoration() {
                @Override
                public void getItemOffsets(@NotNull Rect outRect, @NotNull View view, @NotNull RecyclerView parent, @NotNull RecyclerView.State state) {

                    if (parent.getChildAdapterPosition(view) == Objects.requireNonNull(parent.getAdapter()).getItemCount() - 1) {
                        outRect.bottom = spacing;
                    }
                    if (parent.getChildAdapterPosition(view) == 0) {
                        outRect.top = spacing;
                    }
                }
            });

Other solution is: Instead of adding padding to both the top and bottom items, You can just add the padding to the top and bottom of your RecyclerView and set the clipToPadding attribute to false.

<android.support.v7.widget.RecyclerView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipToPadding="false"
    android:paddingTop="8dp"
    android:paddingBottom="8dp" />

How to center ImageView in GridLayout?

2 Answers2