Flutter（三十五）事件总线EventBus

在Android原生中，有广播可以进行跨页面传递数据。
Flutter中我们可以自定义一个事件总线，实现跨页面传递数据。
步骤

• 定义一个单例类
• 添加一个Map<String ,CallBack>变量，保存监听的事件名和对应的回调方法。
• 添加on方法，用于向map中添加事件。
• 添加off方法，用于从map中移除事件监听。
• 定义emit方法，用于事件源发射事件。

事件总线：

//订阅者回调签名
typedef void EventCallback(arg);

class EventBus {
  //私有构造函数
  EventBus._internal();

  //保存单例
  static EventBus _singleton = new EventBus._internal();

  //工厂构造函数
  factory EventBus()=> _singleton;

  //保存事件订阅者队列，key:事件名(id)，value: 对应事件的订阅者
  var _emap = new Map<String, EventCallback>();

  //添加订阅者
  void on(eventName, EventCallback f) {
    if (eventName == null || f == null) return;
    _emap[eventName]=f;
  }

  //移除订阅者
  void off(eventName) {
    _emap[eventName] = null;
  }

  //触发事件，事件触发后该事件所有订阅者会被调用
  void emit(eventName, [arg]) {
    var f = _emap[eventName];
    f(arg);
  }
}

测试页面：

class EventBusTest extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'RaisedButton',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'RaisedButton'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  // 获取事件总线
  var bus = new EventBus();
  int index = 1;
  String text = '';

  @override
  void initState() {
    super.initState();
    // 添加监听，模仿不同页面添加事件监听
    bus.on("key0", (parmas){text=parmas.toString();});
    bus.on("key1", (parmas){text=parmas.toString();});
    bus.on("key2", (parmas){text=parmas.toString();});
  }

  @override
  void dispose() {
    super.dispose();
    //widget关闭时 删除监听
    bus.off("key0");
    bus.off("key1");
    bus.off("key2");
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        //导航栏
        title: Text("App Name"),
        actions: <Widget>[
          //导航栏右侧菜单
          IconButton(icon: Icon(Icons.share), onPressed: () {}),
        ],
      ),
      body: Center(
        child: Text(text),
      ),
      floatingActionButton: FloatingActionButton(
        //悬浮按钮
        child: Text("emit"),
        onPressed: _onAdd,// 点击调用方法
      ),
    );
  }


  void _onAdd() {
    index++;
    setState(() {
      // 发送事件
      bus.emit(getNameByIndex(index), index);
    });
  }

  String getNameByIndex(index){
    if(index%3==0){
      return 'key0';
    }
    if(index%3==1){
      return 'key1';
    }
    if(index%3==2){
      return 'key2';
    }
  }
}

欢迎关注我的公众号：Flutter和Dart开发实践

让我们共同学习进步，It is never too late to learn!

image.png