Flutter隔离区数据管理插件isolate_bloc的使用

Flutter隔离区数据管理插件isolate_bloc的使用

概述

该插件的目标是简化在Flutter应用中使用BLoC（Business Logic Component）和Isolate的方式。与其它BLoC实现不同的是，这个包中的blocs运行在Isolate中，不会拖慢UI。

索引

• 注意事项
• Bloc和Cubit
• 创建
  • IsolateCubit
  • IsolateBloc
• 注册一个Bloc或Cubit
• 在UI中使用Bloc或Cubit
• 全部API
  • IsolateBlocWrapper
  • 初始化
  • 创建新的Bloc实例
  • 使用Bloc
  • Blocs观察者
  • 在另一个Bloc中使用Bloc
  • 使用平台通道
• 示例
• 文章
• 帮助工具
• 致谢

注意事项

建议先了解Isolates的优点和缺点。简而言之，Isolates共享内存，因此不可变对象在传输到另一个Isolate时不会被复制。虽然现在可以放心使用它们，但仍然存在一些限制和开销。

Bloc和Cubit

在Bloc中，事件按顺序处理。它接收一个事件并响应以mapEventToState中的状态流。直到流结束前，新事件的处理不会开始。 在Cubit中，事件在onEventReceived中异步接收，并通过emit函数返回状态。

创建

IsolateCubit

/// 计数器Cubit，使用`CountEvent`和`int`状态。
class CounterCubit extends IsolateCubit<CountEvent, int> {
  /// `CounterCubit`的初始状态为0。
  CounterCubit() : super(0);

  /// 当接收到`CountEvent`时，通过`state`访问当前状态
  /// 并通过`emit`发出新的状态。
  [@override](/user/override)
  void onEventReceived(CountEvent event) {
    emit(event == CountEvent.increment ? state + 1 : state - 1);
  }
}

IsolateBloc

class CounterBloc extends IsolateBloc<CountEvent, int> {
  /// `CounterBloc`的初始状态为0。
  CounterBloc() : super(0);

  /// 当接收到`CountEvent`时，通过`state`访问当前状态
  /// 并通过`yield`发出新的状态。
  Stream<int> mapEventToState(CountEvent event) async* {
    yield event == CountEvent.increment ? state + 1 : state - 1;
  }
}

注册一个Bloc或Cubit

为了能够创建Bloc，需要注册它。可以通过register函数完成。

void main() async {
  await initialize(isolatedFunc);
  ...
}

/// 全局函数用于注册blocs或cubits并在Isolate中调用
void isolatedFunc() {
  /// 注册一个bloc以便在主Isolate中创建
  register<CounterBloc, int>(create: () => CounterBloc());
}

如果不想创建所有注册的blocs的单个实例以获取其初始状态，可以在register函数中提供初始状态。

register<CounterBloc, int>(
  create: () => CounterBloc(), 
  initialState: 0,
)

在UI中使用Bloc或Cubit

YourWidget(
  /// 创建CounterBloc并将其向下传递到小部件树
  child: IsolateBlocProvider<CounterBloc, int>(
    child: CounterScreen(),
  ),
)
...
class CounterScreen extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Counter'),
      ),
      body: Center(
        /// 监听CounterBloc的状态
        child: IsolateBlocListener<CounterBloc, int>(
          listener: (context, state) => print("New bloc state: $state"),
          /// 根据CounterBloc的状态构建小部件
          child: IsolateBlocBuilder<CounterBloc, int>(
            builder: (context, state) {
              return Text('You tapped $state times');
            },
          ),
        ),
      ),
      floatingActionButton: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          FloatingActionButton(
            heroTag: 'Increment',
            /// 使用扩展方法获取bloc并添加新事件
            onPressed: () => context.isolateBloc<CounterBloc, int>().add(CountEvent.increment),
            child: Icon(Icons.add),
          ),
          SizedBox(height: 10),
          FloatingActionButton(
            heroTag: 'Decrement',
            /// 使用provider类获取bloc并添加新事件
            onPressed: () => IsolateBlocProvider.of<CounterBloc, int>(context).add(CountEvent.decrement),
            child: Icon(Icons.remove),
          ),
        ],
      ),
    );
  }
}

完整示例代码

以下是完整的示例代码，展示了如何使用isolate_bloc插件来实现一个简单的计数器应用：

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

Future<void> main(List<String> arguments) async {
  // 初始化Isolate和注册blocs
  await initialize(isolatedFunc);
  runApp(
    MaterialApp(
      home: IsolateBlocProvider<CounterCubit, int>(
        child: CounterScreen(),
      ),
    ),
  );
}

class CounterScreen extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Counter'),
      ),
      body: Center(
        child: IsolateBlocListener<CounterCubit, int>(
          listener: (context, state) => print('New bloc state: $state'),
          child: IsolateBlocBuilder<CounterCubit, int>(
            builder: (context, state) {
              return Text('You tapped $state times');
            },
          ),
        ),
      ),
      floatingActionButton: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          FloatingActionButton(
            heroTag: 'Increment',
            onPressed: () => context
                .isolateBloc<CounterCubit, int>()
                .add(CountEvent.increment),
            child: const Icon(Icons.add),
          ),
          const SizedBox(height: 10),
          FloatingActionButton(
            heroTag: 'Decrement',
            onPressed: () => context
                .isolateBloc<CounterCubit, int>()
                .add(CountEvent.decrement),
            child: const Icon(Icons.remove),
          ),
        ],
      ),
    );
  }
}

Future<void> isolatedFunc() async {
  // 设置Bloc观察者
  IsolateBloc.observer = SimpleBlocObserver();
  // 注册CounterCubit
  register<CounterCubit, int>(create: () => CounterCubit());
}

// 定义CounterCubit
class CounterCubit extends IsolateCubit<CountEvent, int> {
  CounterCubit() : super(0);

  [@override](/user/override)
  void onEventReceived(CountEvent event) {
    emit(event == CountEvent.increment ? state + 1 : state - 1);
  }
}

// 定义CountEvent枚举
enum CountEvent {
  increment,
  decrement,
}

// 定义SimpleBlocObserver用于观察Bloc的行为
class SimpleBlocObserver extends IsolateBlocObserver {
  [@override](/user/override)
  void onClose(IsolateBlocBase bloc) {
    print('New instance of ${bloc.runtimeType}');
    super.onClose(bloc);
  }

  [@override](/user/override)
  void onEvent(IsolateBlocBase bloc, Object? event) {
    print('New $event for $bloc');
    super.onEvent(bloc, event);
  }

  [@override](/user/override)
  void onTransition(IsolateBloc bloc, Transition transition) {
    print('New ${transition.nextState} from $bloc');
    super.onTransition(bloc, transition);
  }

  [@override](/user/override)
  void onError(IsolateBlocBase bloc, Object error, StackTrace stackTrace) {
    print('$error in $bloc');
    super.onError(bloc, error, stackTrace);
  }
}