說一說V-Layout框架的原理和使用場景

Vlayout是alibaba開源的一個基礎ui框架,用于快速實現一些復雜布局,在淘寶和天貓App中都有使用。

demo

先來看一下官方的介紹:

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提供ViewHolder

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

wutongke

推薦閱讀

說一說Facebook開源的Litho
使用ConstraintLayout制作漂亮的動畫

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容