0

我正在使用 cubit 来管理小部件的状态，并且我只想在发出特定类型的状态时才更新小部件。

part of 'TestData.dart';

@immutable
abstract class TestState {}

class TestInitial extends TestState {}

class TestValueUpdated extends TestState {
  TestValueUpdated(this.message);
  
  final String message;

  @override
  bool operator ==(Object other) {
    return other is TestValueUpdated && other.message == message;
  }

  @override
  int get hashCode => message.hashCode;
}

class TestScaleUpdated extends TestState {
  TestScaleUpdated(this.message);

  final String message;

  @override
  bool operator ==(Object other) {
    return other is TestScaleUpdated && other.message == message;
  }

  @override
  int get hashCode => message.hashCode;
}

我创建了一个名为的状态类TestState，这个类目前有 3 个状态：初始、值更新、比例更新

class TestData extends Cubit<TestState> {

//Codes here

  Future<void> keepPlayStatus() async {
    emit(TestValueUpdated(getTimeStamp()+" / "+getMaxTime()+"  |  "+getPosition()));
  }

  Future<void> updateScaleValueMessage() async {
    emit(TestScaleUpdated((size * 100).round().toInt().toString() + " %"));
  }
}

这个类叫做TestDatausesTestState和 extends Cubit。

基本上，当用户通过捏屏幕更新缩放值时，这个类会发出TestScaleUpdated状态，当用户播放某些东西时，它会发出TestValueUpdated状态。

在 UI 中，

//somewhere of the codes, called widget A
child: BlocBuilder<TestData, TestState>(
  builder: (context, state) {
    if(state is TestValueUpdated) {
      return Text(
        state.message,
        textAlign: TextAlign.end,
        style: TextStyle(color: ThemeManager.getRGBfromHex(0x514745)),
      );
    } else {
      return Text(
        "00:00.000 / 00:04.800 | 1.1.1",
        textAlign: TextAlign.end,
        style: TextStyle(color: ThemeManager.getRGBfromHex(0x514745)),
      );
    }
  },
)

//the other part of the codes, called widget B
child: BlocBuilder<TestData, TestState>(
  builder: (context, state) {
    if(state is TestScaleUpdated) {
      return Text(
        state.message,
        textAlign: TextAlign.center,
        style: TextStyle(color: ThemeManager.getRGBfromHex(0x514745)) ,
      );
    } else {
      return Text(
        "100 %",
        textAlign: TextAlign.center,
        style: TextStyle(color: ThemeManager.getRGBfromHex(0x514745)) ,
      );
    }
  },
)

我试过这段代码。TestData这 2 个小部件在发出某些状态时会更新其状态。这段代码的问题是，如果用户播放某些东西，由于TestScaleUpdated不会发出状态，小部件 B 的状态会回到初始状态，始终显示“100 %”。

如果用户更新比例，则TestValueUpdated不会发出，因此小部件 A 将始终具有初始状态，显示“00:00.000 / 00:04.800 | 1.1.1”。

所以我现在要执行的是，我想让小部件忽略状态更新。例如，在BlocBuilder

(context, state) {
  if(state is TestScaleUpdated) {
    return Text("Scale!");
  else if(state is TestInitial) {
    return Text("Initial!");
  } else {
    //ignore, or keep widget's status
  }
}

这里的问题，如果我解释得更详细一点，是这样的：假设用户玩了一些东西，所以小部件 A 的文本更改为00:10.000 / 00:40.000 | 2.0.0。

然后，当用户尝试更改比例值时，不仅小部件 B 受到影响，而且小部件 A 也受到影响。但是由于TestData只发出TestScaleUpdated状态，小部件 A 的文本会返回到00:00.000 | 00:04.800 | 1.1.1它应该保留其文本和状态的状态。

我只想在发出时更新小部件 B，并在发出时只TestScaleUpdated更新小部件 A。TestValueUpdated简单地说，用一个肘类以不同的方式管理 2 个或更多小部件。

我是否必须将这 2 个状态合并TestScaleUpdated为TestValueUpdated1 个状态，每个小部件包含 2 个状态message？

或者如果发出的状态不满足特定条件，我可以保留小部件的状态吗？

4

1 回答 1

1

我将创建一个包含所有必需信息的状态。但是，如果您只希望小部件仅在某些情况下重建，那么您可以为小部件 A 这样做：

BlocBuilder<TestData, TestState>(
  buildWhen: (oldState, newState) => newState is TestValueUpdated;
  builder: (context, state) {
      return Text(
        state is TestValueUpdated ? state.message : "00:00.000 / 00:04.800 | 1.1.1",
        textAlign: TextAlign.end,
        style: TextStyle(color: ThemeManager.getRGBfromHex(0x514745)),
      );
  },
)
于 2021-05-20T16:24:47.903 回答