Flutter状态管理插件stately_core的潜在功能

Stately

Stately 是一个用于创建声明式和可预测状态机的简单 FSM（有限状态机）解决方案。

设计为与流行的 Flutter 状态管理解决方案一起使用，因此无论你使用哪种状态管理方案，都可以轻松集成它！

以下是相关的依赖包：

包名	版本
stately_core
stately_bloc
stately_notifier
stately_riverpod

基本用法

要开始使用 stately_notifier，你可以不依赖任何额外的库，就像这样：

class CounterEvent {
  const CounterEvent(this.value);

  final int value;
}

class CounterValueNotifier extends StatelyChangeNotifier<CounterEvent, int> {
  CounterValueNotifier(super.state);

  [@override](/user/override)
  StatelyGraph<CounterEvent, int> get graph => StatelyGraph<CounterEvent, int>(
        graph: {
          // 定义状态转移逻辑
          'initial': {
            CounterEvent: transition((CounterEvent event, int state) => state + event.value),
          },
        },
      );
}

然后，你可以使用 ValueListenableBuilder 来监听状态变化：

final counter = CounterValueNotifier(0);

class Home extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Column(
      children: [
        // 使用 ValueListenableBuilder 监听状态变化
        ValueListenableBuilder(
          valueListenable: counter,
          builder: (ctx, state, child) {
            return Text(state.toString(), style: Theme.of(context).textTheme.headlineMedium);
          },
        ),
        // 按钮触发事件
        ElevatedButton(
          onPressed: () => counter.add(CounterEvent(1)), // 增加计数
          child: Text('Increment'),
        ),
      ],
    );
  }
}

示例代码

通过以下代码，可以看到如何使用 Stately 插件结合不同的状态管理解决方案。例如，这里我们使用了 stately_notifier 和 ValueListenableBuilder：

// 定义事件类型
class CounterEvent {
  const CounterEvent(this.value);

  final int value;
}

// 自定义状态管理器
class CounterValueNotifier extends StatelyChangeNotifier<CounterEvent, int> {
  CounterValueNotifier(super.state);

  [@override](/user/override)
  StatelyGraph<CounterEvent, int> get graph => StatelyGraph<CounterEvent, int>(
        graph: {
          // 初始状态到下一个状态的转移规则
          'initial': {
            CounterEvent: transition((CounterEvent event, int state) => state + event.value),
          },
        },
      );
}

class Home extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    final counter = CounterValueNotifier(0); // 初始化状态为 0

    return Column(
      children: [
        // 使用 ValueListenableBuilder 显示当前状态
        ValueListenableBuilder(
          valueListenable: counter,
          builder: (ctx, state, child) {
            return Text(state.toString(), style: Theme.of(context).textTheme.headlineMedium);
          },
        ),
        // 按钮点击时触发事件
        ElevatedButton(
          onPressed: () => counter.add(CounterEvent(1)), // 增加计数
          child: Text('Increment'),
        ),
      ],
    );
  }
}