Flutter中的路由介绍
// Flutter中的路由主要涉及页面的跳转操作。
// 使用Navigator组件来管理路由导航,并提供堆栈式的导航方法,如:Navigator.push和Navigator.pop来进行页面的切换。
Flutter 中的路由通俗的讲就是页面跳转。在 Flutter 中通过 Navigator 组件管理路由导航并提供了管理堆栈的方法。如:Navigator.push 和 Navigator.pop
Flutter中基本路由的使用示例
// 下面是一个RaisedButton组件的示例,点击该按钮会跳转到另一个页面,使用MaterialPageRoute进行页面切换,实现淡入淡出效果。
// CupertinoPageRoute则实现从右侧滑入的效果。
RaisedButton(
child: Text('跳转到分类'),
onPressed: () {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => SearchPage(title: '来了a') // 通过import引入SearchPage页面,并传入title参数
)
);
}
)
MaterialPageRoute // 淡入淡出
CupertinoPageRoute // 右划入
Flutter中的参数传递与接收
// 当我们从一个页面跳转到另一个页面时,经常需要传递一些参数。这可以通过构造函数来实现。
// 例如下面的SearchPage组件,它接收一个title参数,并在页面中显示。
// 为了接收传入的参数,需要在组件的构造函数中声明并使用参数。
class SearchPage extends StatelessWidget{
String title = ''; // 声明一个字符串变量title来存储传入的参数值
SearchPage({this.title}); // 通过构造函数接收传入的title参数
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('搜索页面'),
),
body: Text(this.title), // 将传入的title参数显示在页面中
);
}
}