Flutter-在复杂的UI中应该如何进行集团通信？

Question

我想对我很好奇的话题提供一些建议。最佳方法和最佳做法是什么？我试图绘制有关此主题的UI。我正在使用flutter_bloc软件包。

场景：我有一个列表，如图所示，底部有一个得分按钮。如果未在列表中进行选择，则无法激活按钮。当我从列表中选择一个项目时，按钮处于活动状态。当我按下得分按钮时，得分将写入列表中选定的元素，并且得分按钮再次变为非活动状态。

这个用户界面看起来很简单，但是我的问题是用户界面更加复杂。 所以我肯定会在屏幕上使用多个块。

我想知道如何以最佳方式获得集团之间的这种沟通？我应该在顶层创建一个父块吗？

Answer 1

您应该有一个将控制整个屏幕的块。 在您的集团状态下，您可以拥有一个保存所选项目（或其索引-实际由您决定）的属性。您将通过BlocBuilder根据此道具启用/禁用点按钮。 在指向按钮上点击，您只需添加一个事件，例如PointsAssigned(amount: 50)或FiftyPointsAssigned()-再次由您决定。此事件将映射到将点附加到所选项目的状态，并将通过BlocBuilder重建UI，以便您的更改得到体现。

Answer 2

可以在同一上下文中使用多个块。您可以使用MultiBlocProvider中的flutter_bloc 然后，您可以访问这两个bloc数据并交流您在Bloc中定义的内容。

Widget build(BuildContext context) {
   return MultiBlocProvider(
            providers: [
              BlocProvider<TodoBloc>(create: (BuildContext context) => TodoBloc()),
              BlocProvider<PointBloc>(
                  create: (BuildContext context) => PointBloc()),
            ],
            child: Scaffold(
                        ......
                   ),
          );
}

Answer 3

在不知道您当前代码的情况下很难解释。您真的不需要其他集团。您的Todo实例可能具有某种布尔属性onSelected。

Todo(
  final String name;
  final int point;
  final bool onSelected;

  Todo(this.name, this.point, this.onSelected);
)