flutter Future 使用

下面情况是我使用过程中对Future的误解及处理过程,希望对大家理解有帮助

 

我写一个Future的函数,希望它被异步调用。代码可能如下:

@override
  Widget build(BuildContext context) {

      //code begin
      debugPrint(DateTime.now().toString() + ":build.1");
      myFutureFunc().then( (int){
          debugPrint(DateTime.now().toString() + ":myFutureFunc.then.ok");
      } );
      debugPrint(DateTime.now().toString() + ":build.2");
      //code end

    return new Scaffold(
        body: Container(
            child: Column(...)//这里忽略代码
            )
        )
    );
  }

  Future<int> myFutureFunc() async{
      debugPrint(DateTime.now().toString() + ":enter");

      return 0;
  }

返回如下:

I/flutter (25508): 2019-10-14 15:31:09.082448:build.1
I/flutter (25508): 2019-10-14 15:31:09.084144:enter
I/flutter (25508): 2019-10-14 15:31:09.084344:build.2
I/flutter (25508): 2019-10-14 15:31:09.120824:myFutureFunc.then.ok

感觉与普通函数没有任何区别。只是 then 函数调用慢了一点点

 

在函数中增加更多的处理。如下:

  Future<int> myFutureFunc() async{
      debugPrint(DateTime.now().toString() + ":enter1");
      int i=0;
      for(int i=0;i<1000;++i)
          for(int j=0;j<10000;++j)
              for(int k=0;k<10000;++k)
                  ++i;
      debugPrint(DateTime.now().toString() + ":enter2");

      return 0;
  }

结果如下:

I/flutter (25508): 2019-10-14 15:36:25.282415:build.1
I/flutter (25508): 2019-10-14 15:36:25.283749:enter1
I/flutter (25508): 2019-10-14 15:36:25.416389:enter2
I/flutter (25508): 2019-10-14 15:36:25.416638:build.2
I/flutter (25508): 2019-10-14 15:36:25.449129:myFutureFunc.then.ok

里面执行时间长短不影响,与上一次执行相同结果。

 

替换成 await 对应函数


  Future<int> myFutureFunc() async{
      debugPrint(DateTime.now().toString() + ":enter1");
      await Future.delayed( Duration(seconds: 5));
      debugPrint(DateTime.now().toString() + ":enter2");

      return 0;
  }

结果如下:

I/flutter (25508): 2019-10-14 15:38:22.445591:build.1
I/flutter (25508): 2019-10-14 15:38:22.447336:enter1
I/flutter (25508): 2019-10-14 15:38:22.447710:build.2
I/flutter (25508): 2019-10-14 15:38:27.452447:enter2
I/flutter (25508): 2019-10-14 15:38:27.453455:myFutureFunc.then.ok

可见,碰到了 await ,函数就返回了。再试试验证一下

Future<int> myFutureFunc() async{
      await Future.delayed(Duration(seconds: 0));
      debugPrint(DateTime.now().toString() + ":enter0");

      debugPrint(DateTime.now().toString() + ":enter1");
      await Future.delayed( Duration(seconds: 5));
      debugPrint(DateTime.now().toString() + ":enter2");

      return 0;
  }
I/flutter (25508): 2019-10-14 15:40:26.937157:build.1
I/flutter (25508): 2019-10-14 15:40:26.938874:build.2
I/flutter (25508): 2019-10-14 15:40:26.975199:enter0
I/flutter (25508): 2019-10-14 15:40:26.975438:enter1
I/flutter (25508): 2019-10-14 15:40:31.981472:enter2
I/flutter (25508): 2019-10-14 15:40:31.982531:myFutureFunc.then.ok

的确如此!

因此,函数运行时,只是碰到 await 才会返回 一个 Future 。 我们写异步时用 Future的关键就在这,所以上面的函数,正确的写法应该是:

 

@override
  Widget build(BuildContext context) {

      //code begin
      debugPrint(DateTime.now().toString() + ":build.1");

      Future((){ this.myFutureFunc();}).then((val){
          debugPrint(DateTime.now().toString() + ":myFutureFunc Done.");
      });

      debugPrint(DateTime.now().toString() + ":build.2");
      //code end

    return new Scaffold(
        body: Container(
            child: Column()// 忽略代码
        )
    );
  }

  int myFutureFunc(){
      debugPrint(DateTime.now().toString() + ":enter1");
      

      return 0;
  }

结果如下:

I/flutter (25508): 2019-10-14 16:00:58.093965:build.1
I/flutter (25508): 2019-10-14 16:00:58.094854:build.2
I/flutter (25508): 2019-10-14 16:00:58.130326:enter1
I/flutter (25508): 2019-10-14 16:00:58.130598:myFutureFunc Done.

它与js中的promise 很像!

--END--

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Flutter中,可以使用Future来实现倒计时功能。下面是一个使用Future实现倒计时的代码示例: ```dart import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: '倒计时示例', theme: ThemeData( primarySwatch: Colors.blue, ), home: CountDownPage(), ); } } class CountDownPage extends StatefulWidget { @override _CountDownPageState createState() => _CountDownPageState(); } class _CountDownPageState extends State<CountDownPage> { int countDownValue = 10; @override void initState() { super.initState(); startCountDown(); } void startCountDown() { Future.delayed(Duration(seconds: 1), () { setState(() { countDownValue--; }); if (countDownValue > 0) { startCountDown(); } }); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('倒计时示例'), ), body: Center( child: Text( '倒计时:$countDownValue', style: TextStyle(fontSize: 24), ), ), ); } } ``` 上述代码展示了如何创建一个名为CountDownPage的StatefulWidget,其中使用Future.delayed来实现倒计时的逻辑。在initState中调用了startCountDown方法来启动倒计时,每秒减少countDownValue的值,并通过setState来更新页面。当countDownValue为0时,停止倒计时。 在构建页面时,使用了Center和Text组件来展示倒计时的数值。 通过这种方式,我们可以在Flutter使用Future来实现简单的倒计时功能。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值