A distinción entre StatelessWidget e StatefulWidget é fundamental en Flutter e determina como se comportan os teus widgets cando os datos da interface cambian.
🧱 StatelessWidget (Widgets sen estado)
Úsase cando o contido do widget non necesita cambiar mentres a app está en execución.
- Non teñen estado interno que poida cambiar durante a vida da aplicación.
- Son máis sinxelos e eficientes.
- Exemplos:
Text(o texto non cambia a menos que lle pases un texto novo),Icon,Image,Container.
Cando usalos: Cando a información que mostra o widget é fixa ou só depende dos parámetros que se lle pasaron.
class SaudoFixe extends StatelessWidget {
const SaudoFixe({super.key});
@override
Widget build(BuildContext context) {
return const Text('Ola, mundo!');
}
}
🔁 StatefulWidget (Widgets con estado)
Úsase cando o widget debe actualizar a súa interface como resultado dunha acción (premer un botón, introducir texto, etc.).
- Exemplos:
Checkbox(o seu estado «marcado/desmarcado» cambia),TextField(o texto que o usuario escribe cambia), un contador que se incrementa. - Estrutura: Un
StatefulWidgetdivídese en dúas clases: o propioStatefulWidgete a claseStateasociada. A claseStateé onde se garda o estado mutable e onde se define o métodobuild()que crea a UI.
Cando usalos: Cando o widget necesita cambiar a súa aparencia ou os seus datos sen ser totalmente substituído.
class Contador extends StatefulWidget {
const Contador({super.key});
@override
State<Contador> createState() => _ContadorState();
}
class _ContadorState extends State<Contador> {
int _valor = 0;
void _incrementar() {
setState(() {
_valor++;
});
}
@override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('Valor actual: $_valor'),
ElevatedButton(
onPressed: _incrementar,
child: const Text('Incrementar'),
),
],
);
}
}