Construye una aplicación de cronómetro en Flutter con interfaz de usuario personalizada y animaciones.

Aprende a utilizar los indicadores de Flutter, transformaciones de matriz y otros widgets personalizados para construir un clon de la aplicación iOS Stopwatch.

Lo que aprenderás

• Aprenderás sobre cómo crear interfaces de usuario de Flutter de alto rendimiento que se actualizan en cada cuadro a 60 fps
• Trabajar con widgets de diseño personalizados de Flutter: Stack, Align, Positioned, AspectRatio, LayoutBuilder, Transform
• Trabajar con transformaciones de matriz (escalar, rotar, traducir) para crear interfaces de usuario personalizadas de Flutter
• Construir un clon de la aplicación de cronómetro de iOS

Requisitos

• Ya deberías estar familiarizado con el lenguaje Dart y cómo construir aplicaciones sencillas de Flutter
• Ya deberías tener instalado el SDK de Flutter (2.0 o superior) y un IDE configurado para el desarrollo de Flutter
• Puedes utilizar el emulador de Android (en Windows) o el simulador de iOS (en macOS) para el desarrollo

Descripción

¿Quieres aprender a construir interfaces de usuario totalmente personalizadas y de alto rendimiento en Flutter?

Este curso práctico te enseñará exactamente eso, mostrándote cómo crear un clon de la aplicación de cronómetro de iOS desde cero.

Como parte de esto, aprenderás sobre los fundamentos del marco de animación de Flutter y construirás una interfaz de usuario completamente personalizada usando:

• Ticker y TickerProvider
• Transformaciones de matriz
• Stack, LayoutBuilder, AspectRatio, y otros widgets de diseño

¿Te gustaría:

• construir interfaces de usuario que rendericen cada cuadro, en sincronía con la tasa de refresco de la pantalla, y sin comprometer el rendimiento?
• rotar, escalar o traducir widgets, y combinarlos todos para construir interfaces de usuario personalizadas?

Entonces has venido al lugar correcto.

Este curso es corto y al grano. Pero te dará conocimientos valiosos y algunos trucos que te serán útiles en tus futuros proyectos de Flutter.

¿Cómo se ve el proyecto terminado?

Ve a ver la vista previa del video para obtener una visión completa del proyecto que construirás en este curso.

Otras cosas incluidas en el curso:

• Cómo cambiar entre el modo claro y oscuro
• Cómo gestionar el estado del cronómetro y empezar, parar, y reiniciar el temporizador
• Cómo optimizar el rendimiento de la aplicación
• Cómo construir código modular creando widgets pequeños y reutilizables
• Un desafío final para probar tus conocimientos

Preguntas frecuentes

¿Usaremos Flutter 2?
¡Sí! Todo el curso utiliza Flutter 2 con seguridad nula y lo mantendré actualizado.

¿Cuáles son los prerrequisitos del curso?
Ya deberías estar familiarizado con StatelessWidgets y StatefulWidgets, diseños comunes (Row, Column, Stack), y los fundamentos de la gestión de estado en Flutter.

Para quién es este curso:

Desarrolladores de Flutter que buscan construir diseños personalizados y animaciones basadas en tiempo.