-
-
Save felangel/1e5b2c25b263ad1aa7bbed75d8c76c44 to your computer and use it in GitHub Desktop.
import 'package:flutter/material.dart'; | |
import 'package:bloc/bloc.dart'; | |
import 'package:flutter_bloc/flutter_bloc.dart'; | |
import 'package:meta/meta.dart'; | |
void main() => runApp(MyApp()); | |
class MyApp extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) { | |
return BlocProvider( | |
create: (context) => DataBloc(), | |
child: MaterialApp( | |
home: Home(), | |
), | |
); | |
} | |
} | |
class Home extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
appBar: AppBar(title: Text('Home')), | |
body: BlocListener<DataBloc, DataState>( | |
listener: (context, state) { | |
if (state is Success) { | |
Scaffold.of(context).showSnackBar( | |
SnackBar( | |
backgroundColor: Colors.green, | |
content: Text('Success'), | |
), | |
); | |
} | |
}, | |
child: BlocBuilder<DataBloc, DataState>( | |
builder: (context, state) { | |
if (state is Initial) { | |
return Center(child: Text('Press the Button')); | |
} | |
if (state is Success) { | |
return Center(child: Text('Success')); | |
} | |
return Center(child: CircularProgressIndicator()); | |
}, | |
), | |
), | |
floatingActionButton: Column( | |
crossAxisAlignment: CrossAxisAlignment.end, | |
mainAxisAlignment: MainAxisAlignment.end, | |
children: <Widget>[ | |
FloatingActionButton( | |
child: Icon(Icons.play_arrow), | |
onPressed: () { | |
context.read<DataBloc>().add(FetchData()); | |
}, | |
), | |
], | |
), | |
); | |
} | |
} | |
@immutable | |
abstract class DataEvent {} | |
class FetchData extends DataEvent {} | |
@immutable | |
abstract class DataState {} | |
class Initial extends DataState {} | |
class Loading extends DataState {} | |
class Success extends DataState {} | |
class DataBloc extends Bloc<DataEvent, DataState> { | |
DataBloc() : super(Initial()) { | |
on<FetchData>((event, emit) async { | |
emit(Loading()); | |
await Future.delayed(Duration(seconds: 2)); | |
emit(Success()); | |
}); | |
} | |
} |
as a newbie getting...lib/main.dart:78:7: Error: The superclass, 'Bloc', has no unnamed constructor that takes no arguments.
class DataBloc extends Bloc<DataEvent, DataState> {..
sample code is not working out of the box...
@bsanderson1981 sorry for the inconvenience! Just updated the snippet to support the latest version of bloc, hope that helps! ๐
Felix, as always your the best in your quick response.
Felix cubit questions. not getting any reply to mt stackoverflow question.
I have one variable that my cubit work with today dec/increment. But this one variable base for calculating two other variables on my app display .
emit(CounterCubitIncreased(
totalbagels: (state.totalbagels + 1), // this is in the cubit state
dozcount: ((state.totalbagels +1) ~/ 13),
singcount: ((state.totalbagels +1) % 13),
));
I cannot find an example of using cubit in muitiple variable states.
is cubit design for only one object to track and change state? or do I need a cubitA cubitB cubitC for each above counters totalbagels dozcount and singcount?
thanks
@bsanderson1981 each cubit is associated with a single state object but you can control what that state object looks like. In this case you could break it up into three different objects and have three cubits but if it's all managing state for a single feature I would recommend restructuring your state to look like:
class BagelState {
const BagelState({
this.totalCountA = 0,
this.totalCountB = 0,
this.totalCountC = 0,
});
final int totalCountA;
final int totalCountB;
final int totalCountC;
BagelState copyWith({
int totalCountA,
int totalCountB,
int totalCountC,
}) {
return BagelState(
totalCountA: totalCountA ?? this.totalCountA,
totalCountB: totalCountB ?? this.totalCountB,
totalCountC: totalCountC ?? this.totalCountC,
}
}
Hope that helps ๐
thank you for help.. i will try to implement this... l will have to play with it. still learning class / oop. maybe a future tutorial on cubit managing multiple states would be great ...
nice