Flutter事件分发管理插件event_dispatcher_builder的使用
Flutter事件分发管理插件event_dispatcher_builder的使用
Event Dispatcher
一个用于Dart的事件分发器。
安装
请遵循以下页面上的步骤:
- 在
pubspec.yaml
文件中添加event_dispatcher_builder
依赖。 - 运行
flutter pub get
来安装依赖。 - 安装
build_runner
包。
dependencies:
event_dispatcher_builder: ^版本号
dev_dependencies:
build_runner: ^版本号
配置
为了自定义构建器,需要在pubspec.yaml
旁边创建一个build.yaml
文件,内容如下:
targets:
$default:
auto_apply_builders: true
builders:
event_dispatcher_builder|buildEventDispatcher:
options:
eventDispatcherClassName: 'DefaultEventDispatcher' # 类名
includePackageDependencies: false # 是否包含依赖中的订阅者
注解
@Subscribe()
此注解应用于方法。它告诉生成器该方法处理特定事件。该方法必须有一个事件类型的参数。
// 事件
class TestEvent {
final String name;
TestEvent({
required this.name,
});
}
class FakeHandler {
List<String> eventTexts = [];
// 监听事件的方法
@Subscribe()
void onTestEvent(TestEvent event) {
eventTexts.add(event.name);
}
}
[@GenerateEventDispatcher](/user/GenerateEventDispatcher)()
此注解应在应用程序入口点处仅出现一次。它用于生成包含事件分发器的输出文件。
使用
在用@Subscribe
注解标记事件订阅者方法,并在main
函数中添加[@GenerateEventDispatcher](/user/GenerateEventDispatcher)()
注解后,需要运行dart run build_runner build
或flutter pub run build_runner build
。
你应该在添加注解的文件旁边找到一个名为*.event_dispatcher_builder.g.dart
的新文件。
void main() {
// 类名取决于你的配置
var eventDispatcher = DefaultEventDispatcher();
eventDispatcher.addHandler(FakeHandler());
}
要分发事件,可以使用EventDispatcher.dispatch(event)
方法。
void main() {
var eventDispatcher = DefaultEventDispatcher();
eventDispatcher.addHandler(FakeHandler());
// 分发新事件
var event = TestEvent(name: 'Foo Bar');
eventDispatcher.dispatch(event);
}
自动化addHandler
在大型项目中,管理所有addHandler
可能会很繁琐。特别是如果事件处理器需要额外的服务。
为了优化这一点,你可以安装catalyst_builder
包,该包会生成一个依赖注入容器。
安装并配置后,你可以创建一个HandlerRegistry
类,它被预加载,并添加上述代码:
@Service()
@Preload()
class HandlerRegistry {
HandlerRegistry(
EventDispatcher dispatcher,
@Inject(tag: #eventListener) List<Object> listeners,
) {
for (var listener in listeners) {
dispatcher.addHandler(listener, listener.runtimeType);
}
}
}
你的事件订阅者类需要一个新的注解:
@Service(tags: [#eventListener])
class FakeHandler {
List<String> eventTexts = [];
@Subscribe()
void onTestEvent(TestEvent event) {
eventTexts.add(event.name);
}
}
最后,你需要更新main
注解:
[@GenerateEventDispatcher](/user/GenerateEventDispatcher)()
// 新
[@GenerateServiceProvider](/user/GenerateServiceProvider)()
[@ServiceMap](/user/ServiceMap)(services: {
// 在服务容器中注册事件分发器作为EventDispatcher
MyEventDispatcher: Service(
lifetime: ServiceLifetime.singleton,
exposeAs: EventDispatcher,
)
})
void main(List<String> arguments) {
// 加载提供者
var provider = DefaultServiceProvider();
// 启动
provider.boot();
// 获取事件分发器
var dispatcher = provider.resolve<EventDispatcher>();
// 分发事件
var event = TestEvent(name: 'Foo Bar');
dispatcher.dispatch(event);
}
更多关于Flutter事件分发管理插件event_dispatcher_builder的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html
更多关于Flutter事件分发管理插件event_dispatcher_builder的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
当然,以下是一个关于如何使用Flutter事件分发管理插件event_dispatcher_builder
的代码案例。这个插件允许你创建和管理全局事件分发,非常适合需要在多个组件或页面间传递事件的场景。
首先,确保你已经在pubspec.yaml
文件中添加了event_dispatcher_builder
依赖:
dependencies:
flutter:
sdk: flutter
event_dispatcher_builder: ^最新版本号 # 请替换为最新的版本号
然后,运行flutter pub get
来安装依赖。
接下来,我们来看如何使用这个插件。假设我们有一个全局事件,当某个按钮被点击时,我们希望触发这个事件,并在另一个组件中监听这个事件。
1. 创建事件类
首先,定义一个事件类。例如,我们定义一个简单的CustomEvent
类:
class CustomEvent {
final String message;
CustomEvent({required this.message});
}
2. 设置全局事件分发器
在你的应用的主文件(通常是main.dart
)中,设置全局事件分发器:
import 'package:flutter/material.dart';
import 'package:event_dispatcher_builder/event_dispatcher_builder.dart';
import 'custom_event.dart'; // 导入你定义的事件类
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return EventDispatcherBuilder(
builder: (context, dispatcher) {
return MaterialApp(
title: 'Flutter Event Dispatcher Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(dispatcher: dispatcher),
);
},
);
}
}
3. 触发事件
在需要触发事件的组件中,使用EventDispatcher
来触发事件。例如,在MyHomePage
中:
import 'package:flutter/material.dart';
import 'package:event_dispatcher_builder/event_dispatcher_builder.dart';
import 'custom_event.dart';
class MyHomePage extends StatelessWidget {
final EventDispatcher dispatcher;
MyHomePage({required this.dispatcher});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Event Dispatcher Demo'),
),
body: Center(
child: ElevatedButton(
onPressed: () {
CustomEvent event = CustomEvent(message: "Hello, Event!");
dispatcher.fire(event);
},
child: Text('Trigger Event'),
),
),
);
}
}
4. 监听事件
在需要监听事件的组件中,使用EventDispatcherProvider
和EventDispatcherConsumer
来监听事件。例如,在一个新的页面EventListenerPage
中:
import 'package:flutter/material.dart';
import 'package:event_dispatcher_builder/event_dispatcher_builder.dart';
import 'custom_event.dart';
class EventListenerPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Event Listener Page'),
),
body: EventDispatcherProvider(
create: (context) => EventDispatcher(), // 这里不需要实际的创建,因为我们已经在MyApp中创建了
child: EventDispatcherConsumer<CustomEvent>(
builder: (context, dispatcher, event, child) {
if (event != null) {
return Center(
child: Text('Received Event: ${event.message}'),
);
} else {
return Center(
child: Text('No Event Received Yet'),
);
}
},
),
),
);
}
}
注意:在上面的EventListenerPage
示例中,我们实际上并不需要重新创建一个EventDispatcher
实例,因为我们已经在MyApp
中创建了全局的实例。这里的create
只是为了展示EventDispatcherProvider
的用法,实际使用中你可以忽略它或者传递一个空的构造函数。
为了简化,你可以使用GlobalKey
或者路由来导航到EventListenerPage
,并在那里监听事件。由于EventDispatcher
是全局的,因此在任何页面或组件中都可以触发和监听事件。
希望这个示例能帮助你理解如何使用event_dispatcher_builder
插件进行事件分发管理。如果有进一步的问题,欢迎继续讨论!