如何在 Android 上的 RecyclerView 中使用 GridLayoutManager

Question

In my application I have recyclerView and for this I should use GridLayoutManager and set 2 items per column.

I want set this 2 items fit of screen, each items sticky to screen. Such as below image:

I write below codes, but after run application show me such as this:

And I want set 120dp for layout_width and layout_height !

My XML code:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/rowMasterQuestion_root"
    android:layout_width="@dimen/_120mdp"
    android:layout_height="@dimen/_120mdp"
    android:background="@drawable/gray_border">

    <TextView
        android:id="@+id/rowMasterQuestion_title"
        android:layout_width="@dimen/_120mdp"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/_15mdp"
        android:gravity="center_horizontal"
        android:textColor="@color/black"
        android:textSize="@dimen/_9font_mdp"
        android:visibility="visible"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/rowMasterQuestion_answer"
        android:layout_width="wrap_content"
        android:layout_height="@dimen/_15mdp"
        android:layout_marginLeft="@dimen/_10mdp"
        android:layout_marginRight="@dimen/_10mdp"
        android:layout_marginBottom="@dimen/_20mdp"
        android:gravity="center"
        android:paddingLeft="@dimen/_5mdp"
        android:paddingRight="@dimen/_5mdp"
        android:textColor="@color/white"
        android:textSize="@dimen/_8font_mdp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

My Activity codes:

requestMain_childList.apply {
            layoutManager = GridLayoutManager(this@RequestMainPage, 2, GridLayoutManager.VERTICAL, false)
            hasFixedSize()
            adapter = masterChildAdapter
}

How can I fix this issue?

Answer 1

This is tricky because you are wanting a different layout gravity for each item, depending on the column. I think that will have to be set in the RecyclerView.Adapter.onBindViewHolder function.

First, wrap the ConstraintLayout of your item view in a FrameLayout. Make the width of the outer FrameLayout match_parent so it will fill its column in the RecyclerView. You can also give the FrameLayout the amount of start/end padding you want to hold the items away from the sides of the screen.

<FrameLayout 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="wrap_content"
    android:paddingStart="16dp"
    android:paddingEnd="16dp">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/wrappedView"
        android:layout_width="@dimen/_120mdp"
        android:layout_height="@dimen/_120mdp"
        ...>

    ...

    </androidx.constraintlayout.widget.ConstraintLayout>
</FrameLayout>

Then in onBindViewHolder , you can set the gravity of the inner view to the left or right depending on which column it is in (even or odd data position).

    override fun onBindViewHolder(holder: MyViewHolder, position: Int) {
        // ...
        val innerView = holder.wrappedView // or however you have it stored in view holder
        (innerView.layoutParams as FrameLayout.LayoutParams).gravity = Gravity.CENTER_VERTICAL or 
                (if (position % 2 == 0) Gravity.START else Gravity.END)
    }

Note, if you want the items to be centered in their columns instead, this is much easier. You can just set the gravity of the inner view to center in the XML and you don't have to do anything in the Adapter.