Flutter 保持頁面緩存 保持頁面狀態(tài)

在默認情況下頁面切換走時會被銷毀，頁面切換回來時會被重新創(chuàng)建，如果頁面中有列表那么整個列表將會被重新創(chuàng)建，降低了用戶體驗，下面是解決這個問題的幾種處理方式

創(chuàng)新互聯(lián)建站網(wǎng)絡(luò)公司擁有十余年的成都網(wǎng)站開發(fā)建設(shè)經(jīng)驗，近千家客戶的共同信賴。提供成都做網(wǎng)站、成都網(wǎng)站建設(shè)、網(wǎng)站開發(fā)、網(wǎng)站定制、買鏈接、建網(wǎng)站、網(wǎng)站搭建、響應(yīng)式網(wǎng)站設(shè)計、網(wǎng)頁設(shè)計師打造企業(yè)風(fēng)格，提供周到的售前咨詢和貼心的售后服務(wù)

flutter圖片內(nèi)存優(yōu)化

按照給定尺寸進行圖片的解碼，而不是解碼整個圖片的尺寸，用來減少內(nèi)存的占用。

官方文檔：

官方說明：

Instructs Flutter to decode the image at the specified dimensions instead of at its native size.

This allows finer control of the size of the image in ImageCache and is generally used to reduce the memory footprint of ImageCache .

The decoded image may still be displayed at sizes other than the cached size provided here.

使用：

三方庫： cached_network_image 限2.5.0之后版本才可用

設(shè)定最大的緩存寬度和高度 this.maxWidthDiskCache 、 this.maxHeightDiskCache

使用：

從相冊選取圖片，展示時使用指定尺寸寬高進行處理。

使用三方庫：

使用自定義 provider 來指定所需圖片的寬高：

AssetEntityImageProvider 傳入寬高和圖片原圖 AssetEntity 數(shù)據(jù)。

provider 中 key.entity.thumbDataWithSize 方法：

進入 entity 中 thumbDataWithSize 方法：

進入 _getThumbDataWithId 方法中，

進入getThumb：

調(diào)用iOS原生的獲取圖片方法，

進入 getThumbWithId 方法，

原生實現(xiàn)獲取置頂寬高縮略圖方法實現(xiàn)：

使用 iOS 原生類 PHImageManager 的

來獲取縮略圖。

Flutter Image圖片加載流程

圖片加載過程是由ImageProvider觸發(fā)的。而ImageProvider表示異步獲取圖片數(shù)據(jù)的操作，可以從資源，網(wǎng)絡(luò)，文件等不同的渠道獲取。

首先，ImageProvider根據(jù)_ImageState中傳遞的圖片配置生成對應(yīng)的圖片緩存key，然后去ImageCache中查找是否由對應(yīng)的圖片緩存，如果有，通知刷新對應(yīng)的UI；如果沒有通過ImageStream異步加載，加載完成后更新緩存，然后通知_ImageState刷新UI。

ImageCache采用的是LRU（Least Recently Used）

flutter 圖片緩存

Flutter的圖片緩存機制有問題（可能是我使用的版本1.12.13有問題）

網(wǎng)絡(luò)圖片會默認緩存到本地，但是不管圖片是不是完整的或者損壞的，導(dǎo)致頁面在下次進入的時候會優(yōu)先從緩存里讀取圖片。有些圖片是沒有加載完成的，或者損壞的，導(dǎo)致圖片無法顯示。UI效果就是顯示成白色的。

一種解決方式：加載前或者退出后清理圖片緩存

ImageCache??imageCache?=?PaintingBinding.instance.imageCache;?

imageCache.clear();

缺點就是每次圖片都想要從網(wǎng)絡(luò)上獲取，增加服務(wù)器負擔(dān)

Flutter進行本地緩存

get方法獲取數(shù)據(jù)，封裝存儲和移除方法用于操作數(shù)據(jù)緩存列表（需要優(yōu)化，僅參考）