flutter bloc tutorial code example
Example 1: bloc flutter
dependencies:
flutter_bloc: ^4.0.1
Example 2: flutter counter app with block library
import 'package:equatable/equatable.dart';
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:bloc/bloc.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
abstract class CounterEvent extends Equatable {
const CounterEvent();
@override
List<Object> get props => [];
}
class IncrementEvent extends CounterEvent {}
class DecrementEvent extends CounterEvent {}
class CounterState extends Equatable {
final int counter;
const CounterState({@required this.counter});
@override
List<Object> get props => [counter];
}
class CounterBloc extends Bloc<CounterEvent, CounterState> {
CounterBloc() : super(CounterState(counter: 0));
@override
Stream<CounterState> mapEventToState(CounterEvent event) async* {
print(event.toString());
if (event is IncrementEvent) {
print("inc");
yield CounterState(counter: state.counter + 1);
} else if (state is DecrementEvent) {
yield CounterState(counter: state.counter - 1);
}
}
}
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: BlocProvider<CounterBloc>(
create: (context) => CounterBloc(),
child: Home(
title: "test",
),
),
);
}
}
class Home extends StatefulWidget {
Home({Key key, this.title}) : super(key: key);
final String title;
@override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
@override
Widget build(BuildContext context) {
final CounterBloc counterBloc = BlocProvider.of<CounterBloc>(context);
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: BlocBuilder<CounterBloc, CounterState>(
builder: (context, state) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'You have pushed the button this many times:',
),
Text(
state.counter.toString(),
style: Theme.of(context).textTheme.headline4,
),
],
),
);
},
),
floatingActionButton: FloatingActionButton(
onPressed: () {
print("click");
counterBloc.add(IncrementEvent());
},
tooltip: 'Increment',
child: Icon(Icons.add),
),
);
}
}