Flutter路由(一)

第一点:push使用

1.pushNamed——Navigator.of(context).pushNamed('routeName')

  Navigator.of(context).pushNamed('/screen1'); 直接进入screen1页面(每次都将新建一个新的页面)

2.pushReplacementNamed——Navigator.of(context).pushReplacementNamed('routeName')

  指把当前页面在栈中的位置替换成跳转的页面(替换导航器的当前路由,通过推送路由[routeName]),当新的页面进入后,之前的页面将执行dispose方法。

  即比如当前从页面1进入页面2,在页面2使用 Navigator.of(context).pushReplacementNamed('/screen3');进入页面3,当进入了页面3后,页面2将执行dispose方法,此时在页面3返回时,会回到页面1.

  使用情况:例如 从SplashScreen到HomeScreen。它应该只显示一次,用户不应该再从主屏幕回到它。在这种情况下,由于我们将要进入一个全新的屏幕, 我们可能想要使用这个方法来实现它的enter animation属性。

 3.pushReplacement——Navigator.pushReplacement( context, MaterialPageRoute(builder: (BuildContext context) => screen4()))

   pushReplacement只需new对应页面即可,而且可以传递 参数(传参方式类似于本文后续所说的传递方法)。和pushReplacementNamed只是路由的传递有差别,pushReplacementNamed的是传递路由名称(页面对应的名称,需在入口定义(本文第一点))

 4.popAndPushNamed——Navigator.popAndPushNamed(context, 'routeName')

   指将当前页面pop,然后跳转到制定页面(将当前路由弹出导航器,并将命名路由推到它的位置。) 

5.pushNamedAndRemoveUntil

  5.1.Navigator.of(context).pushNamedAndRemoveUntil('/screen4', (Route<dynamic> route) => false)

 指将制定的页面加入到路由中,然后将其他所有的页面全部pop, (Route route) => false将确保删除推送路线之前的所有路线。 这时候将打开一个新的screen4页面

  5.2.Navigator.of(context).pushNamedAndRemoveUntil('/screen4', ModalRoute.withName('/screen1'))

 指将制定的页面加入到路由中,然后将之前的路径移除一直到制定的页面为止(将具有给定名称的路由推到导航器上,然后删除所有路径前面的路由直到'predicate'返回true为止。) 这时候将销毁栈内除了screen4的页面,点击直接去栈内screen4,这时screen4会重新build
使用情况:例如 一个购物应用程序的例子!或者任何需要支付交易的应用程序。因此,在这些应用程序中,一旦用户完成了支付事件,所有与交易或购物车相关的屏幕都应该从堆栈中删除,用户应该进入到支付确认页面。单击back按钮应将它们返回到产品列表或主屏幕。 使用实例: 1-->2-->3,3到4时使用Navigator.pushNamedAndRemoveUntil(context,"/screen4",ModalRoute.withName('/screen1')); 这时候如果在页面4点击返回,将会直接退出程序。 1-->2-->3,3到4时使用Navigator.pushNamedAndRemoveUntil(context,"/screen4",ModalRoute.withName('/')); 这时候如果在页面4点击返回,将会直接回到页面1。 1-->2-->1-->2-->3,3到4时使用Navigator.pushNamedAndRemoveUntil(context,"/screen4",ModalRoute.withName('/screen1')); 这时候如果在页面4点击返回,将会回到第二个1页面。

  5.4.Navigator.pushAndRemoveUntil( context, MaterialPageRoute(builder: (BuildContext context) => new screen4()), ModalRoute.withName('/')

这种方法跟上述方法作用相同,不同之处在于,上述传递的是路由名称,这个名称需要你在入口处进行路由指定,而这种则无需指定,直接new 出来即可, 而且可以传递参数。(看其名称即可发现差别pushNamedAndRemoveUntil与pushAndRemoveUntil)使用这种作用如下 1-->2-->3,3到4时使用此方法,这时候如果在页面4点击返回,将会直接回到页面1。
如果使用
Navigator.pushAndRemoveUntil(
    context,
    MaterialPageRoute(builder: (BuildContext context) => Screen4()),
      (Route<dynamic> route) => false,
);

这时候进入4后。4将成为唯一的一个页面。其他页面都将pop出栈,这个跟上述pushNamedAndRemoveUntil也一致。

6.popUntil——Navigator.popUntil(context, ModalRoute.withName('/screen2'))

有些应用场景下,用户可能不得不填写一个由三部分组成的长表单,该表单可能在移动应用程序的三个连续屏幕中显示。现在在表单的第三个页面,用户决定取消填写表单。用户单击Cancel,就会弹出所有之前的与表单相关的屏幕,并将用户带回主屏幕,从而丢失所有与表单相关的数据(在这种情况下,这是我们想要的)。我们不会在这里推出任何新东西,只是回到以前的路线。

 pop

1.Navigator.of(context).maybePop()

maybePop 会自动进行判断,如果当前页面pop后,会显示其他页面,不会出现问题,则将执行当前页面的pop操作 否则将不执行。

2.Navigator.of(context).canPop()

canPop 判断当前页面能否进行pop操作,并返回bool值

3.Navigator.of(context).pop()

直接退出当前页面

 

https://github.com/mingfeng002/yinl/tree/master/yinll_flutter/lib/route_demo

posted on 2019-10-29 17:21  mingfeng002  阅读(839)  评论(0编辑  收藏  举报