Entra en Flutter, la entrada de Google en el mundo de los frameworks multiplataforma. No necesariamente nuevo en la escena, con la versión 1.0 lanzada en 2018, Flutter continúa creciendo y agregando características y mejoras. Basado en el lenguaje Dart propio de Google, Flutter proporciona gráficos fluidos y un rendimiento casi nativo en cualquier plataforma en la que se ejecute.
Recientemente aproveché la oportunidad de construir una aplicación básica usando Flutter que accede a la API de IMDB. Simplemente permite al usuario introducir una palabra de búsqueda de título, muestra los resultados en una lista, y cuando se toca una entrada, se muestran los detalles de esa película. La inspiración vino de nuestra Práctica Móvil aquí en Improving, que ha estado trabajando en materiales de formación iOS para aquellos interesados en aprender a escribir aplicaciones iOS. Si quieres probar lo que he escrito, tendrás que solicitar tu propia clave API. El enlace al repositorio del proyecto está al final de este post.
Aquí está la aplicación en acción en Android:
Primeros pasos con Flutter
Para empezar con Flutter, es necesario instalar el SDK de Flutter y una herramienta de desarrollo. IntelliJ IDEA o Android Studio son grandes opciones que tienen plugins maduros para facilitar el desarrollo. Visual Studio Code es otra opción. Personalmente no lo he utilizado para el desarrollo de Flutter, pero tengo entendido que también hay plugins disponibles para ese IDE. Lee y sigue las instrucciones de instalación de Flutter para ponerte en marcha rápidamente. El único problema que encontré fue la instalación de CocoaPods en MacOS. Acabé usando homebrew para instalar CocoaPods en lugar de usar el instalador de gemas. CocoaPods no es necesario si sólo quieres desarrollar usando Android. El flutter doctor te dirá si tienes todo instalado correctamente y te indicará lo que necesitas arreglar.
Cuando se crea un nuevo proyecto, ya sea a través de la línea de comandos o de su IDE de elección, se construye una aplicación básica que cuenta cuántas veces se ha pulsado un botón. No es nada del otro mundo, pero el código está bien comentado para mostrar lo que hacen todas las piezas. Para empezar a desarrollar, casi todo ese código debe ser eliminado y nuevos widgets puestos en lugar de lo que se eliminó.
Todo en Flutter es un Widget
Hablando de widgets, casi todo en Flutter es un widget. Flutter tiene una amplia selección de widgets utilizados para permitir a los usuarios interactuar con una aplicación a los widgets que ayudan con el diseño, posicionamiento y animación. Si un widget no se ajusta a una necesidad, se pueden crear nuevos widgets ampliando un widget existente o componiendo uno nuevo. Para mí, creo que lo más difícil de Flutter es saber qué widgets existen y cómo funcionan, especialmente en relación con el diseño.
Los widgets pueden ser con o sin estado. Los widgets sin estado se consideran ligeros y se utilizan para cosas en las que la configuración del widget no cambia. Si el widget necesita cambiar, se tira y uno nuevo con la nueva configuración lo reemplaza. Los widgets con estado son para cuando el widget necesita cambiar dinámicamente o cuando hay dependencias fuera del widget. Es necesario que el desarrollador notifique a Flutter cuando cambia el estado para que el widget pueda redibujarse. Puede ser complicado elegir el tipo de widget adecuado y, a medida que avanza el desarrollo, el widget puede cambiar de sin estado a con estado o incluso al revés si se simplifica un widget.
Un ejemplo de widget sin estado es un Texto de texto. Una vez configurado, no necesita cambiar. Siempre tendrá un valor determinado, y la fuente y el tamaño seguirán siendo los mismos. En comparación, un ejemplo de widget con estado es TextField. Se espera que cambie a medida que el usuario escribe en el teclado.
Cuando se construye una aplicación, los widgets se disponen en un árbol, de forma similar a lo que hacen los desarrolladores de Java con el conjunto de herramientas Swing. Casi todos los aspectos de un widget pueden configurarse. Por ejemplo, un widget Texto simplemente muestra texto en la pantalla. Sin embargo, se puede especificar el tamaño, la fuente, la dirección, la alineación, lo que sucede cuando se desborda y mucho más. ¡Una aplicación Flutter puede ser hermosa!
¿Qué pasa con Dart?
En cuanto al lenguaje Dart, es un lenguaje de sintaxis de estilo C, no muy diferente de JavaScript o Java. Está orientado a objetos, recolecta basura, y tiene muchas otras características que se encuentran en lenguajes populares. Utiliza el patrón async/await que devuelve Futures. Todo esto sucede dentro de un bucle de eventos como JavaScript utiliza. Es un lenguaje muy cómodo para desarrollar.
La parte más difícil de Dart para mí es el patrón async/await y cómo es viral en la pila de llamadas. Una vez que un método es etiquetado como async, todo lo que lo llama tiene que ser async. Es una forma de escribir código muy diferente a mis experiencias previas con Java y lenguajes relacionados. Es necesario, sin embargo, en Flutter para mantener la interfaz de usuario sensible y suave. Flutter tiene un modelo de un solo hilo con un bucle de eventos para procesar los eventos. Es posible generar más hilos (o aislados, como los implementa Dart) para ejecutar tareas de procesamiento más pesadas, lo que ayuda a que una aplicación siga respondiendo.
¿Puedo probar esta cosa?
Sí. Se soportan pruebas unitarias, de widgets y de integración. Las pruebas unitarias son fáciles de escribir utilizando Mockito para Dart para simular dependencias externas. Las pruebas de widgets permiten a un desarrollador asegurarse de que cuando se pulsa un botón, el comportamiento esperado se muestra en la pantalla. Las pruebas de integración se pueden ejecutar en dispositivos reales o emulados para garantizar que todas las partes de la aplicación funcionan juntas.
En mi opinión, las pruebas son sencillas y no difieren de las de cualquier otro marco de pruebas. Las pruebas relacionadas se pueden agrupar y hay una serie de coincidencias disponibles. Las pruebas unitarias del código de la capa intermedia son sencillas utilizando Mockito para simular dependencias externas. Mockito también es útil para probar widgets y simular el código de la capa intermedia. No he probado una prueba de integración completa, pero parece ser muy similar a las pruebas de widgets donde las expectativas de comportamiento de la interfaz de usuario se comprueban después de interactuar con la interfaz de usuario.
Mi experiencia con Flutter
La creación de esta pequeña aplicación de ejemplo me ha demostrado lo rápido que se puede crear una interfaz de usuario con Flutter. Tengo algo de experiencia previa con Flutter, pero tardé menos de un día en escribirla más otro día parcial para averiguar cómo probarla correctamente. Mis mayores problemas eran: Qué widgets de diseño debería usar, superar algún extraño asunto de versiones de iOS con los simuladores de iOS (no relacionado con Flutter), y averiguar qué bibliotecas adicionales de Linux necesitaba para que mi aplicación funcionara en Linux. En mi caso, necesitaba instalar algunas librerías C++ adicionales, así como una para soportar la librería flutter_secure_storage para poder compilar la aplicación en Linux. El uso de IntelliJ IDEA con emuladores de Android funcionó perfectamente. La funcionalidad de recarga en caliente también hace que la creación de interfaces con retroalimentación rápida sea un verdadero placer.
La documentación de Flutter también es bastante sólida. De los widgets que consulté, todos tenían una breve explicación y código de ejemplo para mostrar cómo se deben utilizar. Las bibliotecas de terceros también son abundantes, aunque la calidad de la documentación de esas bibliotecas puede ser un poco desigual. Echando un vistazo rápido a https://pub.dev (el repositorio oficial de paquetes para Dart), parece que hay una biblioteca disponible para muchas necesidades comunes y algunas poco comunes. Hay un montón de preguntas respondidas en Stack Overflow, muchas entradas de blog y otras vías de ayuda. La comunidad Flutter parece ser muy activa.
¿Debería usar Flutter para mi aplicación?
Es la misma respuesta para la mayoría de las cosas: depende. Creo que deberías considerarlo seriamente.
Si necesitas que una aplicación funcione en más de una plataforma, de forma nativa, es una opción obvia. Si buscas crear una interfaz de usuario bonita con Material o con el lenguaje de diseño de Apple, deberías usar Flutter. También creo que cualquier tamaño de aplicación, grande o pequeño, es un buen candidato para usar Flutter.
Una cosa que puede hacer que Flutter no sea una buena opción es si necesitas algunos requisitos de hardware específicos que solo existen en una plataforma. La misma funcionalidad no existirá en otra plataforma y probablemente no habrá una librería Dart que la soporte. Pero Flutter soporta el uso de APIs específicas de la plataforma por lo que todavía es una posibilidad.
La pregunta que habría que hacerse es "¿Por qué no debería usar Flutter para mi próxima app?".
Enlaces relacionados
Página principal de Flutter - https://flutter.dev/
Página de inicio del lenguaje Dart - https://dart.dev/
Repositorio de paquetes Dart / Flutter - https://pub.dev/
API IMDB - https://imdb-api.com/
Repositorio de proyectos de ejemplo - https://github.com/improving-minnesota/flutter-imdb
