2022-07-14 11:55:49 +01:00

174 lines
4.7 KiB
Markdown

<!--
* Copyright (C) 2022 WYATT GROUP
* Please see the AUTHORS file for details.
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
-->
# Flutter - BloC Helper
<p align="left">
<a href="https://git.wyatt-studio.fr/Wyatt-FOSS/wyatt-packages/src/branch/master/packages/wyatt_analysis">
<img src="https://img.shields.io/badge/Style-Wyatt%20Analysis-blue.svg?style=flat-square" alt="Style: Wyatt Analysis" />
</a>
<img src="https://img.shields.io/badge/SDK-Flutter-blue?style=flat-square" alt="SDK: Flutter" />
</p>
BloC Pattern utilities for Flutter.
## Using
### Mixin Helper
In any custom screen you can get quick access to bloc or repository by using the mixin helper.
```dart
add(context, CounterIncrement());
// or, if you want to use Cubit
bloc(context).increment();
```
> Note: in this context `bloc` returns a Cubit instance.
```dart
final repository = repo<CounterRepository>(context);
```
### Only BlocProvider
If you want to use only `BlocProvider` you have to extends `BlocProviderScreen` or `CubitProviderScreen` depending on your use case.
```dart
class CounterPage extends BlocProviderScreen<CounterBloc, CounterEvent, CounterState> {
const CounterPage({super.key});
//...
}
// or, if you want to use Cubit
class CounterPage extends CubitProviderScreen<CounterCubit, CounterState> {
const CounterPage({super.key});
//...
}
```
Then, create a Bloc or Cubit instance by implementing the `create` method.
```dart
@override
CounterBloc create(BuildContext context) => CounterBloc();
// or, if you want to use Cubit
@override
CounterCubit create(BuildContext context) => CounterCubit();
```
Finaly, you have to implement the `buildChild` method to build your screen.
```dart
@override
Widget buildChild(BuildContext context) {
// return ...
}
```
> Note: here, you can use BlocBuilder, BlocListener,... and access Bloc and Repository instance with the mixin helper.
### Only BlocConsumer
If you want to use only `BlocConsumer` you have to extends `BlocConsumerScreen` or `CubitConsumerScreen` depending on your use case.
> Note: using directly `BlocConsumer` assumes you have already provided a Bloc or Cubit instance.
```dart
class CounterPage extends BlocConsumerScreen<CounterBloc, CounterEvent, CounterState> {
const CounterPage({super.key});
}
// or, if you want to use Cubit
class CounterPage extends CubitConsumerScreen<CounterCubit, CounterState> {
const CounterPage({super.key});
}
```
Then, just implement the `onBuild` method to build your screen.
```dart
@override
Widget onBuild(BuildContext context, CounterState state) {
return Text(state.count.toString());
// or... more complex widgets
}
```
If needed, you can wrap what depends on the state with the function `onWrap`.
```dart
@override
Widget onWrap(BuildContext context, Widget child) {
return Scaffold(
appBar: AppBar(
title: const Text('Title'),
),
body: child,
);
```
> Note: you can override `onBuild`, but also `onListen`, `shouldBuildWhen` and `shouldListenWhen` methods.
### Both BlocProvider and BlocConsumer
You can use both `BlocProvider` and `BlocConsumer` in the same screen, with the `BlocScreen` or `CubitScreen` depending on your use case.
```dart
class CounterPage extends BlocScreen<CounterBloc, CounterEvent, CounterState> {
const CounterPage({super.key});
}
// or, if you want to use Cubit
class CounterPage extends CubitScreen<CounterCubit, CounterState> {
const CounterPage({super.key});
}
```
Then, you can create a Bloc or Cubit instance by implementing the `create` method.
```dart
@override
CounterBloc create(BuildContext context) => CounterBloc();
// or, if you want to use Cubit
@override
CounterCubit create(BuildContext context) => CounterCubit();
```
And, finally, just implement the `onBuild` method to build your screen.
```dart
@override
Widget onBuild(BuildContext context, CounterState state) {
return Text(state.count.toString());
// or... more complex widgets
}
```
> Note: check **BlocProvider** and **BlocConsumer** documentation for more information.
You'll find a more examples in the `example/lib/counter/` directory.