go_router_builderでfullScreen: trueにする方法

概要

go_router_builderで下から上に表示されるような遷移をしたく、公式ドキュメントをほじくってみたら、見つけたので、自分のためにもアウトプットを残します！

開発環境

• flutter 3.16.0
• go_router: ^12.1.1
• build_runner: ^2.4.6
• go_router_builder: ^2.3.4

公式のGoRouteDataの書き方

routes.dart

@TypedGoRoute<HomePageRoute>(
  path: '/home',
)
class HomePageRoute extends GoRouteData {
  const HomePageRoute();

  @override
  Widget build(BuildContext context, GoRouterState state) => const HomePage();
}

fullScreen: trueのGoRouteData

buildメソッドにオーバーライドするのではなく、buildPageメソッドをオーバーライドすることで、遷移アニメーションを変えることができるわけですね。

routes.dart

@TypedGoRoute<HomePageRoute>(
  path: '/home',
)
class HomePageRoute extends GoRouteData {
- const HomePageRoute();

  @override
- Widget build(BuildContext context, GoRouterState state) => const HomePage();
+  MaterialPage<void> buildPage(BuildContext context, GoRouterState state) =>
+      const MaterialPage<void>(
+        fullscreenDialog: true,
+        child: HomePage(),
+      );
}

まとめ

とても簡単な紹介でしたが、ご覧頂きありがとうございました！
ミス等ありましたら、コメントや、X（旧Twitter）などのDMで教えていただけると嬉しいです！
最近GoRouterすっ飛ばして、GoRouterBuilderから入門したので、よくわからないところが多いのですが、やっぱり公式ドキュメント読むのが一番確実ですね^^

参考

https://pub.dev/documentation/go_router_builder/latest/