Flutterで画面遷移してから戻ってきたことを検知する

この記事は Flutter Advent Calendar 2019 １日目 の記事です。

Flutterで画面遷移で Navigator.push を使って画面遷移を行い、その後、 Navigator.pop() したり、 AppBar から戻るをおしたり、 Androidのバックキーをタップなどで前の画面にもどってきたことを検知して処理をする方法について書きます。

Navigator.push の実装

Flutter SDK内の Navigator.push の実装は下記のようになっています。

  @optionalTypeArgs
  Future<T> push<T extends Object>(Route<T> route) {
    assert(!_debugLocked);
    assert(() { _debugLocked = true; return true; }());
    assert(route != null);
    assert(route._navigator == null);
    final Route<dynamic> oldRoute = _history.isNotEmpty ? _history.last : null;
    route._navigator = this;
    route.install(_currentOverlayEntry);
    _history.add(route);
    route.didPush();
    route.didChangeNext(null);
    if (oldRoute != null) {
      oldRoute.didChangeNext(route);
      route.didChangePrevious(oldRoute);
    }
    for (NavigatorObserver observer in widget.observers)
      observer.didPush(route, oldRoute);
    RouteNotificationMessages.maybeNotifyRouteChange(_routePushedMethod, route, oldRoute);
    assert(() { _debugLocked = false; return true; }());
    _afterNavigation(route);
    return route.popped;
  }

まあなにしてるかはとにかく置いておいて、返却される型が Future<T> になっているので、　).then((value) や、 await とかを使って処理が終わった後に何か処理をすることができるようになります、

画面遷移してから戻ってきたことを検知して処理をする

実際に画面遷移してから戻ってきたことを検知するコードはこうなります。

Navigator.push(
 context,
 CupertinoPageRoute(
   builder: (_) => // なんかのWidget,
 ),
).then((value) {
  // ここで画面遷移から戻ってきたことを検知できる
});

自分の場合は、画面遷移から戻ってきたときにアニメーションを再開するみたいな処理で使っています。

Navigator.push(
  context,
  CupertinoPageRoute(
     builder: (_) => MyPage(
       widget.observer,
       widget.analytics,
       otherUser: _currentItem.user,
     ),
   ),
).then((value) {
  animationController.forward();
});

前の画面に引数を渡す

前の画面にデータを渡すことも可能です。

(下のコードでは前の画面に false というデータを渡しています。)

• 渡す側

Navigator.pop(context, false);

• 受け取る側

Navigator.push(
 context,
 CupertinoPageRoute(
    builder: (context) =>
          Setting(widget.observer, widget.analytics),
    ),
).then((value) {
  // valueに `false` が返ってくる
  print(value);
});

地味に使うと思って書いてみました。