Autor: Chris Sells, Product Manager, Flutter developer experience
Nos complace anunciar el lanzamiento de Flutter 1.12, la versión estable más reciente de la plataforma. Esta es la quinta versión estable desde que lanzamos Flutter 1.0 en diciembre de 2018. ¿No fue un año increíble? Cerramos 5303 problemas e incluimos 5950 solicitudes de incorporación de cambios enviadas por 484 colaboradores. En el motor y marco de trabajo de Flutter, agregamos compatibilidad con Android App Bundles e iOS 13, implementamos eventos del mouse y el teclado, publicamos el complemento para compras en la aplicación, combinamos numerosas mejoras importantes en el rendimiento, localizamos el contenido a 24 configuraciones regionales adicionales y creamos varios widgets nuevos. Además, mejoramos enormemente las herramientas de Flutter con el lanzamiento de DevTools de Dart, que incluye el inspector de widgets, la generación de perfiles de memoria y CPU, y la capacidad de registro mejorada que puede utilizarse en cualquier editor o IDE que elijas. Por otro lado, agregamos la importación automática de paquetes de tipos a los que se hace referencia, compatibilidad explícita con ChromeOS y guías sobre IU para facilitar la lectura y escritura de los métodos de compilación. Asimismo, mejoramos los mensajes de error con capacidades de formato, colores y palabras más útiles.
Y en cada versión, repetimos lo mismo: esto es solo el comienzo. Seguimos afirmándolo en esta nueva versión, la más importante hasta el momento, que se generó con el apoyo de 188 colaboradores que cerraron 4571 problemas e incluyeron 1905 solicitudes de incorporación de cambios. Al igual que en versiones anteriores, se implementaron muchas mejoras en el marco de trabajo de Flutter y en sus herramientas.

Marco de trabajo de Flutter

Esta versión incluye una actualización visual para ofrecer compatibilidad con iOS 13 que incorpora la implementación total del modo oscuro, de nuevos widgets de Cupertino, numerosos ajustes de UX y una mejora importante en la función de agregar a apps.

Compatibilidad total con el modo oscuro de iOS 13

Otra excelente novedad de Flutter 1.12 es que ya admite completamente el aspecto de iOS 13, lo que incluye el modo oscuro en los widgets de Cupertino.


Como puedes ver en las capturas de pantalla anteriores, no solo se cambió el color de fondo, sino que se adaptó el resto de los colores para conseguir una apariencia ideal. Lograr este nivel de detalle con el modo oscuro supuso un gran esfuerzo, pero valió la pena lograr el diseño perfecto en cada píxel de iOS en el modo claro y el oscuro.
Además, en nuestra constante búsqueda por lograr la perfección de cada píxel en iOS 13, agregamos dos widgets.

CupertinoContextMenu y CupertinoSlidingSegmentedControl

Por último, en nuestra búsqueda para que el aspecto de la app de Flutter parezca propio de iOS 13, mejoramos la fidelidad de la barra de desplazamiento, proporcionamos la capacidad de relleno adaptable de CupertinoAlertDialog e implementamos límites mínimos y máximos en CupertinoDatePicker.

Actualización de la función "agregar a apps"

Otra mejora que implementamos en el nivel de compatibilidad con los dispositivos móviles fue la actualización de agregar a apps, es decir, la capacidad de integrar Flutter en una app existente para Android o iOS. En este caso, trabajamos con el fin de simplificar y mejorar el proceso que usas para agregar una biblioteca de Flutter a tu app, lo que incluyó añadir un nuevo asistente para módulos de Flutter en Android Studio.


En Flutter 1.12, agregar a apps ya se admite oficialmente para que puedas agregar a tu app una instancia de Flutter en pantalla completa. Para admitir esta funcionalidad, también hicimos lo siguiente:
  • Estabilizamos las API de integración de la plataforma en Java, Kotlin, Objective-C y Swift, lo que incluyó un nuevo grupo de API para Android. Consulta los documentos de migración de proyectos de Android para conocer los cambios en más detalle.
  • Agregamos compatibilidad con el uso de complementos en módulos de Flutter incorporados.
  • Proporcionamos mecanismos de integración adicionales mediante el AAR de Android y los marcos de trabajo de iOS a fin de mejorar la compatibilidad con los sistemas de compilación actuales.
  • Modificamos el mecanismo "flutter attach" en los complementos de las herramientas de línea de comandos, VSCode e IntelliJ para simplificar la conexión con un módulo de Flutter en ejecución a fin de realizar tareas de depuración, DevTools y recarga activa.
Si quieres probar agregar a apps, consulta la documentación del sitio web o nuestros proyectos de muestra que ejemplifican diversas situaciones de integración.

Dart 2.7

Está claro que todo lo que hacemos en Flutter está basado en Dart. Si todavía no leíste la información sobre métodos de extensión y manejo seguro de strings (incluidos los emojis), o si quieres conocer las novedades sobre la seguridad nula con tipos no anulables, puedes consultar el anuncio sobre Dart 2.7.

Hay vida más allá de la versión estable de Flutter 1.12

No solo desarrollamos funciones nuevas en la versión estable de Flutter. También lanzamos una versión beta de compatibilidad web y una versión alfa de compatibilidad con macOS.

Compatibilidad web disponible en la versión beta

Los tres canales de Flutter 1.12 (principal, de desarrollo y beta) ofrecen compatibilidad mejorada con la Web.


Un cliente muy satisfecho con esta novedad es Rivet, que puedes verlo en la imagen de arriba. Rivet es un proyecto educativo que tiene en producción una app para dispositivos móviles, y usa Flutter y Firebase para desarrollar una versión web de la app que tiene previsto lanzar a principios de 2020.
Puedes leer esta entrada del blog de la versión web de Flutter para obtener más información sobre cómo aprovechan otros clientes la compatibilidad web de Flutter y conocer detalles adicionales.

La versión para macOS alcanza la etapa alfa

La compatibilidad con computadoras que ejecutan macOS ya dejó la etapa de vista previa técnica. La nueva versión alfa ya está disponible en el canal principal y el de desarrollo (en el SDK 1.13 de Flutter).


La imagen de arriba es una nueva versión de la galería de Flutter en tamaño de escritorio que se actualizó completamente para ofrecer compatibilidad con macOS (además de Android, iOS y la Web).
La versión alfa para macOS es un gran paso adelante para Flutter en términos de compatibilidad con computadoras, e incluye los nuevos widgets de muestra DataTree y Split, numerosos complementos adaptados a macOS, compatibilidad con la compilación en los modos de versión y generación de perfiles, y una historia de herramientas enormemente simplificada. Si eliges desarrollar en el canal principal o el de desarrollo, puedes obtener acceso a las herramientas de macOS si habilitas la compatibilidad con computadoras que ejecuten macOS en la configuración general del sistema de Flutter:
$ flutter config --enable-macos-desktop
Ahora, puedes usar "flutter create" para crear un proyecto de Flutter que se ejecute en macOS como lo harías con cualquier otro proyecto nuevo.

Observa cómo se crea el nuevo directorio de macOS de forma predeterminada

Además de la compatibilidad con herramientas, también nos ocupamos del nivel adecuado de densidad para las apps de escritorio. Las apps para dispositivos móviles necesitan controles de mayor tamaño para admitir las interacciones táctiles, mientras que es más probable que un usuario use el mouse en una computadora. Para incorporar Flutter a las computadoras, buscamos que pudieras elegir la densidad de tus widgets a fin de adaptarte mejor a los requisitos de tus usuarios de apps de escritorio:

Ejemplo de la implementación de las pautas de densidad de Material Design de Flutter

Por último, para mejorar la experiencia de las apps de escritorio de Flutter, trabajamos arduamente en la navegación y el acceso de teclados. Esto incluyó:
Además del ejemplo de Flutter, te recomendamos consultar el ejemplo de la nueva función de búsqueda de fotos, que permite ver gran parte de los beneficios de la versión para escritorios, incluido el manejo del teclado, la nueva densidad de widgets, y los complementos y los widgets nuevos.
Para quienes quieran conocer los avances en Windows y Linux, podemos decir que, aunque todavía están en la etapa de vista previa técnica, se benefician ampliamente del trabajo que realizamos para lograr que macOS llegue a la etapa alfa. Pronto habrá más novedades al respecto. Para obtener más información sobre los avances relacionados con la compatibilidad de la versión de escritorio de Flutter con macOS, Windows y Linux, consulta flutter.dev/desktop.

Herramientas de Flutter

Además del marco de trabajo y el motor, también hay muchas novedades sobre las herramientas de Flutter. Entre ellas, una nueva versión de DartPad compatible con Flutter, IDE aumentados con tecnología de IntelliJ y una vista previa de una función nueva que denominamos "IU directa", mejoras en DevTools de Dart con una nueva vista de diseño, depuración simultánea multidispositivo en Visual Studio Code, mejoras en los procesos de compilación de Android y compatibilidad optimizada para encontrar diferencias en la representación de los widgets entre las pruebas que se ejecutan.

DartPad y Flutter son el uno para el otro

Si todavía no usas DartPad, ¿qué estás esperando? Es una excelente herramienta para probar las funciones de Dart sin realizar ninguna instalación. Además, ¡la nueva versión de DartPad incluye Flutter!


Esta versión aprovecha la compatibilidad web de Flutter para que, cuando escribas código de Flutter a la izquierda, se ejecute un programa de Flutter (web) en tiempo real a la derecha. La diferencia principal radica en que, si usas DartPad, puedes empezar a familiarizarte con Flutter sin instalar absolutamente nada.
Además del entorno independiente de DartPad, también empezamos a agregar información sobre la compatibilidad de DartPad con Flutter a nuestros documentos y codelabs (por ejemplo, los conceptos de diseño básicos de Flutter y las animaciones implícitas), de modo que puedas conocer Flutter desde la comodidad de tu navegador. Para obtener más información sobre DartPad, consulta nuestra entrada sobre los anuncios de DartPad.

Compilación integrada de widgets con la IU directa

Si instalas las herramientas de Flutter a nivel local en tu máquina (esperamos que así sea), tendrás acceso a la vista previa de una nueva función en el complemento de IntelliJ y Android Studio de Flutter. Con esta función, puedes ver los widgets e interactuar con ellos directamente en el IDE a medida que los compilas.
Elegimos llamarla "IU directa" y, al igual que la recarga activa, la IU alojada se actualiza directamente a medida que cambias el código. También puedes interactuar directamente con la IU alojada (por ejemplo, cambiar un color, como se muestra aquí) y el cambio se implementa directamente en el código. Consulta las instrucciones en la página de wiki de Flutter si quieres habilitar la vista previa de IU directa.

Depuración de problemas de diseño con Layout Explorer

Siempre tendremos el código y sus posibles problemas, aunque lo escribas a mano o dejes que la IU activa lo haga por ti. Justamente para esto se inventó DevTools de Dart: para ayudarte a encontrar los problemas y resolverlos. La nueva versión de DevTools incorpora una función llamada "Layout Explorer", que permite aumentar el tamaño de Inspector con una representación visual de tu diseño.


Además de ayudarte a visualizar el diseño de los widgets mientras se ejecuta tu app, también te permite cambiar de forma interactiva las opciones de diseño para experimentar todas las posibilidades. Esperamos que, con la vista previa de esta función, puedas entender y resolver más fácilmente los problemas de diseño. Consulta los documentos de Layout Explorer si quieres habilitarla.

Depuración multidispositivo

Muy probablemente trabajaste en un solo dispositivo cuando compilaste y depuraste tu IU de Flutter. ¿No sería genial poder depurar tu app en varios dispositivos (físicos o virtuales) al mismo tiempo? Eso es exactamente lo que puedes hacer gracias a la compatibilidad con la depuración multisesión en Visual Code.


Aquí puedes ver la misma app de Flutter ejecutándose al mismo tiempo en tres sesiones de depuración independientes. Si realizas cambios en el código, la recarga activa los implementa en las tres apps. Si nosotros definimos un punto de interrupción, se detiene la app que activa ese código. Si quieres dejar de depurar una sola app, puedes hacerlo sin detener las otras dos. Aprende a configurar esta función con la información sobre depuración multidispositivo en la página de wiki.

Problemas de compilación en Android

Por último, para seguir mejorando Android, esta versión incluye soluciones a algunos problemas de compilación. En primer lugar, optimizamos la capacidad de compilación de Android, especialmente en lo que refiere a combinar complementos que usan bibliotecas de compatibilidad con aquellos que usan AndroidX. Para lograrlo, trasladamos los complementos del equipo de Flutter a AndroidX y recomendamos hacer lo mismo con las apps y los complementos. Sin embargo, si hay problemas con complementos que aún no se trasladaron, nuestra compilación incluye una ruta de código alternativa que usa archivos Android Archive y Jetifier. Esta compilación es más lenta y, por eso, no es la principal, pero resuelve aproximadamente el 95% de los problemas que detectamos.
Otro problema que resolvimos consistió en abandonar ProGuard y adoptar R8, el nuevo optimizador de código de Google. Antes de la nueva versión, el creador de una app debía configurar manualmente las reglas de ProGuard con instrucciones del creador del complemento. A partir de ahora, es posible definir las reglas de los complementos en el código fuente y R8 las incorpora automáticamente para ahorrarle un problema al desarrollador de la app.
Asimismo, seguimos intentando que Flutter sea lo más liviano posible. A tal fin, redujimos 2,6% el tamaño de la app "Hello, World" para Android (de 3,8 MB a 3,7 MB). ¡Todo ayuda!

Pruebas con imagen principal

La "imagen principal" es un archivo de imagen maestro que se considera la verdadera representación de un widget, un estado, una aplicación u otra imagen visual que hayas querido capturar. En Flutter 1.12, contamos con implementaciones de las clases GoldenFileComparator y LocalFileComparator que comparan usando píxeles en lugar de bits y eliminan los positivos falsos. Estas implementaciones nuevas destacan las diferencias visuales para dejar en claro cuándo hay discrepancias entre la imagen principal y las actualizaciones en etapa de prueba.


En este caso, es evidente que las diferencias entre ambas imágenes ocurren en los bordes, y esto facilita enormemente hacer el seguimiento correspondiente.

Comunidad

Además de todo el trabajo que se realiza en Flutter y sus herramientas, la comunidad de Flutter sigue guiando a la plataforma por nuevos e impresionantes caminos. Creamos un breve video para contarte qué están haciendo los desarrolladores en la comunidad.

Somos realmente afortunados de tener a este excelente grupo de desarrolladores en la comunidad de Flutter y todos nos sentimos orgullosos de ser parte del equipo.

Paquetes del programa Flutter Favorite

Cuando lanzamos Flutter 1.0 en diciembre de 2018, había aproximadamente 1000 paquetes en pub.dev compatibles con Flutter y eso nos parecía muchísimo. Hoy en día, esa cantidad se multiplicó más de seis veces. Son tantas las opciones que, a veces, es difícil elegir los paquetes adecuados. Como ayuda, es posible usar la puntuación general de pub.dev y la nueva función de publicadores verificados. Ahora, pub.dev comenzará a incluir un sistema de calificación para complementar esto.
De todos modos, nuestros usuarios piden constantemente que ofrezcamos un grupo de paquetes y complementos "recomendados". Esto nos llevó a desarrollar el programa Flutter Favorite.


Un paquete (o complemento) Flutter Favorite es el que nosotros creemos que debes priorizar cuando compilas una app. Con "nosotros", nos referimos al Comité del ecosistema de Flutter, un grupo de personas de diversas regiones que fueron seleccionadas del equipo de Flutter en Google y de la comunidad de Flutter en general para solucionar problemas en todo el ecosistema de Flutter. Su primera tarea fue definir un nivel alto de calidad e identificar un grupo inicial de paquetes que se ajustara a ese nivel. Los creadores de los paquetes seleccionados pueden usar el logotipo "Flutter Favorite" en la documentación de su paquete. Además, pub.dev se actualizó para que el logotipo aparezca en los resultados de búsqueda y en otros lugares.
Para obtener información detallada, consulta la página de Flutter Favorite en flutter.dev. También puedes consultar la lista completa de los paquetes de Flutter Favorite en pub.dev. En definitiva, si eres desarrollador de apps y ves el logotipo, confía en que el paquete funcionará correctamente. Si eres creador de paquetes y recibes el logotipo de Flutter Favorite, te agradecemos tus aportes al ecosistema de Flutter.

Herramientas comunitarias

Ahora que hablamos de aportes que nos enorgullecen, la comunidad de Flutter en general también está desarrollando una serie de herramientas excelentes. Estas son apenas algunas de ellas:

Flutter Device Preview
Widget Maker
Panache

Socio destacado de desarrollo de herramientas: Nevercode

Además de contar con un notable grupo de herramientas comunitarias, el ecosistema de Flutter también dispone de excelentes socios. Uno de ellos es Nevercode, que publicó todo un conjunto nuevo de funciones en su versión más reciente, lo que incluye un complemento de Visual Studio Code denominado Remote Mac.


La extensión de Remote Mac te permite conectarte directamente con una Mac alojada en la nube para probar código de Flutter de iOS y macOS. Para obtener información sobre la versión más actual de Nevercode, lo que incluye la nueva compatibilidad con Flutter en la Web y en macOS, las nuevas funciones empresariales y mucho más, consulta su entrada de blog más reciente.
Si quieres conocer qué avances están logrando otros socios de desarrollo de herramientas, no dudes en consultar las novedades de las versiones más recientes de Supernova, Rive y Adobe.

Conclusión

Sin duda, este fue un año increíble para Flutter y la versión 1.12 es un lanzamiento sorprendente. Esta entrada de blog es tan solo un resumen de las novedades de la versión más reciente. Si quieres echar un vistazo a tu versión con cambios favorita, ver qué cambios incorporamos en cada área para llegar a la versión actual o saber qué problemas afrontamos, te recomendamos consultar las notas de la versión de Flutter 1.12.
Ojalá estés de acuerdo con nosotros en que Flutter sigue la dirección correcta y está cada vez más al corriente de las tendencias. Con todas estas funciones y herramientas nuevas, ¿dónde quieres ejecutar tu app hoy?