Ir al contenido

Animaciones ​

Las animaciones te permiten agregar animaciones monocromáticas por fotogramas, listas para usar, a pantallas embebidas sin dibujar cada fotograma a mano. Están disponibles en las plataformas que pueden generar código de reproducción de animaciones.

Agregar una animación ​

Selecciona la herramienta Imagen y elige Animación. Lopaka abre el explorador de animaciones, con pestañas de categorías, un campo de búsqueda y controles de tamaño y de detalle. Si la plataforma activa no admite la generación de código de animaciones, la opción Animación no aparece.

Usa las pestañas de categorías para recorrer el conjunto de animaciones integradas, o escribe en el campo de búsqueda para filtrar animaciones por nombre en todas las categorías. Mientras buscas, solo quedan visibles las categorías con animaciones que coinciden. Pasa el cursor sobre una miniatura para ver el movimiento antes de colocarla.

Haz clic en una animación para agregarla al centro del lienzo. Lopaka crea una capa de animación cuyo nombre se forma con la animación, el tamaño seleccionado y la cantidad de fotogramas; por ejemplo, sun-weather 48x48 14f.

Tamaño y detalle ​

El control de tamaño define las dimensiones de los fotogramas: 32 x 32, 48 x 48 o 64 x 64 píxeles. Los tamaños más grandes se leen mejor en la pantalla, pero ocupan más datos en el firmware.

El control de detalle define cuántos fotogramas se conservan de la animación original:

DetalleFotogramasCuándo usarlo
Alta28El movimiento más fluido, si la memoria flash lo permite
Media14Equilibrio entre fluidez y tamaño del código
Baja7La salida más pequeña, cuando la memoria es escasa

El explorador muestra un tamaño estimado de los datos de firmware para el tamaño y el detalle seleccionados. Revisa esta estimación antes de colocar animaciones grandes, sobre todo en dispositivos monocromáticos pequeños.

Lopaka recuerda el último tamaño y detalle que elegiste, así que al volver a abrir el explorador de animaciones se mantienen los mismos ajustes.

Importar un video ​

Selecciona la herramienta Imagen, elige Subir archivo y carga un video MP4, MOV o WebM. Elige el tamaño de los fotogramas, los ajustes de procesamiento y la frecuencia de fotogramas de salida, y luego selecciona Importar para crear una capa de animación. Consulta Importar imágenes para ver los formatos de video admitidos y sus límites.

Comportamiento en el lienzo ​

Una capa de animación se comporta como una capa normal en cuanto a posición, orden, selección y eliminación. Cuando la capa no está seleccionada, el lienzo muestra su primer fotograma como un mapa de bits estático. Cuando seleccionas la capa, Lopaka reproduce la vista previa de la animación con su temporización prevista.

Al quitar la selección de la capa, la reproducción se detiene y vuelve al primer fotograma. Así el editor se mantiene tranquilo y aun así puedes comprobar la animación en su contexto.

Código generado ​

Las capas de animación generan los datos de los fotogramas y la lógica de reproducción. La salida exacta depende de la plataforma y del ajuste de código Funciones auxiliares de animación.

Cuando Funciones auxiliares de animación está activado, Lopaka genera código auxiliar que avanza los fotogramas con el tiempo. La función auxiliar generada updateAnimations() lleva la cuenta del tiempo transcurrido y actualiza el fotograma actual de cada animación según su retardo. Las plataformas que agrupan el dibujo de animaciones también reciben una función auxiliar drawAnimations(), que llama a updateAnimations() y dibuja cada animación en su fotograma actual.

En la plantilla Arduino (C++) de AdafruitGFX, ArduinoGFX y TFT_eSPI, Lopaka agrega una función loop() que llama a la función auxiliar de dibujo de animaciones, para que los sketches copiados puedan reproducirse justo después de la configuración; los fotogramas se temporizan con millis(). Su plantilla ESP-IDF (C++) no genera setup() / loop(): los fotogramas se temporizan con esp_timer_get_time() y tú llamas a drawAnimations() desde el bucle de tu propia tarea. En la salida de U8g2, el bucle generado actualiza los fotogramas de las animaciones antes de ejecutar el bucle de imagen firstPage() / nextPage() de U8g2. En la salida de U8g2 para ESP-IDF, Lopaka mantiene el código integrable y no crea una función app_main() por ti. La salida de Flipper usa el tiempo de actividad del sistema para elegir el fotograma actual de cada animación e incluye un bucle que solicita el redibujado del viewport.

Si una pantalla contiene capas estáticas alrededor de una animación, Lopaka respeta el orden de las capas. En las plataformas con dibujo agrupado, drawAnimations() se inserta donde aparece la primera capa de animación en la pila. En U8g2, las capas de animación se dibujan directamente, en orden, desde la función de dibujo de la pantalla.

Cuando Funciones auxiliares de animación está desactivado, los datos de los fotogramas se incrustan como arreglos estáticos. Lopaka no genera los includes de animación, updateAnimations(), drawAnimations() ni un loop() de reproducción. Usa este modo cuando quieras gestionar la reproducción por tu cuenta.

Archivos de animación ​

Los ajustes de código muestran los archivos adjuntos de animación descargables cuando una pantalla usa capas de animación. Descarga estos archivos junto con el código fuente generado y colócalos junto a tu sketch o a los archivos de tu proyecto, según lo que requiera tu plataforma. Los adjuntos de Flipper son encabezados C con los datos de los fotogramas en XBM y no requieren Arduino ni PROGMEM.

Las llamadas de dibujo generadas hacen referencia por nombre a los datos de los fotogramas de la animación. Si falta el adjunto en tu proyecto de firmware, el código generado no compilará o los fotogramas de la animación no estarán disponibles en tiempo de ejecución.