flutter - 全局事件广播event

it2024-04-15  49

这个东西用的挺多的, 比如换肤, 这个页面的用户改变了头像,返回其它页面时, 也要展示新换的头像,等等,

使用EventBus,参考文档

借助event_bus插件

1. 点击换肤

import 'dart:math'; // 导包 import 'package:event_bus/event_bus.dart'; import 'package:flutter/material.dart'; // 定义全局变量 EventBus eventBus; Color themeColor; //颜色列表 final List<Color> themeList = [ Colors.red, Colors.orange, Colors.blue, Colors.pink, Colors.green, Colors.cyan, Colors.purple, ]; // 自定义事件 class ChangeThemeEvent { // 当前的索引 var themeIndex; // 重写构造方法 ChangeThemeEvent(this.themeIndex); } // 启动app void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return ThemeTest(); } } // 测试换肤 class ThemeTest extends StatefulWidget { @override _ThemeTestState createState() => _ThemeTestState(); } class _ThemeTestState extends State<ThemeTest> { @override void initState() { super.initState(); // 赋值 eventBus = EventBus(); // 默认选中第一个颜色 themeColor = themeList[0]; // 一次监听所有的事件 // eventBus.on().listen((event) { // // Print the runtime type. Such a set up could be used for logging. // print(event.runtimeType); // }); // 监听 某个具体的 事件 eventBus.on<ChangeThemeEvent>().listen( (ChangeThemeEvent event) { setState(() { themeColor = themeList[event.themeIndex]; }); }, ); } @override Widget build(BuildContext context) { return MaterialApp( theme: ThemeData( primarySwatch: themeColor, ), home: Scaffold( appBar: AppBar( title: Text("全局广播"), ), body: Container( child: RaisedButton( onPressed: () { eventBus.fire(ChangeThemeEvent(Random().nextInt(7))); }, child: Text("换肤"), ), ), ), ); } }
最新回复(0)