Does anyone know how to do flow layout using RecyclerView?

Question

Does anyone know how to do flow layout using RecyclerView?

How to change span count dynamically?

Answer :

Undeniable

Can you please explain in detail ? – Godunov

i want design like in above picture, i think this can be achieved by recycler-view but don't know how to do it – Undeniable

github.com/hongyangAndroid/FlowLayout this may help you. – Formfitting

Thankyou @DhinakaranThennarasu – Undeniable

Have you managed to find a solution for this? All the libraries that are out there, are just adding views to the ViewGroup, no recycling is involved. – Coagulant

Answer 1

Here is the full example of using custom Library which acts like List GitHubLibrary TagLayout

• Sample Code:-

mFlowLayout.setAdapter(new TagAdapter<String>(mVals) { @Override public View getView(FlowLayout parent, int position, String s) { TextView tv = (TextView) mInflater.inflate(R.layout.tv, mFlowLayout, false); tv.setText(s); return tv; } });

Using below code you can pre set selection you wanted:-

mAdapter.setSelectedList(1,3,5,7,8,9);

Will show result like below:-

Vocalic

how can I add multiple sections of tags? I want to do it dynamically – Spindling

Answer 2

Best solution is to use a RecyclerView with google FlexLayoutManager

// Set layout manager
    val layoutManager = FlexboxLayoutManager(context)
    recyclerview.layoutManager = layoutManager

// Now you can add your normal recyclerview adapter

recyclerview.adapter = MyListAdapter(list)

Add below dependency in your build.gradle file

 implementation 'com.google.android:flexbox:3.0.0'

This will work like a charm.

Prang

saved my day... easiest solution – Vtol

this should be the accepted answer, kudos! – Ruffner

Answer 3

You can use FlowLayout and put it as a child of ScrollView. Samples for flow layout are available in repository.

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

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

        <com.wefika.flowlayout.FlowLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="start|top"
            android:minHeight="50dp">

            <Button
                android:id="@+id/button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="New Button" />

            <Button
                android:id="@+id/button1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="New Button" />

            <Button
                android:id="@+id/button2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="New Button" />

            <Button
                android:id="@+id/button3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="New Button" />
        </com.wefika.flowlayout.FlowLayout>


        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello world" />

    </LinearLayout>

</ScrollView>

Also you can add or remove views programatically using following methods given in sample.

 public void addItem(View view) {

        int color = getResources().getColor(R.color.holo_blue_dark);

        View newView = new View(this);
        newView.setBackgroundColor(color);

        FlowLayout.LayoutParams params = new FlowLayout.LayoutParams(100, 100);
        params.rightMargin = 10;
        newView.setLayoutParams(params);

        mFlowLayout.addView(newView);
    }

    public void removeItem(View view) {

        mFlowLayout.removeView(getLastView());

    }

    public void toggleItem(View view) {

        View last = getLastView();

        if(last.getVisibility() == View.VISIBLE) {
            last.setVisibility(View.GONE);
        } else {
            last.setVisibility(View.VISIBLE);
        }

    }

    private View getLastView() {
        return mFlowLayout.getChildAt(mFlowLayout.getChildCount() - 1);
    }

Godunov