bloc_pattern 1.5.0 bloc_pattern: ^1.5.0 copied to clipboard
Apenas um package com bases para implantar o Bloc no seu Código.
Bloc Pattern #
Provider to implement Bloc Pattern in your Flutter code
Start #
Add bloc_pattern
in your pubspec.yaml.
Create a Controller Bloc by implementing BlocBase
and add its streams.
OBS: You can pass the "context" in the Bloc.
import 'dart:async';
import 'package:bloc_pattern/bloc_pattern.dart';
import 'package:rxdart/rxdart.dart';
class BlocController implements BlocBase {
BlocController();
//Stream that receives a number and changes the count;
var _counterController = BehaviorSubject<int>(seedValue: 0);
//output
Stream<int> get outCounter => _counterController.stream;
//input
Sink<int> get inCounter => _counterController.sink;
increment(){
inCounter.add(_counterController.value+1);
}
@override
void dispose() {
_counterController.close();
}
}
Add the Provider in the main widget of your widget tree by passing as your BlocController parameter
...
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return BlocProvider<BlocController>(
child: MaterialApp(
home: MyHomePage(),
),
bloc: BlocController(),
);
}
}
...
Now you can recover your Bloc anywhere in your widget tree with the help of BlocProvider
@override
Widget build(BuildContext context) {
//recovering your Bloc
final BlocController bloc = BlocProvider.of<BlocController>(context);
....
}
Now just use StreamBuilder
to get your streams and change the UI without needing setState
StreamBuilder(
stream: bloc.outCounter,
builder: (BuildContext context, AsyncSnapshot snapshot) {
return Text(
'${snapshot.data}',
style: Theme.of(context).textTheme.display1,
);
},
),
....
floatingActionButton: new FloatingActionButton(
onPressed: bloc.increment,
tooltip: 'Increment',
child: new Icon(Icons.add),
),
}
Bloc Pattern With List #
Provider to implement a List Bloc Pattern in your Flutter code
Start #
Add bloc_pattern
in your pubspec.yaml.
Create one or more Controller Bloc by implementing BlocBase
and add its streams.
import 'dart:async';
import 'package:bloc_pattern/bloc_pattern.dart';
import 'package:rxdart/rxdart.dart';
class BlocControllerOne implements BlocBase {
BlocControllerOne();
//Stream that receives a number and changes the count;
var _counterController = BehaviorSubject<int>(seedValue: 0);
//output
Stream<int> get outCounter => _counterController.stream;
//input
Sink<int> get inCounter => _counterController.sink;
increment(){
inCounter.add(_counterController.value+1);
}
@override
void dispose() {
_counterController.close();
}
}
class BlocControllerTwo implements BlocBase {
BlocControllerTwo();
//Stream that receives a number and changes the count;
var _counterController = BehaviorSubject<int>(seedValue: 0);
//output
Stream<int> get outCounter => _counterController.stream;
//input
Sink<int> get inCounter => _counterController.sink;
increment(){
inCounter.add(_counterController.value+1);
}
@override
void dispose() {
_counterController.close();
}
}
Add the BlocProviderList in the main widget of your widget tree by passing as your BlocController parameter list
...
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return BlocProviderList(
child: MaterialApp(
home: IncrementWidget(),
),
listBloc: [
Bloc(BlocControllerOne()),
Bloc(BlocControllerTwo())
],
);
}
}
...
Now you can recover yours Blocs anywhere in your widget tree with the help of BlocProviderList
@override
Widget build(BuildContext context) {
//recovering yours Blocs
final BlocControllerOne blocOne = BlocProviderList.of<BlocControllerOne>(context);
final BlocControllerTwo blocTwo = BlocProviderList.of<BlocControllerTwo>(context);
....
}
Para mais informações #
Acesse o Blog do Flutterando Clicando aqui.