Replace navigation_and_routing with a new sample (#832)

* move snippets into old_snippets directory * add new navigation_and_routing sample * add copyright headers * Apply #827 to old_snippets/ directory and upgrade them to null safety * Code review comments - Move Guard class into parser.dart - Move usage of guards from Delegate to RouteInformationParser - Rename delegate to SimpleRouterDelegate * clean up imports * refactor settings screen, fix bug * avoid conflicting paths /books/new and /books/1 - rename to book/1 * dispose fields in _BookstoreState class * remove /books path This was causing problems * add comment * Change BookstoreAuthScope and BookstoreAuthScope to InheritedNotifier * fix warnings * Make the initial route configurable, set to '/signin' * Enable deep linking https://flutter.dev/docs/development/ui/navigation/deep-linking * use path URL strategy on the web. * remove TODO, add comment
2025-11-09 06:18:49 +00:00 · 2021-07-08 07:48:17 -07:00
parent 8573269c03
commit ae3c4e3c47
96 changed files with 3560 additions and 278 deletions
--- a/navigation_and_routing/old_snippets/router_advanced/nested_router.dart
+++ b/navigation_and_routing/old_snippets/router_advanced/nested_router.dart
@@ -0,0 +1,426 @@
+// Copyright 2020, the Flutter project authors. Please see the AUTHORS file
+// for details. All rights reserved. Use of this source code is governed by a
+// BSD-style license that can be found in the LICENSE file.
+
+/// Shows two [RouterDelegate], one nested within the other. A
+/// [BottomNavigationBar] can be used to select the route of the outer
+/// RouterDelegate, and additional routes can be pushed onto the inner
+/// RouterDelegate / Navigator.
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart';
+
+void main() {
+  runApp(const NestedRouterDemo());
+}
+
+class Book {
+  final String title;
+  final String author;
+
+  Book(this.title, this.author);
+}
+
+class NestedRouterDemo extends StatefulWidget {
+  const NestedRouterDemo({Key? key}) : super(key: key);
+
+  @override
+  _NestedRouterDemoState createState() => _NestedRouterDemoState();
+}
+
+class _NestedRouterDemoState extends State<NestedRouterDemo> {
+  final BookRouterDelegate _routerDelegate = BookRouterDelegate();
+  final BookRouteInformationParser _routeInformationParser =
+      BookRouteInformationParser();
+
+  @override
+  Widget build(BuildContext context) {
+    return MaterialApp.router(
+      title: 'Books App',
+      routerDelegate: _routerDelegate,
+      routeInformationParser: _routeInformationParser,
+    );
+  }
+}
+
+class BooksAppState extends ChangeNotifier {
+  int _selectedIndex;
+
+  Book? _selectedBook;
+
+  final List<Book> books = [
+    Book('Left Hand of Darkness', 'Ursula K. Le Guin'),
+    Book('Too Like the Lightning', 'Ada Palmer'),
+    Book('Kindred', 'Octavia E. Butler'),
+  ];
+
+  BooksAppState() : _selectedIndex = 0;
+
+  int get selectedIndex => _selectedIndex;
+
+  set selectedIndex(int idx) {
+    _selectedIndex = idx;
+    if (_selectedIndex == 1) {
+      // Remove this line if you want to keep the selected book when navigating
+      // between "settings" and "home" which book was selected when Settings is
+      // tapped.
+      selectedBook = null;
+    }
+    notifyListeners();
+  }
+
+  Book? get selectedBook => _selectedBook;
+
+  set selectedBook(Book? book) {
+    _selectedBook = book;
+    notifyListeners();
+  }
+
+  int getSelectedBookById() {
+    if (_selectedBook == null) return 0;
+    if (!books.contains(_selectedBook)) return 0;
+    return books.indexOf(_selectedBook!);
+  }
+
+  void setSelectedBookById(int id) {
+    if (id < 0 || id > books.length - 1) {
+      return;
+    }
+
+    _selectedBook = books[id];
+    notifyListeners();
+  }
+}
+
+class BookRouteInformationParser extends RouteInformationParser<BookRoutePath> {
+  @override
+  Future<BookRoutePath> parseRouteInformation(
+    RouteInformation routeInformation,
+  ) {
+    final uri = Uri.parse(routeInformation.location ?? '');
+
+    if (uri.pathSegments.isNotEmpty && uri.pathSegments.first == 'settings') {
+      return SynchronousFuture(BooksSettingsPath());
+    } else {
+      if (uri.pathSegments.length >= 2 && uri.pathSegments[0] == 'book') {
+        return SynchronousFuture(
+          BooksDetailsPath(int.tryParse(uri.pathSegments[1])!),
+        );
+      }
+      return SynchronousFuture(BooksListPath());
+    }
+  }
+
+  @override
+  RouteInformation? restoreRouteInformation(BookRoutePath configuration) {
+    if (configuration is BooksListPath) {
+      return const RouteInformation(location: '/home');
+    }
+    if (configuration is BooksSettingsPath) {
+      return const RouteInformation(location: '/settings');
+    }
+    if (configuration is BooksDetailsPath) {
+      return RouteInformation(location: '/book/${configuration.id}');
+    }
+    return null;
+  }
+}
+
+class BookRouterDelegate extends RouterDelegate<BookRoutePath>
+    with ChangeNotifier, PopNavigatorRouterDelegateMixin<BookRoutePath> {
+  @override
+  final GlobalKey<NavigatorState> navigatorKey;
+
+  BooksAppState appState = BooksAppState();
+
+  BookRouterDelegate() : navigatorKey = GlobalKey<NavigatorState>() {
+    appState.addListener(notifyListeners);
+  }
+
+  @override
+  BookRoutePath get currentConfiguration {
+    if (appState.selectedIndex == 1) {
+      return BooksSettingsPath();
+    } else {
+      if (appState.selectedBook == null) {
+        return BooksListPath();
+      } else {
+        return BooksDetailsPath(appState.getSelectedBookById());
+      }
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Navigator(
+      key: navigatorKey,
+      pages: [
+        MaterialPage<void>(
+          child: AppShell(appState: appState),
+        ),
+      ],
+      onPopPage: (route, dynamic result) {
+        if (!route.didPop(result)) {
+          return false;
+        }
+
+        if (appState.selectedBook != null) {
+          appState.selectedBook = null;
+        }
+        notifyListeners();
+        return true;
+      },
+    );
+  }
+
+  @override
+  Future<void> setNewRoutePath(BookRoutePath configuration) {
+    if (configuration is BooksListPath) {
+      appState.selectedIndex = 0;
+      appState.selectedBook = null;
+    } else if (configuration is BooksSettingsPath) {
+      appState.selectedIndex = 1;
+    } else if (configuration is BooksDetailsPath) {
+      appState.setSelectedBookById(configuration.id);
+    }
+    return SynchronousFuture<void>(null);
+  }
+}
+
+// Routes
+abstract class BookRoutePath {}
+
+class BooksListPath extends BookRoutePath {}
+
+class BooksSettingsPath extends BookRoutePath {}
+
+class BooksDetailsPath extends BookRoutePath {
+  final int id;
+
+  BooksDetailsPath(this.id);
+}
+
+// Widget that contains the AdaptiveNavigationScaffold
+class AppShell extends StatefulWidget {
+  final BooksAppState appState;
+
+  const AppShell({
+    required this.appState,
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  _AppShellState createState() => _AppShellState();
+}
+
+class _AppShellState extends State<AppShell> {
+  late final InnerRouterDelegate _routerDelegate;
+  late final ChildBackButtonDispatcher _backButtonDispatcher;
+
+  @override
+  void initState() {
+    super.initState();
+    _routerDelegate = InnerRouterDelegate(widget.appState);
+  }
+
+  @override
+  void didUpdateWidget(covariant AppShell oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    _routerDelegate.appState = widget.appState;
+  }
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    // Defer back button dispatching to the child router
+    _backButtonDispatcher = Router.of(context)
+        .backButtonDispatcher!
+        .createChildBackButtonDispatcher();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    var appState = widget.appState;
+
+    // Claim priority, If there are parallel sub router, you will need
+    // to pick which one should take priority;
+    _backButtonDispatcher.takePriority();
+
+    return Scaffold(
+      appBar: AppBar(),
+      body: Router(
+        routerDelegate: _routerDelegate,
+        backButtonDispatcher: _backButtonDispatcher,
+      ),
+      bottomNavigationBar: BottomNavigationBar(
+        items: const [
+          BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Home'),
+          BottomNavigationBarItem(
+              icon: Icon(Icons.settings), label: 'Settings'),
+        ],
+        currentIndex: appState.selectedIndex,
+        onTap: (newIndex) {
+          appState.selectedIndex = newIndex;
+        },
+      ),
+    );
+  }
+}
+
+class InnerRouterDelegate extends RouterDelegate<BookRoutePath>
+    with ChangeNotifier, PopNavigatorRouterDelegateMixin<BookRoutePath> {
+  @override
+  final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();
+
+  BooksAppState get appState => _appState;
+  BooksAppState _appState;
+
+  set appState(BooksAppState value) {
+    if (value == _appState) {
+      return;
+    }
+    _appState = value;
+    notifyListeners();
+  }
+
+  InnerRouterDelegate(this._appState);
+
+  @override
+  Widget build(BuildContext context) {
+    return Navigator(
+      key: navigatorKey,
+      pages: [
+        if (appState.selectedIndex == 0) ...[
+          FadeAnimationPage(
+            child: BooksListScreen(
+              books: appState.books,
+              onTapped: _handleBookTapped,
+            ),
+            key: const ValueKey('BooksListPage'),
+          ),
+          if (appState.selectedBook != null)
+            MaterialPage<void>(
+              key: ValueKey(appState.selectedBook),
+              child: BookDetailsScreen(book: appState.selectedBook!),
+            ),
+        ] else
+          const FadeAnimationPage(
+            child: SettingsScreen(),
+            key: ValueKey('SettingsPage'),
+          ),
+      ],
+      onPopPage: (route, dynamic result) {
+        appState.selectedBook = null;
+        notifyListeners();
+        return route.didPop(result);
+      },
+    );
+  }
+
+  @override
+  Future<void> setNewRoutePath(BookRoutePath configuration) {
+    // This is not required for inner router delegate because it does not
+    // parse route
+    assert(false);
+    return SynchronousFuture<void>(null);
+  }
+
+  void _handleBookTapped(Book book) {
+    appState.selectedBook = book;
+    notifyListeners();
+  }
+}
+
+class FadeAnimationPage extends Page<void> {
+  final Widget child;
+
+  const FadeAnimationPage({LocalKey? key, required this.child})
+      : super(key: key);
+
+  @override
+  Route createRoute(BuildContext context) {
+    return PageRouteBuilder<void>(
+      settings: this,
+      pageBuilder: (context, animation, animation2) {
+        var curveTween = CurveTween(curve: Curves.easeIn);
+        return FadeTransition(
+          opacity: animation.drive(curveTween),
+          child: child,
+        );
+      },
+    );
+  }
+}
+
+// Screens
+class BooksListScreen extends StatelessWidget {
+  final List<Book> books;
+  final ValueChanged<Book> onTapped;
+
+  const BooksListScreen({
+    required this.books,
+    required this.onTapped,
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      body: ListView(
+        children: [
+          for (var book in books)
+            ListTile(
+              title: Text(book.title),
+              subtitle: Text(book.author),
+              onTap: () => onTapped(book),
+            )
+        ],
+      ),
+    );
+  }
+}
+
+class BookDetailsScreen extends StatelessWidget {
+  final Book book;
+
+  const BookDetailsScreen({
+    required this.book,
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      body: Padding(
+        padding: const EdgeInsets.all(8.0),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            TextButton(
+              onPressed: () {
+                Navigator.of(context).pop();
+              },
+              child: const Text('Back'),
+            ),
+            ...[
+              Text(book.title, style: Theme.of(context).textTheme.headline6),
+              Text(book.author, style: Theme.of(context).textTheme.subtitle1),
+            ],
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+class SettingsScreen extends StatelessWidget {
+  const SettingsScreen({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return const Scaffold(
+      body: Center(
+        child: Text('Settings screen'),
+      ),
+    );
+  }
+}
--- a/navigation_and_routing/old_snippets/router_advanced/transition_delegate.dart
+++ b/navigation_and_routing/old_snippets/router_advanced/transition_delegate.dart
@@ -0,0 +1,252 @@
+// Copyright 2020, the Flutter project authors. Please see the AUTHORS file
+// for details. All rights reserved. Use of this source code is governed by a
+// BSD-style license that can be found in the LICENSE file.
+
+/// Shows how a custom TransitionDelegate can be used to customized when
+/// transition animations are shown. (For example, [when two routes are popped
+/// off the stack](https://github.com/flutter/flutter/issues/12146), however the
+/// default TransitionDelegate will handle this if you are using Router)
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart';
+
+void main() {
+  runApp(const BooksApp());
+}
+
+class Book {
+  final String title;
+  final String author;
+
+  Book(this.title, this.author);
+}
+
+class BooksApp extends StatefulWidget {
+  const BooksApp({Key? key}) : super(key: key);
+
+  @override
+  State<StatefulWidget> createState() => _BooksAppState();
+}
+
+class _BooksAppState extends State<BooksApp> {
+  final BookRouterDelegate _routerDelegate = BookRouterDelegate();
+  final BookRouteInformationParser _routeInformationParser =
+      BookRouteInformationParser();
+
+  @override
+  Widget build(BuildContext context) {
+    return MaterialApp.router(
+      title: 'Books App',
+      routerDelegate: _routerDelegate,
+      routeInformationParser: _routeInformationParser,
+    );
+  }
+}
+
+class BookRouteInformationParser extends RouteInformationParser<BookRoutePath> {
+  @override
+  Future<BookRoutePath> parseRouteInformation(
+    RouteInformation routeInformation,
+  ) {
+    final uri = Uri.parse(routeInformation.location ?? '');
+
+    if (uri.pathSegments.length >= 2) {
+      var remaining = uri.pathSegments[1];
+      return SynchronousFuture(BookRoutePath.details(int.tryParse(remaining)!));
+    } else {
+      return SynchronousFuture(BookRoutePath.home());
+    }
+  }
+
+  @override
+  RouteInformation? restoreRouteInformation(BookRoutePath configuration) {
+    if (configuration.isHomePage) {
+      return const RouteInformation(location: '/');
+    }
+    if (configuration.isDetailsPage) {
+      return RouteInformation(location: '/book/${configuration.id}');
+    }
+    return null;
+  }
+}
+
+class BookRouterDelegate extends RouterDelegate<BookRoutePath>
+    with ChangeNotifier, PopNavigatorRouterDelegateMixin<BookRoutePath> {
+  @override
+  final GlobalKey<NavigatorState> navigatorKey;
+
+  Book? _selectedBook;
+
+  final List<Book> books = [
+    Book('Left Hand of Darkness', 'Ursula K. Le Guin'),
+    Book('Too Like the Lightning', 'Ada Palmer'),
+    Book('Kindred', 'Octavia E. Butler'),
+  ];
+
+  BookRouterDelegate() : navigatorKey = GlobalKey<NavigatorState>();
+
+  @override
+  BookRoutePath get currentConfiguration => _selectedBook == null
+      ? BookRoutePath.home()
+      : BookRoutePath.details(books.indexOf(_selectedBook!));
+
+  @override
+  Widget build(BuildContext context) {
+    return Navigator(
+      key: navigatorKey,
+      transitionDelegate: NoAnimationTransitionDelegate(),
+      pages: [
+        MaterialPage<void>(
+          key: const ValueKey('BooksListPage'),
+          child: BooksListScreen(
+            books: books,
+            onTapped: _handleBookTapped,
+          ),
+        ),
+        if (_selectedBook != null) BookDetailsPage(book: _selectedBook!)
+      ],
+      onPopPage: (route, dynamic result) {
+        if (!route.didPop(result)) {
+          return false;
+        }
+
+        // Update the list of pages by setting _selectedBook to null
+        _selectedBook = null;
+        notifyListeners();
+
+        return true;
+      },
+    );
+  }
+
+  @override
+  Future<void> setNewRoutePath(BookRoutePath configuration) {
+    if (configuration.isDetailsPage) {
+      _selectedBook = books[configuration.id!];
+    }
+    return SynchronousFuture<void>(null);
+  }
+
+  void _handleBookTapped(Book book) {
+    _selectedBook = book;
+    notifyListeners();
+  }
+}
+
+class BookDetailsPage extends Page<void> {
+  final Book book;
+
+  BookDetailsPage({
+    required this.book,
+  }) : super(key: ValueKey(book));
+
+  @override
+  Route createRoute(BuildContext context) {
+    return MaterialPageRoute<void>(
+      settings: this,
+      builder: (context) {
+        return BookDetailsScreen(book: book);
+      },
+    );
+  }
+}
+
+class BookRoutePath {
+  final int? id;
+
+  BookRoutePath.home() : id = null;
+
+  BookRoutePath.details(this.id);
+
+  bool get isHomePage => id == null;
+
+  bool get isDetailsPage => id != null;
+}
+
+class BooksListScreen extends StatelessWidget {
+  final List<Book> books;
+  final ValueChanged<Book> onTapped;
+
+  const BooksListScreen({
+    required this.books,
+    required this.onTapped,
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(),
+      body: ListView(
+        children: [
+          for (var book in books)
+            ListTile(
+              title: Text(book.title),
+              subtitle: Text(book.author),
+              onTap: () => onTapped(book),
+            )
+        ],
+      ),
+    );
+  }
+}
+
+class BookDetailsScreen extends StatelessWidget {
+  final Book book;
+
+  const BookDetailsScreen({
+    required this.book,
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(),
+      body: Padding(
+        padding: const EdgeInsets.all(8.0),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Text(book.title, style: Theme.of(context).textTheme.headline6),
+            Text(book.author, style: Theme.of(context).textTheme.subtitle1),
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+class NoAnimationTransitionDelegate extends TransitionDelegate<void> {
+  @override
+  Iterable<RouteTransitionRecord> resolve({
+    required List<RouteTransitionRecord> newPageRouteHistory,
+    required Map<RouteTransitionRecord?, RouteTransitionRecord>
+        locationToExitingPageRoute,
+    required Map<RouteTransitionRecord?, List<RouteTransitionRecord>>
+        pageRouteToPagelessRoutes,
+  }) {
+    final results = <RouteTransitionRecord>[];
+
+    for (final pageRoute in newPageRouteHistory) {
+      if (pageRoute.isWaitingForEnteringDecision) {
+        pageRoute.markForAdd();
+      }
+      results.add(pageRoute);
+    }
+
+    for (final exitingPageRoute in locationToExitingPageRoute.values) {
+      if (exitingPageRoute.isWaitingForExitingDecision) {
+        exitingPageRoute.markForRemove();
+        final pagelessRoutes = pageRouteToPagelessRoutes[exitingPageRoute];
+        if (pagelessRoutes != null) {
+          for (final pagelessRoute in pagelessRoutes) {
+            pagelessRoute.markForRemove();
+          }
+        }
+      }
+
+      results.add(exitingPageRoute);
+    }
+    return results;
+  }
+}