Jaký je rozdíl mezi StatelessWidget a StatefulWidget?

Question

Accepted Answer

Flutter má dva základní typy widgetů: **StatelessWidget** (nemutabilní, bez interního stavu, který se mění) a **StatefulWidget** (může uchovávat a aktualizovat mutabilní stav, obnovuje se při změně stavu). Volba správného typu je základem pro budování Flutter UI. ## StatelessWidget — bez měnícího se stavu ```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 — má mutabilní stav ```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 — klíč ke 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) ``` ## Volba ```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. ``` ## Proč je to důležité Rozeznání rozdílu mezi StatelessWidget a StatefulWidget je základem Flutter vývoje, protože volba správného typu je nezbytná pro budování funkčních UI – je to povinné fundamentální znalosti. Distinkce – **StatelessWidget** (nemutabilní, popisující UI čistě na základě svých vstupů, nikdy se sám neměnící) versus **StatefulWidget** (uchovávající mutabilní stav, který se může měnit, obnovující UI když se změní) – je jeden z prvních a nejdůležitějších konceptů ve Flutter, určující způsob budování jakéhokoli widgetu. Porozumění tomu, že **StatelessWidget** se hodí pro UI, které se neměnit (statický obsah, zobrazení na základě vstupů – většina widgetů, jednodušší) zatímco **StatefulWidget** je potřeba pro cokoli se měnícím interním stavem (čítače, formuláře, přepínače, interaktivní prvky), je nezbytné pro správnou volbu. Nejkritičtěji, porozumění **setState** – mechanismu, který říká Flutter že se stav změnil, spouští obnovení tak aby se UI aktualizovalo (a že bez něj změní proměnné neaktualizují UI, velmi častá chyba začátečníků) – je fundamentální pro správné fungování StatefulWidgetů. Porozumění tomu, že StatefulWidget kombinuje nemutabilní konfiguraci widgetu se samostatným State objektem uchovávajícím mutabilní stav, objasňuje jeho strukturu. Doporučení **preferovat StatelessWidget když je to možné** (jednodušší) a používat StatefulWidget pouze když je potřeba měnící se stav, odráží dobrou praxi. Protože prakticky každý Flutter widget, který postavíte, je jeden z těchto dvou typů a správná volba (a správné používání setState) je nezbytné pro budování funkčních, interaktivních UI, porozumění StatelessWidget versus StatefulWidget – jejich rozdílu, kdy použít který, a kritické roli setState – je nezbytné, fundamentální Flutter znalosti, jeden z nejzákladnějších konceptů Flutter vývoje, které musí každý Flutter vývojář chápat aby budoval fungující uživatelské rozhraní.