百度360必应搜狗淘宝本站头条
当前位置:网站首页 > IT技术 > 正文

flutter软件开发笔记14-事件总线

wptr33 2025-04-26 21:39 16 浏览

Flutter 中的 事件总线(Event Bus) 就像一个 广播电台,专门负责帮不同组件之间传递消息。举个通俗的例子:

想象你在一个商场里:

  • 顾客(组件A)想买鞋,但不知道库存情况
  • 仓库(组件B)有到货通知要发布
  • 商场广播系统(事件总线)负责传递消息: 仓库通过广播喊:"新款球鞋到货啦!" 顾客不用跑去仓库问,直接听到广播就能行动

一 事件总线

二 程序界面


二 代码实现

2.1 添加依赖库

在pubspec.yaml文件中添加:

dependencies:
  event_bus: ^2.0.0

2.2 代码实现

import 'package:flutter/material.dart';
import 'package:event_bus/event_bus.dart';

// 创建全局事件总线(相当于商场的广播系统)
EventBus eventBus = EventBus();

// 定义事件类型(相当于广播内容模板)
class ShoeArrivalEvent {
  final String shoeName;
  ShoeArrivalEvent(this.shoeName);
}

void main() => runApp(MallApp());

class MallApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('商场通知系统')),
        body: Column(
          children: [
            WarehouseSection(), // 仓库区域
            CustomerSection(), // 顾客区域
          ],
        ),
      ),
    );
  }
}

// 仓库组件(发送事件)
class WarehouseSection extends StatelessWidget {
  void _sendArrivalNotice() {
    // 发送新款到货事件(相当于仓库喊广播)
    eventBus.fire(ShoeArrivalEvent('AJ38 限量版'));
  }

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: _sendArrivalNotice,
      child: Text('仓库:发送到货通知'),
    );
  }
}

// 顾客组件(接收事件)
class CustomerSection extends StatefulWidget {
  @override
  _CustomerSectionState createState() => _CustomerSectionState();
}

class _CustomerSectionState extends State<CustomerSection> {
  String _latestNotice = '暂无通知';
  
  // 订阅事件(顾客打开广播接收器)
  void _listenEvent() {
    eventBus.on<ShoeArrivalEvent>().listen((event) {
      setState(() {
        _latestNotice = '最新到货:${event.shoeName}!';
      });
    });
  }

  @override
  void initState() {
    super.initState();
    _listenEvent(); // 初始化时开始监听
  }

  @override
  void dispose() {
    // 关闭时取消订阅(顾客离开商场时关闭收音机)
    eventBus.destroy();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(20),
      child: Text(_latestNotice, 
        style: TextStyle(fontSize: 18, color: Colors.blue)),
    );
  }
}

运行效果:

1. 点击"仓库:发送到货通知"按钮

2. 顾客区域会立即显示:最新到货:AJ38 限量版!

三 事件总结

最佳实践建议

  1. 事件分类管理:为不同模块创建独立的事件类
  2. 及时取消订阅:在dispose()中关闭事件监听
  3. 避免滥用:简单的状态变化仍推荐使用setState
  4. 结合使用:与状态管理库(如Provider)配合处理复杂场景

通过这个"商场广播系统"的比喻,你应该能直观理解事件总线的工作机制了。实际开发中,它特别适合处理那些 不需要知道是谁发送/接收 的全局通知场景!

相关推荐

redis的八种使用场景

前言:redis是我们工作开发中,经常要打交道的,下面对redis的使用场景做总结介绍也是对redis举报的功能做梳理。缓存Redis最常见的用途是作为缓存,用于加速应用程序的响应速度。...

基于Redis的3种分布式ID生成策略

在分布式系统设计中,全局唯一ID是一个基础而关键的组件。随着业务规模扩大和系统架构向微服务演进,传统的单机自增ID已无法满足需求。高并发、高可用的分布式ID生成方案成为构建可靠分布式系统的必要条件。R...

基于OpenWrt系统路由器的模式切换与网页设计

摘要:目前商用WiFi路由器已应用到多个领域,商家通过给用户提供一个稳定免费WiFi热点达到吸引客户、提升服务的目标。传统路由器自带的Luci界面提供了工厂模式的Web界面,用户可通过该界面配置路...

这篇文章教你看明白 nginx-ingress 控制器

主机nginx一般nginx做主机反向代理(网关)有以下配置...

如何用redis实现注册中心

一句话总结使用Redis实现注册中心:服务注册...

爱可可老师24小时热门分享(2020.5.10)

No1.看自己以前写的代码是种什么体验?No2.DooM-chip!国外网友SylvainLefebvre自制的无CPU、无操作码、无指令计数器...No3.我认为CS学位可以更好,如...

Apportable:拯救程序员,IOS一秒变安卓

摘要:还在为了跨平台使用cocos2d-x吗,拯救objc程序员的奇葩来了,ApportableSDK:FreeAndroidsupportforcocos2d-iPhone。App...

JAVA实现超买超卖方案汇总,那个最适合你,一篇文章彻底讲透

以下是几种Java实现超买超卖问题的核心解决方案及代码示例,针对高并发场景下的库存扣减问题:方案一:Redis原子操作+Lua脚本(推荐)//使用Redis+Lua保证原子性publicbo...

3月26日更新 快速施法自动施法可独立设置

2016年3月26日DOTA2有一个79.6MB的更新主要是针对自动施法和快速施法的调整本来内容不多不少朋友都有自动施法和快速施法的困扰英文更新日志一些视觉BUG修复就不翻译了主要翻译自动施...

Redis 是如何提供服务的

在刚刚接触Redis的时候,最想要知道的是一个’setnameJhon’命令到达Redis服务器的时候,它是如何返回’OK’的?里面命令处理的流程如何,具体细节怎么样?你一定有问过自己...

lua _G、_VERSION使用

到这里我们已经把lua基础库中的函数介绍完了,除了函数外基础库中还有两个常量,一个是_G,另一个是_VERSION。_G是基础库本身,指向自己,这个变量很有意思,可以无限引用自己,最后得到的还是自己,...

China&#39;s top diplomat to chair third China-Pacific Island countries foreign ministers&#39; meeting

BEIJING,May21(Xinhua)--ChineseForeignMinisterWangYi,alsoamemberofthePoliticalBureau...

移动工作交流工具Lua推出Insights数据分析产品

Lua是一个适用于各种职业人士的移动交流平台,它在今天推出了一项叫做Insights的全新功能。Insights是一个数据平台,客户可以在上面实时看到员工之间的交流情况,并分析这些情况对公司发展的影响...

Redis 7新武器:用Redis Stack实现向量搜索的极限压测

当传统关系型数据库还在为向量相似度搜索的性能挣扎时,Redis7的RedisStack...

Nginx/OpenResty详解,Nginx Lua编程,重定向与内部子请求

重定向与内部子请求Nginx的rewrite指令不仅可以在Nginx内部的server、location之间进行跳转,还可以进行外部链接的重定向。通过ngx_lua模块的Lua函数除了能实现Nginx...