绘制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:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@color/grey"></solid>
<size android:height="4dp"></size>
</shape>

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

<item name="android:listDivider">@drawable/divider_bg</item>

然后我们继续绘制我们的分隔线,重写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中画出渐变效果,然后分隔符就变成这样了:

渐变运行结果

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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,053评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,527评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,779评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,685评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,699评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,609评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,989评论 3 396
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,654评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,890评论 1 298
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,634评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,716评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,394评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,976评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,950评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,191评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,849评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,458评论 2 342

推荐阅读更多精彩内容