关于flutter:FlutterDart-Callback转同步

前言

怎么将一个Callback回调转化成Future同步办法（Callback to Future），能够配套async / await去应用呢？

集体感觉，这是一个很常见的景象，不晓得为啥，很多人在阐明Future用法的时候，都没提到这个场景，奇怪+懵逼，只能本人去苟解决方案了。

历程

• 为什么我要将Callback转成Future办法？

  • 大家晓得，Flutter在加载页面的时候，有个渲染的过程，在没渲染实现的时候，你去显示一些View的操作，会报错的，例如：加载loading弹窗
  • 解决办法可能大家都晓得，Lifecycle.initState / iniState 生命周期外面做个延时操作或者应用WidgetsBinding

//延时操作
await Future.delayed(Duration(milliseconds: 200));
//上面能够加载弹窗

//应用WidgetsBinding
WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
    //此处能够加载弹窗
});

• 当然，应用WidgetsBinding是更靠谱和精确的，然而这个Callback就让我很方了，而且，这名字太长，也不太记的住，这就须要将它封装了

• 封装WidgetsBinding

  • 蛋筒了，这玩意怎么封装呢

class ViewUtil {
  ///界面初始化实现
  static Future<Void> initFinish() async {
    WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
      
    });
  }
}

• 首先我想到了：Future.delayed()

  • 进去看下他的源码
  • 有戏，能够看到，这外面显著蕴含了一个Timer中的Callback回调，但最初转换成了，Future办法

factory Future.delayed(Duration duration, [FutureOr<T> computation()?]) {
    if (computation == null && !typeAcceptsNull<T>()) {
        throw ArgumentError.value(
            null, "computation", "The type parameter is not nullable");
    }
    _Future<T> result = new _Future<T>();
    new Timer(duration, () {
        if (computation == null) {
            result._complete(null as T);
        } else {
            try {
                result._complete(computation());
            } catch (e, s) {
                _completeWithErrorCallback(result, e, s);
            }
        }
    });
    return result;
}

• 剖析下

  • 首先是实例化一个_Future<T>()对象，而后返回了这个_Future<T>()对象
  • 能够看到办法的最下方是间接返回这个对象，可想而知，这中央，必定始终处于一个阻塞状态，在期待一个条件完结这个阻塞状态
  • 而后在Timer的延迟时间到了后，其回调中应用了_complete()这个办法，这个办法应该是完结了_Future<T>()对象的阻塞状态，而后再返回_Future<T>()对象，同时这个办法也完结了
• 这不就简略了，我把这个抄进去不就欧了

• 这个_Future类是个公有办法，在future_impl.dart文件，把这个文件拷进去，放在咱们工具类文件同一个包下，

  • 而后。。。

• 这一堆报错，玩毛线啊，必定是我关上的形式不对

  • 难道要一个一个去解决这些报错？要是这么麻烦，还搞毛线！

• 是不是我搜寻的姿态不对，再来搜搜看

  • 我去，还主动给我提醒：dart callback to future，这么神奇的吗？试试看

• 而后胜利找到这个：https://medium.com/@brianscha…

  • 长篇累牍，简洁明了

解决方案

• 记录下Callback to Future的写法，很简略，应用Completer类即可

class ViewUtil {
  ///界面初始化实现
  static Future<Void> initFinish() async {
    Completer<Void> completer = Completer();

    WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
      completer.complete();
    });

    return completer.future;
  }
}

• 应用

  • 应用起来，霎时简略很多

void _init() async {
    await ViewUtil.initFinish();
    ///上面能够应用加载弹窗
}

阐明

• Future<T>和Completer<T>的泛型最好保持一致

  • 例如都是String的话，complete()办法外面就能够加上相应的内容，而后await承受这个办法时候，就能拿到complete()办法外面输出的值了

class ViewUtil {
    ///界面初始化实现
    static Future<String> initFinish() async {
        Completer<String> completer = Completer();

        WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
            completer.complete("测试一下...");
        });

        return completer.future;
    }
}


void _init() async {
    var s = await ViewUtil.initFinish();
    print(s);
}