Bloc Usage with RxDart in Flutter
16-03-2020Events
abstract class CounterEvent {} class IncrementEvent extends CounterEvent{} class DecrementEvent extends CounterEvent{}
Bloc class
class CounterBlocRxDart extends Bloc { int _counter = 0; final _replaySubject = BehaviorSubject<int>(); Stream<int> get counterStream => _replaySubject.stream; final _counterEventSubject = BehaviorSubject<CounterEvent>(); Sink<CounterEvent> get counterEventSink => _counterEventSubject.sink; CounterBlocRxDart() { _counterEventSubject.listen(_mapEventToState); } void _mapEventToState(CounterEvent event) { if (event is IncrementEvent) _counter++; else _counter--; _replaySubject.sink.add(_counter); } @override void dispose() { _replaySubject.close(); _counterEventSubject.close(); } }
Usage
class _MyHomePageState extends State<MyHomePage> { final _bloc = new CounterBlocRxDart(); @override Widget build(BuildContext context) { // This method is rerun every time setState is called, for instance as done // by the _incrementCounter method above. // // The Flutter framework has been optimized to make rerunning build methods // fast, so that you can just rebuild anything that needs updating rather // than having to individually change instances of widgets. return Scaffold( appBar: AppBar( // Here we take the value from the MyHomePage object that was created by // the App.build method, and use it to set our appbar title. title: Text(widget.title), ), body: Center( // Center is a layout widget. It takes a single child and positions it // in the middle of the parent. child: StreamBuilder( stream: _bloc.counterStream, builder: (BuildContext context, AsyncSnapshot<int> snapshot) { if(!snapshot.hasData){ return Center(child: CircularProgressIndicator(),); } return Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[Text('${snapshot.data}')], ); }, )), floatingActionButton: FloatingActionButton( onPressed: () => _bloc.counterEventSink.add(IncrementEvent()), tooltip: 'Increment', child: Icon(Icons.add), ), // This trailing comma makes auto-formatting nicer for build methods. ); } @override void dispose() { _bloc.dispose(); super.dispose(); } }