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,定期推送移動開發前沿技術文章: