带有 flutter 块的控制小部件

Question

Project

Hi, I recently discovered flutter bloc and now I'm trying to understand how exactly this works. My goal is to separate logic from widget classes in order to easily manage my projects.

Problem

I'm stuck with something that is very simple using classic setState, but I was trying to achieve this with bloc.

Here is an old widget of mine

Widget build(BuildContext context) {
 return AnimatedOpacity(
   duration: Duration(milliseconds: 200),
   opacity: _opacity,
   curve: Curves.easeInOut,
   child: Text(
     _currentTitle,
     style: TitleTextStyle,
   ),
 );
}

Is it possible to control _opacity and _currentTitle from a bloc? Something like this:

List<String> titles = ['title1', 'title2', ....];
int myIndex;

@override
Stream<SomeBlocState> mapEventToState(SomeEvent event,) 
async* {

....
if (event is SomeSpecificEvent)
  setWidgetTitle(titles[myIndex]);
....
}

I am trying to avoid buiding different state for each possible title, that would be a mess

Thanks

Answer 1

You can try and make the title widget build in a StreamBuilder instead. That will give you a clean separation of responsibilities. So that the BLoC doesn't know of any state changes or widget specific things.

Widget build(BuildContext context) {
 return AnimatedOpacity(
      duration: Duration(milliseconds: 200),
      opacity: _opacity,
      curve: Curves.easeInOut,
      child: StreamBuilder<String>(
        stream: myBloc.title,
        builder: (_, snap) {
          return Text(
            snap?.data ?? 'Some default',
            style: TitleTextStyle,
          );
        }
      ),
    );
}

And you create some logic in your BLoC that emits the title as needed

List<String> titles = ['title1', 'title2', ....];
int myIndex;
final _myObservableTitles = PublishSubject();

Stream<String> get title => _myObservableTitles.stream;

....
if (event is SomeSpecificEvent)
  _myObservableTitles.add(titles[myIndex]);
....