Flutter - Как должно быть blo c коммуникаций в сложном интерфейсе?

Question

Мне нужен совет по поводу топи c, который мне интересен. Каков наилучший способ и лучшая практика? Я попытался нарисовать пользовательский интерфейс об этом topi c. Я использую пакет flutter_blo c.

Сценарий : у меня есть список, показанный на картинке, и внизу есть кнопки оценки. Кнопки не активны без выбора в списке. Кнопки активны, когда я выбираю элемент из списка. Когда я нажимаю кнопку оценки, оценка записывается в выбранный элемент списка, и кнопки оценки снова становятся неактивными.

Этот интерфейс выглядит простым, но моя проблема в более сложном интерфейсе. Так что я определенно буду использовать более одного блока c на экране.

Интересно, как наилучшим образом получить эту связь между блоками? Должен ли я создать родительский блок на верхнем слое?

Answer 1

У вас должен быть один блок c, который будет контролировать весь экран. В вашем состоянии blo c у вас может быть свойство, которое содержит выбранный элемент (или его индекс - действительно зависит от вас здесь). Ваши точечные кнопки будут включены / отключены на основе этого реквизита через BlocBuilder. Нажимая на кнопку точки, вы просто добавляете событие, например PointsAssigned(amount: 50) или FiftyPointsAssigned() - снова на ваше усмотрение. Это событие будет сопоставлено с состоянием, в котором точки прикреплены к выбранному элементу, и перестроит пользовательский интерфейс с помощью BlocBuilder, чтобы ваши изменения были отражены.

Answer 2

Трудно объяснить, не зная, как выглядят ваши текущие коды. Тебе не нужен дополнительный блок c. Ваш экземпляр Todo может иметь какое-то свойство bool onSelected.

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

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

Answer 3

Multiple Blo c могут быть использованы в том же контексте. Вы можете использовать MultiBlocProvider из flutter_bloc Затем вы можете получить доступ к данным blo c и передавать все, что вы определили в Blo c.

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