Junior
Mi a különbség a Stateful és Stateless widgetek között?
sobes.tech MI
Válasz az MI-től
-
StatelessWidget:
- Nincs belső állapota, amely idővel változhat.
- A widget paraméterei a létrehozásakor vannak beállítva, és életciklusa során nem változnak.
- Statikus adatok megjelenítésére használják.
- Újrarajzolás csak akkor történik, amikor a szülő widget újraépül.
- A
build()metódussal valósítják meg.
-
StatefulWidget:
- Belső állapottal (
State) rendelkezik, amely eseményekre (felhasználói műveletek, hálózati kérések stb.) reagálhat. - A widget újrarajzolása a
setState()hívásakor történik. - Interaktív elemek és dinamikus adatok megjelenítésére használják.
- Két részből áll: maga a
StatefulWidgetés a hozzá kapcsolódóStateobjektum.
- Belső állapottal (
| Jellemző | StatelessWidget | StatefulWidget |
|---|---|---|
| Állapot | Nincs | Változtatható állapottal (State) |
| Újrarajzolás | Amikor a szülő widget újraépül | Amikor a setState() hívódik |
| Használat | Statikus adatok, nem interaktív elemek | Interaktív elemek, dinamikus adatok |
| Megvalósítás | Csak a build() metódus |
createState() és életciklus metódusok a State-ben |
// StatelessWidget példa
class MyStatelessWidget extends StatelessWidget {
final String text;
MyStatelessWidget({required this.text});
@override
Widget build(BuildContext context) {
return Text(text); // Csak megjeleníti a átadott szöveget
}
}
// StatefulWidget példa
class MyStatefulWidget extends StatefulWidget {
@override
_MyStatefulWidgetState createState() => _MyStatefulWidgetState();
}
class _MyStatefulWidgetState extends State<MyStatefulWidget> {
int _counter = 0; // Belső állapot
void _incrementCounter() {
setState(() {
// Állapot módosítása és újrarajzolás
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('Számláló:'),
Text('$_counter'),
ElevatedButton(
onPressed: _incrementCounter, // Metódus hívása nyomáskor
child: Text('Növel'),
),
],
);
}
}