Android RecyclerView网格布局（支持多种分割线）详解(2)

概述上篇AndroidRecyclerView详解(1)―线性布局记录了下RecyclerView的使用方法，并且讲述了线性布局列表的使用方法，在此基础上加上了万能分割线，支持颜色分割线和图片分割线，同时支持对分割线设置线宽。

上篇Android RecyclerView 详解(1)―线性布局

记录了下RecyclerVIEw的使用方法，并且讲述了线性布局列表的使用方法，在此基础上加上了万能分割线，支持颜色分割线和图片分割线，同时支持对分割线设置线宽。
这篇是总结一下网格布局的使用，同样也支持两种分割线和线宽的设置。

主要的相关类：

1. RecyclerVIEw.Adapter

2. GrIDLayoutManager 网格布局管理器

3. RecycleVIEw.Itemdecoration 分割线

下面就直接通过一个例子来展示：

先上效果图：

(1) 颜色分割线

看起来还不错吧，根据item的数量去显示格子，当然如果你需要的样式不是三列，这个很简单，只需要在设置
GrIDLayoutManager的时候设置相应的列数即可，即：

mManagerLayout = new GrIDLayoutManager(getActivity(),3);

(2) 图片分割线

可能有人会说你的列表四周都有分割线，其实在不做特殊处理时左边和上面默认是没有分割线的。后面我会加上四周没有分割线的，其实这两种形式在实际开发中都是常见的，先来看四周都有边线的。

由于RecycleVIEw是高度解耦的控件，绘制分割线只和 RecycleVIEw.Itemdecoration 有关，所以我们只需关心怎么去继承 RecycleVIEw.Itemdecoration 去实现我们所需的分割线，如下：

这里需要说明的是：颜色分割线和图片分割线原理是完全一样的，图片分割线只是将一张很细的图片传入即可。

public class GrIDdivIDer extends RecyclerVIEw.Itemdecoration {  private Drawable mdivIDerDarwable;  private int mdivIDerHight = 1;  private Paint mcolorPaint;  public final int[] ATRRS = new int[]{androID.R.attr.ListdivIDer};  public GrIDdivIDer(Context context) {    final TypedArray ta = context.obtainStyledAttributes(ATRRS);    this.mdivIDerDarwable = ta.getDrawable(0);    ta.recycle();  }  /*   int divIDerHight 分割线的线宽   int divIDercolor 分割线的颜色   */  public GrIDdivIDer(Context context,int divIDerHight,int divIDercolor) {    this(context);    mdivIDerHight = divIDerHight;    //绘制颜色分割线的画笔    mcolorPaint = new Paint();    mcolorPaint.setcolor(divIDercolor);  }  /*   int divIDerHight 分割线的线宽   Drawable divIDerDrawable 图片分割线   */  public GrIDdivIDer(Context context,Drawable divIDerDrawable) {    this(context);    mdivIDerHight = divIDerHight;    mdivIDerDarwable = divIDerDrawable;  }  @OverrIDe  public voID onDraw(Canvas c,RecyclerVIEw parent,RecyclerVIEw.State state) {    super.onDraw(c,parent,state);    //画水平和垂直分割线    drawHorizontaldivIDer(c,parent);    drawVerticaldivIDer(c,parent);  }  public voID drawVerticaldivIDer(Canvas c,RecyclerVIEw parent) {    // 这里传入的parent是recyclevIEw，通过它我们可以获取列表的所有的元素，    // 这里我们遍历列表中的每一个元素，对每一个元素绘制垂直分割线    final int childCount = parent.getChildCount();    for (int i = 0; i < childCount; i++) {      final VIEw child = parent.getChildAt(i);      //获取当前item布局参数，通过它可以知道该item的精确位置，我们通过这个位置去绘制它的分割线      final RecyclerVIEw.LayoutParams params = (RecyclerVIEw.LayoutParams) child.getLayoutParams();      final int top = child.gettop() - params.topmargin;      final int bottom = child.getBottom() + params.bottommargin;      int left = 0;      int right = 0;      //左边第一列，      if ((i % 3) == 0) {        //item左边分割线        left = child.getleft();        right = left + mdivIDerHight;        mdivIDerDarwable.setBounds(left,top,right,bottom);        mdivIDerDarwable.draw(c);        if (mcolorPaint != null) {//如果是颜色分割线          c.drawRect(left,bottom,mcolorPaint);        }        //item右边分割线        left = child.getRight() + params.rightmargin - mdivIDerHight;        right = left + mdivIDerHight;      } else {        //非左边第一列        left = child.getRight() + params.rightmargin - mdivIDerHight;        right = left + mdivIDerHight;      }      //画分割线      mdivIDerDarwable.setBounds(left,bottom);      mdivIDerDarwable.draw(c);      if (mcolorPaint != null) {        c.drawRect(left,mcolorPaint);      }    }  }  //....水平分割线与垂直分割线类似，完整代码见下。}

下面是完整代码：

1. MainActivity

public class MainActivity extends AppCompatActivity {  private GrIDFragment mGrIDFragment;  @OverrIDe  protected voID onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    setContentVIEw(R.layout.activity_main);    //网格    mGrIDFragment = new GrIDFragment();    getFragmentManager().beginTransaction().replace(R.ID.activity_main,mGrIDFragment).commit();  }

activity_main

<?xml version="1.0" enCoding="utf-8"?><FrameLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  androID:ID="@+ID/activity_main"  androID:layout_wIDth="match_parent"  androID:layout_height="match_parent"></FrameLayout>

2. GrIDFragment

public class GrIDFragment extends Fragment implements VIEw.OnClickListener{  private RecyclerVIEw mRecycleVIEwDrawable;  private RecyclerVIEw mRecycleVIEwcolor;  private linearlayoutmanager mManagercolor;  private linearlayoutmanager mManagerDrawable;  private List<String> mData;  private button mDrawable;  private button mcolor;  private MyRecycleVIEwAdapter mRecycleVIEwAdapter;  @Nullable  @OverrIDe  public VIEw onCreateVIEw(LayoutInflater inflater,VIEwGroup container,Bundle savedInstanceState) {    VIEw vIEw = inflater.inflate(R.layout.fragment_grID_layout,container,false);    mRecycleVIEwDrawable = (RecyclerVIEw) vIEw.findVIEwByID(R.ID.recyclevIEw_drawable);    mRecycleVIEwcolor = (RecyclerVIEw) vIEw.findVIEwByID(R.ID.recyclevIEw_color);    mDrawable = (button) vIEw.findVIEwByID(R.ID.btn_drawable);    mDrawable.setonClickListener(this);    mcolor = (button) vIEw.findVIEwByID(R.ID.btn_color);    mcolor.setonClickListener(this);    //设置颜色分割线    mManagercolor = new GrIDLayoutManager(getActivity(),3);    mRecycleVIEwcolor.setLayoutManager(mManagercolor);    mRecycleVIEwcolor.addItemdecoration(new GrIDdivIDer(getActivity(),20,this.getResources().getcolor(R.color.colorAccent)));    //设置图片分割线    mManagerDrawable = new GrIDLayoutManager(getActivity(),3);    mRecycleVIEwDrawable.setLayoutManager(mManagerDrawable);    Drawable drawable = ContextCompat.getDrawable(getActivity(),R.mipmap.divIDer);    mRecycleVIEwDrawable.addItemdecoration(new GrIDdivIDer(getActivity(),drawable));    //初始化数据    mData = new ArrayList<String>();    initData(mData);    mRecycleVIEwAdapter = new MyRecycleVIEwAdapter(getActivity(),R.layout.item_grID_recyclevIEw,mData);    mRecycleVIEwcolor.setAdapter(mRecycleVIEwAdapter);    mRecycleVIEwDrawable.setAdapter(mRecycleVIEwAdapter);    return vIEw;  }  private voID initData(List<String> dataList) {    for (int i = 0; i < 16; i++) {      dataList.add("item" + i);    }  }  @OverrIDe  public voID onClick(VIEw vIEw) {    int ID = vIEw.getID();    switch (ID){      case R.ID.btn_drawable:        mRecycleVIEwcolor.setVisibility(VIEw.INVISIBLE);        mRecycleVIEwDrawable.setVisibility(VIEw.VISIBLE);        break;      case R.ID.btn_color:        mRecycleVIEwcolor.setVisibility(VIEw.VISIBLE);        mRecycleVIEwDrawable.setVisibility(VIEw.INVISIBLE);        break;    }  }}

3.分割线 GrIDdivIDer

直接继承 RecyclerVIEw.Itemdecoration

public class GrIDdivIDer extends RecyclerVIEw.Itemdecoration {  private Drawable mdivIDerDarwable;  private int mdivIDerHight = 1;  private Paint mcolorPaint;  public final int[] ATRRS = new int[]{androID.R.attr.ListdivIDer};  public GrIDdivIDer(Context context) {    final TypedArray ta = context.obtainStyledAttributes(ATRRS);    this.mdivIDerDarwable = ta.getDrawable(0);    ta.recycle();  }  /*   int divIDerHight 分割线的线宽   int divIDercolor 分割线的颜色   */  public GrIDdivIDer(Context context,int divIDercolor) {    this(context);    mdivIDerHight = divIDerHight;    mcolorPaint = new Paint();    mcolorPaint.setcolor(divIDercolor);  }  /*   int divIDerHight 分割线的线宽   Drawable divIDerDrawable 图片分割线   */  public GrIDdivIDer(Context context,RecyclerVIEw parent) {    final int childCount = parent.getChildCount();    for (int i = 0; i < childCount; i++) {      final VIEw child = parent.getChildAt(i);      final RecyclerVIEw.LayoutParams params = (RecyclerVIEw.LayoutParams) child.getLayoutParams();      final int top = child.gettop() - params.topmargin;      final int bottom = child.getBottom() + params.bottommargin;      int left = 0;      int right = 0;      //左边第一列      if ((i % 3) == 0) {        //item左边分割线        left = child.getleft();        right = left + mdivIDerHight;        mdivIDerDarwable.setBounds(left,bottom);        mdivIDerDarwable.draw(c);        if (mcolorPaint != null) {          c.drawRect(left,mcolorPaint);      }    }  }  public voID drawHorizontaldivIDer(Canvas c,RecyclerVIEw parent) {    final int childCount = parent.getChildCount();    for (int i = 0; i < childCount; i++) {      final VIEw child = parent.getChildAt(i);      RecyclerVIEw.LayoutParams params = (RecyclerVIEw.LayoutParams) child.getLayoutParams();      final int left = child.getleft() - params.leftmargin - mdivIDerHight;      final int right = child.getRight() + params.rightmargin;      int top = 0;      int bottom = 0;      // 最上面一行      if ((i / 3) == 0) {        //当前item最上面的分割线        top = child.gettop();        //当前item下面的分割线        bottom = top + mdivIDerHight;        mdivIDerDarwable.setBounds(left,mcolorPaint);        }        top = child.getBottom() + params.bottommargin;        bottom = top + mdivIDerHight;      } else {        top = child.getBottom() + params.bottommargin;        bottom = top + mdivIDerHight;      }      //画分割线      mdivIDerDarwable.setBounds(left,mcolorPaint);      }    }  }}

4. Adapter

public class MyRecycleVIEwAdapter extends RecyclerVIEw.Adapter<MyRecycleVIEwAdapter.MyVIEwHolder> {  private LayoutInflater mLayoutInflater;  private List<String> mDataList;  private int mItemLayout;  public MyRecycleVIEwAdapter(Context context,int itemLayout,List<String> dataList) {    mLayoutInflater = LayoutInflater.from(context);    mItemLayout = itemLayout;    mDataList = dataList;  }  @OverrIDe  public MyRecycleVIEwAdapter.MyVIEwHolder onCreateVIEwHolder(VIEwGroup parent,int vIEwType) {    return new MyVIEwHolder(mLayoutInflater.inflate(mItemLayout,false));  }  @OverrIDe  public voID onBindVIEwHolder(MyRecycleVIEwAdapter.MyVIEwHolder holder,int position) {    holder.mTextVIEw.setText(mDataList.get(position));  }  @OverrIDe  public int getItemCount() {    return mDataList.size();  }  class MyVIEwHolder extends RecyclerVIEw.VIEwHolder {    private TextVIEw mTextVIEw;    public MyVIEwHolder(VIEw itemVIEw) {      super(itemVIEw);      mTextVIEw = (TextVIEw) itemVIEw.findVIEwByID(R.ID.tv);    }  }}

adapter 的item布局

<?xml version="1.0" enCoding="utf-8"?><FrameLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  androID:layout_wIDth="match_parent"  androID:layout_height="wrap_content">  <TextVIEw    androID:ID="@+ID/tv"    androID:gravity="center"    androID:layout_wIDth="match_parent"    androID:layout_height="60dp"/></FrameLayout>

未完待续……

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的Android RecyclerView网格布局（支持多种分割线）详解(2)全部内容，希望文章能够帮你解决Android RecyclerView网格布局（支持多种分割线）详解(2)所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。