18Flutter中的路由、路由替换、返回到根路由:
路由:
import 'package:flutter/material.dart';
class HomePage extends StatelessWidget {
const HomePage({Key key}) : super(key: key); @override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('跳转到搜索页面'),
onPressed: (){
Navigator.pushNamed(context,'/search',arguments: {
"id":
});
},
color: Theme.of(context).accentColor,
textTheme: ButtonTextTheme.primary
),
RaisedButton(
child: Text('跳转到商品页面'),
onPressed: (){
Navigator.pushNamed(context,'/product');
}
)
],
);
}
}
Product.dart
import 'package:flutter/material.dart';
class ProductPage extends StatefulWidget {
ProductPage({Key key}) : super(key: key);
_ProductPageState createState() => _ProductPageState();
}
class _ProductPageState extends State<ProductPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('商品页面'),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('跳转到商品详情页面'),
onPressed: () {
// Navigator.pushReplacementNamed(context, '/productinfo',
// arguments: {"pid":778899}
// );
Navigator.pushNamed(context, '/productinfo',
arguments: {"pid":}
);
},
color: Theme.of(context).accentColor,
textTheme: ButtonTextTheme.primary),
],
)
);
}
}
ProductInfo.dart
import 'package:flutter/material.dart';
import '../pages/Tabs.dart'; class ProductInfoPage extends StatefulWidget {
Map arguments;
ProductInfoPage({Key key, this.arguments}) : super(key: key); _ProductInfoPageState createState() =>
_ProductInfoPageState(arguments: this.arguments);
} class _ProductInfoPageState extends State<ProductInfoPage> {
Map arguments;
_ProductInfoPageState({this.arguments});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('商品详情页面'),
),
// body: Text("这是一个商品详情页面pid=${arguments["pid"]}")
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('完成'),
onPressed: () {
// Navigator.of(context).pop(); //返回根:
Navigator.of(context).pushAndRemoveUntil(
new MaterialPageRoute(builder: (context)=>new Tabs(index: )),
(route)=>route==null
);
}
),
],
),
);
}
}
Tabs.dart
import 'package:flutter/material.dart';
import 'tabs/Home.dart';
import 'tabs/Category.dart';
import 'tabs/Setting.dart';
class Tabs extends StatefulWidget {
final index;
Tabs({Key key,this.index=}) : super(key: key);
_TabsState createState() => _TabsState(this.index);
} class _TabsState extends State<Tabs> {
int _currentIndex = ;
_TabsState(index){
this._currentIndex=index;
}
List _pageList=[
HomePage(),
CategoryPage(),
SettingPage()
];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Flutter Demo'),
),
bottomNavigationBar: BottomNavigationBar(
currentIndex: this._currentIndex,
onTap: (int index) {
// print(index);
setState(() {
this._currentIndex = index;
});
},
iconSize: 36.0,
type: BottomNavigationBarType.fixed,
fixedColor: Colors.red,
items: [
BottomNavigationBarItem(icon: Icon(Icons.home), title: Text('首页')),
BottomNavigationBarItem(
icon: Icon(Icons.category), title: Text('分类')),
BottomNavigationBarItem(
icon: Icon(Icons.settings), title: Text('设置')),
]),
body: this._pageList[this._currentIndex],
);
}
}
main.dart
import 'package:flutter/material.dart';
import 'package:flutter_demo/pages/Search.dart';
import 'routes/Routes.dart'; void main() {
runApp(MyApp());
} class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return MaterialApp(
initialRoute: '/',
onGenerateRoute: onGenerateRoute
);
}
}
18Flutter中的路由、路由替换、返回到根路由:的更多相关文章
- Flutter中的替换路由、返回到根路由
替换路由 当我们有三个页面,页面1,页面2,页面3. 期望点击页面1按钮,跳转到页面2,页面2点击返回,跳转到页面1: 点击页面2按钮,跳转到页面3,页面3点击返回,跳转到页面1,而不是页面2. 这时 ...
- vue中的组件,Component元素,自定义路由,异步数据获取
组件是Vue最强大的功能之一.组件是一组可被复用的具有一定功能,独立的完整的代码片段,这个代码片段可以渲染一个完整视图结构组件开发如何注册组件?第一步,在页面HTML标签中使用这个组件名称,像使用DO ...
- ionic back 返回按钮不正常显示&&二级路由点击返回按钮失效无法返回到上一级页面的问题
很多时候,app不只有一两级路由,还要三四级路由,但是在ionic中,给出的返回键三级或四级无法使用,所以得自定义方法设置返回. 直接贴代码: <ion-nav-buttons side=&qu ...
- 056——VUE中vue-router之路由参数的验证处理保存路由安全
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Spring Cloud (十三) Zuul:静态路由、静态过滤器与动态路由的实现
前言 本文起笔于2018-06-26周二,接了一个这周要完成的开发任务,需要先等其他人的接口,可能更新的会慢一些,还望大家见谅.这篇博客我们主要讲Spring Cloud Zuul.项目地址:我的gi ...
- 理解Web路由(浅谈前后端路由与前后端渲染)
1.什么是路由? 在Web开发过程中,经常会遇到『路由』的概念.那么,到底什么是路由?简单来说,路由就是URL到函数的映射. 路由的概念最开始是由后端提出来的,在以前用模板引擎开发页面的时候,是使用路 ...
- vue动态添加路由addRoutes之不能将动态路由存入缓存
在我不知道vue的路由还可以通过addRoutes动态添加时,我只知道vue的路由都是写死在路由表中的,每当跳转时再去加载相应的路由.直到在一个新公司接到需要根据用户的权限显示不同的菜单的需求时才知道 ...
- 2种方式解决vue路由跳转未匹配相应路由避免出现空白页面或者指定404页面
https://www.cnblogs.com/goloving/p/9254084.html https://www.cnblogs.com/goloving/p/9254084.html 1.路由 ...
- Laravel之路由 Route::get/post/any、路由参数、过滤器、命名、子域名、前缀、与模型绑定、抛出 404 错误、控制器
基本路由 应用中的大多数路都会定义在 app/routes.php 文件中.最简单的Laravel路由由URI和闭包回调函数组成. 基本 GET 路由 代码如下: Route::get('/', fu ...
随机推荐
- Go语言中Goroutine的设置
一. 通过runtime包进行多核设置 1.NumCPU()获取当前系统的cpu核数 2.GOMAXPROCS设置当前程序运行时占用的cpu核数 版本1.6之前默认是使用1个核,而之后是全部使用. 好 ...
- 运输层8——TCP运输连接管理
目录 1. TCP的连接建立 2. TCP的连接释放 写在前面:本文章是针对<计算机网络第七版>的学习笔记 运输层1--运输层协议概述 运输层2--用户数据报协议UDP 运输层3--传输控 ...
- Win10 hosts文件无法保存
Win10无法修改编辑保存hosts文件怎么办?Win10系统默认是没有权限去编辑保存系统里的文件,这也是权限不够才导致修改编辑hosts后无法保存的原因,解决的办法就是把自己的帐户权限给提高就行了. ...
- SATB深入详解与问题剖析【纯理论】
延着上一次[https://www.cnblogs.com/webor2006/p/11147893.html]的理论继续. SATB: 在G1中,使用的是SATB(Snapshot-At-The-B ...
- Time Intersection
Description Give two users' ordered online time series, and each section records the user's login ti ...
- Spark mllib 随机森林算法的简单应用(附代码)
此前用自己实现的随机森林算法,应用在titanic生还者预测的数据集上.事实上,有很多开源的算法包供我们使用.无论是本地的机器学习算法包sklearn 还是分布式的spark mllib,都是非常不错 ...
- Spring事务管理器
1.创建实体和接口 public class Bank { private Integer id; private String name; private String manay; public ...
- django 渲染模板与 vue 的 {{ }} 冲突解决方法
如果不可避免的在同一个页面里既有 django 渲染又有 vue 渲染的部分,可有 2 种方式解决 方法一: 采用 vue 的 delimiters 分隔符. new Vue({ delimiter ...
- 使用DOS命令将类库封装成dll
1.Windows键+R.输入cmd进入DOS 2.使用 cd 加路径找到需要封装成dll的类库文件 3.csc /target:library /out:dll的名字.DLL 需要封装的cs文件
- Unity使用Xcode将项目打包成IPA
https://blog.csdn.net/Superficialtise/article/details/79699813 Unity是个开放性的平台,打包时也可以选择多种打包类型,几乎包含了所有的 ...