Android 复杂的多类型列表视图新写法: drakeet/MultiType

2016-08-04 11:00:11 +08:00
 drakeet

MultiType

Android 复杂的多类型列表视图新写法,清晰、灵活、模块开发、插件化思想

中文版 | 英文版

GitHub: https://github.com/drakeet/MultiType

这几天晚上回家开始设计我的 TimeMachine 的消息池系统,并抽取出来开源成一个全新的类库: MultiType! 从前,我们写一个复杂的、多 item view types 的列表视图,经常要做一堆繁琐的工作,而且不小心的话代码还堆积严重:我们需要覆写 RecyclerView.AdaptergetItemViewType 方法,并新增一些 type 整形常量,而且 ViewHolder 继承、泛型传递、转型也比较糟糕,毕竟 Adapter 只能接受一个泛型……十分麻烦导致过于复杂的页面经常会使用 ScrollView 来实现,一次性加载,而且失去了复用性。

而且,一旦我们需要新增一些新的 item view types ,就得去修改 Adapter 旧的代码,步骤繁多,侵入较强

现在好了,只要三步,不需要修改旧代码,只要无脑往池子里插入新的 type ,会自动连接、分发数据和事件,新增再多的 item types 都能轻松搞定,支持 RV 、复用,代码模块开发,清晰而灵活。若要说为什么这么灵活? 因为它本来就是为 IM 视图开发的,想想 IM 的消息类型可能有多少种而且新增频繁。

接入

在你的 build.gradle:

dependencies {
    compile 'me.drakeet.multitype:multitype:1.1-beta2'
}

使用

Step 1. 创建一个 class implements ItemContent,它将是你的数据类型或 Java bean,示例:

public class TextItemContent implements ItemContent, Savable {

    @NonNull public String text;

    public TextItemContent(@NonNull String text) {
        this.text = text;
    }

    public TextItemContent(@NonNull byte[] data) {
        init(data);
    }

    @Override public void init(@NonNull byte[] data) {
        String json = new String(data);
        this.text = new Gson().fromJson(json, TextItemContent.class).text;
    }

    @NonNull @Override public byte[] toBytes() {
        return new Gson().toJson(this).getBytes();
    }
}

Step 2. 创建一个 class 继承 ItemViewProvider<T extends ItemContent>,示例:

public class TextItemViewProvider extends ItemViewProvider<TextItemContent> {

    private static class ViewHolder extends ItemViewProvider.ViewHolder {
        @NonNull final TextView text;


        ViewHolder(@NonNull View itemView) {
            super(itemView);
            this.text = (TextView) itemView.findViewById(R.id.text);
        }
    }


    @NonNull @Override
    protected View onCreateView(@NonNull LayoutInflater inflater, @NonNull ViewGroup parent) {
        View root = inflater.inflate(R.layout.item_text, parent, false);
        ViewHolder holder = new ViewHolder(root);
        root.setTag(holder);
        return root;
    }


    @Override
    protected void onBindView(
        @NonNull View view, @NonNull TextItemContent content, @NonNull TypeItem typeItem) {
        ViewHolder holder = (ViewHolder) view.getTag();
        holder.text.setText("hello: " + content.text);
    }
}

Step 3. 好了,你不必再创建新的类文件了,只要往你的 Activity 中加入 RecyclerViewList<TypeItem> 即可,示例:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    recyclerView = (RecyclerView) findViewById(R.id.list);

    itemFactory = new TypeItemFactory.Builder().build();
    TypeItem textItem = itemFactory.newItem(new TextItemContent("world"));
    TypeItem imageItem = itemFactory.newItem(new ImageItemContent(R.mipmap.ic_launcher));
    TypeItem richItem = itemFactory.newItem(new RichItemContent("小艾大人赛高", R.mipmap.avatar));

    List<TypeItem> typeItems = new ArrayList<>(80);
    for (int i = 0; i < 20; i++) {
        typeItems.add(textItem);
        typeItems.add(imageItem);
        typeItems.add(richItem);
    }

    /* register the types before setAdapter, that's all right */
    ItemTypePool.register(TextItemContent.class, new TextItemViewProvider());
    ItemTypePool.register(ImageItemContent.class, new ImageItemViewProvider());
    ItemTypePool.register(RichItemContent.class, new RichItemViewProvider());

    recyclerView.setAdapter(new TypeItemsAdapter(typeItems));
}

大功告成!

你可以阅读源码项目中的 sample 模块获得更多信息和示例,当完整的示例代码运行起来,它是这样子的:

题外话

这个类库成品看来是挺精巧的,或者说轻巧,但一个人从无到有把它设计和创造出来,还是费了很多思考和多次推翻重构,其中有些点看起来可能自然而然,但是它在开发过程中可能都是一个小坎,如果没有找到合适的结构或设计,整体可能就不能搭建起来,使用也可能没那么简单和灵活。所以,要是有人感兴趣,之后可以分享一下开发过程中遇到的问题和思考,还是很有意思的 : )

11065 次点击
所在节点    Android
5 条回复
echopan
2016-08-05 11:18:11 +08:00
支持一下小伙伴 darkeet
liangzhitao
2016-08-06 14:12:03 +08:00
👍👍👍
drakeet
2016-08-13 20:58:24 +08:00
最新 release 版本 v1.2:

https://github.com/drakeet/MultiType/releases

## 性能测试

找了一个小米 2s 来对 `MultiType` 进行测试,注入 9999 个 `ItemContent` class 和 `ItemViewProvider` 对象,`ItemContent` 包含 12 个随机 String ,`ItemViewProvider.TestViewHolder` 包含 12 个 `TextView` 对象,并将我们使用的 Type 排到第 10000 位以后(检索严格模式)。

测试结果表明,性能极好。初始化注册 10000 个类型,只要 10 毫秒左右!而且内存占用也极低,因为类型 class 和 provider 对象都是非常非常轻薄的对象,后者虽然是以传统实例注册(其实 class 也是实例),但 provider 层面不持有任何对象,它只提供生产方法;另外,尽管 target index 在 10000 位以后,但丝毫不会影响列表滑动流畅性,因为计算个 10000 次,对于我们的手机 CPU ,简直比我们人类 1 + 1 还简单的事情。这更近坚定了我使用全局类型池的设计。



那么问题来了,即使是淘宝,有超过 10000 个 item types 吗?我们真的需要局部类型池吗?答案我想是显然的。
G0D
2016-08-31 08:52:38 +08:00
drakeet
2016-10-17 11:18:29 +08:00
MultiType v2.2.0-beta1, 支持了局部类型池: https://github.com/drakeet/MultiType/blob/master/README-zh-cn.md

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/297027

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX