Flutter事件监听与管理插件eventified的使用

发布于 1周前 作者 yuanlaile 来自 Flutter

Flutter事件监听与管理插件eventified的使用

Eventified 插件用于将方法调用转换为事件流。更多用法可以查看 eventified_generator。

示例代码

以下是一个简单的示例，展示了如何使用 eventified 插件来创建一个带有事件的方法类。

import 'package:eventified/eventified.dart';

// 使用 [@eventified](/user/eventified) 注解标记该类，使其能够处理事件
[@eventified](/user/eventified)
abstract class Example {
  // 使用 [@Event](/user/Event) 注解标记该方法为一个事件，并添加元数据
  [@Event](/user/Event)(metadata: 'Hello')
  void hello({
    required bool world,
    // 使用 @EventArgument 注解标记参数为事件参数，并添加元数据
    @EventArgument(metadata: 'Name') String? name,
  });

  // 这个方法不会被转换为事件
  void world(String name);
}

完整示例 Demo

下面是一个完整的示例 Demo，展示如何使用 eventified 插件进行事件监听和管理。

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

// 使用 [@eventified](/user/eventified) 注解标记该类，使其能够处理事件
[@eventified](/user/eventified)
abstract class Example {
  // 使用 [@Event](/user/Event) 注解标记该方法为一个事件，并添加元数据
  [@Event](/user/Event)(metadata: 'Hello')
  void hello({
    required bool world,
    // 使用 @EventArgument 注解标记参数为事件参数，并添加元数据
    @EventArgument(metadata: 'Name') String? name,
  });

  // 这个方法不会被转换为事件
  void world(String name);
}

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Eventified Demo')),
        body: Center(
          child: EventifiedDemo(),
        ),
      ),
    );
  }
}

class EventifiedDemo extends StatefulWidget {
  [@override](/user/override)
  _EventifiedDemoState createState() => _EventifiedDemoState();
}

class _EventifiedDemoState extends State<EventifiedDemo> {
  final example = ExampleImpl();

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        ElevatedButton(
          onPressed: () {
            // 触发事件
            example.hello(world: true, name: 'Flutter');
          },
          child: Text('触发事件'),
        ),
        ElevatedButton(
          onPressed: () {
            // 调用非事件方法
            example.world('Flutter');
          },
          child: Text('调用非事件方法'),
        ),
      ],
    );
  }
}

// 实现 Example 类的具体实现
class ExampleImpl with ExampleBase {
  [@override](/user/override)
  void onHello(bool world, String? name) {
    print('Hello event triggered: $world, Name: $name');
  }

  [@override](/user/override)
  void onWorld(String name) {
    print('World method called: $name');
  }
}

更多关于Flutter事件监听与管理插件eventified的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter事件监听与管理插件eventified的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然，下面是一个关于如何在Flutter中使用eventified插件进行事件监听与管理的代码示例。eventified是一个轻量级的事件总线库，用于在Flutter应用中管理事件监听。

首先，你需要在你的pubspec.yaml文件中添加eventified依赖：

dependencies:
  flutter:
    sdk: flutter
  eventified: ^最新版本号 # 请替换为实际的最新版本号

然后运行flutter pub get来安装依赖。

以下是一个简单的示例，展示如何使用eventified来发布和监听事件：

1. 创建一个自定义事件类

首先，创建一个自定义事件类。例如，我们创建一个表示用户登录成功的事件：

// user_login_event.dart
class UserLoginEvent {
  final String username;

  UserLoginEvent({required this.username});
}

2. 设置事件总线

接下来，在你的应用中设置事件总线。通常，你可以在一个单例类中管理事件总线实例：

// event_bus.dart
import 'package:eventified/eventified.dart';
import 'user_login_event.dart';

class EventBus {
  static final EventBus _instance = EventBus._internal();
  final EventBusController _controller = EventBusController();

  factory EventBus() => _instance;

  EventBus._internal();

  // 发布用户登录事件
  void publishUserLogin(String username) {
    _controller.publish(UserLoginEvent(username: username));
  }

  // 订阅用户登录事件
  StreamSubscription<UserLoginEvent> subscribeUserLogin(void Function(UserLoginEvent event) onData) {
    return _controller.subscribe<UserLoginEvent>(onData);
  }

  // 关闭事件总线
  void dispose() {
    _controller.close();
  }
}

3. 发布事件

在你需要发布事件的地方（例如用户登录成功后），发布事件：

// login_service.dart
import 'event_bus.dart';

class LoginService {
  final EventBus eventBus = EventBus();

  void loginUser(String username) {
    // 模拟登录逻辑
    print("User $username logged in");

    // 发布登录事件
    eventBus.publishUserLogin(username);
  }
}

4. 监听事件

在你需要监听事件的地方（例如UI层），订阅并处理事件：

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  final EventBus eventBus = EventBus();
  final LoginService loginService = LoginService();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Eventified Example'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(
                'You have not logged in yet.',
                style: TextStyle(fontSize: 20),
              ),
              SizedBox(height: 20),
              ElevatedButton(
                onPressed: () {
                  loginService.loginUser('JohnDoe');
                },
                child: Text('Login'),
              ),
            ],
          ),
        ),
      ),
    );
  }

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

    // 订阅用户登录事件
    eventBus.subscribeUserLogin((UserLoginEvent event) {
      print("Received user login event for user: ${event.username}");
      // 这里可以更新UI，例如使用setState
      // setState(() {
      //   // 更新UI状态
      // });
    });
  }

  @override
  void dispose() {
    // 取消订阅并关闭事件总线
    eventBus.dispose();
    super.dispose();
  }
}

注意事项

  1. 内存管理：确保在不再需要监听事件时取消订阅，并在适当的时候关闭事件总线，以避免内存泄漏。
  2. 线程安全：eventified是线程安全的，可以在多个隔离（Isolate）中发布和订阅事件。

这个示例展示了如何使用eventified在Flutter应用中进行事件监听与管理。你可以根据需要扩展和修改这个示例以适应你的具体需求。

回到顶部