navigation_builder 0.0.5-dev1

A Flutter Navigation 2 with the ease of Navigation 1.

example/README.md

navigation_builder examples

Getting Started

First, make sure you have installed navigation_builder package.

Objective

In these examples, you will learn how to work on Flutter Navigation 2.0 (Nav2) more easily with navigation_builder's API.

Basic in use: Quick demo of below code

final navigator = NavigationBuilder.create(
  routes: {
    '/': (data) => const HomeScreen(),
    '/selection-screen': (data) => const SelectionScreen(),
  },
);

Exploring Use-cases

Here it provides a bundle of use-cases of Nav2 from simple to complex:

• 01: Declarative Navigation
  Description: To use Nav2 remain in declarative approach.

• 02 (A): Imperative Navigation
  Description: Refactoring example 01 into imperative approach.

• 02 (B): Imperative & Imperative Navigation
  Description: To use Nav2 in a combination of declarative and imperative approaches, and remove a hidden page from stack.

• 03: Navigation & Widgets
  Description: To use of the InjectedNavigator.builder method to wrap the app inside the body of the Scaffold and the AppBar that used a fixed navigation menu.

• 04: Deep-linking Navigation (Basic)
  Description: To know the difference between InjectedNavigator.to and InjectedNavigator.toDeeply methods.

• 05: Deep-linking Navigation (Normal)
  Description: The same as pervious example 04, but written using a RouteWidget

• 06: Deep-linking Navigation (Advanced)
  Description: The same as pervious example 04 & 05, it is using RouteWidget with static helper methods to decentralize the route logic from one place to belonging page widget.

• 07: Cyclic Redirection
  Description: After reading of this example say no fear to cyclic redirect.

• 08: Redirection Information
  Description: This example is a show case that when a route redirect at another route, the latter will have all information about the route it is redirected from.

• 09: Authentication Navigation Guard
  Description: This example will show you how to easily build up a redirection guard when auth status is invalid, it is all done by a tiny API InjectedNavigator.onNavigate.

• 10-a: Pop Validation & Navigation Guard
  Description: This example will show you how to prevent leaving from a page without validating its data. Here the back navigation guard is done globally.

• 10-b: Pop Validation & Navigation Guard
  Description: This example will show you how to prevent leaving from a page without validating its data. Here the back navigation guard is done locally using OnBackNavigationScope widget.

• 11: Tailor-made Page Transition Animation (Basic)
  Description: Look! There is a transitionsBuilder that can let you play the transition animation within 20 lines of code, whenever it's to a specific page or all the pages, those animations reusable.

    final navigator = NavigationBuilder.create(
      transitionsBuilder: (context, animation, secondaryAnimation, child) {
        return ScaleTransition(
          scale: animation,
          child: Transform.rotate(
            angle: 1 - animation.value,
            child: child,
          ),
        );
      },
      transitionDuration: const Duration(milliseconds: 1000),
      routes: { 
         '/specific page': (data) => RouteWidget(
            transitionsBuilder: RM.transitions.upToBottom(),
          ),
           /* ... Other routes */
      }
  

• 12: Page Transition Animation (Normal)
  Description: Are you ready? Let's learn how to re-implementation a staggered animation demo example from ResoCoder.

• 13: 404 Unknown Routes
  Description: Ladies and gentlemen, it's the right place for you to define 404 page.

• 14: Data Return from a Screen (Basic)
  Description: Example of data return from a screen.

• 15: Provide InheritedWidget to new route
  Description: This example solves a comment issue encountered using some packages that rely on InheritedWidget such as Provider and navigation_builder. Now you can provide your model to a new route without being forced to make it global.

• 16: Nested Routes
  Description: Example of nested routes.

• 17: Unit Testing
  Description: Example of how can mock the routes into unit testing, and keep the code dry by extracting business logic depends on InjectedNavigator.

• 18: Books App
  Description: To use navigation_builder rewriting flutter book app demo within 70 lines of code for the entire route settings.

• 18: Dialogs, bottomSheets, Drawers
  Description: Example of how to show/hide dialogs, bottomSheets, drawers and any Scaffold related popup modal.

Questions & Suggestions

Please feel free to post an issue or PR. As always, your feedback makes this library become better and better.