How to center items of a recyclerview?

I need to center elements in each row so they will be like in this mockup. I've been searching if there is any layout that works that way without look. items are centered in their rows.

mockup

This is how it looks now in my code. enter image description here

Solution 1:

Make recyclerview width to wrap_content and its container's layout_gravity to center_horizontal

 <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="vertical">

      <android.support.v7.widget.RecyclerView
           android:id="@+id/recycrer_view"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_gravity="center_horizontal"
           android:paddingLeft="16dp"
           android:paddingRight="16dp" />
 </LinearLayout>

Solution 2:

Take LinearLayout in your RecyclerView's item row layout then give android:layout_gravity="center" to LinearLayout.

For each row of images you have to take different LinearLayout.

Here is example code:

 <LinearLayout
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="center"
         android:orientation="horizontal">

            <ImageView
                android:id="@+id/image1"
                android:layout_width="64dp"
                android:layout_height="64dp"
                android:layout_marginRight="10dp"
                android:layout_weight="1"
                android:src="@drawable/image1" />

            <ImageView
                android:id="@+id/image2"
                android:layout_width="64dp"
                android:layout_height="64dp"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:layout_weight="1"
                android:src="@drawable/image2" />

           <ImageView
                android:id="@+id/image3"
                android:layout_width="64dp"
                android:layout_height="64dp"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:layout_weight="1"
                android:src="@drawable/image3" />

  </LinearLayout>

Solution 3:

Achieved with:

recycler.adapter = MyAdapter()
val layoutManager = FlexboxLayoutManager( context: this)
layoutManager.justifyContent = JustifyContent.CENTER
layoutManager.alignItems = AlignItems.CENTER
layoutManager.flexDirection = FlexDirection. ROW layoutManager.flexWrap = FlexWrap.WRAP
my recycler.layout Manager = = layout Manager

enter image description here

Solution 4:

I am assuming that you are using a LinearLayoutManager with a RecyclerView for a ListView-style effect. In that case, use a horizontal LinearLayout for each row, with android:gravity="center" to center its contents.

Solution 5:

Use FlexboxLayout from com.google.android:flexbox library. Note the flexwrap and justifyContent property values. Then, set layout_wrapBefore = true on the view that you want to wrap the line of items before.

    <com.google.android.flexbox.FlexboxLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:flexWrap="wrap"
        app:justifyContent="center">

        <View ... />

        <View app:layout_wrapBefore="true" ... />

        <View ... />

    </com.google.android.flexbox.FlexboxLayout>