Introduction to State Restoration in Flutter

Flutter Night

這次很有榮幸的被受邀擔任 Google 舉辦的 Flutter Engage Extended — Flutter Night 活動的講者，我分享的主題是 State Restoration。

Concept

當App在背景模式運行，經過很長的一段時間，我們將App喚起，讓它變成前景模式運行，此時App會重新啟動，並不會恢復到上次我們使用App的狀態。主要原因是當App在背景模式運行很長一段時間，手機作業系統為了節省記憶體與資源運算，會清除到App。但這樣的話，就會造成App的使用者體驗不好，因此解決方案就是使用 State Restoration 機制。

什麼是 State Restoration？

State Restoration 就是即使App在背景模式運行很久，被手機作業系統清除，之後我們將App喚起到前景模式運行，App依舊會恢復到上次我們使用App的狀態。

Flutter v1.22 開始，提供了 State Restoration 機制。下方是 State Restoration 的架構簡易圖：

State Restoration 架構簡易圖

• RestorableProperty 就是 Restoration Data，資料是 key-value 的格式。當App在背景模式運行很久，被手機作業系統清除，之後將App喚起到前景模式運行時，從RestorableProperty取得上次暫存的資料，進而恢復App上次使用的狀態。
• RestorationBucket 儲存多筆 RestorableProperty，通常一個Bucket儲存一個View裡的Restoration Data。
• RestorationManager 管理多個 RestorationBucket，也就是管理整個App的Restoration Data。

Implement

1. 在 RootRestorationScope 提供一個 restorationId。

2. 實現 class RestorationMixin。

3. 提供 RestorationBucket 的 restorationId。

4. 實作 restoreState function，透過 registerForRestoration 方法，將 RestorableProperty 儲存至 Bucket 中。

完整程式如下：

Test

以 Android 為例：

• 在 Developer options 中開啟 Don’t keep activities。

Developer options

• 執行程式。
• 將 App 退至背景模式運行。
• 將 App 喚起至前景模式，此時App會重新啟動，並且恢復到上次使用App的狀態。

Restorable Counter App

你可以在我的GitHub中，找到 Restorable Counter App 的 Source Code。

davechao/restoration_app