登录之后跳转到之前的页面_Flutter实战经验(二):路由跳转

87052adc28fd690cd15a1a3372cab489.png

Flutter 中的页面跳转是通过 Navigator 实现的,路由跳转又分为:带参数跳转和不带参数跳转。不带参数跳转比较简单,默认可以通过 MaterialApp 的路由表跳转;而带参数的跳转,参数通过跳转页面的构造方法传递。常用的跳转有如下几种使用:

不带参数的路由表跳转

Navigator.pushNamed(context, routeName);

跳转新页面并且替换,比如登录页跳转主页

Navigator.pushReplacementNamed(context, routeName);

跳转到新的路由,并且关闭给定路由的之前的所有页面

Navigator.pushNamedAndRemoveUntil(context, '/calendar', ModalRoute.withName('/'));

带参数的路由跳转,并且监听返回

Navigator.push(context, new MaterialPageRoute(builder: (context) => new NotifyPage())).then((res) { ///获取返回处理 });

同时我们可以看到,Navigator 的 push 返回的是一个 Future,这个Future 的作用是在页面返回时被调用的。也就是你可以通过 Navigator 的 pop 时返回参数,之后在 Future 中可以的监听中处理页面的返回结果。

@optionalTypeArgsstatic Future push(BuildContext context, Route route) {  return Navigator.of(context).push(route);}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要从另一个页面跳转到TabBar和TabBarView中的页面,您可以使用Flutter的导航机制。以下是一个简单的示例: 假设您有两个页面:HomePage和TabbedPage。HomePage包含一个按钮,点击该按钮将导航到TabbedPage,TabbedPage包含TabBar和TabBarView,每个标签对应一个页面。 在HomePage中,您可以使用Navigator.push方法跳转到TabbedPage: ```dart import 'package:flutter/material.dart'; import 'tabbed_page.dart'; class HomePage extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('Home'), ), body: Center( child: RaisedButton( child: Text('Go to Tabbed Page'), onPressed: () { Navigator.push( context, MaterialPageRoute(builder: (context) => TabbedPage()), ); }, ), ), ); } } void main() { runApp(MaterialApp( home: HomePage(), )); } ``` 在TabbedPage中,您可以创建一个DefaultTabController来管理TabBar和TabBarView,并在TabBar中定义标签。每个标签对应一个页面。 ```dart import 'package:flutter/material.dart'; import 'tab_page.dart'; class TabbedPage extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('Tabbed Page'), bottom: TabBar( tabs: [ Tab(text: 'Page 1'), Tab(text: 'Page 2'), ], ), ), body: TabBarView( children: [ TabPage(title: 'Page 1'), TabPage(title: 'Page 2'), ], ), ); } } class TabPage extends StatelessWidget { final String title; TabPage({this.title}); @override Widget build(BuildContext context) { return Scaffold( body: Center( child: Text(title), ), ); } } ``` 在上面的示例中,TabbedPage使用TabBar和TabBarView来展示两个页面。每个页面由TabPage小部件表示。您可以根据实际需求自定义这些页面。 当您从HomePage点击按钮跳转到TabbedPage时,将会显示TabBar和TabBarView,并且您可以在TabBar中进行不同标签页之间的切换。 希望对您有所帮助!如果有任何其他问题,请随时提问。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值