Sobes.tech
Middle

Qu'est-ce qu'InheritedWidget et comment l'utiliser dans Flutter?

sobes.tech IA

Réponse de l'IA

InheritedWidget est un type spécial de widget dans Flutter qui permet de distribuer efficacement des informations vers le bas dans l’arbre de widgets. Il est utilisé pour fournir des données et des services aux sous-arbres de widgets sans avoir besoin de les transmettre explicitement via les constructeurs de chaque widget intermédiaire.

Caractéristiques clés de InheritedWidget:

  • Distribution efficace des données : Lorsqu’InheritedWidget change, Flutter ne reconstruit automatiquement que les widgets dans le sous-arbre qui en dépendent.
  • Accès simple aux données : Les widgets enfants peuvent accéder aux données d’InheritedWidget via la méthode statique of().
  • Gestion des dépendances : La méthode updateShouldNotify permet de contrôler quand les widgets dépendants doivent être reconstruits.

Comment utiliser InheritedWidget :

  1. Créer une classe héritant de InheritedWidget :

    class MyInheritedWidget extends InheritedWidget {
      const MyInheritedWidget({
        Key? key,
        required this.data,
        required Widget child,
      }) : super(key: key, child: child);
    
      final String data; // Données à distribuer
    
      // Méthode pour obtenir l’instance de InheritedWidget
      static MyInheritedWidget of(BuildContext context) {
        final MyInheritedWidget? result = context.dependOnInheritedWidgetOfExactType<MyInheritedWidget>();
        assert(result != null, 'Aucun MyInheritedWidget trouvé dans le contexte');
        return result!;
      }
    
      // Détermine si les widgets dépendants doivent être notifiés des changements
      @override
      bool updateShouldNotify(MyInheritedWidget oldWidget) {
        return data != oldWidget.data; // Notifie si les données changent
      }
    }
    
  2. Insérer InheritedWidget dans l’arbre de widgets :

    class MyApp extends StatelessWidget {
      const MyApp({super.key});
    
      @override
      Widget build(BuildContext context) {
        return MyInheritedWidget( // Enveloppe le sous-arbre de widgets
          data: 'Bonjour depuis InheritedWidget',
          child: MaterialApp(
            title: 'Démo InheritedWidget',
            home: Scaffold(
              appBar: AppBar(
                title: const Text('Démo InheritedWidget'),
              ),
              body: const Center(
                child: MyDependentWidget(), // Widget qui utilisera les données
              ),
            ),
          ),
        );
      }
    }
    
  3. Accéder aux données depuis un widget enfant :

    class MyDependentWidget extends StatelessWidget {
      const MyDependentWidget({super.key});
    
      @override
      Widget build(BuildContext context) {
        // Accède aux données via la méthode of()
        final String receivedData = MyInheritedWidget.of(context).data;
    
        return Text(
          receivedData,
          style: Theme.of(context).textTheme.headlineMedium,
        );
      }
    }
    

InheritedWidget est la base de nombreuses solutions de gestion d’état dans Flutter, telles que Provider, Bloc. Il offre un moyen efficace et déclaratif d’échanger des données dans l’arbre de widgets.