这篇博客作为上一章的补充，今天在总结一点Recyclerview分割线的使用，相信大家在网上已经看过了太多的万能分割线，真的万能吗？
大多数情况还是满足的，比如横向列表，竖向列表，用的还是挺好的，如果是一个GridView可能就尴尬了，大多数万能分割线画出来的都不那么完美，他会在没有内容的item上也画上分割线（如下图），这样的效果通常不是我们所需要的。
1、首先给大家找了一篇讲解Recyclerview分割线绘制原理的文章：RecyclerView系列之（2）：为RecyclerView添加分隔线
2、接着给大家贴上通常所谓的万能分割线的代码，这段代码中支持设置分隔线的位置（水平或垂直）、分割线的颜色、分隔线的宽度等。
public class DividerItemDecoration extends RecyclerView.ItemDecoration {
private Paint mPaint;
//取名mDivider似乎更恰当
private Drawable mDrawable;
//分割线高度，默认为1px
private int mDividerHeight = 2;
//列表的方向
private int mOrientation;
//系统自带的参数
private static final int[] ATTRS = new int[]{android.R.attr.listDivider};
//水平
public static final int HORIZONTAL_LIST = RecyclerView.HORIZONTAL;
//垂直
public static final int VERTICAL_LIST = RecyclerView.VERTICAL;
//水平+垂直
public static final int BOTH_SET = 2;
/**
* 默认分割线：高度为2px，颜色为灰色
*
* @param context 上下文
* @param orientation 列表方向
*/
public DividerItemDecoration(Context context, int orientation) {
this.setOrientation(orientation);
//获取xml配置的参数
final TypedArray a = context.obtainStyledAttributes(ATTRS);
//typedArray.getDrawable(attr)这句是说我们可以通过我们的资源获得资源，使用我们的资源名attr去获得资源id
//看不懂就用自己写一个分割线的图片吧，方法：ContextCompat.getDrawable(context, drawableId);
mDrawable = a.getDrawable(0);
//官方的解释是：回收TypedArray，以便后面重用。在调用这个函数后，你就不能再使用这个TypedArray。
//在TypedArray后调用recycle主要是为了缓存。
a.recycle();
}
/**
* 自定义分割线
*
* @param context 上下文
* @param orientation 列表方向
* @param drawableId 分割线图片
*/
public DividerItemDecoration(Context context, int orientation, int drawableId) {
this.setOrientation(orientation);
//旧的getDrawable方法弃用了，这个是新的
mDrawable = ContextCompat.getDrawable(context, drawableId);
mDividerHeight = mDrawable.getIntrinsicHeight();
}
/**
* 自定义分割线
*
* @param context 上下文
* @param orientation 列表方向
* @param dividerHeight 分割线高度
* @param dividerColor 分割线颜色
*/
public DividerItemDecoration(Context context, int orientation,
int dividerHeight, int dividerColor) {
this.setOrientation(orientation);
mDividerHeight = dividerHeight;
Log.e("mDividerHeight", mDividerHeight + "===================");
//抗锯齿画笔
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaint.setColor(dividerColor);
//填满颜色
mPaint.setStyle(Paint.Style.FILL);
}
/**
* 设置方向
*
* @param orientation
*/
public void setOrientation(int orientation) {
if (orientation < 0 || orientation > 2)
throw new IllegalArgumentException("invalid orientation");
mOrientation = orientation;
}
/**
* 绘制分割线之后,需要留出一个外边框,就是说item之间的间距要换一下
*
* @param outRect outRect.set(0, 0, 0, 0);的四个参数理解成margin就好了
* @param view 视图
* @param parent 父级view
* @param state
*/
@Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
//下面super...代码其实调用的就是那个过时的getItemOffsets,也就是说这个方法体内容也可以通通移到那个过时的getItemOffsets中
super.getItemOffsets(outRect, view, parent, state);
//获取layoutParams参数
RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) view.getLayoutParams();
//当前位置
int itemPosition = layoutParams.getViewLayoutPosition();
//ItemView数量
int childCount = parent.getAdapter().getItemCount();
switch (mOrientation) {
case BOTH_SET:
//获取Layout的相关参数
int spanCount = this.getSpanCount(parent);
if (isLastRaw(parent, itemPosition, spanCount, childCount)) {
// 如果是最后一行，则不需要绘制底部
outRect.set(0, 0, mDividerHeight, 0);
} else if (isLastColum(parent, itemPosition, spanCount, childCount)) {
// 如果是最后一列，则不需要绘制右边
outRect.set(0, 0, 0, mDividerHeight);
} else {
outRect.set(0, 0, mDividerHeight, mDividerHeight);
}
break;
case VERTICAL_LIST:
childCount -= 1;
//水平布局右侧留Margin,如果是最后一列,就不要留Margin了
outRect.set(0, 0, (itemPosition != childCount) ? mDividerHeight : 0, 0);
break;
case HORIZONTAL_LIST:
childCount -= 1;
//垂直布局底部留边，最后一行不留
outRect.set(0, 0, 0, (itemPosition != childCount) ? mDividerHeight : 0);
break;
}
}
/**
* 绘制分割线
*
* @param c
* @param parent
* @param state
*/
@Override
public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
super.onDraw(c, parent, state);
if (mOrientation == VERTICAL_LIST) {
drawVertical(c, parent);
} else if (mOrientation == HORIZONTAL_LIST) {
drawHorizontal(c, parent);
} else {
drawHorizontal(c, parent);
drawVertical(c, parent);
}
}
/**
* 绘制横向 item 分割线
*
* @param canvas 画布
* @param parent 父容器
*/
private void drawHorizontal(Canvas canvas, RecyclerView parent) {
final int x = parent.getPaddingLeft();
final int width = parent.getMeasuredWidth() - parent.getPaddingRight();
//getChildCount()(ViewGroup.getChildCount) 返回的是显示层面上的“所包含的子 View 个数”。
final int childSize = parent.getChildCount();
for (int i = 0; i < childSize; i++) {
final View child = parent.getChildAt(i);
RecyclerView.LayoutParams layoutParams =
(RecyclerView.LayoutParams) child.getLayoutParams();
//item底部的Y轴坐标+margin值
final int y = child.getBottom() + layoutParams.bottomMargin;
final int height = y + mDividerHeight;
Log.e("height", height + "===================");
if (mDrawable != null) {
//setBounds(x,y,width,height); x:组件在容器X轴上的起点 y:组件在容器Y轴上的起点
// width:组件的长度 height:组件的高度
mDrawable.setBounds(x, y, width, height);
mDrawable.draw(canvas);
}
if (mPaint != null) {
canvas.drawRect(x, y, width, height, mPaint);
}
}
}
/**
* 绘制纵向 item 分割线
*
* @param canvas
* @param parent
*/
private void drawVertical(Canvas canvas, RecyclerView parent) {
final int top = parent.getPaddingTop();
final int bottom = parent.getMeasuredHeight() - parent.getPaddingBottom();
final int childSize = parent.getChildCount();
for (int i = 0; i < childSize; i++) {
final View child = parent.getChildAt(i);
RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) child.getLayoutParams();
final int left = child.getRight() + layoutParams.rightMargin;
final int right = left + mDividerHeight;
if (mDrawable != null) {
mDrawable.setBounds(left, top, right, bottom);
mDrawable.draw(canvas);
}
if (mPaint != null) {
canvas.drawRect(left, top, right, bottom, mPaint);
}
}
}
/**
* 获取列数
*
* @param parent
* @return
*/
private int getSpanCount(RecyclerView parent) {
int spanCount = -1;
RecyclerView.LayoutManager layoutManager = parent.getLayoutManager();
if (layoutManager instanceof GridLayoutManager) {
spanCount = ((GridLayoutManager) layoutManager).getSpanCount();
} else if (layoutManager instanceof StaggeredGridLayoutManager) {
spanCount = ((StaggeredGridLayoutManager) layoutManager)
.getSpanCount();
}
return spanCount;
}
private boolean isLastColum(RecyclerView parent, int pos, int spanCount,
int childCount) {
RecyclerView.LayoutManager layoutManager = parent.getLayoutManager();
if (layoutManager instanceof GridLayoutManager) {
int orientation = ((GridLayoutManager) layoutManager)
.getOrientation();
if (orientation == StaggeredGridLayoutManager.VERTICAL) {
// 如果是最后一列，则不需要绘制右边
if ((pos + 1) % spanCount == 0)
return true;
} else {
childCount = childCount - childCount % spanCount;
// 如果是最后一列，则不需要绘制右边
if (pos >= childCount)
return true;
}
} else if (layoutManager instanceof StaggeredGridLayoutManager) {
int orientation = ((StaggeredGridLayoutManager) layoutManager)
.getOrientation();
if (orientation == StaggeredGridLayoutManager.VERTICAL) {
// 如果是最后一列，则不需要绘制右边
if ((pos + 1) % spanCount == 0)
return true;
} else {
childCount = childCount - childCount % spanCount;
// 如果是最后一列，则不需要绘制右边
if (pos >= childCount)
return true;
}
}
return false;
}
private boolean isLastRaw(RecyclerView parent, int pos, int spanCount,
int childCount) {
int orientation;
RecyclerView.LayoutManager layoutManager = parent.getLayoutManager();
if (layoutManager instanceof GridLayoutManager) {
childCount = childCount - childCount % spanCount;
orientation = ((GridLayoutManager) layoutManager)
.getOrientation();
if (orientation == StaggeredGridLayoutManager.VERTICAL) {
// 如果是最后一行，则不需要绘制底部
childCount = childCount - childCount % spanCount;
if (pos >= childCount)
return true;
} else {// StaggeredGridLayoutManager 横向滚动
// 如果是最后一行，则不需要绘制底部
if ((pos + 1) % spanCount == 0)
return true;
}
} else if (layoutManager instanceof StaggeredGridLayoutManager) {
orientation = ((StaggeredGridLayoutManager) layoutManager)
.getOrientation();
if (orientation == StaggeredGridLayoutManager.VERTICAL) {
// 如果是最后一行，则不需要绘制底部
childCount = childCount - childCount % spanCount;
if (pos >= childCount)
return true;
} else {// StaggeredGridLayoutManager 横向滚动
// 如果是最后一行，则不需要绘制底部
if ((pos + 1) % spanCount == 0)
return true;
}
}
return false;
}
}3、最后我们来讨论下刚才所提出的问题，如何给Gridview画上完美的分割线。
我们来看下面这幅图，这样的效果相信大家一定很常见。
由图可见，这个Gridview的分割线最左边和最右边不要画；最后一个item如果不是这一行的最后一个，需要画右边框和下边框；
这是我们的两个特殊需求。
首先分析下思路吧，我们可以理解为给每个item只画右边和底部的分隔线，当该item是该行的最后一个时则不画右边的分割线；
//绘制纵向 item 分割线
private void drawVertical(Canvas canvas, RecyclerView parent) {
final int childSize = parent.getChildCount();
for (int i = 0; i < childSize; i++) {
final View child = parent.getChildAt(i);
RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) child
.getLayoutParams();
if ((i % getSpanCount(parent)) != getSpanCount(parent) - 1) {//最后一列不画右边
int top = child.getTop() - layoutParams.topMargin;
int bottom = child.getBottom() + layoutParams.bottomMargin;
int left = child.getRight() + layoutParams.rightMargin;
int right = left + mDividerHeight;
if (mDividerDarwable != null) {
mDividerDarwable.setBounds(left, top, right, bottom);
mDividerDarwable.draw(canvas);
}
if (mPaint != null) {
canvas.drawRect(left, top, right, bottom, mPaint);
}
}
}
}if ((i % getSpanCount(parent)) != getSpanCount(parent) - 1) 这句话判断是否是该行的最后一个item，getSpanCount（）方法获得列数；（注意：每行的position是0-getSpanCount() - 1）
//绘制底部横向 item 分割线
private void drawHorizontalBottom(Canvas canvas, RecyclerView parent) {
final int childSize = parent.getChildCount();
for (int i = 0; i < childSize; i++) {
final View child = parent.getChildAt(i);
RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) child
.getLayoutParams();
int left = child.getLeft() - layoutParams.leftMargin - mDividerHeight;
int right = child.getRight() + layoutParams.rightMargin;
int top = child.getBottom() + layoutParams.bottomMargin;
int bottom = top + mDividerHeight;
if (mDividerDarwable != null) {
mDividerDarwable.setBounds(left, top, right, bottom);
mDividerDarwable.draw(canvas);
}
if (mPaint != null) {
canvas.drawRect(left, top, right, bottom, mPaint);
}
}
}底部的分割线按正常情况画就好。下面贴上完整的代码。
public class DividerGridItemDecoration extends RecyclerView.ItemDecoration {
private Drawable mDividerDarwable;
private int mDividerHeight = 1;
private Paint mPaint;
public final int[] ATRRS = new int[]{android.R.attr.listDivider};
public DividerGridItemDecoration(Context context) {
final TypedArray ta = context.obtainStyledAttributes(ATRRS);
this.mDividerDarwable = ta.getDrawable(0);
ta.recycle();
this.mDividerDarwable = ContextCompat.getDrawable(context, R.drawable.line_divier);
}
public DividerGridItemDecoration(Context context, int drawableId) {
mDividerDarwable = ContextCompat.getDrawable(context, drawableId);
}
/*
int dividerHight 分割线的线宽
int dividerColor 分割线的颜色
*/
public DividerGridItemDecoration(Context context, int dividerHight, int dividerColor) {
this(context);
mDividerHeight = dividerHight;
mPaint = new Paint();
mPaint.setColor(dividerColor);
}
/*
int dividerHight 分割线的线宽
Drawable dividerDrawable 图片分割线
*/
public DividerGridItemDecoration(Context context, int dividerHight, Drawable dividerDrawable) {
this(context);
mDividerHeight = dividerHight;
mDividerDarwable = dividerDrawable;
}
//获取分割线尺寸
@Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State
state) {
super.getItemOffsets(outRect, view, parent, state);
outRect.set(0, 0, 0, mDividerHeight);
}
//绘制分割线
@Override
public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
super.onDraw(c, parent, state);
drawVertical(c, parent);
//drawHorizontalTop(c, parent);
drawHorizontalBottom(c, parent);
}
private int getSpanCount(RecyclerView parent) {
// 列数
int spanCount = -1;
RecyclerView.LayoutManager layoutManager = parent.getLayoutManager();
if (layoutManager instanceof GridLayoutManager) {
spanCount = ((GridLayoutManager) layoutManager).getSpanCount();
} else if (layoutManager instanceof StaggeredGridLayoutManager) {
spanCount = ((StaggeredGridLayoutManager) layoutManager).getSpanCount();
} else if (layoutManager instanceof LinearLayoutManager) {
spanCount = ((LinearLayoutManager) layoutManager).getItemCount();
}
return spanCount;
}
//绘制顶部横向 item 分割线
private void drawHorizontalTop(Canvas canvas, RecyclerView parent) {
final int childSize = parent.getChildCount();
for (int i = 0; i < childSize; i++) {
final View child = parent.getChildAt(i);
RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) child
.getLayoutParams();
int left = child.getLeft() - layoutParams.leftMargin - mDividerHeight;
int right = child.getRight() + layoutParams.rightMargin;
int top = child.getTop() + layoutParams.topMargin;
int bottom = top + mDividerHeight;
if (mDividerDarwable != null) {
mDividerDarwable.setBounds(left, top, right, bottom);
mDividerDarwable.draw(canvas);
}
if (mPaint != null) {
canvas.drawRect(left, top, right, bottom, mPaint);
}
}
}
//绘制底部横向 item 分割线
private void drawHorizontalBottom(Canvas canvas, RecyclerView parent) {
final int childSize = parent.getChildCount();
for (int i = 0; i < childSize; i++) {
final View child = parent.getChildAt(i);
RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) child
.getLayoutParams();
int left = child.getLeft() - layoutParams.leftMargin - mDividerHeight;
int right = child.getRight() + layoutParams.rightMargin;
int top = child.getBottom() + layoutParams.bottomMargin;
int bottom = top + mDividerHeight;
if (mDividerDarwable != null) {
mDividerDarwable.setBounds(left, top, right, bottom);
mDividerDarwable.draw(canvas);
}
if (mPaint != null) {
canvas.drawRect(left, top, right, bottom, mPaint);
}
}
}
//绘制纵向 item 分割线
private void drawVertical(Canvas canvas, RecyclerView parent) {
final int childSize = parent.getChildCount();
for (int i = 0; i < childSize; i++) {
final View child = parent.getChildAt(i);
RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) child
.getLayoutParams();
if ((i % getSpanCount(parent)) != getSpanCount(parent) - 1) {//最后一列不画右边
int top = child.getTop() - layoutParams.topMargin;
int bottom = child.getBottom() + layoutParams.bottomMargin;
int left = child.getRight() + layoutParams.rightMargin;
int right = left + mDividerHeight;
if (mDividerDarwable != null) {
mDividerDarwable.setBounds(left, top, right, bottom);
mDividerDarwable.draw(canvas);
}
if (mPaint != null) {
canvas.drawRect(left, top, right, bottom, mPaint);
}
}
}
}
}如果想写出一个完美的万能分割线的话，把这两个类的内容整理一下便可。(^o^)/~
4、接下来补充一点小知识，关于onDraw（）和onDrawOver（）的区别：
在官方的开发文档中有指出，onDraw是在itemview绘制之前，onDrawOver是在itemview绘制之后。
All ItemDecorations are drawn in the order they were added, before the item views (in onDraw() and after the items (in onDrawOver(Canvas, RecyclerView, RecyclerView.State).
Android中View的绘制流程是：View先会调用draw方法，在draw中又会调用onDraw方法。 而在RecyclerView的draw方法中会先通过super.draw() 调用父类也就是View的draw方法，进而继续调用RecyclerView的OnDraw方法，ItemDecorations的onDraw方法就在此时会被调用，RecyclerView执行完super.draw()之后，ItemDecorations的onDrawOver方法也被调用，这也就解释了为什么说onDraw会绘制在itemview之前，表现形式是在最底层（抽象的说法，最底层应该是background），onDrawOver是在itemview绘制之后，表现形式在最上层。
下面对照源码来看下：
/**
* RecyclerView的draw方法
* @param c
*/
@Override
public void draw(Canvas c) {
// 调用父类也就是View的draw方法
super.draw(c);
final int count = mItemDecorations.size();
for (int i = 0; i < count; i++) {
// 执行ItemDecorations的onDrawOver方法
mItemDecorations.get(i).onDrawOver(c, this, mState);
}
}
/**
* View的draw方法
* @param canvas
*/
@CallSuper
public void draw(Canvas canvas) {
....
// View会继续调用onDraw
if (!dirtyOpaque) onDraw(canvas);
....
}
/**
* RecyclerView的onDraw方法
* @param c
*/
@Override
public void onDraw(Canvas c) {
super.onDraw(c);
final int count = mItemDecorations.size();
for (int i = 0; i < count; i++) {
// 执行ItemDecorations的onDraw方法
mItemDecorations.get(i).onDraw(c, this, mState);
}
}知道了他们的区别之后呢，我们就可以使用onDrawOver()来实现一些比较好玩的效果了，比如stickheader，如下图：
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
