7 puntos claves del código de programación Flutter

 

 

 

Uno de nuestros primeros pasos en el onboarding con un nuevo cliente, es el análisis del código de programación existente. En este análisis, verificaremos si el código existente es escalable y se puede mantener en el tiempo para que siga creciendo. De esta forma revisaremos la calidad de código y estableceremos prioridades para la gestión interna de estas soluciones.

 

Para esto analizaremos estos 7 puntos esenciales que nos permiten saber si un código de programación Flutter es escalable:

 

Arquitectura de código de programación: 

Nos permite separar el código por funcionalidades y responsabilidades, lo cual facilita el mantenimiento, la escalabilidad y la ausencia de bugs en la base de código.

 

En FlutterLab, aplicamos Flutter Clean Architecture, permitiéndonos dejar el código separado tanto por funcionalidad como responsabilidad, preparándolo para su crecimiento. 

 

Versión de Flutter y paquetes

 

Puede que sea evidente, pero utilizar la última versión estable de Flutter, nos permite aprovechar las últimas funcionalidades añadidas y los más recientes parches de bugs. A su vez, comprobamos que los paquetes de los que depende el proyecto, estén actualizados a su última versión, y verificar que ninguno está deprecado.

 

Realizar esto, nos permitirá reducir la deuda técnica en un futuro e invertir ese tiempo en tener nuestro código al día.

 

Archivos extremadamente largos

 

Otra bandera roja que es frecuente encontrar, son archivos extremadamente largos. En un caso de un archivo con más de 1.000 líneas, será complicado ejecutar cambios y mejoras en un futuro, por lo que deberíamos modularizar el código y distribuirlo dentro de archivos según guía nuestra arquitectura.

 

Gestor de Estados

Ocasionalmente, podemos encontrarnos con un código de programación que carece de Gestor de Estados, esta parte es muy crítica dentro del proyecto. El Gestor de Estados nos permitirá controlar el ciclo de vida de nuestros widgets y los diferentes estados por los que pasará nuestro UI.

 

En código realizado por alguien inexperto, suele ser común integrar la lógica dentro de los archivos encargados de UI, lo que provoca un gran caos en la gestión de estados dentro del proyecto.

 

En FlutterLab, utilizamos el patrón BLoC para gestionar la lógica de negocio dentro del código.

 

CI/CD

Hacer compilaciones y/o subidas de un proyecto Flutter a las plataformas de publicación de apps o un servidor web, va a ser algo que vamos a realizar frecuentemente inevitablemente cuando trabajamos con un sistema ágil de desarrollo, por este motivo, si facilitamos esta distribución lo máximo posible, nos ahorraremos tiempo y esfuerzo a lo largo del desarrollo.

 

Aparte de la distribución, un buen CI/CD nos permitirá hacer tests automáticos y forzar el formateado de código, los cual nos permitirá crear un filtro cada vez que queramos mezclar nuevo código dentro de nuestra app.

 

Testing

Pese a ser una asignatura pendiente dentro de muchos proyectos, la existencia de tests dentro de nuestro código, debe ser algo obligatorio si queremos mantener nuestro código bajo control, y que al momento de verificar que cuando incluyamos nuevas funcionalidades, no dañemos las anteriores.

 

Lo mínimo que recomendamos implementar son test unitarios, pero deberíamos implementar también test de widgets y de integración, si queremos asegurarnos que el código que estamos generando es de calidad, y siempre lo será.

 

Linting – Flutter Analyze

Ejecutar una herramienta de análisis de código estático en una buena forma de ver si se están ejecutando buenas prácticas dentro del código y nos puede dar un camino de problemas que hay que solucionar dentro del formato de código.

 

Te puede interesar: MVP: Qué es y su importancia en la creación de productos

 

Conclusión

Mantener un código escalable puede ser la cosa más importante que puedes hacer para tu app. Implementar las características de arriba, permitirá que tu código siempre mantenga una alta calidad, independientemente de su evolución en el futuro.

 

Checklist para el desarrollo de aplicaciones móviles

 

 

Una lista completa de todo lo que necesita considerar antes de comenzar su proyecto móvil

 

Ya sea que estés investigando empresas de desarrollo móvil por primera vez o estés buscando desarrollar tu próxima versión de sus aplicaciones iOS y Android, debes prepararte para responder preguntas clave sobre tu proyecto de aplicación móvil para que comprendas mejor en lo que estás involucrado. En FlutterLab entendemos que se necesita mucho para crear una aplicación. A continuación, incluimos preguntas clave para ayudarte a planificar el desarrollo de tu proyecto de aplicación móvil:

 

Planificación de tu estrategia comercial y de aplicación 

La estrategia comercial: clave para el éxito de un negocio - Cognodata

La planificación comercial permitirá entender las necesidades que tu producto solventará y su viabilidad en el mercado.

 

  • ¿Cómo se percibirá tu marca con una aplicación? ¿Tiene sentido que tu marca tenga una aplicación?

  • ¿Has definido tu aplicación en una sesión de descubrimiento y definición? 

  • ¿Sabes qué hará exactamente la aplicación? 

  • ¿Has creado una hoja de ruta del producto? ¿Cuál es la característica más importante que necesita? ¿Cuáles son las características imprescindibles? ¿Cuáles son las características que estarían bien tener? 

  • ¿Quiénes son sus stakeholders? ¿Quién toma las decisiones finales? 

  • ¿Qué hará que la aplicación sea exitosa a los ojos de los stakeholders? 

  • ¿Cuáles son tus objetivos de negocio?

  • ¿Has identificado y analizado a tu competencia? 

  • ¿Cómo está incorporando su aplicación a sus nuevos clientes? ¿Es simple y efectivo? 

  • ¿Cómo está incorporando su aplicación nuevas funciones?  

  • ¿Sabes cómo el público objetivo de tu aplicación querría realmente usar la aplicación? ¿Has realizado una investigación de audiencia? 

  • ¿Has pensado en los flujos de usuarios de un extremo a otro? 

  • ¿Tienes una estrategia de monetización? 

  • ¿Planeas mostrar anuncios en tu aplicación? ¿O tienes un modelo freemium o basado en suscripción? 

  • ¿Tienes un plan establecido para la participación y retención de usuarios? ¿Gamificarás tu aplicación? 

  • ¿Cómo medirás el comportamiento de los usuarios en la aplicación? ¿Utilizarás un programa de análisis como Firebase? ¿La aplicación será un negocio en sí mismo o apoyará a otro negocio? Sus consideraciones cambiarán en función de si la aplicación respalda o no a otra empresa. Por ejemplo, Snapchat es un negocio donde la aplicación es el negocio. Necesita muchas pruebas de usuario reales si es independiente. 

  • ¿Has determinado cómo validarás tu idea? ¿MVP, prototipo o POC? 

 

 

       Diseño y desarrollo 

 

Apps Móviles - ITBlueOcean

No solo será cuestión de la solución perfecta, sino de lo llamativa que este resulte para enganchar al usuario.

  • ¿Tienes marca o es un requisito adicional? 

  • ¿Tienes algún diseño visual preliminar? ¿O estás empezando desde cero?

  • ¿Tienes alguna aplicación que te guste usar como inspiración? ¿Qué quieres que se implemente en tu propia aplicación que disfrutes de los demás? 

  • ¿Tu aplicación tiene una IU / UX diferente para tabletas que para dispositivos más pequeños? 

  • ¿Estás utilizando una CDN para almacenar en caché datos no volátiles provenientes de API? De lo contrario, tendrá malos tiempos de carga si no tiene una CDN en su lugar. 

  • ¿Tienes una estrategia y herramientas de prueba de API? Debes asegurarte de que todos los casos estén cubiertos con herramientas de prueba API. Podemos probar cómo manejan las condiciones de error. Algunos ejemplos incluyen, Charles Proxy, Postman, etc. 

  • ¿Has definido el ciclo de vida de desarrollo de software (SDLC) que se utilizará con este proyecto? ¿Se han analizado sus API para detectar posibles riesgos de seguridad? ¿Sus API se adhieren a los estándares RESTful (u otros)? 

  • ¿Conoces las ventajas y desventajas de lo nativo frente a lo híbrido frente a lo web? 

  • ¿Has realizado un inventario de lo que ejecutan sus servicios de backend actuales y si sería fácil o no convertirlos en un servicio compatible con dispositivos móviles? 

  • ¿Has considerado crear API sin servidor? 

  • ¿Tienes desarrolladores de aplicaciones móviles que tengan experiencia con la tecnología y las plataformas que has elegido para la aplicación? 

  • ¿Quiénes son los arquitectos de tu aplicación? No solo hace que tu aplicación sea segura, sino que también te permite escalar con tu negocio. ¿Qué estrategia de almacenamiento en caché estás utilizando para el contenido de tu aplicación? 

  • ¿Tienes todos los derechos y permisos adecuados para el contenido y las imágenes de tu aplicación? ¿Quieres que el contenido de la aplicación sea actualizable sin volver a publicar la aplicación? 

  • ¿Tu aplicación maneja correctamente la autenticación? ¿Cómo lo manejará correctamente tu aplicación? Por ejemplo, cuando tiene un inicio de sesión o necesita una contraseña para ser encriptada. 

  • ¿Con qué facilidad desea que la aplicación se amplíe? ¿Planeas tener millones de usuarios o adquirir un goteo lento? 

  • ¿Qué tan impulsada por los datos deseas que sea tu aplicación? ¿Cuántos datos deseas recopilar y qué tan receptivo deseas ser a esos datos? 

  • ¿Necesitará soporte la aplicación una vez se lance? ¿Con qué frecuencia? 

  • Si estás utilizando una metodología ágil, ¿Tu socio de desarrollo de aplicaciones tiene experiencia con proyectos ágiles? 

 

     

Implementación y mantenimiento 

 

Mantenimiento de Software para Apps y Webs - Doonamis

Lo que no se mejora no avanza y lo mismo ocurre con los productos digitales

  • ¿Tienes un equipo de control de calidad dedicado que tenga experiencia en probar aplicaciones móviles en una variedad de plataformas diferentes? ¿Necesitas pruebas automáticas, manuales o ambas? 

  • ¿Tienes pruebas definidas para cubrir casos extremos conocidos? 

  • ¿Tienes un proveedor que pueda facilitar la detección y la notificación de los bloqueos de aplicaciones que puedan ocurrir? 

  • ¿Tienes un sistema para capturar y rastrear cualquier problema que pueda encontrarse en tu aplicación? 

  • ¿Tienes una herramienta para automatizar la ejecución y la generación de informes de pruebas unitarias? 

  • ¿Tienes una amplia selección de dispositivos iOS y Android que se dedicarán a probar la aplicación? 

  • ¿Has conseguido el tiempo necesario para ejecutar todas las pruebas de regresión antes de cada lanzamiento? 

  • ¿Se ha optimizado la descripción de la aplicación en la App Store para palabras clave? 

  • ¿Has creado algunas capturas de pantalla, videos y maquetas atractivos que muestran las características más importantes de tu aplicación? 

  • ¿Tienes un plan para publicar actualizaciones frecuentes en App Store y Google Play? 

  • ¿Cómo manejarás las actualizaciones de versión? Por ejemplo, si tiene la versión 1.0 y necesita actualizar a la 1.1, ¿notificará al usuario que actualice la aplicación? 

  • Debes considerar cuál será el soporte mínimo para tu aplicación. Por ejemplo, para Android 21 y 22, no necesita el consentimiento del usuario para el servicio de llamadas telefónicas, pero para los de 23 años en adelante, necesita que el usuario dé su consentimiento para grabar y tener acceso a los contactos. Hay una pequeña diferencia al realizar la prueba, pero debe tenerlo en cuenta. 

  • ¿Diseñarás de forma personalizada el icono de la aplicación? 

  • ¿Los íconos e imágenes de tu aplicación reflejan adecuadamente tu marca e imagen? ¿El diseño es confuso? ¿Refleja tu marca? 

  • ¿Tu aplicación captura comentarios críticos fuera de la revisión de la tienda de aplicaciones? ¿Con qué herramienta? 

  • ¿Tu aplicación está aprovechando la función de calificación dentro de la aplicación para App Store? 

  • ¿Has definido una lista de verificación de pasos y requisitos para publicar en la App Store? ¿Has definido una lista de verificación de pasos y requisitos para publicar en Google Play Store? 

  • ¿Tienes una estrategia para responder a las reseñas en la App Store y Google Play? ¿Qué idiomas admite tu aplicación? 

  • Si se encuentra un problema crítico en la aplicación, ¿Tienes un plan sobre cómo crear y publicar una versión de emergencia? 

  • ¿Tienes un calendario de lanzamientos? ¿Estás lanzando las aplicaciones en múltiples plataformas al mismo tiempo? 

  • ¿Tienes un contacto en la App Store de Apple que pueda acelerar la aplicación publicada, si al iniciar la aplicación se bloquea y no desea esperar tres días para pasar por el proceso de aprobación de la aplicación? Los llamas y les dices que se está bloqueando en el lanzamiento y que lo revisarán lo antes posible. 

   

      Comercialización de su aplicación 

Mobile App Marketing: la clave para el éxito de una aplicación móvil | Conexión ESAN

El momento de introducir en el mercado el producto final

  • ¿Has integrado la analítica en tu aplicación? Por ejemplo, ¿Sus funciones de seguimiento se utilizan con frecuencia? ¿Con qué pantallas interactúan más tus usuarios? ¿Cuáles son las acciones de los usuarios más populares? Debe comprender la participación de los usuarios en tu aplicación. 

  • ¿Has preparado un plan previo y posterior al lanzamiento? ¿Has determinado cómo lanzarás tu aplicación? MVP, Soft Launch, Hard Launch? 

  • ¿Has recopilado material de marketing y garantías? ¿Has considerado varias actividades de lanzamiento? Por ejemplo: 

  • Identificar personas influyentes y periodistas clave. 

  • Crear un kit de prensa. 

  • Aprovechar los sitios de selección de productos como Product Hunt. 

  • ¿Has determinado un presupuesto de marketing? 

 

Esperamos que pongas en práctica estas recomendaciones para que tu aplicación sea todo un éxito.

Flutter 3.0: Novedades, actualizaciones y mejoras

Sin duda alguna, Flutter se ha convertido en un mundo apasionante en el desarrollo de aplicaciones y su impacto ha sido tan contundente que el ritmo al que se mueve parece el de una historia animada. A pesar de su corta existencia, este framework se ha convertido en una tecnología de continuo avance y es por esto que hace algunas semanas Google anunció Flutter 3.0, una nueva versión que trae consigo innovaciones y mejoras para continuar con la revolución del desarrollo y la programación.

 

En este nuevo escenario, Flutter 3.0 incluye un soporte estable para Linux y macOS, además de Windows que se incorporó en la lista a inicios del 2022. Por otro lado, esta nueva versión incluye un soporte completo para Material You, una función de tema dinámico y que se encuentra disponible en la mayoría de dispositivos con Android 12 o posterior a este. Es de anotar que Material You genera una serie de paletas de colores y con esta nueva actualización, las aplicaciones Flutter podrán usar de manera fácil sus diseños, generando una mayor variedad en los fondos de pantalla.

 

En lo que respecta a la web, Flutter 3.0 trae consigo varias mejoras que incluyen la posibilidad de precargar la aplicación, por ejemplo, mientras se muestra una carga, lo cual podrá aumentar la eficiencia al administrar imágenes en un navegador.

 

En cuanto a las herramientas de desarrollo, esta nueva actualización incluye mejoras relacionadas con una mejor depuración y creación de perfiles de las aplicaciones de Flutter. Se ha agregado una nueva pestaña que muestra más información sobre el rendimiento y la posibilidad de deshabilitar algunas capas que podrán ayudar a resolver problemas de forma más veloz.

 

Es de anotar que en esta nueva fase también se ha anunciado la nueva versión de Dart, el lenguaje de programación de Flutter. Ahora tendremos Dart 2.17 con la cual  encontraremos un mejor soporte para enumeraciones, las cuales podrán tener valores, variables, métodos, entre otros, casi como si fueran clases.

How to Use Super Initializers in Dart 2.17

De igual forma se ha eliminado el requisito de poner argumentos con nombre al final de todo, por lo que ahora se podrán ordenar los argumentos de los constructores y funciones en el orden que resulte más natural, independientemente de si poseen un nombre o no. Además de lo anterior, se ha incluido el superconstructor, que hará que el código sea mucho menos detallado y más fácil y rápido de leer.
Por otro lado, ahora cuando se cree una aplicación en Firebase, se tendrá la opción de agregar una aplicación Flutter; la documentación se actualizará para que se pueda usar la nueva herramienta de integración, en lugar de realizar la configuración en Android e iOS por separado.
Adicionalmente, se ha anunciado la creación del kit de herramientas Flutter Casual Game, un conjunto de recursos que incluye un juego de nuestra y materiales de aprendizaje con lo cual queda demostrado que Flutter será un elemento fundamental para desarrollar videojuegos y de esta forma, hacer de esta tecnología un elemento más versátil y llamativo en el desarrollo de aplicaciones.
Flutter no se detiene en su evolución y sigue conquistando cada vez más la atención en el desarrollo de aplicaciones.

MVP: Qué es y su importancia en la creación de productos

Los prototipos a menudo influyen en un MVP y los dos trabajan juntos para crear un producto final exitoso. Un MVP (del inglés Minimum Viable Product) es una forma mínima de su producto completo que se prueba en el mercado.
Este enfoque de desarrollo le permite aprender cómo reaccionarán sus usuarios a su producto antes de que desperdicie una gran cantidad de dinero y recursos construyendo algo que nadie quiere o necesita. Si bien los prototipos resuelven problemas durante las primeras etapas de desarrollo, el proceso iterativo de un MVP está diseñado para identificar los puntos débiles de los usuarios cuando el producto se prueba realmente en el mercado.
El riesgo de desarrollar más (o menos) de lo que necesita es la razón por la que es tan importante validar los supuestos de su producto con un MVP. Comenzando con una característica central, aprender cómo reaccionan los usuarios a esa característica y construir de acuerdo con los comentarios de los usuarios es esencial para determinar la cantidad adecuada de funcionalidad que su producto necesita para adquirir y retener usuarios. Con el tiempo, los aprendizajes que provienen de un MVP definen la hoja de ruta de su producto y guían la evolución de su aplicación.
Un MVP es una versión de un producto que incluye solo las características que necesita para ser comercializable. Con el proceso MVP, se puede verificar lo siguiente:
  • Viabilidad del producto
  • Supuestos del producto
  • Usabilidad
  • Demanda del mercado
Producto mínimo viable (MVP): qué es, características, ventajas, ejemplos y cómo se desarrolla
Los MVP brindan valor inmediato al tiempo que minimizan los costos de desarrollo. En última instancia, un MVP le permite crear un producto con características mínimas y desarrollarlo de forma iterativa para crear un producto mejor y más pulido al tiempo que aprovecha la inteligencia del usuario para tomar las mejores decisiones posibles. Con cada versión de lanzamiento, el producto evoluciona para maximizar el ROI y avanzar hacia una aplicación completamente madura.
Todas las aplicaciones más exitosas de la actualidad comenzaron como algo mucho más simple de lo que son hoy. Las aplicaciones como Uber, Instagram y Spotify, por ejemplo, son todas aplicaciones maduras; son el resultado de años de desarrollo y grandes cantidades de capital. Desarrollar una aplicación de alcance similar requiere mucho tiempo y una gran inversión.
Aquí es donde entra en juego un MVP, ya que proporciona valor inmediato, rápidamente, al tiempo que minimiza los costos de desarrollo y revela la dirección más adecuada para un mayor desarrollo.
Lo que implica un MVP puede ser muy subjetivo, difiriendo de una organización a otra en función de las necesidades comerciales, la industria y la competencia.
Dado que un MVP implica salir al mercado con características y funcionalidades centrales, le permite comenzar a construir una base de usuarios para obtener información sobre lo que funciona y lo que no. Esta es información vital, ya que permite a los equipos de productos utilizar datos para tomar decisiones sobre futuras iteraciones del producto, incluidas las otras funciones que se agregarán, los aspectos que aumentarán las ventas y exactamente dónde asignar el presupuesto.
No será solo cuestión de desarrollar la mejor versión posible de tu aplicación, sino de conocer a profundidad a tu usuario y satisfacer de la mejor manera su necesidad.

Monetización de apps con Flutter

La monetización de apps no es un mito, es una realidad…

Antes de lanzar tu app habrás definido bien todas sus funcionalidades, tu estrategia de adquisición de usuarios y cómo retenerlos. En este punto, toca plantearse la siguiente fase: cómo ganar dinero, es decir, transformar el engagement de tus usuarios en ingresos para tu negocio. Existen distintos tipos de monetización para apps y tendrás que determinar la estrategia que funcione mejor para alcanzar tus objetivos de rentabilidad.

En FlutterLab te enseñamos como hacerlo 👋

No hay descripción alternativa para esta imagen

Ahora que ya conoces cómo monetizar tu aplicación, ¿Qué esperas para hacerlo?

Navigator 2.0 en Flutter

 

La navegación es parte esencial de cualquier software, tanto web como móvil, ya que este nos permite realizar el desplazamiento entre enlaces de una página a otra.

Para entender mejor la apuesta que Flutter está realizando al cambiar el concepto de su Navigator a Navigator 2.0, es necesario entrar en contexto sobre estas dos API’s:

Understanding Flutter Navigator 2.0 | Codemagic Blog

 

Navigator

Si estás usando Navigator significa que estás familiarizado con:

 

  • Navigator: un widget que administra una pila de objetos de rutas.
  • Route: un objeto administrado por un Navigator que representa una pantalla, normalmente implementado por clases como MaterialPageRoute.

 

Uno de los principales problemas con el Navigator actual es que su implementación se basa en una programación imperativa (vamos definiendo el stack de la navegación a medida que el desarrollo va avanzando). Lo anterior es completamente opuesto a la programación declarativa y reactiva con el cual está construido Flutter.

Otro de los grandes problemas que tiene la navegación actual son la cantidad de parámetros en los que podemos declarar nuestra navegación dentro del Widget MaterialApp, ya que en la actualidad Flutter nos permite implementar la navegación a través de los siguientes parámetros:

  • Routes
  • OnGenerateRoute
  • OnGenerateInitialRoutes
  • OnUnknownRoute

Lo anterior hace que la implementación de la navegación en un inicio sea un tanto confusa, sin contar que existe otra cantidad de formas de poder declarar nuestra navegación y aplicarla imperativamente.

Por ejemplo:

Opción 1

  • MaterialApp(
      debugShowCheckedModeBanner: false,
      title: ExampleFlutterLab,
      theme: ThemeData(
        primaryColor: Colors.white,
        scaffoldBackgroundColor: AppColors.backgroundGrey,
        textTheme: GoogleFonts.poppinsTextTheme(Theme.of(context).textTheme),
      ),
      localizationsDelegates: AppLocalizations.localizationsDelegates,
      supportedLocales: L10n.all,
      navigatorKey: AppNavigator.navigatorKey,
      onGenerateRoute: Routes.generateRoute,
    ); 
  • class Routes {
      static Route<dynamic> generateRoute(RouteSettings settings) {

        switch (settings.name) {
          case ‘/’: return MaterialPageRoute(builder: (_) => const Login());
          case ‘/Home: return MaterialPageRoute(builder: (_) => const Home());
          default: return MaterialPageRoute(builder: (_) => const Login());
        }
      }
    }
  • Material(
        elevation: 4,
      borderRadius: BorderRadius.circular(3),
      child: InkWell(
        onTap: () => Navigator.of(context).pushNamed(«/home»),
        child: const Text(«let’s go home»),
      ),
    );

(Se agrego en el parámetro OnGenerateRoute una static Function que nos retorne Route<dynamic> y que esta nos agregara en la pila de navegación la nueva vista, en este caso Home())

Opción 2

  • Material(
      elevation: 4,
      borderRadius: BorderRadius.circular(3),
      child: InkWell(
        onTap: () => Navigator.of(context).push(
          new MaterialPageRoute(
            builder: (context) => home(
              user: User(),
            ),
          ),
        ),
        child: const Text(«let’s go home»),
      ),
    ),

(Imperativamente se declara la función que nos permitirá realizar la navegación a la siguiente vista en este caso Home() )

 

Navigator 2.0

Esta API nos permite un control más preciso sobre la pila de navegación, logrando analizar las rutas y eliminar páginas debajo de la actual.

Se agregan nuevas clases al marco, para hacer que las pantallas de la aplicación sean una función de estado (muy similar a lo que se implementa en URL web) entre las que encontramos las siguientes.

  • Page: objeto inmutable que nos permite configurar los Stack en la pila de navegación.
  • Router: es el encargado de abrir y cerrar páginas de una aplicación.

Este widget escucha la información de enrutamiento del sistema operativo, analiza los parámetros de la ruta y luego convierte esos datos en un widget que posteriormente se agrega a la pila de navegación.

  • RouteInformationParser: Cuando el enrutador obtiene una nueva información de ruta de RouteInformationProvider, el Router usa este delegado para analizar la información de ruta y producir una configuración que será utilizada por RouterDelegate que eventualmente procederá a construir el widget de Router.
  • RouterDelegate: Un delegado que utiliza el widget de Router para crear y configurar un widget de navegación.
  • BackButtonDispatcher: Informa en un Router cuando el usuario toca el botón atrás en plataformas que admiten botones atrás (como Android).

 

Por ejemplo:

main.dart

import ‘package:example_flutter_lab/page/home/home.dart’;
import ‘package:example_flutter_lab/page/login/login.dart’;
import ‘package:flutter/material.dart’;

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  WidgetsFlutterBinding.ensureInitialized();
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  static late String nameUser;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: ‘ExampleFlutterLab’,
      theme: ThemeData(
          primaryColor: Colors.white, scaffoldBackgroundColor: Colors.white),
      home: Navigator(
        pages: [
          MaterialPage(
            child: Login(
              handledOnTap: handledOnTap,
            ),
            key: const ValueKey(«login»),
          ),
          if (nameUser != null)
            const MaterialPage(
              child: Home(),
              key: ValueKey(«home»),
            ),
        ],
        onPopPage: (route, result) => route.didPop(result),
      ),
    );
  }

  handledOnTap(String nameUserParams) => setState(() {
        nameUser = nameUserParams;
      });
}

login.dart

import ‘package:flutter/material.dart’;

class Login extends StatefulWidget {
  final Function(String) handledOnTap;

  const Login({Key? key, required this.handledOnTap}) : super(key: key);

  @override
  _LoginState createState() => _LoginState();
}
class _LoginState extends State<Login> {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Material(
          elevation: 4,
          borderRadius: BorderRadius.circular(3),
          child: InkWell(
            onTap: () => widget.handledOnTap(«user»),
            child: const Text(«let’s go home»),
          ),
        )
      ],
    );
  }
}

¡Navigator 2.0, un mundo fascinante a la espera de la acción!

 

Dash, la mascota de Flutter y Dart

Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaqueipsa quae abillo inventore veritatis quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem.

Seguir leyendo