How to Navigate from Splash Screen to a StatefulShellRoute.indexedStack route of go_router Flutter

Navigating from a splash screen to a StatefulShellRoute.indexedStack route in go_router Flutter involves using a shell route as a wrapper around other routes to share a common internal navigator and UI elements.

The StatefulShellRoute widget is not a route itself, but a container for other routes, allowing you to share a common internal navigator and UI elements.

To achieve this navigation, follow these steps:

1. Define Your Shell Route:

StatefulShellRoute.indexedStack(
  builder: (BuildContext context, GoRouterState state,
      StatefulNavigationShell navigationShell) {
    return HomeScreen(navigationShell: navigationShell);
  },
  branches: <StatefulShellBranch>[
    // ... Define your shell branches here.
  ],
);

2. Create Routes for Each Branch:

StatefulShellBranch(
  navigatorKey: _sectionANavigatorKey,
  routes: <RouteBase>[
    GoRoute(
      path: '/a',
      builder: (BuildContext context, GoRouterState state) =>
          const ScreenAShellBody(),
    ),
  ],
),

// ... Define other shell branches and routes here.

3. Navigate to the Shell Route:

context.goNamed('shell');

4. Navigate Within the Shell Branches:

context.go('/a'); // Navigates to the first branch's route
context.go('/b'); // Navigates to the second branch's route

By following these steps, you can navigate from a splash screen to a StatefulShellRoute.indexedStack route, allowing you to share common UI elements and a common internal navigator across multiple routes.