【Flutter】AppBarで戻る時に特定の処理をしたい

はじめに

Flutterを利用してモバイルアプリを開発している際、AppBarで前画面へ戻る前に、特定の処理を実行する方法を備忘のために残しておく。

前提

通常は、画面遷移を行うと、デフォルトでAppBarに戻るアイコンが表示されます。
これを押下すると、直前の画面に戻りますが、その際に何か処理を組み込むことはできません。

appBar: AppBar(
  backgroundColor: Theme.of(context).colorScheme.inversePrimary,
),

まずはAppBarの戻るアイコンを消す

AppBarのautomaticallyImplyLeading要素をfalseに設定する。

appBar: AppBar(
  backgroundColor: Theme.of(context).colorScheme.inversePrimary,
  automaticallyImplyLeading: false,
),

好きなボタンを配置する

AppBarのleading要素に好きなボタンを配置します。
今回は見た目はデフォルトに近づけたかったので、IconButtonを使用しました。
戻るアイコンを押下時、Navigator.pop(context)で前画面に戻る前に、行いたい処理を記述します。
今回はFirebaseに登録していた不要レコードを、前画面に戻る前に削除する処理を記述しています。

appBar: AppBar(
  backgroundColor: Theme.of(context).colorScheme.inversePrimary,
  automaticallyImplyLeading: false,

  // 戻るアイコン
  leading: IconButton(
    icon: const Icon(Icons.arrow_back_ios),
    onPressed: () {
      final db = FirebaseFirestore.instance;
      db.collection("diary").doc(this.diaryId).delete();
      Navigator.pop(context);
    },
  ),
),

当然ながら、戻るアイコンそのものを色々と変えることはできますが、ユーザ的にはスタンダードな方がわかりやすそうではありますね。