Primera App con Flutter

La presente aplicación móvil es una básica, desarrollada para entender como es la dinámica con Flutter, usaremos el IDE de desarrollo Android Studio de Google, también se puede utilizar Visual Studio Code de Microsoft previa configuración e integración del SDK de Flutter tanto en Android Studio como en Visual Studio Code.

Desarrollando mi Primera App con Flutter

Antes de empezar con nuestra App, repito debemos de haber instalado y configurado Flutter es decir el SDK de Flutter para poder probar y escribir código Dart con Flutter.

El lenguaje de programación para Flutter es Dart. en su versión 2. Por experiencia puedo decirles que Dart es muy parecido a Javascript, este lenguaje nos permite trabajar en simultáneo el diseño como la lógica, es decir nos permite desarrollar mucho más rápido un proyecto.

HOLA MUNDO EN FLUTTER

¿Cómo hacer hola mundo en Flutter?

Al crear un nuevo proyecto, borramos todo lo que viene por default en main.dart  y digitamos el siguiente código para obtener un Hola mundo. Además de ello, debemos borrar al archivo que se encuentra dentro de la carpeta test.

El archivo principal llamado main.dart 

Veamos el código

• Realizamos un import para instanciar materialApp en nuestra app
• Levantamos runApp para ejecutar el widget principal
• El widget retorna MaterialApp donde tenemos:
  • theme : determina los colores de la app
  • home : instancia un Scaffold el contendrá varios widgets como :appBar, Body, etc..
• En el widget body creamos un widget Center este contendrá un widget hijo Text donde asignamos un Texto "Hola Mundo con Flutter", además podemos agregar estilos como color, tamaño de fuente, etc.

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(       
        //title: 'Flutter Demo',
        theme: ThemeData(
          primaryColor: Colors.indigo,
        ),
        home: Scaffold(
          appBar: AppBar(
            title: Text("Mi Primera App"),
          ),
          body: Center(
            child: Text(
              "Hola Mundo con Flutter!!!",
              style: TextStyle(color: Colors.amber, fontSize: 60),
            ),
          ),
        ));
  }
}

Y colorin colorado este cuento se ha acabado... bueno, fuera de bromas esta es nuestra primera app. Para llegar a dominar el desarrollo de aplicaciones con Flutter recomiendo lo siguiente:

• Práctica, mucho práctica
• Googlear códigos de Flutter, estudiar como los han desarrollado
• Probar dichos códigos, modificarlos, mejorarlos 
• Leer la documentación https://flutter.dev/
• Aprender a usar y asistenciar los paquetes: https://pub.dev/
• Y no rendirse nunca jamas, al final siempre obtendremos frutos.

Leido 12039 veces