nav_router 0.0.7 copy "nav_router: ^0.0.7" to clipboard
nav_router: ^0.0.7 copied to clipboard

flutter The lightest, easiest and most convenient route management!

Language: English | 中文简体

nav_router #

nav_router is the simplest / lightweight / convenient routing management solution for flutter. It supports various routing animations, and it is very convenient to jump / pass parameters. To jump to a new page, just routePush (NewPage ());

Log #

  • 2020.07.04-Test Flutter 1.17.3

  • 2020.06.03-Cancel pop default empty string data

  • 2020.02.28 - Fix pop method of dev branch flutter error.

Getting started #

Add dependency #

dependencies:
  nav_router: any #Specific version customization (any means latest)

Related articles updated ...

Then use flutter packages upgrade to update flutter plugin packages

Sample project #

There is a pretty sweet example project in the example folder. Check it out. Otherwise, keep reading to get up and running.

Setting up #

  • 1.Import our plugin on the page of MaterialApp
import 'package:nav_router/nav_router.dart';
  • 2.Write navGK value in navigatorKey property of MaterialApp
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: '',
      navigatorKey: navGK,
    );
  }
  • 3.Then, we can start using it, here is an example of a jump page
Widget buildItem(RouteModel item) {
  return new FlatButton(
    onPressed: () => routePush(new NewPage()),
    child: new Text('Click to jump'),
  );
}
  • 4.If we want to use other routing animations to jump, we can add jump properties later, such as: gradient animation
routePush(new NewPage(), RouterType.fade);

Parameter passing #

Way 1: #

Normally push the new page, but add Then at the back, the v behind is the data brought back by the page after we jump, and then we print it out.

routePush(NewPage()).then((v) {
  print('I received::$v');
});

Then our new page will pop the return value. Add our parameters directly in the pop and then the brackets. It can be any type of parameter value. After that, what we wrote above will receive the parameters we returned this time with the past.

FlatButton(
  onPressed: () {
    pop('This is the parameter');
  },
  child: Text('Return with parameters'),
),

Way 2: #

Method two can use our NavData, first add the NavData type parameter to the page we want to push to,

class NewPage extends StatlessWidget {
  final NavData navData;

  NewPage({this.navData});
}

Then the following judges whether the navData is empty, that is, whether the superior has received this method, and if so, returns it with parameters.

FlatButton(
  onPressed: () {
    if(navData == null) return;
    widget.navData('NavData mode parameter transmission');
    pop();
  },
  child: Text('Return with parameters'),
),

Then the place where we push can use navData to receive the value and print it out.

routePush(NewPage(navData: (v) {
    print('I received::$v');
  }),
);

Effect map #

1.gif 2.gif 3.gif
4.gif 5.gif 6.gif
7.gif 8.gif 9.gif

Flutter WeChat group #

Above can't show my point

FlutterJ:www.flutterj.com

Contributor #

12
likes
40
pub points
59%
popularity

Publisher

unverified uploader

flutter The lightest, easiest and most convenient route management!

Repository (GitHub)
View/report issues

License

Apache-2.0 (LICENSE)

Dependencies

flutter

More

Packages that depend on nav_router