Navigator
参数
- push 将设置的router信息推送到Navigator上，实现页面跳转。
- of 主要是获取 Navigator最近实例的好状态。
- pop 导航到新页面，或者返回到上个页面。
- canPop 判断是否可以导航到新页面
- maybePop 可能会导航到新页面
- popAndPushNamed 指定一个路由路径，并导航到新页面。
- popUntil 反复执行pop 直到该函数的参数predicate返回true为止。
- pushAndRemoveUntil 将给定路由推送到Navigator，删除先前的路由，直到该函数的参数predicate返回true为止。
- pushNamed 将命名路由推送到Navigator。
- pushNamedAndRemoveUntil 将命名路由推送到Navigator，删除先前的路由，直到该函数的参数predicate返回true为止。
- pushReplacement 路由替换。
- pushReplacementNamed 这个也是替换路由操作。推送一个命名路由到Navigator，新路由完成动画之后处理上一个路由。
- removeRoute 从Navigator中删除路由，同时执行Route.dispose操作。
- removeRouteBelow 从Navigator中删除路由，同时执行Route.dispose操作，要替换的路由是传入参数anchorRouter里面的路由。
- replace 将Navigator中的路由替换成一个新路由。
- replaceRouteBelow 将Navigator中的路由替换成一个新路由，要替换的路由是是传入参数anchorRouter里面的路由。
push
// 不传参
Navigator.push(
context,
new MaterialPageRoute(builder: (context) => new SecondScreen()),
);
//传参
Navigator.push(
context,
new MaterialPageRoute(
builder: (context) => new ContentScreen(articles[index]),
),
);
// 不同写法
Navigator.push<String>(context, new MaterialPageRoute(
builder: (BuildContext context) {
return new Add(title: i.toString());
},
));
// 接收
final Article article;
ContentScreen(this.article);
final String title; // 储存传递过来的参数
Add({this.title});
pop
// 不传参
Navigator.pop(context);
// 传参
Navigator.pop(context, 'Like');
// 接收
void add() async{
String result = await Navigator.push(context, MaterialPageRoute(
builder: (BuildContext context) {
return new Add();
},
));
print(result);
}
定制路由动画
onTap: () async {
String result = await Navigator.push(
context,
new PageRouteBuilder(
transitionDuration: const Duration(milliseconds: 1000),
pageBuilder: (context, _, __) =>
new ContentScreen(articles[index]),
transitionsBuilder:
(_, Animation<double> animation, __, Widget child) =>
new FadeTransition(
opacity: animation,
child: new RotationTransition(
turns: new Tween<double>(begin: 0.0, end: 1.0)
.animate(animation),
child: child,
),
),
));
if (result != null) {
Scaffold.of(context).showSnackBar(
new SnackBar(
content: new Text("$result"),
duration: const Duration(seconds: 1),
),
);
}
},
命名导航器路由(MaterialApp)
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Navigation',
initialRoute: '/',
routes: <String, WidgetBuilder>{
'/': (BuildContext context) => new ArticleListScreen(),
'/new': (BuildContext context) => new NewArticle(),
},
);
}
}
// 跳转
Navigator.of(context).pushNamed('/new');
Navigator.pushNamed(context, '/b');
pushNamed
普通跳转
pushReplacementNamed
跳转新页面并且替换原页面，比如登录页跳转主页, 当新的页面进入后，之前的页面将执行dispose方法
Navigator.of(context).pushReplacementNamed('/home');
pushReplacement
同pushReplacementNamed 写法不同 可传递参数
Navigator.of(context).pushReplacement(new MaterialPageRoute(builder: (context) => new Home()));
popAndPushNamed
销毁当前页面并跳转指向新的页面 动画不太友好
pushNamedAndRemoveUntil
跳转到新的路由，并且关闭给定路由的之前的所有页面
指将制定的页面加入到路由中，然后将其他所有的页面全部pop, (Route route) => false将确保删除推送路线之前的所有路线。 这时候将打开一个新的screen4页面
Navigator.of(context).pushNamedAndRemoveUntil('/home', (route) => route == null);
// 到red为止
Navigator.of(context).pushNamedAndRemoveUntil('/home', ModalRoute.withName('/red'));
pushAndRemoveUntil
同pushNamedAndRemoveUntil 写法不同 可传递参数
Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(builder: (context) => new Home()), ModalRoute.withName('/home'));
popUntil
pop直到...为止
Navigator.of(context).popUntil(ModalRoute.withName('/red'));
传参onGenerateRoute
onGenerateRoute ： 生成路由的回调函数，当导航的命名路由的时候，会使用这个来生成界面
// 跳转
Navigator.of(context).pushNamed('/add/' + i.toString());
// 定义
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'TODO',
theme: new ThemeData(
primaryColor: Colors.purple,
),
home: new Home(),
routes: <String, WidgetBuilder>{
'/add': (context) => new Add()
},
onGenerateRoute: (RouteSettings settings) {
print(settings);
WidgetBuilder builder;
if (settings.name == '/') {
builder = (BuildContext context) => new Add();
} else {
String param = settings.name.split('/')[2];
builder = (BuildContext context) => new Add();
}
return new MaterialPageRoute(builder: builder, settings: settings);
}
);
}
}
MaterialPageRoute
属于MaterialApp下面的一个路由方法
