Flutter event_bus基础使用(小白看了用脚也会写)

Flutter event_bus基础使用(小白看了用脚也会写)

原创:@As.Kai
博客地址:https://blog.csdn.net/qq_42362997
如果以下内容对您有帮助,点赞点赞点赞~

首先 最基础必要条件导入依赖:

event_bus: ^1.1.1
最新pub版本点我查看
此篇文章实现订阅用户是否登录 来通知所有发布者
实现场景:监听用户的登录状态

步入正题:

使用前须知:

event_bus能够通过事件总线进行通信,分为发布者/订阅者
发布者能够触发事件,订阅者能够监听事件
这样就能使对象进行互相通信交互,不需要显式的定义监听器来跟踪他们

总而言之你可以理解他们为
不需要异步处理的SharedPreference,不需要在主函数注册的provider
这是个人理解,每个人理解方式不同,如有误导性错误可私信我下架文章

接下来我们来讲讲最基础的event_bus该如何使用:

我们进入项目Demo:
首先需要创建一个供当前项目使用的event_bus工具类:
event_bus_util.dart:

import 'package:event_bus/event_bus.dart';

EventBus eventBus = new EventBus();
//用户是否注册
class UserIsLogin{
  final bool isLogin;
  UserLoggedInEvent({this.isLogin});
}

在第一个页面我们放一个Text用来显示当前的登录状态
接着放一个按钮跳转一个新页面two.dart
初始化方法中咱们订阅一下event_bus中咱们刚写的用户是否登录

String test = '当前登录状态:';

@override
void initState() {
  // TODO: implement initState
  super.initState();
  eventBus.on<UserLoggedInEvent>().listen((event) {
    if(event.isLogin){
      print('true');
      test = '用户已登录';
    }else{
      print('false');
      test = '用户未登录';
    }
    setState((){});
  });
}
@override
Widget build(BuildContext context) {
  return new Scaffold(
    appBar: new AppBar(
      title: new Text('aaa'),
    ),
//event_bus Demo
body: new Column(
  children: [
    new Text(test),
    new GestureDetector(
      onTap: () {
        Navigator.push(context, new MaterialPageRoute(builder: (context){
          return Two();
        }));
      },
      child: new Text('第二个页面'),
    )
  ],
),
);

two.dart:
第二个页面我们主要做发布者的触发事件
放两个按钮,一个为用户登录 一个为用户未登录

@override
Widget build(BuildContext context) {
  return new Scaffold(
    appBar: new AppBar(
      title: new Text('two'),
    ),
    body: new Column(
      children: [
        new GestureDetector(
          onTap: (){
            print('onTap()');
            eventBus.fire(UserLoggedInEvent(isLogin: false));
          },
          child: new Text('用户未登录'),
        ),
        new GestureDetector(
          onTap: (){
            print('onTap()');
            eventBus.fire(UserLoggedInEvent(isLogin: true));
          },
          child: new Text('用户登录'),
        ),
      ],
    )
  );
}

eventBus.fire(UserLoggedInEvent(isLogin: false));
eventBus.fire(UserLoggedInEvent(isLogin: true));

点击后发布者进行触发事件

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

flutter run 运行查看效果吧!

最后,点个赞吧各位老爷!

关注我,一起成长!
@As.Kai

猜你喜欢

转载自blog.csdn.net/qq_42362997/article/details/114023763