Flutter 下拉刷新、上拉加載flutter_easyrefresh的使用

flutter_easyrefresh: ^2.0.5

公司主營(yíng)業(yè)務(wù)：成都做網(wǎng)站、成都網(wǎng)站建設(shè)、移動(dòng)網(wǎng)站開(kāi)發(fā)等業(yè)務(wù)。幫助企業(yè)客戶(hù)真正實(shí)現(xiàn)互聯(lián)網(wǎng)宣傳，提高企業(yè)的競(jìng)爭(zhēng)能力。創(chuàng)新互聯(lián)公司是一支青春激揚(yáng)、勤奮敬業(yè)、活力青春激揚(yáng)、勤奮敬業(yè)、活力澎湃、和諧高效的團(tuán)隊(duì)。公司秉承以“開(kāi)放、自由、嚴(yán)謹(jǐn)、自律”為核心的企業(yè)文化，感謝他們對(duì)我們的高要求，感謝他們從不同領(lǐng)域給我們帶來(lái)的挑戰(zhàn)，讓我們激情的團(tuán)隊(duì)有機(jī)會(huì)用頭腦與智慧不斷的給客戶(hù)帶來(lái)驚喜。創(chuàng)新互聯(lián)公司推出尋烏免費(fèi)做網(wǎng)站回饋大家。

Pub get一下

下面我就以flutter_easyrefresh這個(gè)插件進(jìn)行講解。

[參照]{ }

flutter刷新頁(yè)面的方法

這種方法最常見(jiàn)，但是有些地方引用的話(huà)，刷新的成本比較大，刷新的是整個(gè)頁(yè)面，數(shù)據(jù)太多加載太慢的話(huà)，會(huì)有閃爍的現(xiàn)象

這種方法類(lèi)似于iOS中的set方法，通過(guò)設(shè)置某個(gè)屬性的時(shí)候，去刷新某個(gè)控件。在flutter中這種刷新方式，是對(duì)上面setState(){}方法的改進(jìn)，根本的方法還是setState(){}，只不過(guò)是通過(guò)方法去刷新某個(gè)控件。如下：

首先在pubspec.yaml中添加provider依賴(lài)

下面通過(guò)provider來(lái)實(shí)現(xiàn)一個(gè)發(fā)送驗(yàn)證碼的案例。

創(chuàng)建一個(gè)TimerModel文件

頁(yè)面布局如下：

Flutter下拉刷新、上拉加載

注意： 滾動(dòng)組件添加： physics: ClampingScrollPhysics() 可以處理IOS系統(tǒng)的物理滾動(dòng)的效果（即橡皮筋效果）

ListView 是最常用的可滾動(dòng)組件之一，可以沿一個(gè)方向線性排布所有子組件，并且它也支持基于Sliver的延遲構(gòu)建模型

默認(rèn)構(gòu)造函數(shù)：

ListView.builder：

ListView.separated：

ListView.separated 可以在生成的列表項(xiàng)之間添加一個(gè)分割組件，它比 ListView.builder 多了一個(gè) separatorBuilder 參數(shù)，該參數(shù)是一個(gè)分割組件生成器。

RefreshIndicator 下拉刷新：

RefreshIndicator 是 Material 風(fēng)格的下拉刷新組件。

CupertinoSliverRefreshControl 下拉刷新：

CupertinoSliverRefreshControl 是 ios 風(fēng)格的下拉刷新控件。

上拉加載的功能，需要用到 ScrollController + ListView組件:

Flutter的setState（狀態(tài)刷新）

Flutter有兩個(gè)常用的狀態(tài)類(lèi)：

標(biāo)記為dirty，執(zhí)行的markNeedsBuild，定義在Element類(lèi)中：

當(dāng)前Element節(jié)點(diǎn)被標(biāo)記為dirty，同時(shí)調(diào)用owner的scheduleBuildFor方法：

將element元素添加到全局的“臟”鏈表里。

BuildOwner用來(lái)管理哪些需要更新的Widget。這個(gè)owner最開(kāi)始被初始化的地方在WidgetsBinding的initInstances方法中，隨后初始化了onBuildScheduled方法，對(duì)應(yīng)執(zhí)行的是_handleBuildScheduled，定義在WidgetsBinding類(lèi)中：

ensureVisualUpdate 方法定義在SchedulerBinding類(lèi)中：

在提交下一幀繪制的時(shí)候會(huì)調(diào)用到scheduleFrame方法，提交給引擎繪制，看看scheduleFrame方法，也定義在SchedulerBinding類(lèi)中：

提交給引擎繪制之后，會(huì)收到onDrawFrame的回調(diào)，最終執(zhí)行到_handleDrawFrame方法中，對(duì)應(yīng)的是handleDrawFrame方法，定義在SchedulerBinding類(lèi)中：

在RendererBinding的initInstances方法中添加了一個(gè)回調(diào)到這個(gè)List中，對(duì)應(yīng)的是RenderBinding的drawFrame方法，對(duì)應(yīng)的節(jié)點(diǎn)進(jìn)行繪制渲染操作。

WidgetsBinding中的drawFrame方法：

看看這里的buildScope方法，定義在BuildOwner方法中。在上面 scheduleBuildFor 方法介紹中有提到："scheduleBuildFor 是把一個(gè) element 添加到 _dirtyElements 鏈表，以便當(dāng)[WidgetsBinding.drawFrame]中調(diào)用 buildScope 的時(shí)候能夠重構(gòu) element。onBuildScheduled()是一個(gè) BuildOwner 的回調(diào)"。在 drawFrame 中調(diào)用 buildOwner.buildScope(renderViewElement)更新 elements。

_dirtyElements列表在遍歷的過(guò)程中執(zhí)行rebuild方法，此時(shí)將所有標(biāo)記為dirty的Element節(jié)點(diǎn)依次執(zhí)行rebuild，preformRebuild，build，updateChild，update方法，執(zhí)行界面更新。完成build，update操作完成之后，后續(xù)會(huì)將需要繪制的RenderObject添加到需要layout的列表中，等待繪制渲染。所有繪制完成之后將_dirtyElments列表清空，_inDirtyList標(biāo)記位置為false。

提交給引擎繪制渲染

看看super.drawFrame()，這里就執(zhí)行到了RendererBinding類(lèi)中，定義如下：

這里就是將最終需要繪制渲染的畫(huà)面提交給引擎的地方了，繪制完成之后就在界面顯示更新后的視圖了。