Android开发之RecyclerView的间隔线处理

RecyclerView没有默认的分割线，需要自己绘制，接下来我会为大家绘制三种线：水平线、竖直线、和网格线。

废话少说，马上开车！！！

---------------------------------------------华丽的分割线------------------------------------------------------------

水平线实现：在原来的代码中添加

mRecyclerView.addItemDecoration(new DividerItemDecoration(this, DividerItemDecoration.VERTICAL));

即可实现分割线，不过默认的分割线颜色个人感觉有点不太漂亮，大家看图说话：

想要改变分割线的颜色只能在theme中添加该属性

<!-- Base application theme. -->    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">        <item name="android:listDivider">@drawable/divider_bg</item>    </style>

然后在drawable中添加背景色

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"    android:shape="rectangle">    <gradient        android:centerColor="#ffff0000"        android:endColor="#ffff0000"        android:startColor="#ffff0000"        android:type="linear" />    <size android:height="1dp" /></shape>

为了看起来更亮眼我全部设置成了骚红色，来大家看效果图：

看一下gridview和瀑布流的效果：

---------------------------------------------华丽的分割线------------------------------------------------------------

竖直线：和水平线同样的道理只需要改动一点代码即可只需要把vertical改成horizontal即可。

mRecyclerView.addItemDecoration(new DividerItemDecoration(this, DividerItemDecoration.HORIZONTAL));

看效果图：

---------------------------------------------华丽的分割线------------------------------------------------------------

网格线：大家估计该注意到问题了，像gridView网格状的该怎么搞啊其实有个很简单的方法，写一个水平的然后在写一个竖直的不就ok了嘛。。。

mRecyclerView.addItemDecoration(new DividerItemDecoration(this, DividerItemDecoration.HORIZONTAL));mRecyclerView.addItemDecoration(new DividerItemDecoration(this, DividerItemDecoration.VERTICAL));

这是一种偷懒的方法，效果嘛就只能呵呵了，大家看效果图：

丑丑丑。。。

---------------------------------------------华丽的分割线------------------------------------------------------------

网格线的优雅写法：其实想解决这个问题，没办法只有看源码了，源码分析我就不带大家分析了，大家有兴趣的自己可以ctrl+鼠标左键自行查看，我这里的思路是：重写ItemDecoration类，同时绘制水平和竖直线，当然了为了保证下面的线不能超过你的内容，需要加以判断有多少行多少列。。。具体怎么实现的，代码奉上：(感谢一下dn学院的ricky老师)

public class DividerGridViewItemDecoration extends RecyclerView.ItemDecoration {    private Drawable mDivider;    private int[] attrs = new int[]{android.R.attr.listDivider};    public DividerGridViewItemDecoration(Context context) {        TypedArray typedArray = context.obtainStyledAttributes(attrs);        mDivider = typedArray.getDrawable(0);        typedArray.recycle();    }    @Override    public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {        drawVertical(c, parent);        drawHorizontal(c, parent);    }    private void drawHorizontal(Canvas c, RecyclerView parent) {        // 绘制水平间隔线        int childCount = parent.getChildCount();        for (int i = 0; i < childCount; i++) {            View child = parent.getChildAt(i);            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child.getLayoutParams();            int left = child.getLeft() - params.leftMargin;            int right = child.getRight() + params.rightMargin;            int top = child.getBottom() + params.bottomMargin;            int bottom = top + mDivider.getIntrinsicHeight();            mDivider.setBounds(left, top, right, bottom);            mDivider.draw(c);        }    }    private void drawVertical(Canvas c, RecyclerView parent) {        //绘制垂直间隔线(垂直的矩形)        int childCount = parent.getChildCount();        for (int i = 0; i < childCount; i++) {            View child = parent.getChildAt(i);            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child.getLayoutParams();            int left = child.getRight() + params.rightMargin;            int right = left + mDivider.getIntrinsicWidth();            int top = child.getTop() - params.topMargin;            int bottom = child.getBottom() + params.bottomMargin;            mDivider.setBounds(left, top, right, bottom);            mDivider.draw(c);        }    }    @Override    @Deprecated    public void getItemOffsets(Rect outRect, int itemPosition, RecyclerView parent) {        // 四个方向的偏移值        int right = mDivider.getIntrinsicWidth();        int bottom = mDivider.getIntrinsicHeight();        if (isLastColum(itemPosition, parent)) {//是否是最后一列            right = 0;        }        if (isLastRow(itemPosition, parent)) {//是最后一行            bottom = 0;        }        outRect.set(0, 0, right, bottom);    }    /**     * 是否是最后一行     */    private boolean isLastRow(int itemPosition, RecyclerView parent) {        int spanCount = getSpanCount(parent);        RecyclerView.LayoutManager layoutManager = parent.getLayoutManager();        //有多少列        if (layoutManager instanceof GridLayoutManager) {            int childCount = parent.getAdapter().getItemCount();            int lastRowCount = childCount % spanCount;            //最后一行的数量小于spanCount            if (lastRowCount == 0 || lastRowCount < spanCount) {                return true;            }        }        return false;    }    /**     * 判断是否是最后一列     */    private boolean isLastColum(int itemPosition, RecyclerView parent) {        RecyclerView.LayoutManager layoutManager = parent.getLayoutManager();        //有多少列        if (layoutManager instanceof GridLayoutManager) {            int spanCount = getSpanCount(parent);            if ((itemPosition + 1) % spanCount == 0) {                return true;            }        }        return false;    }    private int getSpanCount(RecyclerView parent) {        RecyclerView.LayoutManager layoutManager = parent.getLayoutManager();        if (layoutManager instanceof GridLayoutManager) {            GridLayoutManager lm = (GridLayoutManager) layoutManager;            int spanCount = lm.getSpanCount();            return spanCount;        }        return 0;    }}

然后添加一下代码即可优雅的实现网格效果的线

DividerGridViewItemDecoration dividerGridViewItemDecoration = new DividerGridViewItemDecoration(this);mRecyclerView.addItemDecoration(dividerGridViewItemDecoration);

效果图走起：

---------------------------------------------华丽的分割线------------------------------------------------------------

下一节还是带领大家继续处理recyclerView的相关问题，还望大家支持。。。