美文网首页
『Flutter』使用eventBus来使用flutterboo

『Flutter』使用eventBus来使用flutterboo

作者: butterflyer | 来源:发表于2021-10-11 20:37 被阅读0次

    最近一直在做直播间flutter化,是的没错,又要用flutter把直播间重新写一遍。
    原因是什么呢?第一是减少人力成本,第二呢?安卓代码写的太烂,没法维护了。是的,没听错。

    言归正传,准备写些flutter相关的文章,帮助自己对知识加深记忆。


    src=http___pic3.zhimg.com_v2-0831ab242b01a6de64757dfd7b0197d1_1200x500.jpg&refer=http___pic3.zhimg.jpeg

    eventBus 从设计模式来说,可以认为是观察者模式。

    typedef void EventCallback(arg);
    
    class LiveEventBus {
      // //私有构造函数
      // LiveEventBus._internal();
    
      // //保存单例
      // static LiveEventBus _singleton = new LiveEventBus._internal();
    
      // //工厂构造函数
      // factory LiveEventBus()=> _singleton;
    
      //保存事件订阅者队列,key:事件名(id),value: 对应事件的订阅者队列
      Map<Object, List<EventCallback>> _emap = new Map<Object, List<EventCallback>>();
    
      //添加订阅者
      void on(String eventName, EventCallback f) {
        if (eventName == null || f == null) return;
        _emap[eventName] ??= [];
        _emap[eventName].add(f);
      }
    
      //移除订阅者
      void off(String eventName, [EventCallback f]) {
        List<EventCallback> list = _emap[eventName];
        if (eventName == null || list == null) return;
    
        if (f == null) {
          _emap[eventName] = null;
        } else {
          list.remove(f);
        }
      }
    
      //触发事件,事件触发后该事件所有订阅者会被调用
      void emit(String eventName, [arg]) {
        List<EventCallback> list = _emap[eventName];
        if (list == null) return;
    
        int len = list.length - 1;
        //反向遍历,防止订阅者在回调中移除自身带来的下标错位 
        for (int i = len; i > -1; --i) {
          list[i](arg);
        }
      }
    
      destroy() {
        _emap.clear();
      }
    }
    

    怎么使用呢?
    下面用如何用flutterboost来监听app的生命周期来举个例子。
    由于直播间都是用stateless来做的,用flutter自带的生命周期,都是针对于stateful来做的,鄙人试过,收不到相应的回调,所以才转用flutterboost的生命周期,当然我们也可以自己写一个。
    flutterboost的生命周期,从源码可以看到也是拿channel做的。最简单粗暴的方式,直接从源码里扒拉出他的代码

    {
          const BasicMessageChannel<Object?> channel = BasicMessageChannel<Object?>(
              'dev.flutter.pigeon.FlutterRouterApi.onForeground', StandardMessageCodec());
          if (api == null) {
            channel.setMessageHandler(null);
          } else {
            channel.setMessageHandler((Object? message) async {
              assert(message != null, 'Argument for dev.flutter.pigeon.FlutterRouterApi.onForeground was null. Expected CommonParams.');
              final CommonParams input = CommonParams.decode(message!);
              api.onForeground(input);
              return;
            });
          }
        }
        {
          const BasicMessageChannel<Object?> channel = BasicMessageChannel<Object?>(
              'dev.flutter.pigeon.FlutterRouterApi.onBackground', StandardMessageCodec());
          if (api == null) {
            channel.setMessageHandler(null);
          } else {
            channel.setMessageHandler((Object? message) async {
              assert(message != null, 'Argument for dev.flutter.pigeon.FlutterRouterApi.onBackground was null. Expected CommonParams.');
              final CommonParams input = CommonParams.decode(message!);
              api.onBackground(input);
              return;
            });
          }
        }
    

    当然,如果这么搞,那么其他人就没法用这个生命周期了。
    那么如何优雅的来使用呢?

    创建一个Observer 并且with上flutterboost专门做生命周期的Observer。并且暴露两个方法addObserver和removeObserver

    class GlobalZhiBoRouteObserver with GlobalPageVisibilityObserver {
    
      static final GlobalZhiBoRouteObserver instance = GlobalZhiBoRouteObserver._();
    
      GlobalZhiBoRouteObserver._();
    
      @override
      void onPagePush(Route<dynamic> route) {
        try {
    
        } catch (e) {}
      }
    
      @override
      void onPageShow(Route<dynamic> route) {
        LiveAppLifeCycleStateBinding().liveEventBus.emit(AppLifeCycleEvent.PAGE_SHOW_EVENT);
        if (Platform.isAndroid) {
          LiveAppLifeCycleStateBinding().liveEventBus.emit(AppLifeCycleEvent.APP_ONFOREGROUND_EVENT);
        }
      }
    
      @override
      void onPageHide(Route<dynamic> route) {
        LiveAppLifeCycleStateBinding().liveEventBus.emit(AppLifeCycleEvent.PAGE_HIDE_EVENT);
        if (Platform.isAndroid) {
          LiveAppLifeCycleStateBinding().liveEventBus.emit(AppLifeCycleEvent.APP_ONBACKGROUND_EVENT);
        }
      }
    
      @override
      void onForeground(Route<dynamic> route) {
        if (Platform.isIOS) {
          LiveAppLifeCycleStateBinding().liveEventBus.emit(AppLifeCycleEvent.APP_ONFOREGROUND_EVENT);
        }
      }
      @override
      void onBackground(Route<dynamic> route) {
        if (Platform.isIOS) {
          LiveAppLifeCycleStateBinding().liveEventBus.emit(AppLifeCycleEvent.APP_ONBACKGROUND_EVENT);
        }
      }
    
      addObserver() {
        try {
          PageVisibilityBinding.instance.addGlobalObserver(this);
        } catch (e) {}
      }
    
      removeObserver() {
        try {
          PageVisibilityBinding.instance.removeGlobalObserver(this);
        } catch (e) {}
      }
    }
    
    

    在项目开始的main.dart中调用

    @override
      void initState() {
        super.initState();
        GlobalZhiBoRouteObserver.instance.addObserver();
        // GlobalRouteObserver.instance.addObserver(); //职Q全局路由监听,并且过滤了职Q自己的路由变化
      }
    
      @override
      void dispose() {
        GlobalZhiBoRouteObserver.instance.removeObserver();
        super.dispose();
      }
    

    创建一个单例,在里面持有一个eventbus对象,在需要的地方进行监听。

    class LiveAppLifeCycleStateBinding {
      static final _instance = LiveAppLifeCycleStateBinding._init();
      factory LiveAppLifeCycleStateBinding() => _instance;
    
      LiveEventBus liveEventBus;
      
      LiveAppLifeCycleStateBinding._init() {
        liveEventBus = new LiveEventBus();
      }
    
      destroy() {
        liveEventBus.destroy();
      }
    }
    
    

    比如在某个界面需要进行使用

     // app进入后台
        LiveAppLifeCycleStateBinding().liveEventBus.on(AppLifeCycleEvent.APP_ONBACKGROUND_EVENT, (arg) {
    
        });
    
        // app进入前台
        LiveAppLifeCycleStateBinding().liveEventBus.on(AppLifeCycleEvent.APP_ONFOREGROUND_EVENT, (arg) {
     
        });
    
        // 当前页面隐藏
        LiveAppLifeCycleStateBinding().liveEventBus.on(AppLifeCycleEvent.PAGE_HIDE_EVENT, (arg) {
    
        });
    
        // 当前页面显示
        LiveAppLifeCycleStateBinding().liveEventBus.on(AppLifeCycleEvent.PAGE_SHOW_EVENT, (arg) {
          
        });
    

    相关文章

      网友评论

          本文标题:『Flutter』使用eventBus来使用flutterboo

          本文链接:https://www.haomeiwen.com/subject/iolroltx.html