Diferencia entre revisiones de «Flutter Hola Mundo»

Revisión del 13:44 15 sep 2024

En este apartado vamos a ejecutar nuestra primera aplicación Flutter escrita en lenguaje DART.

El código no lo vamos a escribir nosotros :) y ya aparece al crear un nuevo proyecto.

Es el equivalente al 'Hola Mundo' que se explica en cualquier lenguaje de programación y lo empleamos para comprobar que todo funciona correctamente.

Como expliqué en los puntos anteriores de esta sección, necesitamos tener todo instalado y un emulador creado.

Primera aplicación en Flutter
Iniciamos el Android Studio o si ya estamos en un proyecto, creamos uno nuevo en File-> New Flutter Proyect.
Escogemos la opción Flutter Application.
La demos un nombre al proyecto y si no aparece, debemos de indicar la ruta al SDK Flutter, como ya vimos durante la instalación.
Indicamos el nombre del paquete asociado al proyecto (todas las aplicaciones tienen que tener un nombre de paquete único. Normalmente se suele poner el dominio de la compañía más el nombre de la aplicación, por ejemplo, com.google.maps). Las otras dos opciones sirven por si queremos añadir dentro de nuestra aplicación en lenguaje DART, código en el lenguaje Kotlin para aplicaciones Android o código en el lenguaje Swift para IOS.
Una vez creado el proyecto aparecerá un código de muestra de una aplicación la cual la podemos ejecutar (si tenemos instalado previamente un emulador). Si disponemos de emulador podremos elegirlo en la parte superior y presionar el botón de 'Play' para ejecutarla.
Si presionamos el botón flotante, el contador se incrementará.

Primera aplicación en Flutter en VS Code
Abrimos la paleta de VSCode. Lo podemos hacer desde el menú superior => View => Command Palette o pulsando la combinación de teclas Control+Shift+N. Escribimos flutter y escogemos la opción Nuevo proyecto Flutter.
Escogemos la opción Empty Project si queremos empezar con una aplicación vacía, Application si queremos que el proyecto se cree con una base o template ya hecho con un código de ejemplo, o la opción Skeleton Templates, que son plantillas ya hechas con código (por ejemplo en https://github.com/flutter/samples). En el ejemplo a seguir escogemos la opción Application.
Escogemos el directorio donde se van a crear los proyectos Flutter.
Indicamos el nombre que va a llevar la aplicación (proyecto) y pulsamos enter. Si aparece un mensaje de si queremos confiar (trust) en el autor debemos escoger si (YES).
Teniendo un emulador previamente creado podemos lanzarlo antes de iniciar la aplicación o al ejecutarla ya indicará si queremos ejecutarla en un emulador o en la propia máquina.
Una vez creado el proyecto aparecerá un código de muestra de una aplicación la cual la podemos ejecutar (si tenemos instalado previamente un emulador). Debemos de estar situados en dicho archivo (main.dart)
Si presionamos el botón flotante, el contador se incrementará.

@@ Línea 19: / Línea 19: @@
-br />
 <br />
 ===VS Code===
 <gallery caption="Primera aplicación en Flutter en VS Code" widths="350" heights="300px" perrow="2">