Navigatior 2.0 与 Navigator 1.0: 谁更符合 Flutter?
2023-10-12 06:21:40
随着最新版本的的发布,Flutter 1.22 中各个全新的功能映入了我们的眼帘,可以发现本次对路由相关 API 的改动最大,官方的设计文档中表示,由于传统的命令式并没有给开发者一种灵活的方式去直接管理路由栈,甚至觉得已经过时了,一点也不 Flutter。 而 Navigator 2.0,作为路由管理的全新方案,重新回归了开发者对 Widget 的掌控。
而本文,将分别对 Navigator 2.0 和 Navigator 1.0 做详细介绍,并进行对比分析。文章将从路由栈、路由切换动画、路由参数传递、命名路由和返回结果五个方面展开。
导航堆栈
在深入比较之前,我们需要了解一下什么是导航堆栈。导航堆栈是一个存储应用程序中所有路由页面的堆栈数据结构,实现了 LIFO(后进先出)原则,这意味着应用程序打开的最新页面始终位于堆栈的顶部。而导航堆栈的根部通常是应用程序的主页。
在 Navigator 1.0 中,应用程序只能有一个导航堆栈,该堆栈通常由 MaterialApp 或 CupertinoApp 创建和管理。而 Navigator 2.0 允许应用程序拥有多个导航堆栈,这使得应用程序的导航变得更加灵活。
路由切换动画
在 Flutter 中,我们可以通过设置 PageTransitionsBuilder 属性来定义路由切换动画。
Navigator 1.0 使用了固定的动画作为路由切换动画,而 Navigator 2.0 允许我们自定义动画。
Navigator 2.0 中,我们可以通过使用 PageTransitionsTheme 来设置路由切换动画。此外,Navigator 2.0 还提供了更强大的动画自定义功能,如:
1.我们可以为不同的路由切换动画设置不同的动画。
2.我们可以使用动画控制器来控制动画的播放。
路由参数传递
Navigator 1.0 通过 pushNamed 和 pushReplacementNamed 方法传递参数,而 Navigator 2.0 可以通过 push 和 pushReplacement 方法传递参数。
在 Navigator 2.0 中,通过使用参数类型 RouteSettings 来传递路由参数。在接收端,我们使用 ModalRoute.of(context).settings.arguments
来获取路由参数。
命名路由
命名路由是指给路由起一个名字,然后通过名字来跳转到该路由。 Navigator 1.0 和 Navigator 2.0 都支持命名路由。
在 Navigator 1.0 中,我们通过 onGenerateRoute 方法来处理命名路由。而在 Navigator 2.0 中,我们通过 onUnknownRoute 来处理命名路由。
Navigator 2.0 的 onUnknownRoute 方法返回一个 Route<dynamic>
类型的对象,而 Navigator 1.0 的 onGenerateRoute 方法返回一个 WidgetBuilder
类型的对象。
返回结果
在 Navigator 1.0 中,我们通过 pop 方法返回路由结果。而在 Navigator 2.0 中,我们通过 Navigator.pop
方法返回路由结果。
在 Navigator 1.0 中,如果路由结果是一个 Future
对象,那么我们需要等待 Future
对象完成才能返回路由结果。而在 Navigator 2.0 中,我们可以直接返回一个 Future
对象,而不必等待 Future
对象完成。
总结
总的来说,Navigator 2.0 比 Navigator 1.0 更加灵活、强大。Navigator 2.0 允许我们拥有多个导航堆栈,自定义动画,更轻松地传递路由参数,并使用 Future
对象返回路由结果。
正因如此,无论是对于已经掌握 Flutter 框架的开发者来说,还是准备进入 Flutter 开发的初学者而言, 都可以尝试学习和使用 Navigator 2.0,让自己的应用更贴近 Flutter 的“心”。