Vlayout是alibaba开源的一个基础ui框架,用于快速实现一些复杂布局,在淘宝和天猫App中都有使用。
先来看一下官方的介绍:
VirtualLayout是一个针对RecyclerView的LayoutManager扩展, 主要提供一整套布局方案和布局间的组件复用的问题。
通过定制化的LayoutManager,接管整个RecyclerView的布局逻辑;LayoutManager管理了一系列LayoutHelper,LayoutHelper负责具体布局逻辑实现的地方;每一个LayoutHelper负责页面某一个范围内的组件布局;不同的LayoutHelper可以做不同的布局逻辑,因此可以在一个RecyclerView页面里提供异构的布局结构,这就能比系统自带的LinearLayoutManager、GridLayoutManager等提供更加丰富的能力。同时支持扩展LayoutHelper来提供更多的布局能力。
从RecyclerView出发
VLayout主要扩展自RecyclerView,我们就从RecyclerView说起,先来看一下RecyclerView中的几个关键元素:
-
RecyclerView.LayoutManager
主要负责对RecyclerView中的ItemView布局,我们经常用到它的子类:
RecyclerView.ItemDecoration
给每一项Item视图添加子View,可以在Item直接增加分割线等RecyclerView.ItemAnimator
负责处理Item添加或者删除时候的动画效果RecyclerView.Adapter
为每一个positon提供ViewHolderRecyclerView.ViewHolder
负责Item 自身的布局,并参与到RecyclerView的缓存策略中。
VLayout的思路
从官网的介绍VLayout扩展的主要是LayoutManager,具体布局逻辑在LayoutHelper中实现。Vlayout提供了各种各样的LayoutHelper实现,同时也可以非常容易地扩展实现自定义的LayoutHelper。
可以看的上图的列表中有各种各样的布局,这些都是LayoutHelper的功劳。
我们知道在RecyclerView中正常是只有一种布局的,如果列表中需要使用不同的布局,可以通过设置不同的ItemType,提供多种ViewHolder来实现。
VLayout使用了不同的思路。其继承RecyclerView.Adapter类来实现DelegateAdapter类,通过DelegateAdapter来实现复杂布局的展示,同时实现了自己的缓存。
DelegateAdapter的原理其实是串联多个继承自RecyclerView.Adapter的adapter来管理数据和视图的适配:
所以每个adapter和layouthelper负责一个区域,每个区域有多个ItemView。
DelegateAdapter负责组合多个adapter,展示在RecyclerView中。
这有一个比较明显的缺点是,每个子adapter只负责一个连续的区域,如果,有多个区域需要同样的adapter,就需要添加两次adapter。
VLayout 使用场景
从以上的分析中,个人认为类似淘宝这样形式的布局非常适合使用VLayout,并且VLayout提供了多种layoutHelper,使用非常方便。
但是如果是类似于微博、微信这种Feed流为主的界面,使用VLayout并没有什么优势,徒增实现的复杂度。
欢迎关注公众号wutongke,定期推送移动开发前沿技术文章: