Flutter RxBus实现

刚刚使用RxDart简单实现了EvnetBus效果,

github地址:flutter_rxbus

在pubspec.yaml引入

dependencies:
  flutter_rxbus: ^0.0.1

用法一:

1、注册

    ///注册接收T类型消息
    RxBus.getInstance().register<T>((value) {
    });

2、发送消息

///发送T类型消息
RxBus.getInstance().post(T)

3、解除注册

  @override
  void dispose() {
    ///解除接收T类型消息
    RxBus.getInstance().unregister<T>();
    super.dispose();
  }

用法二

1、注册返回一个Observable,通过listen实现消息接收。

	StreamSubscription _subscription;
	
    ///返回T类型的Observable,
     _subscription = RxBus.getInstance().toObservable<T>().listen((value) {
    });

2、发送消息

///发送T类型消息
RxBus.getInstance().post(T)

3、手动解除注册

  @override
  void dispose() {
    ///取消注册
    _subscription?.cancel();
    super.dispose();
  }

示例代码:

class _MyAppState extends State<MyHomePage> {
  StreamSubscription _subscription;

  @override
  void initState() {
    super.initState();

    ///注册的方式使用
    RxBus.getInstance().register<int>((event) {
      print("通过注册,收到event: $event");
    });

    ///返回指定类型的Observable,
    _subscription = RxBus.getInstance().toObservable<MyEvent>().listen((event) {
      print("返回MyEvent类型的Observable,收到event: ${event.msg}");
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('flutter_rxbus'),
      ),
      body: Center(child: Text("RxBus"),),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          Navigator.push(context, MaterialPageRoute(builder: (context) {
            return SecondPage();
          }));
        },
        child: Icon(Icons.add),
      ),
    );
  }

  @override
  void dispose() {
    ///解除注册
    RxBus.getInstance().unregister<int>();
    ///取消注册
    _subscription?.cancel();
    super.dispose();
  }
}

class SecondPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Second Page"),
      ),
      body: Column(
        mainAxisSize: MainAxisSize.max,
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          RaisedButton(
            onPressed: () => RxBus.getInstance().post(1111),
            child: Text("发送int类型广播"),
          ),
          RaisedButton(
            onPressed: () => RxBus.getInstance().post(MyEvent("你好")),
            child: Text("发送MyEvent类型广播"),
          ),
        ],
      ),
    );
  }
}

在SecondPage中分别发送一次int类型消息和MyEvent类型消息,收到消息如下:

I/flutter (22402): 通过注册,收到event: 1111

I/flutter (22402): 返回MyEvent类型的Observable,收到event: 你好

注意

扫描二维码关注公众号,回复: 8634443 查看本文章

需要注意的是RxBus.getInstance().unregister<T>();只能解除通过register方法注册的广播。
使用toObservable方式需要自己声明一个StreamSubscription接收,最后调用_subscription?.cancel();来解除注册。

总结

其实我项目都已经引入了EventBus了,只不过想通过多实践来熟悉Rxdart使用。如果有什么不对的地方,请指正。

项目地址:
https://github.com/Zhengyi66/flutter_rxbus

发布了82 篇原创文章 · 获赞 16 · 访问量 3万+

猜你喜欢

转载自blog.csdn.net/sjdjdjdjahd/article/details/103525868