文件列表:

.idea/ (0, 2023-12-07)
.idea/libraries/ (0, 2023-12-07)
.idea/libraries/Dart_SDK.xml (1965, 2023-12-07)
CHANGELOG.md (14555, 2023-12-07)
LICENSE (1068, 2023-12-07)
art/ (0, 2023-12-07)
art/auto_route_logo.svg (7181, 2023-12-07)
art/nested_router_demo.png (38957, 2023-12-07)
art/scoped_routers_demo.png (51077, 2023-12-07)
auto_route/ (0, 2023-12-07)
auto_route/.metadata (307, 2023-12-07)
auto_route/CHANGELOG.md (23039, 2023-12-07)
auto_route/LICENSE (1068, 2023-12-07)
auto_route/analysis_options.yaml (94, 2023-12-07)
auto_route/example/ (0, 2023-12-07)
auto_route/example/.metadata (930, 2023-12-07)
auto_route/example/android/ (0, 2023-12-07)
auto_route/example/android/app/ (0, 2023-12-07)
auto_route/example/android/app/src/ (0, 2023-12-07)
auto_route/example/android/app/src/main/ (0, 2023-12-07)
auto_route/example/android/app/src/main/AndroidManifest.xml (2189, 2023-12-07)
auto_route/example/build.dart (1413, 2023-12-07)
auto_route/example/build.yaml (369, 2023-12-07)
auto_route/example/ios/ (0, 2023-12-07)
auto_route/example/ios/Flutter/ (0, 2023-12-07)
auto_route/example/ios/Flutter/.last_build_id (32, 2023-12-07)
auto_route/example/ios/Flutter/AppFrameworkInfo.plist (774, 2023-12-07)
auto_route/example/ios/Flutter/Debug.xcconfig (30, 2023-12-07)
auto_route/example/ios/Flutter/Release.xcconfig (30, 2023-12-07)
... ...

--- - [Introduction](https://github.com/Milad-Akarie/auto_route_library/blob/master/#introduction) - [Installation](https://github.com/Milad-Akarie/auto_route_library/blob/master/#installation) - [Setup and Usage](https://github.com/Milad-Akarie/auto_route_library/blob/master/#setup-and-usage) - [Generated routes](https://github.com/Milad-Akarie/auto_route_library/blob/master/#generated-routes) - [Navigation](https://github.com/Milad-Akarie/auto_route_library/blob/master/#navigating-between-screens) - [Navigating Between Screens](https://github.com/Milad-Akarie/auto_route_library/blob/master/#navigating-between-screens) - [Passing Arguments](https://github.com/Milad-Akarie/auto_route_library/blob/master/#passing-arguments) - [Returning Results](https://github.com/Milad-Akarie/auto_route_library/blob/master/#returning-results) - [Nested navigation](https://github.com/Milad-Akarie/auto_route_library/blob/master/#nested-navigation) - [Tab Navigation](https://github.com/Milad-Akarie/auto_route_library/blob/master/#tab-navigation) - [Using PageView](https://github.com/Milad-Akarie/auto_route_library/blob/master/#using-pageview) - [Using TabBar](https://github.com/Milad-Akarie/auto_route_library/blob/master/#using-tabbar) - [Finding The Right Router](https://github.com/Milad-Akarie/auto_route_library/blob/master/#finding-the-right-router) - [Navigating Without Context](https://github.com/Milad-Akarie/auto_route_library/blob/master/#navigating-without-context) - [Deep Linking](https://github.com/Milad-Akarie/auto_route_library/blob/master/#deep-linking) - [Declarative Navigation](https://github.com/Milad-Akarie/auto_route_library/blob/master/#declarative-navigation) - [Working with Paths](https://github.com/Milad-Akarie/auto_route_library/blob/master/#working-with-paths) - [Route guards](https://github.com/Milad-Akarie/auto_route_library/blob/master/#route-guards) - [Wrapping routes](https://github.com/Milad-Akarie/auto_route_library/blob/master/#wrapping-routes) - [Navigation Observers](https://github.com/Milad-Akarie/auto_route_library/blob/master/#navigation-observers) - [Customization](https://github.com/Milad-Akarie/auto_route_library/blob/master/#customizations) - [Custom Route Transitions](https://github.com/Milad-Akarie/auto_route_library/blob/master/#custom-route-transitions) - [Custom Route Builder](https://github.com/Milad-Akarie/auto_route_library/blob/master/#custom-route-builder) - [Others](https://github.com/Milad-Akarie/auto_route_library/blob/master/#others) - [Including Micro/External Packages](https://github.com/Milad-Akarie/auto_route_library/blob/master/#including-microexternal-packages) - [Configuring builders](https://github.com/Milad-Akarie/auto_route_library/blob/master/#configuring-builders) - [Optimizing Generation Time](https://github.com/Milad-Akarie/auto_route_library/blob/master/#optimizing-generation-time) - [Enabling Cached Builds (Experimental)](https://github.com/Milad-Akarie/auto_route_library/blob/master/#enabling-cached-builds) - [AutoLeadingButton-BackButton](https://github.com/Milad-Akarie/auto_route_library/blob/master/#autoleadingbutton-backbutton) - [ActiveGuardObserver](https://github.com/Milad-Akarie/auto_route_library/blob/master/#activeguardobserver) - [Remove shadow from nested routers](https://github.com/Milad-Akarie/auto_route_library/blob/master/#remove-shadow-from-nested-routers) - [Examples](https://github.com/Milad-Akarie/auto_route_library/blob/master/#examples) ## Idea Tools [New] - [AutoRoute-Helper](https://github.com/Milad-Akarie/auto_route_library/blob/master/https://plugins.jetbrains.com/plugin/21071-autoroute-helper) (Android Studio) ## Migration guides - [Migrating to v6](https://github.com/Milad-Akarie/auto_route_library/blob/master/#migrating-to-v6) ## Pre v6 documentation - [Pre v6 documentation](https://github.com/Milad-Akarie/auto_route_library/blob/master/https://github.com/Milad-Akarie/auto_route_library/blob/master/old/pre_v6_README.md) ## Introduction #### What is AutoRoute? It’s a Flutter navigation package, it allows for strongly-typed arguments passing, effortless deep-linking and it uses code generation to simplify routes setup, with that being said it requires a minimal amount of code to generate everything needed for navigation inside of your App. #### Why AutoRoute? If your App requires deep-linking or guarded routes or just a clean routing setup you'll need to use named/generated routes and you’ll end up writing a lot of boilerplate code for mediator argument classes, checking for required arguments, extracting arguments and a bunch of other stuff. AutoRoute does all that for you and much more. ## Installation ```yaml dependencies: auto_route: [latest-version] dev_dependencies: auto_route_generator: [latest-version] build_runner: ``` ## Setup And Usage 1- Create a router class and annotate it with `@AutoRouterConfig` then extend "$YourClassName" 2- override the routes getter and start adding your routes. ```dart @AutoRouterConfig() class AppRouter extends $AppRouter { @override List get routes => [ /// routes go here ]; } ``` ### Using part builder To generate a part-of file simply add a `Part Directive` to your `AppRouter` and extend the generated private router. **Note** deferredLoading functionality does not work with part-file setup ```dart part 'app_router.gr.dart'; @AutoRouterConfig() class AppRouter extends _$AppRouter { @override List get routes => [ /// routes go here ] } ``` ### Generating Routable pages Routable pages are just simple everyday widgets annotated with `@RoutePage()` which allows them to be constructed by the router. ```dart @RoutePage() class HomeScreen extends StatefulWidget {} ``` #### Now simply run the generator Use the [watch] flag to watch the files' system for edits and rebuild as necessary. ```terminal flutter packages pub run build_runner watch ``` if you want the generator to run one time and exit, use ```terminal flutter packages pub run build_runner build ``` #### Add the generated route to your routes list ```dart @AutoRouterConfig(replaceInRouteName: 'Screen,Route') class AppRouter extends $AppRouter { @override List get routes => [ //HomeScreen is generated as HomeRoute because //of the replaceInRouteName property AutoRoute(HomeRoute.page), ] } ``` #### Finalize the setup after you run the generator your router class will be generated, hook it up with MaterialApp. ```dart // assuming this is the root widget of your App class App extends StatelessWidget { // make sure you don't initiate your router // inside of the build function. final _appRouter = AppRouter(); @override Widget build(BuildContext context){ return MaterialApp.router( routerConfig: _appRouter.config(), ); } } ``` ## Generated Routes A `PageRouteInfo` object will be generated for every declared AutoRoute, These objects hold strongly-typed page arguments which are extracted from the page's default constructor. Think of them as string path segments on steroids. ```dart class BookListRoute extends PageRouteInfo { const BookListRoute({List? children}) : super(name, path: '/books',initialChildren: children); static const String name = 'BookListRoute'; static const PageInfo page = PageInfo(name); } ``` ## Navigating Between Screens `AutoRouter` offers the same known push, pop and friends methods to manipulate the pages stack using both the generated `PageRouteInfo` objects and paths. ```dart // get the scoped router by calling AutoRouter.of(context) // or using the extension context.router // adds a new entry to the pages stack router.push(const BooksListRoute()) // or by using paths router.pushNamed('/books') // removes last entry in stack and pushes provided route // if last entry == provided route page will just be updated router.replace(const BooksListRoute()) // or by using paths router.replaceNamed('/books') // pops until provided route, if it already exists in stack // else adds it to the stack (good for web Apps). router.navigate(const BooksListRoute()) // or by using paths router.navigateNamed('/books') // on Web it calls window.history.back(); // on Native it navigates you back // to the previous location router.navigateBack(); // adds a list of routes to the pages stack at once router.pushAll([ BooksListRoute(), BookDetailsRoute(id:1), ]); // This's like providing a completely new stack as it rebuilds the stack // with the list of passed routes // entries might just update if already exist router.replaceAll([ LoginRoute() ]); // pops the last page unless stack has 1 entry context.router.pop(); // keeps poping routes until predicate is satisfied context.router.popUntil((route) => route.settings.name == 'HomeRoute'); // a simplifed version of the above line context.router.popUntilRouteWithName('HomeRoute'); // keeps popping routes until route with provided path is found context.router.popUntilRouteWithPath('/some-path'); // pops all routes down to the root context.router.popUntilRoot(); // removes the top most page in stack even if it's the last // remove != pop, it doesn't respect WillPopScopes it just // removes the entry. context.router.removeLast(); // removes any route in stack that satisfies the predicate // this works exactly like removing items from a regular List // [...].removeWhere((r)=>) context.router.removeWhere((route) => ); // you can also use the common helper methods from context extension to navigate context.pushRoute(const BooksListRoute()); context.replaceRoute(const BooksListRoute()); context.navigateTo(const BooksListRoute()); context.navigateNamedTo('/books'); context.back(); context.popRoute(); ``` ## Passing Arguments That's the fun part! **AutoRoute** automatically detects and handles your page arguments for you, the generated route object will deliver all the arguments your page needs including path/query params. e.g. The following page widget will take an argument of type `Book`. ```dart @RoutePage() class BookDetailsPage extends StatelessWidget { const BookDetailsPage({required this.book}); final Book book; ... ``` **Note:** Default values are respected. Required fields are also respected and handled properly. The generated `BookDetailsRoute` will deliver the same arguments to its corresponding page. ```drt router.push(BookDetailsRoute(book: book)); ``` **Note:** all args are generated as named parameters regardless of their original type. ## Returning Results You can return results by either using the pop completer or by passing a callback function as an argument the same way you'd pass an object. 1 - Using the pop completer ```dart var result = await router.push(LoginRoute()); ``` then inside of your `LoginPage` pop with results ```dart router.pop(true); ``` as you'd notice we did not specify the result type, we're playing with dynamic values here, which can be risky and I personally don't recommend it. To avoid working with dynamic values we specify what type of results we expect our page to return, which is a `bool` value. ```dart @RoutePage() class LoginPage extends StatelessWidget{..} ``` we push and specify the type of results we're expecting ```dart var result = await router.push(LoginRoute()); ``` and of course we pop with the same type ```dart router.pop(true); ``` 2- Passing a callback function as an argument. We only have to add a callback function as a parameter to our page constructor like follows: ```dart @RoutePage() class BookDetailsPage extends StatelessWidget { const BookDetailsRoute({this.book, required this.onRateBook}); final Book book; final void Function(int) onRateBook; ... ``` The generated `BookDetailsRoute` will deliver the same arguments to its corresponding page. ```dart context.pushRoute( BookDetailsRoute( book: book, onRateBook: (rating) { // handle result }), ); ``` if you're finishing with results make sure you call the callback function as you pop the page ```dart onRateBook(RESULT); context.popRoute(); ``` **Note:** Default values are respected. Required fields are also respected and handled properly. ## Nested Navigation Nested navigation means building an inner router inside of a page of another router, for example in the below diagram users page is built inside of dashboard page.

defining nested routes is as easy as populating the children field of the parent route. In the following example `UsersPage` , `PostsPage` and `SettingsPage` are nested children of `DashboardPage`. ```dart @AutoRouterConfig(replaceInRouteName: 'Page,Route') class AppRouter extends $AppRouter{ @override List get routes => [ AutoRoute( path: '/dashboard', page: DashboardRoute.page, children: [ AutoRoute(path: 'users', page: UsersRoute.page), AutoRoute(path: 'posts', page: PostsRoute.page), AutoRoute(path: 'settings', page: SettingsRoute.page), ], ), AutoRoute(path: '/login', page: LoginRoute.page) ], } ``` To render/build nested routes we need an `AutoRouter` widget that works as an outlet or a nested router-view inside of our dashboard page. ```dart class DashboardPage extends StatelessWidget { @override Widget build(BuildContext context) { return Row( children: [ Column( children: [ NavLink(label: 'Users', destination: const UsersRoute()), NavLink(label: 'Posts', destination: const PostsRoute()), NavLink(label: 'Settings', destination: const SettingsRoute()), ], ), Expanded( // nested routes will be rendered here child: AutoRouter(), ) ], ); } } ``` **Note** NavLink is just a button that calls router.push(destination) Now if we navigate to `/dashboard/users` we will be taken to the `DashboardPage` and the `UsersPage` will be shown inside of it. What if want to show one of the child pages at `/dashboard`? we can simply do that by giving the child routes an empty path `''` to make initial or by setting initial to true. ```dart AutoRoute( path: '/dashboard', page: DashboardRoute.page, children: [ AutoRoute(path: '', page: UsersRoute.page), AutoRoute(path: 'posts', page: PostsRoute.page), ], ), ``` or by using a `RedirectRoute` ```dart AutoRoute( path: '/dashboard', page: DashboardRoute.page, children: [ RedirectRoute(path: '', redirectTo: 'users'), AutoRoute(path: 'users', page: UsersRoute.page), AutoRoute(path: 'posts', page: PostsRoute.page), ], ), ``` ### Things to keep in mind when implementing nested navigation 1- Each router manages its own pages stack. 2- Navigation actions like push, pop and friends are handled by the topmost router and bubble up if it couldn't be handled. ## Tab Navigation If you're working with flutter mobile you're most likely to implement tabs navigation, that's why `auto_route` makes tabs navigation as easy and straightforward as possible. in the previous example we used an `AutoRouter` widget to render nested child routes, `AutoRouter` is just a shortcut for `AutoStackRouter`, `StackRouters` manage a stack of pages inside of them where the active/visible page is always the one on top and you'd need to pop it to see the page beneath it. Now we can try to implement our tabs using an `AutoRouter` (StackRouter) by pushing or replacing a nested route every-time the tab change ... ...

近期下载者：

相关文件：

评论：[我要评论] [举报此文件]

收藏者：