How to display recycler view items side by side

Question

How can we display RecyclerView items side by side. i tried to do this by using FlowLayoutManager and FlexboxLayoutManager but it is showing in list format only here is the code with FlowLayoutManager:

  FlowLayoutManager flowLayoutManager = new FlowLayoutManager();
  flowLayoutManager.setAutoMeasureEnabled(true);
    listView.setLayoutManager(flowLayoutManager);

    madapter = new testingAdapter(Quran_e_Kareem.this,surah1);
    listView.setAdapter(madapter); 

here is the code with FlexboxLayoutManager:

    FlexboxLayoutManager flexboxLayoutManager = new FlexboxLayoutManager(getApplicationContext());
    //         Set flex direction.
    flexboxLayoutManager.setFlexDirection(FlexDirection.ROW);
    flexboxLayoutManager.setFlexWrap(FlexWrap.WRAP);
    flexboxLayoutManager.setAlignItems(AlignItems.FLEX_START);
    flexboxLayoutManager.setJustifyContent(JustifyContent.FLEX_START);
    listView.setLayoutManager(flexboxLayoutManager);

madapter = new testingAdapter(Quran_e_Kareem.this,surah1);
listView.setAdapter(madapter);

I am getting result list this

But i want to get this way

Any help is appreciated.

Answer 1

Use ChipsLayoutManager use following lib helps me to do same

 implementation 'com.beloo.widget:ChipsLayoutManager:0.3.7@aar'

Answer 2

Please follow the below code and make your adapter textview wrap content may it will solve your problem.

        RecyclerView recyclerView = (RecyclerView)findViewById(R.id.flex_box_recycler_view);

        // Create the FlexboxLayoutMananger, only flexbox library version 0.3.0 or higher support.
        FlexboxLayoutManager flexboxLayoutManager = new FlexboxLayoutManager(getApplicationContext());

        // Set flex direction.
        flexboxLayoutManager.setFlexDirection(FlexDirection.ROW);

        // Set JustifyContent.
        flexboxLayoutManager.setJustifyContent(JustifyContent.SPACE_AROUND);
        recyclerView.setLayoutManager(flexboxLayoutManager);

Add into xml like this:

<com.google.android.flexbox.FlexboxLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:flexWrap="wrap"
    app:alignItems="stretch"
    app:alignContent="stretch" >

Answer 3

try this

setFlexDirection as Row Reverse

Answer 4

set orientation of linearlayoutmanager for recyclerview

LinearLayoutManager layoutManager = LinearLayoutManager(activity,RecyclerView.HORIZONTAL,false)