权限管理包


我们在上一章回中介绍了BoxDecoration Widget相关的内容,本章回中将介绍命名路由(Route).闲话休提,让我们一起Talk Flutter吧。

在这里插入图片描述

1. 概念介绍

我们在这里介绍的命名路由是路由(Route)中的一种,主要用来当作导航,通过导航跳转到不同的页面,它和我们前面章回中介绍的路由类似,只不过是给路由添加了名
字,因此叫命名路由,有了名字后就可以直接通过名字来使用路由。当然了命名路由的使用还是需要Navigator配合才可以,通常是它充当Navigator中某个方法的参数。
常用的方法是pushNamed()方法。在此,大家先对命名路由有个大概的了解,本章回中将详细介绍它的使用方法。

2. 知识回顾

在Flutter中每个StatefulWidget或者StatelessWidget都有一个路由栈,这个路由栈通过Navigator来管理,使用Navigator的of()方法可以获取到当前页面
所在的路由栈,如果想从当前页面跳转到其它页面,那么使用Navigator的push()方法,相当于把其它页面压入当前页面的路由栈,如果从当前页面返回上一级页面,那
么使用Navigator的pop()方法,相当于把当前页面从路由栈中弹出,然后显示路由栈顶部的页面,也就是当前页面的上一级页面。Navigator的push/pop()方法需
要使用Router类对象充当参数,常用的是Router类的子类:MaterialPageRoute。该类有一个WidgetBuilder类型的必选参数,WidgetBuilder类型本质上是
一个方法类型,它会返回一个Widget对象,这个对象就是压入或者弹出路由栈的页面。这里先做文字性描述,如果大家不理解的话可以看示例代码。

使用方法

  • 1.创建命名路由。具体做法为:在MaterialApp的routes属性中创建命名路由;
  • 2.创建路由的语法:routeName: WidgetBuilder对象;
  • 3.使用命名路由进行导航,具体用法为:Navigator.pushNamed(routeName);
    关于第二步中的内容大家可能不理解,我们给一个示例代码:“/route1”: (context)=> DiyWidget();代码中的route1是命名路由的名字,名字前面的反斜线是
    根路由,它默认的页面是home属性对应的页面,如果不想使用默认值,也可以使用"/"来指定,或者使用initialRouter属性指定根路由。箭头是个语法糖,箭头前后
    的内容合在一起是一个方法,方法的参数是context,方面的内容是返回一个DiyWidget类型的对象。这个方法其实就是WidgetBuilder类型,我们在上一小节中介绍
    过该类型,它是MaterialPageRoute构造方法中的参数类型。看到这里大家就会明白,命名路由就是给普通路由起了个名字,背后的原理和普通路由完全相同。

3. 示例代码

ListTile(
  leading: Icon(Icons.message),
  title: Text("Messages"),
  //点击这个条目跳转到其它页面r,
  onTap: () {
    //使用普通路由
    // Navigator.of(context).push(
    //   MaterialPageRoute(builder: (context){
    //     return ExButton();
    //   })
    // );

    //下面代码是上面代码的语法糖式写法
    // Navigator.of(context).push(
    //   MaterialPageRoute(builder: (context) => ExButton())
    // );

    //使用命名路由
    Navigator.pushNamed(context,"/ButtonExample");
  },
),

我们在上面的代码中演示了普通路由和传统路由的使用方法,同时把路由封装到了ListTile中的onTap()方法里面,运行程序进点击List中的图标就可以通过路由实现
页面跳转。我在这里就是不演示程序的运行结果了,建议大家自己动手去实践。
看官们,关于命名路由相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!

  • 26
    点赞
  • 19
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

talk_8

真诚赞赏,手有余香

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值