用RecyclerView展现错误和空白界面 附加详情界面实践-MultiItem进阶 | 掘金技术征文

前言

本文是MultiItem系列的进阶文章，讲解如何展现空白、错误等状态页，这个功能比较经常使用，实现的思路也有不少，本文的思路是把状态页当成一个填充满RecyclerView的Item，不须要事先定义到布局中，而后利用库中封装的一个状态页辅助类进行管理，方便简洁，而且作到了用时再去初始化，减小资源浪费。另外会附加讲一下，对于展现业务中详情页的实践，因为这个实践目前比较简单，因此就不单拿出来写一篇文章了。MultiItem特色：

• 直接使用业务中的实体类为RecyclerView Adapter设置数据源，不须要作任何封装
• RecyclerView Adapter零编码，解放了复杂的Adapter类
• 支持DataBinding，让你清爽的编写列表代码
• 支持Form表单录入，懒加载易复用，支持DataBinding、隐藏域、输入内容验证及是否变化
• 支持业务详情页展现
• 支持空白、错误等状态页的展现

源码地址

Github地址：github.com/free46000/M…，请你们多多关注。

系列文章

• MultiItem用法与详解-优雅的实现多类型
• MultiItem进阶 实现Head Foot和加载更多
• MultiItem进阶 使用DataBinding让RecyclerView代码更简洁清爽
• MultiItem进阶 让咱们用RecyclerView实现录入Form表单 给你一个新思路
• MultiItem扩展 仿任务面板 跨多个RecyclerView的Item拖动 支持缩小后拖动

效果截图

空白错误页

详情页效果

用法

开启数据绑定

因为用到了数据绑定的技术，首先须要在build.gradle开启DataBinding：

dataBinding {
    enabled = true
}复制代码

状态页使用方法

状态页就是空白错误等页面，首先初始化列表和辅助类，为列表设置点击监听，处理状态页的展现。让每一个状态对应一个实例，使用起来更清晰。

protected void initViews() {
    //初始化adapter
    BaseItemAdapter adapter = new BaseItemAdapter();
    //为XXBean数据源注册XXManager管理类
    adapter.register(TextBean.class, new TextViewManager());
    recyclerView.setAdapter(adapter);
    adapter.addDataItem(new TextBean("展现空白页"));
    adapter.addDataItem(new TextBean("展现错误页"));
    //设置点击监听，再点击Item的时候展现空白或者错误页面
    setOnItemClickListener(adapter);
    //初始化空白页辅助类
    emptyViewHelper = newStateViewHelper("列表数据为空");
    //初始化错误页辅助类
    errorViewHelper = newStateViewHelper("数据加载错误");
}

/** * 建立新的状态页辅助类 * * @param message 状态页展现的信息 * @return StateViewHelper */
private StateViewHelper newStateViewHelper(String message) {
    //初始化状态Item
    BaseItemState stateItem = new ItemEmptyAndError(message);
    //初始化辅助类，须要一个BaseItemState
    StateViewHelper stateViewHelper = new StateViewHelper(recyclerView, stateItem);
    //设置状态页按钮的点击事件监听，处理状态页隐藏
    stateItem.setOnStateClickListener(() -> errorViewHelper.hide());
    return stateViewHelper;
}

/** * 设置点击监听，再点击Item的时候展现空白或者错误页面 */
private void setOnItemClickListener(BaseItemAdapter adapter) {
    adapter.setOnItemClickListener(new OnItemClickListener() {
        @Override
        public void onItemClick(BaseViewHolder viewHolder) {
            switch (viewHolder.getItemPosition()) {
                case 0:
                    //展现空白页
                    emptyViewHelper.show();
                    break;
                case 1:
                    //展现错误页
                    errorViewHelper.show();
                    break;
            }
        }
    });
}复制代码

由上面代码能够看出咱们须要一个BaseItemState的类，Demo中自定义了一个ItemEmptyAndError的子类，使用了DataBinding的技术，因为自己并无承载太多的业务，只是对一些属性进行存储，逻辑基本都在xml布局中，下面咱们看下布局的主要代码：

<?xml version="1.0" encoding="utf-8"?>
<layout ... >

    <data>
        <variable name="itemData" type="com.freelib.multiitem.demo.state.ItemEmptyAndError"/>
    </data>

    <android.support.constraint.ConstraintLayout ... >

        <TextView //文本绑定 android:text="@{itemData.message}" ... />

        <Button //点击监听 android:onClick="@{() -> itemData.onStateClickListener.onStateClick()}" //文本绑定 android:text="@{itemData.btnText}" ... />
    </android.support.constraint.ConstraintLayout>
</layout>复制代码

详情页相关实践

Demo中介绍了展现用户详情页，并无复杂的界面，首先咱们为每一条用户信息项声明一个ItemInfo实体，Demo里为了简单，只实现了这一种类型，你们使用的时候视具体业务而定（例如：文章详情功能：就须要，标题、内容、回复等至少三种Item...）。
下面咱们来看看相关实现代码，组装用户展现项，并添加到列表中：

protected void initViews() {
    UserBean userBean = getUserBean();

    recyclerView.setLayoutManager(new LinearLayoutManager(this));
    //初始化adapter
    BaseItemAdapter adapter = new BaseItemAdapter();
    //为UserBean数据源注册数据绑定View Holder Manager管理类
    adapter.register(ItemInfo.class, new DataBindViewHolderManager<>(
            R.layout.item_info, BR.itemData));
    recyclerView.setAdapter(adapter);

    //构建用户信息须要展现的ItemInfo的集合，每一个ItemInfo表明页面中的一行
    List<ItemInfo> list = new ArrayList<>(5);
    list.add(new ItemInfo("名字", userBean.getName()));
    list.add(new ItemInfo("性别", userBean.getSex()));
    list.add(new ItemInfo("年龄", userBean.getAge()));
    list.add(new ItemInfo("城市", userBean.getAddr()));
    list.add(new ItemInfo("介绍", userBean.getInfo()));
    adapter.setDataItems(list);
}复制代码

而后咱们看下ItemInfo实体类，其实很是简单：

public class ItemInfo {
    private String name;
    private String value;

    public ItemInfo(String name, String value) {
        this.name = name;
        this.value = value;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getValue() {
        return value;
    }

    public void setValue(String value) {
        this.value = value;
    }
}复制代码

能够看出上面的代码中除了声明了新的ItemInfo实体类之外，其他所有使用了已有的方法而且是MultiItem库中已经定义好的基础类。因此用起来仍是很轻的，但愿你们多多尝试。

总结

状态界面采用辅助类的方式实现，没有侵入原有的业务代码，而且对于每种状态会生成对应的实例去管理，使用起来更灵活，更简洁。详情界面是对已有功能的一个实践，可能用户详情这个例子并非特别适合，可是前面提到的文章详情界面应该更有说服力。期待你们多多挖掘实用的功能，欢迎你们多多交流。