Android流式布局盒子布局RecyclerView+FlexboxLayoutManager实现

导入依赖

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

xml文件

 <androidx.recyclerview.widget.RecyclerView
           android:id="@+id/flow"
           android:background="@color/white"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"/>

Activity中代码

这里省略找控件和设置适配器的代码，正常写就行，重点是设置recyclerview的LayoutManager

		//设置布局管理器  流式布局 盒子布局
 		FlexboxLayoutManager flexboxLayoutManager = new FlexboxLayoutManager(this);
		//flexDirection 属性决定主轴的方向（即项目的排列方向）。类似 LinearLayout 的 vertical和horizontal。
		flexboxLayoutManager.setFlexDirection(FlexDirection.ROW); //主轴为水平方向，起点在左端。
        //flexWrap 默认情况下 Flex 跟 LinearLayout 一样，都是不带换行排列的，但是flexWrap属性可以支持换行排列。
        flexboxLayoutManager.setFlexWrap(FlexWrap.WRAP); //按正常方向换行
        //justifyContent 属性定义了项目在主轴上的对齐方式。
        flexboxLayoutManager.setJustifyContent(JustifyContent.FLEX_START); //交叉轴的起点对齐。
        //设置布局管理器
        flow.setLayoutManager(flexboxLayoutManager);
        //设置recyclerview的适配器 这是用BaseRecyclerViewAdapterHelper写的适配器 不熟悉可以换成你自己的适配器
       	BaseQuickAdapter<String, BaseViewHolder> mFlowAdapter = new BaseQuickAdapter<String, BaseViewHolder>(R.layout.item, list) {
            @Override
            protected void convert(@NonNull BaseViewHolder helper, String item) {
                helper.setText(R.id.tv,item);
            }
        };
        flow.setAdapter(mFlowAdapter);

适配器的item

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingStart="@dimen/dp15"
    android:paddingEnd="@dimen/dp15"
    android:paddingTop="@dimen/dp6"
    android:paddingBottom="@dimen/dp3"
    android:layout_margin="@dimen/dp7"
    android:id="@+id/tv"
    android:background="@drawable/shape_round17_f5f6f7">

TextView>

shape文件

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle"
    >
    <corners  android:radius="16dp"/>
    <solid android:color="#F5F6F7" />
shape>