绘制RecyclerView的分隔线

RecyclerView

现在开发Android的都知道，RecyclerView可以替代ListView和GridView，因为它的自由度很高，我们可以很随意的展示我们的数据集，还有默认的动画！但是有一个瑕疵，那就是没有提供一个分隔线的实现类，只有一个抽象类（RecyclerView.ItemDecoration）等着我们自己去实现！不过实现起来还是很简单的。

自定义ItemDecoration的步骤（我以竖向举例）

1. 新建一个类，继承自RecyclerView.ItemDecoration
2. 把各个item之间的距离加大！留出空间给我们要绘制的分隔线。所以要重写getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state)方法，设置偏移量！
3. 绘制分隔线到上面设置的间距，重写onDraw()方法。

代码实现

public class MyItemDecoration extends RecyclerView.ItemDecoration {
    //分隔线
    Drawable mDivider;

    //我们通过获取系统属性中的listDivider来添加，在系统中的AppTheme中设置
    public static final int[] ATRRS  = new int[]{
            android.R.attr.listDivider
    };
    public MyItemDecoration(Context context, int orientation){
        TypedArray ta = context.obtainStyledAttributes(ATRRS);
        mDivider = ta.getDrawable(0);
        ta.recycle();
    }

    @Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
       int pos =parent.getChildLayoutPosition(view);//得到当前view的位置
       if(pos != parent.getAdapter().getItemCount()-1) {//如果不是最后一个view 那么留出空间
            //设置paddingLeft，paddingTop， paddingRight， paddingBottom
            outRect.set(0,0,0,mDivider.getIntrinsicHeight());
            //mDivider.getIntrinsicHeight()是获取我们定义的分隔线的高度！
          }
    }
}

设置offset后的效果

我们可以看到已经有白色的空间了！我们想用自定义的颜色去填充它，接来下我们先在drawable目录下建一个shape，作为我们的divider:

然后在styles的主题AppTheme里设置：

@drawable/divider_bg

然后我们继续绘制我们的分隔线，重写onDraw()方法：

    @Override
    public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
        //设置分隔线的left和right
        int left = parent.getPaddingLeft();
        int right = parent.getWidth() - parent.getPaddingRight();

        for (int i = 0; i < parent.getChildCount(); i++) {
            View view = parent.getChildAt(i);
            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) view.getLayoutParams();
            //分隔线的top和bottom
            int top = view.getBottom()+params.bottomMargin;
            int bottom = top + mDivider.getIntrinsicHeight();
            //分隔线的绘制区域
            mDivider.setBounds(left,top,right,bottom);
            //把分隔线绘制到canvas
            mDivider.draw(c);
        }
    }

然后运行结果：

运行结果

我们可以在shape中画出渐变效果，然后分隔符就变成这样了：

渐变运行结果

到此我们就完工了，很简单，只需要重写两个方法就可以了！
下一篇： 绘制分组悬浮分隔栏