Flutter学习笔记十五——页面导航并返回参数

上一篇已经学会了跳转时传值，那么如果跳转后返回参数如何实现呢？类似Android中的startActivityForResult();

示例

直接上代码：

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    title: '页面跳转返回数据',
    home: FirstPage(),
  ));
}

class FirstPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('第一页'),
      ),
      body: Center(
        child: RouteButton(),
      ),
    );
  }
}

class RouteButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      onPressed: () {
        _navigator2Second(context);
      },
      child: Text('跳转到第二页'),
    );
  }

  _navigator2Second(BuildContext context) async {
    final result = await Navigator.push(
        context, MaterialPageRoute(builder: (context) => SecondPage()));
    Scaffold.of(context).showSnackBar(SnackBar(content: Text('$result')));
  }
}

class SecondPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('第二页'),
      ),
      body: Center(
        child: Column(
          children: [
            RaisedButton(
              onPressed: () {
                Navigator.pop(context, '我是来自第二页的No.1');
              },
              child: Text('我是来自第二页的No.1'),
            ),
            RaisedButton(
              onPressed: () {
                Navigator.pop(context, '我是来自第二页的No.2');
              },
              child: Text('我是来自第二页的No.2'),
            )
          ],
        ),
      ),
    );
  }
}

异步请求个等待

Dart中的异步请求和等待使用async...await就可以实现。

  _navigator2Second(BuildContext context) async {
    final result = await Navigator.push(
        context, MaterialPageRoute(builder: (context) => SecondPage()));
    Scaffold.of(context).showSnackBar(SnackBar(content: Text('$result')));
  }

跳转到第二个页面的方法是异步方法，result是等待第二个页面的返回值；

SnackBar的使用

SnackBar是用户操作后，显示提示信息的一个控件，类似Tost，会自动隐藏。SnackBar是以Scaffold的showSnackBar方法来进行显示的。
Scaffold.of(context).showSnackBar(SnackBar(content: Text('$result')));

返回数据的方式

第二个页面返回数据的方式就是使用Navigator.pop(context, '我是来自第二页的No.2');
比之前的使用多了一个参数。