flutter图片点击跳转_Flutter 中如何跳转界面

您好,欢迎关注我的专栏,本专栏是关于 Flutter 的专栏,从简单的 Flutter 介绍开始,一步步带你了解进入 Flutter 的世界。你最好有一定的移动开发经验,如果没有也不要担心,在我的专栏底部给我留言,我会尽我的能力给你解答。

上一篇专栏,我带大家用Flutter实现了一个完整的可自定义配置的 PageView 指示器。这篇专栏,我会教大家在Flutter中如何实现界面跳转。

在Android中,我们会使用Intent来进行界面间的跳转,用startActivityForResult来处理界面跳转完成后的回调;在iOS中,我们使用Pages进行页面跳转。

页面跳转

在Flutter中页面跳转方式有两种:

方法一:

直接跳转

Navigator.push(context, new MaterialPageRoute(builder: (context) => new SecondScreen()),);

方法二:

通过路由跳转

void main() {

runApp(MaterialApp(

home: MyAppHome(), // becomes the route named '/'

routes: {

'/a': (BuildContext context) => MyPage(title: 'page A'),

'/b': (BuildContext context) => MyPage(title: 'page B'),

'/c': (BuildContext context) => MyPage(title: 'page C'),

},

));

}

Navigator.of(context).pushNamed('/b');

根据Flutter的文档,routes的灵感来源于reactjs,routes可以翻译为路由,可以看到这种routes的思路在目前的设计中彼此借鉴,routes的思路不仅在前端流行,比如在vue、reactjs、Angular中用到,而且在后端应用中也非常成熟。

关闭页面

使用Navigator.pop()方法可以直接

Navigator.pop(context);

也可以直接带参数回调。

Navigator.of(context).pop({"lat":43.821757,"long":-79.226392});

利用第三方库实现页面传值

Fluro是一个基于Flutter的路由传参库,它可以通过url传递参数。

```

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值