ルーティングスタックの変更のグローバルモニタリング

Lao Mengのガイド：ルーティングスタックをカスタマイズして例外ログを分析できるように、ルーティングスタックの変更を監視する必要があることがよくあります。

使用にRouteObserverルーティングスタック内のモニターに変化。まず、追加でMaterialAppのコンポーネントnavigatorObservers：

void main() {
  runApp(MyApp());
}

RouteObserver<PageRoute> routeObserver = RouteObserver<PageRoute>();

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      ...
      navigatorObservers: [routeObserver],
      home: HomePage(),
    );
  }
}

監視ページの設定は次のとおりです。

class ARouteObserverDemo extends StatefulWidget {
  @override
  _RouteObserverDemoState createState() => _RouteObserverDemoState();
}

class _RouteObserverDemoState extends State<ARouteObserverDemo> with RouteAware {

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    routeObserver.subscribe(this, ModalRoute.of(context));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        alignment: Alignment.center,
        child: RaisedButton(
          child: Text('A RouteObserver'),
          onPressed: () {
            Navigator.of(context).pushNamed('/BRouteObserver');
          },
        ),
      ),
    );
  }

  @override
  void dispose() {
    super.dispose();
    routeObserver.unsubscribe(this);
  }

  @override
  void didPush() {
    final route = ModalRoute.of(context).settings.name;
    print('A-didPush route: $route');
  }

  @override
  void didPopNext() {
    final route = ModalRoute.of(context).settings.name;
    print('A-didPopNext route: $route');
  }

  @override
  void didPushNext() {
    final route = ModalRoute.of(context).settings.name;
    print('A-didPushNext route: $route');
  }

  @override
  void didPop() {
    final route = ModalRoute.of(context).settings.name;
    print('A-didPop route: $route');
  }

}

その中で、didPush、didPushNext、didPopNext、didPopは、スタック変更をルーティングするためのコールバックです。

ページAからページARouteObserverDemoにジャンプすると、ログ出力は次のようになります。

flutter: A-didPush route: /ARouteObserver

このページに入ると、didPushと呼ばれるだけです。

ARouteObserverDemoページからBRouteObserverDemoページ（監視が設定されたARouteObserverDemoページと同じ）にジャンプすると、ログ出力は次のようになります。

flutter: A-didPushNext route: /ARouteObserver
flutter: B-didPush route: /BRouteObserver

最初にARouteObserverDemoページでdidPushNextを呼び出し、次にBRouteObserverDemoページでdidPushを呼び出しました。

BRouteObserverDemoページからpopを実行して、ARouteObserverDemoページに戻ります。ログ出力は次のとおりです。

flutter: A-didPopNext route: /ARouteObserver
flutter: B-didPop route: /BRouteObserver

最初にARouteObserverDemoページでdidPopNextを呼び出し、次にBRouteObserverDemoページでdidPopを呼び出します。

上記のケースは、アプリケーションのルーティングスタック全体の変更に対処する方法を知りたい場合は、ページレベルのルーティングスタックの変更にすぎません。

1つの方法は、ルーティングスタックを監視する基本クラスを作成することです。すべてのページは、この基本クラスを継承します。この方法は、ソースコードに対して非常に侵襲的です。

もう1つの方法は、RouteObserverをカスタマイズし、RouteObserverを継承して、メソッドを書き直すことです。

class MyRouteObserver<R extends Route<dynamic>> extends RouteObserver<R> {
  @override
  void didPush(Route route, Route previousRoute) {
    super.didPush(route, previousRoute);
    print('didPush route: $route,previousRoute:$previousRoute');
  }

  @override
  void didPop(Route route, Route previousRoute) {
    super.didPop(route, previousRoute);
    print('didPop route: $route,previousRoute:$previousRoute');
  }

  @override
  void didReplace({Route newRoute, Route oldRoute}) {
    super.didReplace(newRoute: newRoute, oldRoute: oldRoute);
    print('didReplace newRoute: $newRoute,oldRoute:$oldRoute');
  }

  @override
  void didRemove(Route route, Route previousRoute) {
    super.didRemove(route, previousRoute);
    print('didRemove route: $route,previousRoute:$previousRoute');
  }

  @override
  void didStartUserGesture(Route route, Route previousRoute) {
    super.didStartUserGesture(route, previousRoute);
    print('didStartUserGesture route: $route,previousRoute:$previousRoute');
  }

  @override
  void didStopUserGesture() {
    super.didStopUserGesture();
    print('didStopUserGesture');
  }
}

使用する：

void main() {
  runApp(MyApp());
}

MyRouteObserver<PageRoute> myRouteObserver = MyRouteObserver<PageRoute>();

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      navigatorObservers: [myRouteObserver],
      initialRoute: '/A',
      home: APage(),
    );
  }
}

このとき、ページAからページBにジャンプすると、ログ出力は次のようになります。

flutter: didPush route: MaterialPageRoute<dynamic>(RouteSettings("/B", 来自A), animation: AnimationController#6d429(▶ 0.000; for MaterialPageRoute<dynamic>(/B))),previousRoute:MaterialPageRoute<dynamic>(RouteSettings("/A", null), animation: AnimationController#e60f7(⏭ 1.000; paused; for MaterialPageRoute<dynamic>(/A)))

と通信する

Laomeng Flutterブログ（330コントロールの使用法+実際の戦闘紹介シリーズ）：http：//laomengit.com

Flutter交換グループ（WeChat：laomengit）に参加し、パブリックアカウント[Lao Meng Flutter]をフォローすることを歓迎します：