Menu
CoddyTech

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.

challenge icon

Desafío

Fácil

La 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'),
        ),
      ),
    );
  }
}
quiz iconPonte a prueba

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

Practica por tu cuenta: Compilador de Flutter online