flutter-routing-and-navigation

SKILL.md

Navigate between screens, handle deep linking, and manage data passing in Flutter applications.

Evaluates app requirements to select the optimal routing strategy: imperative Navigator for simple flows, declarative Router/go_router for deep linking and web support, or nested Navigator for independent sub-flows

Supports data passing between routes via constructor arguments (preferred) or RouteSettings with type-safe argument extraction

Implements named routes with MaterialApp.routes or onGenerateRoute for dynamic route handling, with guidance on limitations for deep linking scenarios

Includes nested navigation patterns using GlobalKey<NavigatorState> for managing independent navigation stacks within sub-flows like setup wizards or persistent bottom navigation

flutter-navigation-routing

Goal

Implements robust navigation and routing in Flutter applications. Evaluates application requirements to select the appropriate routing strategy (imperative Navigator, declarative Router, or nested navigation), handles deep linking, and manages data passing between routes while adhering to Flutter best practices.

Instructions

1. Determine Routing Strategy (Decision Logic)

Evaluate the application's navigation requirements using the following decision tree:

Condition A: Does the app require complex deep linking, web URL synchronization, or advanced routing logic?

Action: Use the declarative Router API (typically via a routing package like go_router).

Condition B: Does the app require independent sub-flows (e.g., a multi-step setup wizard or persistent bottom navigation bars)?

Action: Implement a Nested Navigator.

Condition C: Is it a simple application with basic screen-to-screen transitions and no complex deep linking?

Action: Use the imperative Navigator API (Navigator.push and Navigator.pop) with MaterialPageRoute or CupertinoPageRoute.

Condition D: Are Named Routes requested?

Action: Use MaterialApp.routes or onGenerateRoute, but note the limitations regarding deep link customization and web forward-button support.

STOP AND ASK THE USER: "Based on your app's requirements, should we implement simple imperative navigation (Navigator.push), declarative routing (Router/go_router for deep links/web), or a nested navigation flow?"