Flutter 路由系统: 无缝应用程序导航指南

2024-01-11 10:01:50

在Flutter应用程序中，路由是应用程序不同屏幕之间的导航机制。它允许您在不重新加载整个应用程序的情况下在屏幕之间移动。Flutter提供了一个强大的路由系统，可让您轻松创建复杂的导航体验。

Flutter 中的路由类型

Flutter 中有两种主要的路由类型：

MaterialPageRoute： 这是一个基本的路由，可为Android和iOS提供平台特定的过渡动画。
CupertinoPageRoute： 这是一个特定的iOS路由，为应用程序提供类似iOS的导航体验。

使用命名路由

命名路由是 Flutter 中推荐的路由机制。它使用字符串值来标识路由，从而更容易导航和管理应用程序的状态。要使用命名路由，请使用 Navigator.pushNamed() 方法：

Navigator.pushNamed(context, '/detailPage');

自定义路由过渡

您可以通过创建自定义 RoutePageBuilder 小部件来自定义路由过渡。此小部件允许您指定过渡动画、持续时间和其他设置。

RoutePageBuilder(
  pageBuilder: (context, animation, secondaryAnimation) => DetailPage(),
  transitionsBuilder: (context, animation, secondaryAnimation, child) {
    return SlideTransition(
      position: Tween<Offset>(begin: Offset(1.0, 0.0), end: Offset.zero)
          .animate(animation),
      child: child,
    );
  },
);

路由参数

您可以使用 ModalRoute.of(context).settings.arguments 访问路由参数。这允许您在屏幕之间传递数据。

class DetailPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final args = ModalRoute.of(context).settings.arguments as Map<String, String>;
    return Text(args['name']);
  }
}