管理多个页面时有两个核心概念和类：Route和 Navigator。 一个route是一个屏幕或页面的抽象，Navigator是管理route的Widget。Navigator可以通过route入栈和出栈来实现页面之间的跳转
我们可以自己创建导航器，但由于我们通常会使用MaterialApp控件，它的内部已经创建了导航器，因此可以使用Navigator.of来获取其内部的导航器对象。
MaterialApp的home指定的页面就是导航器堆栈底部的路由。要在堆栈上推送（push）一 个新路由，可以创建一个具有构建器功能的MaterialPageRoute对象，并将想要显示的页面在屏幕上展示出来。
MaterialPageRoute是一种模态路由，在不同平台上可以产生不同过渡动画来切换屏幕。对于Android，页面向上滑动过渡面，并将淡入淡出，弹出过渡则向下滑动页面。在iOS上，页面从右侧滑入，反向弹出。
跳转一个页面
onPressed: () {
//动态路由
Navigator.of(context).push(MaterialPageRoute(
settings: const RouteSettings(
arguments: {
'id': 15,
'name': 'zhangsan',
},
),
builder: (context) => const FirstPage(),
));
},
动态路由
Flutter中的路由通常可分为动态路由和静态路由，像上面示例中使用了路由构建器生成路由的就属于动态路由，它是动态构建的。
有两种动态路由构建器
- PageRouterBuilder
- MaterialPageRoute
通常使用MaterialPageRoute即可，但当我需要自定义更加丰富的页面切换动画时，则需要使用PageRouterBuilder
///创建一个平移动画
SlideTransition createTransition(Animation<double> animation, Widget child) {
return SlideTransition(
position: Tween<Offset>(
begin: const Offset(1.0, 0.0),
end: const Offset(0.0, 0.0),
).animate(animation),
child: child,
);
}
/// 通过PageRouteBuilder 以指定动画跳转新页面
Navigator.of(context).push(
PageRouteBuilder(pageBuilder: (BuildContext context,
Animation<double> animation,
Animation<double> secondaryAnimation) {
// 返回新页面
return NewPage();
}, transitionsBuilder: (BuildContext context,
Animation<double> animation,
Animation<double> secondaryAnimation,
Widget child,) {
return createTransition(animation, child);
}));
静态路由
静态路由也称为命名路由，使用起来更简单，它类似于Web前端中的URL跳转，但它不够灵活，实际项目中的使用并不多。
静态路由的使用分两部分，首先第一部分是注册，类似于配置。
MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
initialRoute: '/',
routes: {
'/': (ctx) => const MyHomePage(title: 'Flutter Demo Home Page'),
'/first': (ctx) => const FirstPage(),
'/second': (ctx) => const SecondPage(),
},
);
第二部分就是在合适的地方进行跳转
onPressed: () {
Navigator.of(context).pushNamed('/second');
},
路由相关的有三个属性需要注意
initialRoute: 指定初始路由的名字，即APP启动后应显示的页面
onGenerateRoute: 用于生成路由，实际上就是一个匹配器
onUnknownRoute: 无法匹配时的回调，类似于Web前端处理的 404 页面
使用中需要注意，initialRoute属性和home属性不应同时设置，它们表达的意义是一样的，只是表现形式不同。如果同时设置了，那么initialRoute的优先级也会高于home
动态路由和静态路由最大的区别
1.静态路由不能通过构造方法传参
2.如果APP有太多的页面时，使用注册路由表这种方式会显得臃肿而不灵活
动态路由传参与返回
//传参返回
Navigator.of(context).pop(false);
//普通返回
Navigator.of(context).pop();
