RecyclerView分割线——万能分割线
参照网络上众多的分割线设计方法,对方法进行调整和修改,最终完成的比较通用的RecyclerView分割线,底部会附上参考网址,大家可以去看一下。
在正文之前,先说一下个人看法:研究下来,我发现,其实最简单的办法就是直接去设置ItemView的Margin,如果需要分割线有颜色,大可直接在ItemView父级容器的Background属性上做文章。
虽然这个文章是本人发表的,但是我并不推荐大家使用,本身算法过于复杂,能解决大部分问题,但不是全部,我也更热衷于通过Margin+Background的方式解决,而且感觉不加边框才是最好看的。
效果图:
!
知识点
本身没多少知识点,就是一大堆的计算问题,代码注释我写得很详尽了,大家可以直接从底部源码开始
设置分割线需要继承ItemDecoration,然后重写以下几个方法:
- getItemOffsets:就直接理解成绘制Margin吧。因为绘制分割线是有宽度的,要调整两个ItemView直接的间距,间距为 outRect 设置的4个方向的值,将被计算进所有 decoration 的尺寸中,而这个尺寸,被计入了 RecyclerView 每个item view 的 padding 中,
- onDraw:把边分割线在ItemView下面。 为 divider 设置绘制范围,并绘制到 canvas 上,而这个绘制范围可以超出在 getItemOffsets 中设置的范围,但由于 decoration 最终是绘制在 ItemView的底下
- onDrawOver:是绘制在最上层的,所以它的绘制位置并不受限制
代码使用方法:
添加水平分割线:高度为2px,颜色为灰色
//水平分割线
recyclerView.addItemDecoration(new DividerItemDecoration(
ListRecycle.this, DividerItemDecoration.HORIZONTAL_LIST));
添加垂直分割线:高度为2px,颜色为灰色
//垂直分割线
recyclerView.addItemDecoration(new DividerItemDecoration(
ListRecycle.this, DividerItemDecoration.VERTICAL_LIST));
水平+垂直分割线:高度为2px,颜色为灰色
//垂直+水平分割线
recyclerView.addItemDecoration(new DividerItemDecoration(
ListRecycle.this, DividerItemDecoration.BOTH_SET));
带颜色的分割线
//添加带颜色分割线
recyclerView.addItemDecoration(new DividerItemDecoration(
ListRecycle.this, DividerItemDecoration.BOTH_SET,5,Color.BLUE));
自定义图片的分割线(图片必须有高度,比如说Xml文件,就可能没设置高度):
//添加图片分割线
recyclerView.addItemDecoration(new DividerItemDecoration(
ListRecycle.this, DividerItemDecoration.HORIZONTAL_LIST,R.mipmap.ic_launcher));
代码缺陷
错误的打开方式:
//如果希望横竖都是图片边框,那可能要失望了
recyclerView.addItemDecoration(new DividerItemDecoration(
ListRecycle.this, DividerItemDecoration.BOTH_SET,R.mipmap.ic_launcher));
原因分析:
- 假如我们有两个ItemView,明显只需要写一个分割线,分割线是有宽度的,而分割线的宽度是通过调整其中一个ItemView的宽度,然后空出间隙来绘制这个分割线,从原理上来讲,其中一个ItemView会比另一个小,当分割线比较窄的时候,视觉是不易察觉的,当它过宽的时候,就开始崩了。
- 对于RecycleView的瀑布流的边框,表示确实有些无能为力,原因是getItemOffsets会绘制整占满屏幕的边框,假如ItemView只有半个屏幕大小,明显不合适。
解决方案推荐:
- 直接调整ItemView的Margin的大小,放弃使用分割线,采用之前说的Margin+Background方式。
- 调整代码,对onDraw绘制的位置进行微调,这里需要一个有耐心去测试修改代码的人
源码:
/**
* 万能分割线
* Created by ChenSS on 2016/9/21.
*/
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;
}
}
如果还有什么不懂的,请参考网址:
http://www.2cto.com/kf/201511/450814.html
http://blog.csdn.net/fuhao476200/article/details/51488650
http://www.cnblogs.com/baiqiantao/p/5585345.html
http://blog.csdn.net/lmj623565791/article/details/45059587
http://blog.csdn.net/skykingf/article/details/50827141
http://www.jianshu.com/p/4eff036360da
RecyclerView分割线——万能分割线的更多相关文章
- RecyclerView的万能分割线
效果图: 使用方法: 添加默认分割线:高度为2px,颜色为灰色 mRecyclerView.addItemDecoration(new RecyclerViewDivider(mContext, Li ...
- 使用RecyclerView设置自定义分割线
在安卓开发中,RecyclerView控件来做一些列表是非常方便的,如何使用在网上很多文章,这次着重来说一下怎么设置自定义分割线: 首先,我们来看一下怎么设置默认的分割线 RecyclerView m ...
- 打造android偷懒神器———RecyclerView的万能适配器
转载请注明出处谢谢:http://www.cnblogs.com/liushilin/p/5720926.html 很不好意思让大家久等了,本来昨天就应该写这个的,无奈公司昨天任务比较紧,所以没能按时 ...
- iOS tableView移除某一行的分割线 让分割线宽度为整个cell的宽度
移除tableViewCell中某一行的分割线 有2种方法 1. 移除系统的分割线,自己定义每行的分割线 self.tableView.separatorStyle = UITableViewCell ...
- RecyclerView的万能切割线
效果图: 用法: 加入默认切割线:高度为2px.颜色为灰色 mRecyclerView.addItemDecoration(new RecycleViewDivider(mContext, Linea ...
- android开发之 listview中的item去掉分割线 隐藏分割线
有三种方法: 1> 设置android:divider="@null" 2> android:divider="#00000000" #000000 ...
- eclipse与visualVM与mat
GC与CPU与内存的查看与分析 本文主要讲visualVM,MAT的下载配置;以及如何运用visualVM生成hprof文件;如何用visualVM分析CPU消耗,程序瓶颈在哪里;怎么用MAT导入hp ...
- android控件RecyclerView中,如何显示自定义分割线以及最后一项去除分割线
在控件RecyclerView中,分割线DividerItemDecoration类的使用经常见,如果是使用自带的分割线,只需要这样写即可 RecyclerView mRecyclerView; mR ...
- RV ItemDecoration 分割线 简介 MD
Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...
随机推荐
- win10 UWP FlipView
FlipView 可以让用户逐个浏览的项目集合 <FlipView Grid.Row="0" Height="100" Margin="10,1 ...
- win10 uwp smms图床
本文,如何使用smms图床上传图片,用到win10 uwp post文件,因为我是渣渣,如果本文有错的,请和我说,在本文评论,或发给我邮箱lindexi_gd@163.com,请不要发不良言论 找到一 ...
- Kotlin——最详细的控制语句使用
在前面 的章节中讲解了Kotlin语言中的数据类型.变量与常量的定义.不了解请参见前面的内容: Kotlin从无到有系列之数据类型介绍. Kotlin从无到有系列之变量.常量.注释的使用. 下面详细为 ...
- FastDFS 简介
FastDFS开源的分布式文件系统,功能包括:文件存储,文件同步,文件访问(文件上传,文件下载等),解决了大容量存储和负载均衡的问题,特别适合以文件为载体的在线服务,如服务网站,视频网站等 FastD ...
- C#通过OpenCL调用显卡GPU做高效并行运算
GPU的并行运算能力远超CPU,有时候我们会需要用到超大数据并行运算,可以考虑用GPU实现,这是一篇C#调用GPU进行运算的入门教程. 1: 下载相关的库: https://sourceforge.n ...
- nvm进行node多版本管理
写在前面 nvm(nodejs version manager)是nodejs的管理工具,如果你需要快速更新node版本,并且不覆盖之前的版本:或者想要在不同的node版本之间进行切换: 使用nvm来 ...
- 一、JAVA环境变量配置详解——JavaWeb点滴
JAVA环境变量JAVA_HOME.CLASSPATH.PATH设置详解 Windows下JAVA用到的环境变量主要有3个,JAVA_HOME.CLASSPATH.PATH. JAVA_HOME 指向 ...
- 使用jQuery中trigger()方法自动触发事件
一.常用事件 在页面加载完成时 自动触发input的点击事件,在移动端可以实现自动弹出输入法,获得焦点 $("input").trigger("click") ...
- 使用OpenCV训练Haar like+Adaboost分类器的常见问题
<FAQ:OpenCV Haartraining>——使用OpenCV训练Haar like+Adaboost分类器的常见问题 最近使用OpenCV训练Haar like+Adaboost ...
- 前后端分离跨服务器文件上传-Java SpringMVC版
近来工作上不上特别忙,加上对后台java了解一点,所以就抽时间,写了一个java版本的前后端分离的跨服务器文件上传功能,包括前后端代码. 一.Tomcat服务器部分 1.Tomcat服务器 单独复制一 ...