Android零基础入门第65节：RecyclerView分割线开发技巧

在上一期通过简单学习，已经领略到了RecyclerView的灵活性，当然都是一些最基础的用法，那么本期一起来学习RecyclerView的分割线使用。

相信有的比较细心的同学已经发现了，使用RecyclerView实现的List列表和ListView实现的列表有一些细微差距，item之间没有分割线，导致item之间相隔不明显，但在实际开发中有又往往需要。

由于RecyclerView并没有支持divider这样的属性，需要我们自己想办法来完成。主要有两种实现方式，接下来分别对其进行学习。

一、背景设置显示间隔

先给RecyclerView添加黑色背景，然后再给每个item添加白色背景并设置间隔1dp，这样自然就用背景空隙当做分割线了。

在上一期的基础上进行简单修改即可，修改后的recyclerview_layout.xml文件代码如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerview"
        android:background="#5000"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>
</LinearLayout>

修改后的recyclerview_item.xml文件代码如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="#fff"
                android:layout_marginBottom="1dp"
                android:padding="6dp" >

    <ImageView
        android:id="@+id/icon_img"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_marginRight="6dp"
        android:contentDescription="null"
        android:src="@mipmap/ic_launcher" />

    <TextView
        android:id="@+id/title_tv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/icon_img"
        android:layout_alignParentTop="true"
        android:layout_marginTop="5dp"
        android:gravity="center_vertical"
        android:text="Title"
        android:textSize="16sp" />

    <TextView
        android:id="@+id/content_tv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/icon_img"
        android:layout_alignParentRight="true"
        android:layout_below="@id/title_tv"
        android:layout_marginTop="5dp"
        android:text="content"
        android:textSize="12sp" />

</RelativeLayout>

其他地方的代码不变，重新运行程序，可以看到下图所示的分割线。

二、自定义分割线

上面第一种实现方式非常简单，但有时候还是不足以完成实际需求，这就需要用到自定义分割线了。

还记得上期里面提到的ItemDecoration类的作用了吗？RecyclerView类也提供了一个addItemDecoration方法，我们可以通过该方法添加分割线。

首先我们自定义一个drawable文件recyclerview_item_divider，具体内容后续会进行学习的，这里不做过多介绍，代码如下：

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

由于RecyclerView.ItemDecoration为抽象类，需要自定义一个实现类，该类很好的实现了为RecyclerView添加分割线。新建RecyclerViewItemDivider类，具体代码如下：

package com.jinyu.cqkxzsxy.android.advancedviewsample.view;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.support.v7.widget.RecyclerView;
import android.view.View;

/**
 * @创建者 鑫鱻
 * @描述 Android零基础入门到精通系列教程
 * 首发微信公众号分享达人秀（ShareExpert）
 */
public class RecyclerViewItemDivider extends RecyclerView.ItemDecoration {
    private Drawable mDrawable;

    public RecyclerViewItemDivider(Context context, int resId) {
        mDrawable = context.getResources().getDrawable(resId);
    }

    @Override
    public void onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state) {
        int left = parent.getPaddingLeft();
        int right = parent.getWidth() - parent.getPaddingRight();
        int childCount = parent.getChildCount();
        for (int i = 0; i < childCount; i++) {
            View child = parent.getChildAt(i);
            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child.getLayoutParams();
            int top = child.getBottom() + params.bottomMargin;
            int bottom = top + mDrawable.getIntrinsicHeight();
            mDrawable.setBounds(left, top, right, bottom);
            mDrawable.draw(c);
        }
    }

    @Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent,
                               RecyclerView.State state) {
        outRect.set(0, 0, 0, mDrawable.getIntrinsicWidth());
    }
}

然后在将自定义的分割线添加到RecyclerView中，局部代码如下：

        // 设置管理器
        LinearLayoutManager layoutManager = new LinearLayoutManager(this);
        mRecyclerView.setLayoutManager(layoutManager);
        // 自定义分割线
        RecyclerView.ItemDecoration itemDecoration = new RecyclerViewItemDivider(this,
                R.drawable.recyclerview_item_divider);
        mRecyclerView.addItemDecoration(itemDecoration);
        // 如果可以确定每个item的高度是固定的，设置这个选项可以提高性能
        mRecyclerView.setHasFixedSize(true);

其余代码不变，重新运行程序，可以看到下图所示界面效果。

可以看到，自定义分割线的自由度和灵活性较大，也更加炫丽，完全可以根据实际需要来定制。

上面学习的自定义分割线只适合纵向列表，由于横向列表和网格布局每一行都有多个子视图，需要重新定义一个ItemDecoration类，这里就不作过多介绍了。

今天就先到这里，如果有问题欢迎留言一起探讨，也欢迎加入Android零基础入门技术讨论微信群，共同成长！

此文章版权为微信公众号分享达人秀（ShareExpert）——鑫鱻所有，若需转载请联系作者授权，特此声明！

往期总结分享：

Android零基础入门第1节：Android的前世今生

Android零基础入门第2节：Android 系统架构和应用组件那些事

Android零基础入门第3节：带你一起来聊一聊Android开发环境

Android零基础入门第4节：正确安装和配置JDK, 高富帅养成第一招

Android零基础入门第5节：善用ADT Bundle, 轻松邂逅女神

Android零基础入门第6节：配置优化SDK Manager, 正式约会女神

Android零基础入门第7节：搞定Android模拟器，开启甜蜜之旅

Android零基础入门第8节：HelloWorld，我的第一趟旅程出发点

Android零基础入门第9节：Android应用实战，不懂代码也可以开发

Android零基础入门第10节：开发IDE大升级，终于迎来了Android Studio

Android零基础入门第11节：简单几步带你飞，运行Android Studio工程

Android零基础入门第12节：熟悉Android Studio界面，开始装逼卖萌

Android零基础入门第13节：Android Studio个性化配置，打造开发利器

Android零基础入门第14节：使用高速Genymotion，跨入火箭时代

Android零基础入门第15节：掌握Android Studio项目结构，扬帆起航

Android零基础入门第16节：Android用户界面开发概述

Android零基础入门第17节：文本框TextView

Android零基础入门第18节：输入框EditText

Android零基础入门第19节：按钮Button

Android零基础入门第20节：复选框CheckBox和单选按钮RadioButton

Android零基础入门第21节：开关组件ToggleButton和Switch

Android零基础入门第22节：图像视图ImageView

Android零基础入门第23节：图像按钮ImageButton和缩放按钮ZoomButton

Android零基础入门第24节：自定义View简单使用，打造属于你的控件

Android零基础入门第25节：简单且最常用的LinearLayout线性布局

Android零基础入门第26节：两种对齐方式，layout_gravity和gravity大不同

Android零基础入门第27节：正确使用padding和margin

Android零基础入门第28节：轻松掌握RelativeLayout相对布局

Android零基础入门第29节：善用TableLayout表格布局

Android零基础入门第30节：两分钟掌握FrameLayout帧布局

Android零基础入门第31节：少用的AbsoluteLayout绝对布局

Android零基础入门第32节：新推出的GridLayout网格布局

Android零基础入门第33节：Android事件处理概述

Android零基础入门第34节：Android中基于监听的事件处理

Android零基础入门第35节：Android中基于回调的事件处理

Android零基础入门第36节：Android系统事件的处理

Android零基础入门第37节：初识ListView

Android零基础入门第38节：初识Adapter

Android零基础入门第39节：ListActivity和自定义列表项

Android零基础入门第40节：自定义ArrayAdapter

Android零基础入门第41节：使用SimpleAdapter

Android零基础入门第42节：自定义BaseAdapter

Android零基础入门第43节：ListView优化和列表首尾使用

Android零基础入门第44节：ListView数据动态更新

Android零基础入门第45节：网格视图GridView

Android零基础入门第46节：列表选项框Spinner

Android零基础入门第47节：自动完成文本框AutoCompleteTextView

Android零基础入门第48节：可折叠列表ExpandableListView

Android零基础入门第49节：AdapterViewFlipper图片轮播

Android零基础入门第50节：StackView卡片堆叠

Android零基础入门第51节：进度条ProgressBar

Android零基础入门第52节：自定义ProgressBar炫酷进度条

Android零基础入门第53节：拖动条SeekBar和星级评分条RatingBar

Android零基础入门第54节：视图切换组件ViewSwitcher

Android零基础入门第55节：ImageSwitcher和TextSwitcher

Android零基础入门第56节：翻转视图ViewFlipper

Android零基础入门第57节：DatePicker和TimePicker选择器

Android零基础入门第58节：数值选择器NumberPicker

Android零基础入门第59节：常用三大Clock时钟组件

Android零基础入门第60节：日历视图CalendarView和定时器Chronometer

Android零基础入门第61节：滚动视图ScrollView

Android零基础入门第62节：搜索框组件SearchView

Android零基础入门第63节：值得借鉴学习的选项卡TabHost

Android零基础入门第64节：揭开RecyclerView庐山真面目