はじめに

こんにちは。エキサイト株式会社でアプリエンジニアをしている岡島です。

今回は、PopScopeについて勉強したことをまとめていこうと思います。

はじめに
バージョン
PopScopeとは
基本的な使い方
まとめ
参考記事

バージョン

Flutter: 3.22.2

PopScopeとは

PopScopeとは、戻るジェスチャを使用した時の動作をコントロールするウィジェットです。

WillPopScopeの後継となるウィジェットであり、WillPopScopeがFlutter v3.12.0-1.0.preからdeprecatedになったため、以前にWillPopScopeを使用していた場合はPopScopeに移行する必要があります。

これは、Android 14から、Predictive Back Gestureと呼ばれる機能が導入され、戻るジェスチャが予測不能になりすぐに戻るジェスチャが実行されるようになったことによる影響です。事前に戻ることが可能かどうかを判定する必要があるため、PopScopeウィジェットに移行する必要が出てきたようです。

Here comes PopScope, directly replacing the WillPopScope widget. Let’s dive into it and understand why it is needed.

Android 14 introduced a new feature called Predictive Back Gesture. In short, the back gesture is now more unpredictable, and it happens immediately when the user interacts with the gesture.

Migrating from WillPopScope to PopScope in Flutter | by Fahim Ahmed | Mediumより引用

WillPopScopeでは非同期の処理で、ユーザーが戻るジェスチャを押した時のみ処理が走るようですが、PopScopeでは同期的な処理となり、あらかじめ戻れるかどうかを明確にする必要があります。

基本的な使い方

 PopScope(
     canPop: false,
     onPopInvoked: (bool didPop){
        // 戻るボタンが押された時の処理
      },
),

canPop: trueの場合、通常の戻る操作が許可されます。falseの場合、戻る操作がブロックされます。デフォルトでは true です。
onPopInvoked: 戻る操作が行われた時に呼び出されるコールバック関数です。 didPopパラメータは、戻るナビゲーションが実際に成功したかどうかを示します。

onPopInvokedが呼ばれるときにPopされることを防ぐことはできないので、事前にPopされることを阻止するにはcanPopでfalseを設定します。

canPopをfalseにすることで、一時的に戻る操作を防ぎ、onPopInvokedで戻る動作を扱うような使い方ができます。フォームに未保存の変更がある場合、ユーザーに確認を求めるというような確認ダイアログなどにも使えそうです。