【Flutter】自定義ListView開發記錄(二)——設計LayoutManager
theme: condensed-night-purple
「這是我參與11月更文挑戰的第9天,活動詳情檢視:2021最後一次更文挑戰」。
前言
前面簡單的處理了一下滑動方式的修改,使用 ListView 實現了類似於覆蓋翻頁效果的,效果如下:
此時的工程專案中就三個類:
今天稍微增加幾個類,引入layoutManager的概念,將上面覆蓋翻頁效果的部分抽過來:
引入 LayoutManager 的目的
通過之前的ListView 分析,能得知ListView真正展示內容的部分就是SliverList;
而SliverList 的內容變化是通過layout方法觸發的;所以如果想對SliverList進行修改,修改paint或layout是不可避免的部分;
所以我參考Android 的 LayoutManager,試圖將piant和layout方法暴露出來,這樣就可以通過自定義layoutManager來直接對展示內容進行修改;
LayoutManager的基礎粗略版本
按照上面的目的,先從完整的暴露paint 和 layout方法開始;
所以定義一個抽象類,規定paint和layout兩個抽象方法:
然後規定一下繫結方法,方便使用sliver本身的一些計算方法:
RenderListView加入layoutManager的託管,並設定繫結;
首先制定一個基礎版本的LayoutManager,將 RenderSliverMultiBoxAdaptor 部分的 paint 方法拿過來;來當作一個基本的LayoutManager,起名這塊,就叫它——linearLayoutManager吧;
現在把之前的覆蓋翻頁的LayoutManager也實現出來:
同樣的繼承重寫,但是在具體繪製的時候,僅僅處理可見部分;其他部分直接設定為0,並從後往前迴圈:
最後給SliverList、RenderSliverList、ListView部分都設定上layoutManager,並提供出來;
這樣就大功告成~
結語
現在通過修改paint方法,並抽到layoutManager來實現了上面的覆蓋翻頁效果;
但是是不是可以修改layout方法,讓資料來源頭這塊就是符合現實效果的?
然而ListView這塊是通過長度來計算快取的,而非像Android 的 recyclerView那樣,通過index進行快取的,所以如果修改layout方法中的layoutOffset引數的話,會影響到快取計算~
或許可以再將快取這部分改成android 中的index快取形式?
- 【Flutter】小說閱讀器改版 —— 翻頁動畫(三)
- 【Flutter】小說閱讀器改版 (六)—— 在動畫播放中攔截手勢
- 【Flutter】小說閱讀器改版 (五)—— 整合ScrollActivity
- 【Flutter】小說閱讀器改版 (四)—— 讓ScrollActivity追蹤手勢最新位置
- 【Flutter】小說閱讀器改版 (三)—— 實現支援 Drag 的ScrollActivity
- 【Flutter】小說閱讀器改版 (二)—— 改進一下模擬翻頁的效果
- 【Flutter】小說閱讀器改版 (一)—— 模擬翻頁的思路優化
- 【Flutter】自定義ListView開發記錄(五)—— 提供手勢等資訊
- 【Flutter】自定義ListView開發記錄(四)—— 關於ParentData的設想和分析與簡單實踐
- 【Flutter】自定義ListView開發記錄(三)—— 處理HitTest手勢事件
- 【Flutter】自定義ListView開發記錄(二)——設計LayoutManager
- 【Flutter】自定義ListView開發記錄(一)——設計滑動效果的處理方式
- 【Flutter】熊孩子拆元件系列之拆ListView(十)—— 按自己的方式組裝修改ListView
- 【Flutter】熊孩子拆元件系列之拆ListView(九)—— AutomaticKeepAlive和KeepAlive
- 【Flutter】熊孩子拆元件系列之拆ListView(八)—— SliverList的運作機制
- 【Flutter】熊孩子拆元件系列之拆ListView(七)—— SliverList的基礎結構
- 【Flutter】熊孩子拆元件系列之拆ListView(六)—— SliverPadding
- 【Flutter】熊孩子拆元件系列之拆ListView(五)—— ViewPort
- 【Flutter】熊孩子拆元件系列之拆ListView(四)—— _ScrollableScope
- 【Flutter】熊孩子拆元件系列之拆ListView(三)—— GlowingOverscrollIndicator