Ir al contenido

Guía de Flutter para novatos - Miguel Páramos

FAQ sobre Flutter pal que no tiene ni idea de Flutter | 2º DAM · PMDM

Estructura inicial ( void main y runApp ): ¿Es obligatorio el nombre de la clase MainApp ?

Al iniciar una aplicación de Flutter, solemos encontrarnos con una estructura base similar a esta:

void main() { // Punto de entrada oficial de toda aplicación en Dart y Flutter
runApp(const MainApp()); // Arranca la app e infla el widget raíz en pantalla
} // Fin de la función main
class MainApp extends StatelessWidget { // Widget raíz inmutable que hereda de StatelessWidget
const MainApp({super.key}); // Constructor constante que reenvía la clave identificadora
@override // Sobreescritura obligatoria del método build de StatelessWidget
Widget build(BuildContext context) { // Construye la jerarquía visual del widget
return const MaterialApp( // Configura el sistema de diseño Material Design global
home: Scaffold( // Proporciona la estructura visual base de pantalla
body: Center( // Centra su componente hijo en los ejes vertical y horizontal
child: Text('Hello World!'), // Muestra el mensaje de texto en pantalla
), // Fin del widget Center
), // Fin del widget Scaffold
); // Fin del widget MaterialApp
} // Fin del método build
} // Fin de la clase MainApp

Una duda muy común al comenzar con Flutter es si el nombre de la clase MainApp es obligatorio por convención del framework o si puede personalizarse libremente.

No, en absoluto.

  • Lo primero que conviene aclarar es que MainApp no es una función, es una clase (el widget raíz de tu aplicación).
  • En Dart, la única función cuyo nombre es obligatorio por convenio del lenguaje es void main(), que es el punto de inicio de cualquier programa en Dart/Flutter.
  • Puedes llamar a tu clase como quieras: MyApp, MiAplicacion, SuperTiendaApp, etc. Lo único imprescindible es que el nombre coincida al instanciarla dentro de runApp:
void main() { // Punto de entrada del programa
runApp(const MiTiendaApp()); // Instancia la clase personalizada elegida
} // Fin de la función main
class MiTiendaApp extends StatelessWidget { // Nombre personalizado de la clase raíz
const MiTiendaApp({super.key}); // Constructor con el mismo nombre que la clase
} // Fin de la clase MiTiendaApp