Flutter Android でもスワイプで戻る機能を有効にする

より新しい方法は https://qiita.com/najeira/items/dfa20d0104bd4457bc9a を参照

---

「iOSにおけるスワイプで戻る」をAndroidでも提供するために、CARTUNEでは画面遷移にCupertinoPageRouteを使っています。これはFlutterが提供しているクラスです。

• CupertinoPageRoute

このPageRouteは、通常の画面遷移は横方向のスライド、ダイアログ（fullscreenDialog: false時）の場合は縦方向のスライドと、画面遷移のトランジションもiOS標準のものと同じようになっています。

この画面遷移の仕方はAndroidユーザーにとっても分かりやすいと思い、これでiOS/Androidともに統一しています。

ちなみに、画面遷移のたびに CupertinoPageRoute を書くのは手間なので、以下のような関数を用意して使っています。

Future<T> pushPage<T>(BuildContext context, WidgetBuilder builder, {String name}) {
  return Navigator.push<T>(
    context,
    new CupertinoPageRoute<T>(
      builder: builder,
      settings: new RouteSettings(name: name),
    ),
  );
}

Future<T> pushDialog<T>(BuildContext context, WidgetBuilder builder, {String name}) {
  final nav = Navigator.of(context, rootNavigator: true);
  return nav.push<T>(
    new CupertinoPageRoute<T>(
      builder: builder,
      settings: new RouteSettings(name: name),
      fullscreenDialog: true,
    ),
  );
}

使う側はこんな感じ:

// 結果のやりとりがない画面遷移
pushPage<void>(
  context,
  (BuildContext context) {
    return new YourPage();
  },
  name: "/foo/bar",
);

// 何らかの画面を表示し、その画面から結果を受け取るような処理
final future = pushDialog<int>(
  context,
  (BuildContext context) {
    return new YourDialog();
  },
);

// pop時に渡した値が入ってくる
final result = await future;

※サンプルコードのライセンスは MIT とします。

※CARTUNEの実際のコードでは、歴史的経緯などによりMaterialPageRouteを継承したMyPageRouteを定義し、その内部からCupertinoPageRouteを使っていますが、記事のように直接CupertinoPageRouteを使っても大丈夫なはずです。

※歴史的経緯とは、以前のFlutterではMaterialPageRouteを前提としたコードがあったことです。ただ、このコミット により直っているので、いまはCupertinoPageRoute直でいいはず。

この記事はQiitaの記事をエクスポートしたものです