40个flutter入门实例详解(二)

3.页面的切换跳转

class RouterTestRoute extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: RaisedButton(
        onPressed: () async {
          // 异步执行转为同步执行，必须等待结果返回后才往下执行
          var result = await Navigator.push(
            context,
            MaterialPageRoute(
              builder: (context) {
                //创建新路由时传入参数text
                return TipRoute(
                  // 路由参数
                  text: "我是提示xxxx",
                );
              },
            ),
          );
          //输出`TipRoute`路由返回结果
          print("路由返回值: $result");
        },
        child: Text("打开提示页"),
      ),
    );
  }
}

class TipRoute extends StatelessWidget {
  TipRoute({
    Key key,
    @required this.text,  // 接收一个text参数
  }) : super(key: key);
  final String text;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("提示"),
      ),
      body: Padding(
        padding: EdgeInsets.all(18),
        child: Center(
          child: Column(
            children: <Widget>[
              Text(text),
              RaisedButton(
                //从路由栈将路由出栈
                onPressed: () => Navigator.pop(context, "我是返回值"),
                child: Text("返回"),
              )
            ],
          ),
        ),
      ),
    );
  }
}

效果：

    

4.引入包并使用包中的方法

Google官方的Dart Packages仓库:https://pub.dev/

(1)修改pubspec.yaml文件，添加english_words包

dependencies:
  flutter:
    sdk: flutter
  english_words: ^3.1.5

(2)命令行执行

flutter packages get

(3)引入english_words包

import 'package:english_words/english_words.dart';

(4)使用english_words包的方法

class MyHomePage extends StatelessWidget {
 @override
  Widget build(BuildContext context) {
    //使用english_words包的方法
    final wordPair = new WordPair.random();
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('标题'),
      ),
      body: new Padding(
          padding: const EdgeInsets.all(38.0),
          child: new Text(wordPair.toString()),
        ),
    );
  }
}

效果：

5.捕获同步异常

try{
    Future.delayed(Duration(seconds: 1)).then((e) => Future.error("xxx"));
}catch (e){
    print(e);
}

效果：

6.捕获异步异常

Future.delayed(Duration(seconds: 1)).then((e) => Future.error("xxx"));

import 'dart:async';

void main() {
  runZoned(
    //可能发生异常的代码
    () => runApp(MyApp()),
    //捕获异常并输出
    onError: (e) {
      print(e);
    },
  );
}

效果：

7.Widget的各个生命周期

class CounterWidget extends StatefulWidget {
  const CounterWidget({
    Key key,
    //默认参数
    this.initValue: 0
  });

  final int initValue;

  @override
  _CounterWidgetState createState() => new _CounterWidgetState();
}

class _CounterWidgetState extends State<CounterWidget> {  
  int _counter;
  //State类第一次初始化数据时调用
  @override
  void initState() {
    super.initState();
    //获取StatefulWidget类的成员变量
    _counter=widget.initValue;
    print("initState");
  }

  @override
  Widget build(BuildContext context) {
    print("build");
    return Scaffold(
      body: Center(
        child: FlatButton(
          child: Text('$_counter'),
          //点击后计数器自增
          onPressed:()=>setState(()=> ++_counter,
          ),
        ),
      ),
    );
  }
  //热重载调用reassemble()后调用
  @override
  void didUpdateWidget(CounterWidget oldWidget) {
    super.didUpdateWidget(oldWidget);
    print("didUpdateWidget");
  }
  //当State对象从树中被移除时，会调用此回调
  @override
  void deactivate() {
    super.deactivate();
    print("deactive");
  }
  //当State对象从树中被永久移除时调用
  @override
  void dispose() {
    super.dispose();
    print("dispose");
  }
  //热重载(hot reload)时会被调用
  @override
  void reassemble() {
    super.reassemble();
    print("reassemble");
  }
  //当State对象的依赖发生变化时会被调用
  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    print("didChangeDependencies");
  }
}

效果：