go_routerの導入

2023年12月10日

go_routerとは

go_router は、Flutter用のルーティングライブラリで、宣言的なAPIを提供して、ナビゲーションとルーティングを簡単にすることを目指しています。このライブラリは、Flutterの Navigator APIの代替として使われ、特に大規模なアプリケーションでのルーティングの管理を簡素化するのに役立ちます。

go_routerのインストール

flutter pub add go_router

主要機能

宣言的なルーティング: go_router は、ルートを宣言的に設定し、URLと連動させることができます。これにより、アプリケーション内のナビゲーション状態を簡単に管理できます。
ネストされたナビゲーション: サブルートを使って、複雑なネストされたナビゲーションシナリオを管理できます。
パラメータ化されたルーティング: パスパラメータやクエリパラメータを使用して、動的なルートを作成できます。
ディープリンクのサポート: モバイルとウェブの両方でディープリンクをサポートしており、外部から特定の画面に直接ナビゲートすることができます。
リダイレクトとガード: アクセス制御や認証フローを管理するためのリダイレクトとガード機能を提供します。
型安全なナビゲーション: コードの中でパス名をハードコードする代わりに、型安全な方法でナビゲーションを実行できます。

基本的な使い方

go_router の基本的な設定は、GoRouter オブジェクトを作成し、アプリケーションのルートに設定することで行います。以下は、簡単な例です。

import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';

void main() {
  final goRouter = GoRouter(
    routes: [
      GoRoute(
        path: '/',
        builder: (context, state) => HomeScreen(),
      ),
      GoRoute(
        path: '/details/:id',
        builder: (context, state) {
          final id = state.params['id']!;
          return DetailsScreen(id: id);
        },
      ),
    ],
  );

  runApp(MyApp(goRouter: goRouter));
}

class MyApp extends StatelessWidget {
  final GoRouter goRouter;

  MyApp({required this.goRouter});

  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      routeInformationParser: goRouter.routeInformationParser,
      routerDelegate: goRouter.routerDelegate,
    );
  }
}