使用FlexboxLayoutManager来实现流式布局移动开发我本无名的专栏-

在项目中经常会用到流式布局，以前一直是使用鸿洋开源的哪个版本，然后在其上进行修改，之前看到了google开源了一个FlexboxLayoutManager的控件，也可以实现流式布局，但是一直也没有细看。今天偶然又见到一篇相关的文章，这里简单做一个记录，以备以后使用。 [官方地址](https://github.com/google/flexbox-layout) 这里注意，它默认给出的版本是androidX使用的，你看一下它下面的说明，非X使用的版本在里面有说明。 好不多说，直接上代码，这里的流式布局，采用的是RecyclerView + FlexboxLayoutManager来实现的。 我这里写到了fragment里，主要是当时为了试一下新写的懒惰加载功能。 fragment_one.xml 

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"     android:layout_width="match_parent"     android:layout_height="match_parent">      <android.support.v7.widget.RecyclerView         android:id="@+id/rv_Flexbox"         android:layout_width="match_parent"         android:layout_height="match_parent"></android.support.v7.widget.RecyclerView>  </LinearLayout>  

FragmentOne.java

public class FragmentOne extends BaseFragment {      private RecyclerView rv_Flexbox;     private List<String> list_data;     private FlexBoxAdapter fAdapter;     //private FlexboxLayoutManager flexboxLayoutManager;      private Context mContext;       public FragmentOne(Context mContext) {          this.mContext = mContext;     }      @Override     protected void initView(View rootView) {         rv_Flexbox = (RecyclerView)rootView.findViewById(R.id.rv_Flexbox);         FlexboxLayoutManager flexboxLayoutManager = new FlexboxLayoutManager(mContext);         //flexDirection 属性决定主轴的方向（即项目的排列方向）。类似 LinearLayout 的 vertical 和 horizontal。         flexboxLayoutManager.setFlexDirection(FlexDirection.ROW);//主轴为水平方向，起点在左端。         //flexWrap 默认情况下 Flex 跟 LinearLayout 一样，都是不带换行排列的，但是flexWrap属性可以支持换行排列。         flexboxLayoutManager.setFlexWrap(FlexWrap.WRAP);//按正常方向换行         //justifyContent 属性定义了项目在主轴上的对齐方式。         flexboxLayoutManager.setJustifyContent(JustifyContent.FLEX_START);//交叉轴的起点对齐。         rv_Flexbox.setLayoutManager(flexboxLayoutManager);          list_data = new ArrayList<>();         fAdapter = new FlexBoxAdapter(getActivity(),list_data);         rv_Flexbox.setAdapter(fAdapter);          fAdapter.setOnItemClickLitener(new FlexBoxAdapter.OnItemClickLitener() {             @Override             public void OnItemClick(View view, int positon) {                 Log.e("FragmentOne", "行数: 52  data:" + list_data.get(positon));             }         });     }      @Override     protected int getLayoutRes() {         return R.layout.fragment_one;     }      private void initData()     {         list_data.add("这里");         list_data.add("是设置");         list_data.add("的子元素");         list_data.add("的属性");         list_data.add("设置的");         list_data.add("属性可以参考");         list_data.add("上面的介绍。效");         list_data.add("果图如");         list_data.add("下");         list_data.add("轻轻松松");         fAdapter.notifyDataSetChanged();     }      @Override     public void onFragmentLoad() {         super.onFragmentLoad();          if(list_data.size() == 0)         {             initData();         }     }      @Override     public void onFragmentLoadStop() {         super.onFragmentLoadStop();     } } 

FlexBoxAdapter.java

public class FlexBoxAdapter extends RecyclerView.Adapter<FlexBoxAdapter.myHolder> {      private Context mContext;     private List<String> list_data;     private LayoutInflater inflater;      public FlexBoxAdapter(Context mContext, List<String> list_data) {         this.mContext = mContext;         this.list_data = list_data;         this.inflater = LayoutInflater.from(mContext);     }      @NonNull     @Override     public myHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {          View view = inflater.inflate(R.layout.fragment_rv_item,viewGroup,false);          return new myHolder(view);     }      @Override     public void onBindViewHolder(@NonNull final myHolder myHolder, int i) {         myHolder.tv_title.setText(list_data.get(i));          // 如果设置了回调，则设置点击事件         if (mOnItemClickLitener != null)         {             myHolder.itemView.setOnClickListener(new View.OnClickListener()             {                 @Override                 public void onClick(View v)                 {                     int pos = myHolder.getLayoutPosition();                     mOnItemClickLitener.OnItemClick(myHolder.itemView, pos);                 }             });           }     }      @Override     public int getItemCount() {         return list_data.size();     }      class myHolder extends RecyclerView.ViewHolder     {          TextView tv_title;          public myHolder(@NonNull View itemView) {             super(itemView);              tv_title = (TextView)itemView.findViewById(R.id.tv_title);         }     }      /**      * 定义点击每项的接口      */     public interface OnItemClickLitener     {         void OnItemClick(View view, int positon);     }      private OnItemClickLitener mOnItemClickLitener;      public void setOnItemClickLitener(OnItemClickLitener mOnItemClickLitener)     {         this.mOnItemClickLitener = mOnItemClickLitener;     } } 

fragment_rv_item.xml

<?xml version="1.0" encoding="utf-8"?> <LinearLayout     xmlns:android="https://schemas.android.com/apk/res/android"     android:layout_width="wrap_content"     android:layout_height="wrap_content"     android:orientation="vertical"     android:padding="5dp"     android:layout_marginTop="8dp"     android:layout_marginLeft="8dp"     android:layout_marginRight="8dp"     android:background="@drawable/flex_item_bg">      <TextView         android:id="@+id/tv_title"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:text="标题"         android:textSize="15sp"         android:textColor="#333333"         android:layout_gravity="center"/>  </LinearLayout>  

flex_item_bg.xml

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="https://schemas.android.com/apk/res/android" android:shape="rectangle">     <!-- 填充-->     <solid android:color="#00000000"/>     <!-- 描边 -->     <stroke         android:width="1dp"         android:color="#7F7F7F" />     <!-- 圆角 -->     <corners         android:radius="2dp" /> </shape> 

对于 FlexboxLayoutManage,还有很多好玩的使用，这里给出一个兄弟的地址

FlexboxlayoutManage的其它应用