👆 Que sucede ao premer?

onPressed recibe unha función sen parámetros que non devolve ningún valor: un callback void Function(). Flutter executaraa cando premamos o botón.

Dentro da clase da pantalla podemos escribir un método:

void saudar() {
  debugPrint('Ola, Diego!'); // Mensaxe na consola de depuración.
}

Despois, dentro de build, podemos pasar o método polo nome ou escribir unha función anónima:

ElevatedButton(
  onPressed: saudar, // Pasamos a función; non escribimos saudar().
  child: const Text('Saudar'),
)

ElevatedButton(
  onPressed: () {
    debugPrint('Ola, Diego!'); // Executarase ao premer.
  },
  child: const Text('Saudar'),
)

onPressed: null desactiva o botón. onPressed: () {} deixa o botón activo, pero sen facer nada.

📌 debugPrint escribe na consola; non mostra texto na pantalla. No Tema 3.3 veremos como actualizar a interface ao premer un botón.

🔘 Escoller un botón

Nos botóns de texto, child contén o texto ou outro widget. En IconButton, usamos icon. Variantes como ElevatedButton.icon combinan unha icona e unha etiqueta.

🧪 Exemplo completo

Preme os botóns e observa a consola de DartPad ou a consola de depuración de VS Code.

🔗 DartPad:

• https://dartpad.dev/?id=8426f965515363f6b8022b413064b3f0.

🎨 Cambiar o estilo

Dentro do botón, styleFrom permite configurar cores, espazos ou bordos sen construír un estilo máis complexo:

ElevatedButton(
  onPressed: () => debugPrint('Saúdo de Diego'),
  style: ElevatedButton.styleFrom(
    backgroundColor: Colors.blue,
    foregroundColor: Colors.white, // Cor do texto e das iconas.
  ),
  child: const Text('Saudar'),
)

➕ Botón flotante

FloatingActionButton destaca unha acción principal e colócase en floatingActionButton do Scaffold. Veremos as súas variantes, posicións e un exemplo completo no Tema 3.4.

📚 Consulta:

• FloatingActionButton → https://api.flutter.dev/flutter/material/FloatingActionButton-class.html.