Zum Inhalt springen

Animationen ​

Mit Animationen fügst du Embedded-Screens fertige monochrome Frame-Animationen hinzu, ohne jedes Frame von Hand zu zeichnen. Sie stehen auf Plattformen zur Verfügung, die Code für die Animationswiedergabe erzeugen können.

Animation hinzufügen ​

Wähle das Werkzeug Bild und dann Animation. Lopaka öffnet den Animations-Browser mit Kategorie-Tabs, einem Suchfeld sowie Steuerelementen für Größe und Detailstufe. Unterstützt die aktive Plattform keine Code-Generierung für Animationen, ist die Option Animation ausgeblendet.

Durchstöbere über die Kategorie-Tabs die integrierten Animationen oder tippe ins Suchfeld, um Animationen kategorieübergreifend nach Namen zu filtern. Während der Suche bleiben nur Kategorien mit passenden Animationen sichtbar. Fahre mit der Maus über ein Vorschaubild, um die Bewegung vor dem Einfügen anzusehen.

Klicke auf eine Animation, um sie in der Mitte der Zeichenfläche einzufügen. Lopaka erstellt eine Animationsebene, deren Name sich aus der Animation, der gewählten Größe und der Anzahl der Frames zusammensetzt, zum Beispiel sun-weather 48x48 14f.

Größe und Detailstufe ​

Die Größensteuerung legt die Frame-Abmessungen fest: 32 x 32, 48 x 48 oder 64 x 64 Pixel. Größere Formate sind auf dem Display besser lesbar, benötigen aber mehr Firmware-Daten.

Die Detailsteuerung legt fest, wie viele Frames aus der Quellanimation übernommen werden:

DetailstufeFramesWann verwenden
Hoch28Flüssigste Bewegung, wenn der Flash-Speicher es zulässt
Mittel14Ausgewogen zwischen Bewegung und Code-Größe
Niedrig7Kleinste Ausgabe bei knappem Speicher

Der Browser zeigt für die gewählte Größe und Detailstufe eine geschätzte Größe der Firmware-Daten an. Prüfe diese Schätzung, bevor du große Animationen einfügst – besonders auf kleinen monochromen Geräten.

Lopaka merkt sich die zuletzt gewählte Größe und Detailstufe, sodass der Animations-Browser beim erneuten Öffnen dieselben Einstellungen verwendet.

Video importieren ​

Wähle das Werkzeug Bild, dann Datei hochladen und lade ein MP4-, MOV- oder WebM-Video. Wähle Frame-Größe, Verarbeitungseinstellungen und Ausgabe-Framerate und klicke dann auf Importieren, um eine Animationsebene zu erstellen. Unterstützte Videoformate und Grenzen findest du unter Bilder importieren.

Verhalten auf der Zeichenfläche ​

Eine Animationsebene verhält sich beim Positionieren, Anordnen, Auswählen und Löschen wie eine normale Ebene. Solange die Ebene nicht ausgewählt ist, zeigt die Zeichenfläche ihr erstes Frame als statische Bitmap. Wenn du die Ebene auswählst, spielt Lopaka die Vorschau der Animation im vorgesehenen Timing ab.

Hebst du die Auswahl der Ebene auf, stoppt die Wiedergabe und springt zum ersten Frame zurück. So bleibt der Editor ruhig, und du kannst die Animation trotzdem im Kontext prüfen.

Erzeugter Code ​

Animationsebenen erzeugen Frame-Daten und Wiedergabelogik. Die genaue Ausgabe hängt von der Plattform und von der Code-Einstellung Animations-Hilfsfunktionen ab.

Wenn Animations-Hilfsfunktionen aktiviert ist, erzeugt Lopaka Hilfscode, der die Frames im Lauf der Zeit weiterschaltet. Die erzeugte Hilfsfunktion updateAnimations() verfolgt die verstrichene Zeit und aktualisiert das aktuelle Frame jeder Animation anhand ihrer Verzögerung. Plattformen, die das Zeichnen von Animationen bündeln, erhalten zusätzlich eine Hilfsfunktion drawAnimations(), die updateAnimations() aufruft und jede Animation in ihrem aktuellen Frame zeichnet.

In der Vorlage Arduino (C++) von AdafruitGFX, ArduinoGFX und TFT_eSPI fügt Lopaka eine loop()-Funktion hinzu, die die Zeichen-Hilfsfunktion für Animationen aufruft. So laufen kopierte Sketches direkt nach dem Setup los, und die Frames werden mit millis() getaktet. Ihre Vorlage ESP-IDF (C++) erzeugt kein setup() / loop(): Die Frames werden mit esp_timer_get_time() getaktet, und du rufst drawAnimations() aus der Schleife deines eigenen Tasks auf. Bei U8g2-Ausgabe aktualisiert die erzeugte Schleife die Animations-Frames, bevor die U8g2-Bildschleife firstPage() / nextPage() läuft. Bei U8g2-Ausgabe für ESP-IDF hält Lopaka den Code einbettbar und legt keine app_main()-Funktion für dich an. Die Flipper-Ausgabe wählt das aktuelle Frame jeder Animation anhand der Systemlaufzeit und enthält eine Schleife, die das Neuzeichnen des Viewports anfordert.

Enthält ein Screen statische Ebenen rund um eine Animation, bleibt die Reihenfolge der Ebenen erhalten. Auf Plattformen mit gebündeltem Zeichnen wird drawAnimations() an der Stelle eingefügt, an der die erste Animationsebene im Stapel steht. Bei U8g2 werden Animationsebenen der Reihe nach direkt aus der Zeichenfunktion des Screens gezeichnet.

Wenn Animations-Hilfsfunktionen deaktiviert ist, werden die Frame-Daten der Animation als statische Arrays eingebettet. Lopaka erzeugt dann keine Animations-Includes, kein updateAnimations(), kein drawAnimations() und keine Wiedergabe-loop(). Nutze diesen Modus, wenn du die Wiedergabe selbst steuern willst.

Animationsdateien ​

Die Code-Einstellungen listen herunterladbare Animationsanhänge auf, sobald ein Screen Animationsebenen verwendet. Lade diese Dateien zusammen mit dem erzeugten Quellcode herunter und lege sie so neben deinen Sketch oder deine Projektdateien, wie es deine Plattform verlangt. Flipper-Anhänge sind C-Header mit XBM-Frame-Daten und benötigen weder Arduino noch PROGMEM.

Die erzeugten Zeichenaufrufe verweisen per Namen auf die Frame-Daten der Animation. Fehlt der Anhang in deinem Firmware-Projekt, lässt sich der erzeugte Code nicht kompilieren oder die Animations-Frames stehen zur Laufzeit nicht zur Verfügung.