RouteObserverを定義する
このサンプルの場合main.dartのグローバルに定義しています。
main.dart
final RouteObserver<ModalRoute> routeObserver = RouteObserver<ModalRoute>();
定義したrouteObserverをMaterialAppに設定する
main.dart
return MaterialApp(
…
navigatorObservers: [routeObserver],
…
);
遷移を検知したい画面で、定義したrouteObserverを使う
検知したいウィジェットにwith
でRouteAware
をくっつけて使います。
import '/main.dart'; // main.dartに定義された、routeObserverをインポートするため
class RouteAwareSample extends StatefulWidget {
const RouteAwareSample({Key? key}) : super(key: key);
@override
_RouteAwareSample createState() => _RouteAwareSample();
}
class _RouteAwareSample extends State<RouteAwareSample> with RouteAware {
@override
void didChangeDependencies() { // 遷移時に呼ばれる関数
// routeObserverに自身を設定
super.didChangeDependencies();
routeObserver.subscribe(this, ModalRoute.of(context));
}
@override
void dispose() {
// routeObserverから自身を外す
routeObserver.unsubscribe(this);
super.dispose();
}
@override
void didPopNext() {
debugPrint("popされて、この画面に戻ってきました!");
}
@override
void didPush() {
debugPrint("pushされてきました、この画面にやってきました!");
}
@override
void didPop() {
debugPrint("この画面がpopされました");
}
@override
void didPushNext() {
debugPrint("この画面からpushして違う画面に遷移しました!");
}
}
Flutter開発で知らないと損すること