Quelle est la différence entre StatelessWidget et StatefulWidget ?

Question

Accepted Answer

Flutter a deux types de widget fondamentaux : **StatelessWidget** (immuable, sans état interne qui change) et **StatefulWidget** (peut contenir et mettre à jour un état mutable, se reconstruisant quand l'état change). Choisir le bon est fondamental pour construire des interfaces Flutter. ## StatelessWidget — pas d'état changeant ```dart // a StatelessWidget: just describes UI based on its inputs (immutable, no internal state) class Greeting extends StatelessWidget { final String name; const Greeting(this.name); @override Widget build(BuildContext context) { return Text('Hello, $name'); // UI depends only on inputs, never changes itself } } // → use for UI that doesn't change on its own (static content, displays based on inputs) ``` ## StatefulWidget — a un état mutable ```dart // a StatefulWidget: holds STATE that can change → rebuilds the UI when it does class Counter extends StatefulWidget { @override State createState() => _CounterState(); } class _CounterState extends State { int count = 0; // mutable STATE @override Widget build(BuildContext context) { return Column(children: [ Text('Count: $count'), ElevatedButton( onPressed: () => setState(() => count++), // setState → rebuild with new state child: Text('Increment'), ), ]); } } ``` ## setState — la clé de StatefulWidget ```text → setState(() { ... }) tells Flutter the state CHANGED → triggers a REBUILD (build() runs again with the new state, updating the UI) → WITHOUT setState, changing a variable won't update the UI → StatefulWidget = widget config (immutable) + a State object (holds mutable state) ``` ## Choisir ```text STATELESS → UI based purely on inputs; doesn't change itself (most widgets; simpler) STATEFUL → needs to hold/change internal state over time (counters, forms, toggles, animations, anything interactive that changes) → Prefer Stateless when possible (simpler); use Stateful when you need changing state. ``` ## Pourquoi c'est important Comprendre la différence entre StatelessWidget et StatefulWidget est fondamental au développement Flutter car choisir le bon est essentiel pour construire des interfaces fonctionnelles, c'est donc une connaissance fondamentale incontournable. La distinction — **StatelessWidget** (immuable, décrivant l'interface purement basée sur ses entrées, ne changeant jamais d'elle-même) versus **StatefulWidget** (contenant un état mutable qui peut changer, reconstruisant l'interface quand il change) — est l'un des premiers et des plus importants concepts de Flutter, déterminant comment vous construisez n'importe quel widget. Comprendre que **StatelessWidget** convient à l'interface qui ne change pas elle-même (contenu statique, affichages basés sur les entrées — la majorité des widgets, et plus simple) tandis que **StatefulWidget** est nécessaire pour tout ce qui a un état interne changeant (compteurs, formulaires, bascules, éléments interactifs) est essentiel pour choisir correctement. Plus important encore, comprendre **setState** — le mécanisme qui dit à Flutter que l'état a changé, déclenchant une reconstruction pour que l'interface se mette à jour (et que sans lui, changer une variable ne mettra pas à jour l'interface, une erreur très courante chez les débutants) — est fondamental pour que StatefulWidgets fonctionnent. Comprendre qu'un StatefulWidget combine une configuration de widget immuable avec un objet State séparé contenant l'état mutable clarifie sa structure. Le conseil de **préférer StatelessWidget quand c'est possible** (plus simple) et utiliser StatefulWidget uniquement quand un état changeant est nécessaire reflète une bonne pratique. Puisque pratiquement chaque widget Flutter que vous construisez est l'un de ces deux types et choisir correctement (et utiliser setState correctement) est essentiel pour construire des interfaces fonctionnelles et interactives, comprendre StatelessWidget vs StatefulWidget — leur différence, quand utiliser chacun, et le rôle critique de setState — est une connaissance Flutter essentielle et fondamentale, l'un des concepts les plus fondamentaux du développement Flutter que chaque développeur Flutter doit comprendre pour construire des interfaces utilisateur fonctionnelles.