Flutter BLoC multiple BLoCs same widget

Question

I'm relatively new to Flutter and the BLoC pattern, so I'm still trying to wrap my head around everything.

Let's say I have a quiz app where I have a BLoC called QuestionBloc which uses a repository to fetch questions from a file. Event on QuestionBloc

• FetchQuestion

States on QuestionBloc

• QuestionEmpty
• QuestionLoading
• QuestionLoaded which contains a question object
• QuestionError

I then have another BLoC called QuestionValidatorBloc which is responsible for validating the answers to the question. The answer is entered into a text field and there is a submit button to trigger the validation. Event on QuestionValidatorBloc

• ValidateQuestion

States on QuestionValidatorBloc

• ValidateInitial
• ValidateInProgress
• ValidateSuccess
• ValidateError

This is fairly straight forward. However, now I need to incorporate both QuestionBloc and QuestionValidatorBloc into the same widget since one of them is responsible for fetching and displaying the question and the other for handling the validation action. How can I achieve this?

Answer 1

I assumed you are using the flutter_bloc library. Let the QuestionBloc listen to the QuestionValidatorBloc using StreamSubscription

class QuestionBloc extends Bloc<QuestionEvent, QuestionState> {
  QuestionValidatorBloc questionValidatorBloc;
  StreamSubscription subscription;

  MainPageBloc({@required this.questionValidatorBloc}) {
    subscription= questionValidatorBloc.state.listen((state) {
      if (state is ValidateSuccess) {
        dispatch(YourEvent());
      } else if(state is ValidateError{
        dispatch(AnotherEvent());
      }
    });
  }

...

Now you just have to pass the QuestionValidatorBloc to the QuestionBloc constructor.