Skip to content
My Docs

Apuntes

MediaQuery

El MediaQuery permite obtener las dimensiones del dispositivo, asi que tenemos que:

Dentro del metodo build, se usa el context para obtenerlo

final size = MediaQuery.of(context).size

Banner debug

Dentro del widget MaterialApp en el main de la aplicacion existe una propiedad llamada:

debugShowCheckedModeBanner: false

Esto quita el banner de debug molesto.

Tip Git

Dejar el codigo en el commit anterior?

git checkout -- .

App Theme

Para los temas de la aplicacion, es bueno crearse un directorio o archivo:

config/theme/app_theme.dart

Esto permite centralizar los colores de la aplicacion, podemos referirnos a este video:

assert

Permite por codigo establecer restricciones del codigo para que el programador se guie en el mismo.

Carpetas

La estructura de carpetas Fernando recomienda

  • config
    • theme
  • presentation
    • screens
      • nombre_widget

Navegacion en Pantallas

URL: https://docs.flutter.dev/ui/navigation

En esto tenemos la documentacion de flutter que dice que es super complejo, sin embargo, deberia realizarse como sisiegue:

Navigation.of(context).push(
  MaterialPageRoute(
    builder: (context) => const ButtonScreen(),
  ),
);

Esto puede ubicarse en una propiedad de onTap por ejemplo de un Widget padre.

@override
Widget build(BuildContext context) {
  return MaterialApp(
    routes: {
      '/': (context) => HomeScreen(),
      '/details': (context) => DetailScreen(),
    },
  );
}

TextFormField o TextField

Parametros relevantes:

TextController

Para poder manejar los controles de texto, hay que usar TextEditingController

Este se agrega a:

  • TextFormField: propiedad controller.

Tips

Snippet Theme.of colorScheme

Cuando se presiona ctrl+shift+p se busca por snippets, luego se elije Dart como lenguaje y se crea lo siguiente:

  "Color scheme": {
    "prefix": "theme-of-context",
    "body": [
      "final color = Theme.of(context).colorScheme;",
     ],
     "description": "Create the reference to the colors for the main whole app context"
  }

Anexos

Flutter con Fernando de Udemy