Créer des BLoC avec flutter

Créer des BLoC avec Flutter

Une fois que vous maîtrisez BLoC avec flutter, tout n’est pas fini. En fait, tout commence réellement maintenant parce que les application que vous pouvez créer actuellement sont simples et sans structure. Elles vont consommer beaucoup de ressources pour une simple action et elle seront difficiles à relire par la suite.

BLoC signifie Business Logic Component et a été introduit en 2018.

Pourquoi utiliser BLoC?
Bonne question puisque nous savons déjà plus ou moins coder des applications simples; pourquoi s’embêter à apprendre un nouveau système qui paraît à la lecture compliqué.

Le BLoC permet en fait de distinguer le front-end du back-end. Ceci va nous permettre après d’avoir une vision beaucoup plus claire du code pour pouvoir faire des modifications surtout quand vous travaillez en équipe ou bien pour le futur dans le cas ou votre application deviendrait plus complexe.

Comment fonctionne le BLoC?
La spécificité du BLoC est sa manière de gérer le back-end donc de voir comment il fonctionne avec le schéma suivant:
INSERER UN SCHEMA

Toutes les pages doivent avoir un fichier bloc par exemple votre login page , votre profile page.

Tout commence par un EVENT -> BLoC -> State
Donc on va commencer par écrire notre page EVENT.

Pour utiliser les BLoc, il est impératif de maîtriser les notions suivantes:

  1. Stream
  2. Sink
  3. Inherited widget: par exemple Thème.of(context)

Comme dans tout processus d’apprentissage, il est utile de saisir le fonctionnement du BLoC avec un projet simple.

::Qu’est ce qu’un stream ?::
Un stream est un tuyau avec une entrée et une sortie. On va y insérer des données par un bout et on va « écouter » ce qui en sort de l’autre.
Pour réellement saisir ce qu’est un stream, vous devez vous dire que c’est un flux ininterrompu de données.
Pour le contrôler on va utiliser un StreamController

Comment insérer une valeur dans le stream?
Pour insérer une valeur add.

Comment écouter un stream?
On va utiliser la fonction stream.listen

Important:
Quand on commence à utiliser un stream, il faut prévoir aussi le moment ou on va arrêter de l’utiliser notamment avec la fonction streamSubscription.cancel sinon votre application risque de perdre des données.

::Prérequis pour utiliser les streams:::
D’abord vous allez avoir besoin d’importer le Dart:async package. Async signifie asynchrone qui veut dire que le rythmes d’informations sont égaux. Par exemple quelque chose de périodique va être synchrone comme une vague sur un rivage, le rythme est régulier.

Or si dans notre application tout ne sera pas constant par exemple si un utilisateur publie une information cela peut arriver à tout moment, il ne va pas y avoir une publication toute les 10 secondes exactement. Donc notre fonction va être asynchrone.

Dans le cas présent nous allons lier notre tuyau avec l’import async: des fois il y aura de l’eau dans notre tuyau, des fois, il n’y aura rien.

::Qu’est ce qu’un inherited widget?::
Comment créez votre premier BLoC?
Tout d’abord créez un nouveau projet dans flutter avec votre IDE favori (si vous ne savez pas ce qu’est un IDE, vous ne devriez pas être sur cette page mais sur celle-ci).

::La structure des BLoC:::
Le fichier BLoC est composé de la manière suivante:
Un fichier bloc/users_state.dart : qui indique l’Etat loading, done error
Un fichier bloc/users_event.dart : qui indique la fonction qu’on veut exécuter.
Un fichier bloc/users_bloc.dart : qui va relier nos deux fichiers.

Oui mais d’accord on utilise mapEventToState pour répartir les événements mais

  • – Comment passer de la data entre les pages?
  • – Comment on gère la data qui doit s’initialiser au démarrage

Laisser un commentaire