Tu primer botón
Parte de la sección Cómo hacerla interactiva del Journey de Flutter de Coddy. Lección 1 de 34.
Hasta ahora, tus aplicaciones solo mostraban cosas. En esta sección aprenderás a hacer que respondan, empezando con un botón.
ElevatedButton(
onPressed: () {},
child: Text('Start'),
)child: es lo que muestra el botón, normalmente un Text. onPressed: es lo que ocurre cuando alguien lo toca.
() {} es una función sin nombre: un pequeño fragmento de código que el botón guarda y ejecuta cada vez que lo tocan. El código va entre las llaves. Esta está vacía, así que tocar el botón no hace nada todavía, pero ya se puede pulsar.
Con onPressed: null, el botón aparece en gris y no se puede pulsar. null significa «sin valor»: no hay código que ejecutar.
Desafío
FácilLa aplicación muestra la palabra Start. Conviértela en un ElevatedButton que se pueda pulsar, con Start como elemento secundario. Basta con una función vacía para onPressed.
Pruébalo tú mismo
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
body: Center(
child: Text('Start'),
),
),
);
}
}
Esta lección incluye un breve cuestionario. Empieza la lección para responderlo y registrar tu progreso.
Todas las lecciones de Cómo hacerla interactiva
1Botones
Tu primer botónImprimir en la consolaBotones de texto y contornoBotones con iconosEl botón de acción flotante7Interruptores y deslizadores
Encender y apagar con un interruptorMarcar una casillaElegir un valor con un deslizadorPractica por tu cuenta: Compilador de Flutter online