内容简介：在某些情况下，我们可能希望从新路由返回数据。例如，假设我们我们怎样才能做到这一点？使用
在某些情况下，我们可能希望从新路由返回数据。例如，假设我们 push 一个向用户提供两个选项的新路由。当用户点击选项时，我们想要通知我们的第一个路由用户的选择，以便它可以对该信息采取行动！
我们怎样才能做到这一点？使用 Navigator.pop ！
路线
- 定义主路由
- 添加一个启动选择路由的按钮
- 使用两个按钮显示选择路由
- 点击按钮时，关闭选择路由
- 在主屏幕上用snackbar显示选择的那项
1.定义主屏幕
主路由将显示一个按钮。点击时，它将启动选择路由！
class HomeScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Returning Data Demo'),
),
// We'll create the SelectionButton Widget in the next step
body: Center(child: SelectionButton()),
);
}
}
2.添加一个启动选择路由的按钮
现在，我们将创建SelectionButton。我们的选择按钮将：
SelectionScreen SelectionScreen
class SelectionButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
return RaisedButton(
onPressed: () {
_navigateAndDisplaySelection(context);
},
child: Text('Pick an option, any option!'),
);
}
// A method that launches the SelectionScreen and awaits the result from
// Navigator.pop
_navigateAndDisplaySelection(BuildContext context) async {
// Navigator.push returns a Future that will complete after we call
// Navigator.pop on the Selection Screen!
final result = await Navigator.push(
context,
// We'll create the SelectionScreen in the next step!
MaterialPageRoute(builder: (context) => SelectionScreen()),
);
}
}
3.使用两个按钮显示选择路由
现在，我们需要建立一个选择路由！它将包含两个按钮。当用户点击按钮时，它应该关闭选择路由，并让主路由知道点击了哪个按钮！
现在，我们将定义UI，并确定如何在下一步中返回数据。
class SelectionScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Pick an option'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: RaisedButton(
onPressed: () {
// Pop here with "Yep"...
},
child: Text('Yep!'),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: RaisedButton(
onPressed: () {
// Pop here with "Nope"
},
child: Text('Nope.'),
),
)
],
),
),
);
}
}
4.点击按钮时，关闭选择路由
现在，我们要修改两个按钮的onPressed回调！为了将数据返回到第一个路由，我们需要使用 Navigator.pop 方法。
Navigator.pop 接收一个名为result的可选的第二个参数。如果我们提供结果，它将在SelectionButton中返回到 Future 中！
是的按钮
RaisedButton(
onPressed: () {
// Our Yep button will return "Yep!" as the result
Navigator.pop(context, 'Yep!');
},
child: Text('Yep!'),
);
否的按钮
RaisedButton(
onPressed: () {
// Our Nope button will return "Nope!" as the result
Navigator.pop(context, 'Nope!');
},
child: Text('Nope!'),
);
5.在主路由用snarkback显示选择的那项
既然我们正在启动选择路由并等待结果，我们将要对所返回的信息做些什么！
在这种情况下，我们将显示一个显示结果的Snackbar。为此，我们将在SelectionButton中修改_navigateAndDisplaySelection方法。
_navigateAndDisplaySelection(BuildContext context) async {
final result = await Navigator.push(
context,
MaterialPageRoute(builder: (context) => SelectionScreen()),
);
// After the Selection Screen returns a result, hide any previous snackbars
// and show the new result!
Scaffold.of(context)
..removeCurrentSnackBar()
..showSnackBar(SnackBar(content: Text("$result")));
}
完整例子
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
title: 'Returning Data',
home: HomeScreen(),
));
}
class HomeScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Returning Data Demo'),
),
body: Center(child: SelectionButton()),
);
}
}
class SelectionButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
return RaisedButton(
onPressed: () {
_navigateAndDisplaySelection(context);
},
child: Text('Pick an option, any option!'),
);
}
// A method that launches the SelectionScreen and awaits the result from
// Navigator.pop!
_navigateAndDisplaySelection(BuildContext context) async {
// Navigator.push returns a Future that will complete after we call
// Navigator.pop on the Selection Screen!
final result = await Navigator.push(
context,
MaterialPageRoute(builder: (context) => SelectionScreen()),
);
// After the Selection Screen returns a result, hide any previous snackbars
// and show the new result!
Scaffold.of(context)
..removeCurrentSnackBar()
..showSnackBar(SnackBar(content: Text("$result")));
}
}
class SelectionScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Pick an option'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: RaisedButton(
onPressed: () {
// Close the screen and return "Yep!" as the result
Navigator.pop(context, 'Yep!');
},
child: Text('Yep!'),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: RaisedButton(
onPressed: () {
// Close the screen and return "Nope!" as the result
Navigator.pop(context, 'Nope.');
},
child: Text('Nope.'),
),
)
],
),
),
);
}
}
以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，也希望大家多多支持 码农网
猜你喜欢:
- php – Laravel：如何使用尾部斜杠创建路由路由返回URL？
- c# – 仅为路由公开.NET OData API的子集(对于排除的API,返回404)
- C# 永远不会返回的方法真的不会返回
- iOS之导航返回上上个控制器或指定返回某个控制器
- MyBatis返回Map
- c++ 为什么在返回从函数的返回类型派生的类型的本地对象时,没有选择move构造函数？
本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。
并行计算导论
Ananth Grama、George Karypis、张武、毛国勇、Anshul Gupta、Vipin Kumar、程海英 / 张武、毛国勇、程海英 / 机械工业出版社 / 2005-1-1 / 49.00元
《并行计算导论》(原书第2版)全面介绍并行计算的各个方面，包括体系结构、编程范例、算法与应用和标准等，涉及并行计算的新技术，也覆盖了较传统的算法，如排序、搜索、图和动态编程等。《并行计算导论》(原书第2版)尽可能采用与底层平台无关的体系结构并且针对抽象模型来设计处落地。书中选择MPI、POSIX线程和OpenMP作为编程模型，并在不同例子中反映了并行计算的不断变化的应用组合。一起来看看 《并行计算导论》 这本书的介绍吧!
