Nextion Tutorial #7 – Animation erstellen

Nextion Tutorial #7 – Animation erstellen

In diesem Beitrag geht es darum wie Ihr Animation auf dem Nextion Display darstellen könnt.

Ich zeige es für alle Modelle, Basic, Discovery, Enhanced und Intelligent.


Inhaltsverzeichnis

  1. Was wird für das Projekt benötigt.
  2. Animation für Basic, Discovery und Enhanced Modelle
  3. Animation auf dem Intelligent Modell



1. Was wird für das Projekt benötigt.

Ihr braucht ein Nextion Display eurer Wahl.

1x Nextion 3.5″ Discovery Touch Display 480×320 HMI – NX4832F035 - https://ap-url.de/nextion35d
1x Nextion 3.5″ Enhanced Touch Display 480×320 HMI – NX4832K035 - https://ap-url.de/nextion35e
1x Nextion 5" Intelligent Touch Display 800x600 HMI - https://ap-url.de/nextio5




2.Animation für Basic, Discovery und Enhanced Modelle

Als erstes benötigt Ihr die Bilder die zur Animation führen soll. In meinem Fall 21 Bilder mit wandernden Schrift. Es können mehr aber auch weniger Bilder sein, je nachdem wie aufwendig die Animation ist.


Diese 21 Bilder müssen nun in der Nextion Software importiert werden. Dazu auf das + klicken und die Bilder auswählen.


Als nächstes wählen wir aus der Toolbox Picture aus und tragen in den Attributen bei pic eine 0 ein für das 1. Bild.
Somit ist das 1. Bild ausgewählt.


Nun brauchen wir noch einen Timer und eine Variable, diese wählen wir wieder aus der Toolbox aus. Die Variable muss nicht angepasst werden, Sie kann bleiben wie sie ist.


In den Attributen des Timers lässt sich die Zeit über den tim einstellen. Der en ist zum aktivieren und deaktivieren da, somit kann die Animation gestoppt und gestartet werden. Der en lässt sich auch über den Arduino steuern.


Nun muss nur noch im Timer Event dieser Code reingeschrieben werden und dann ist es schon Fertig.

p0.pic=va0.val
va0.val=va0.val+1
if(va0.val>20)
{
  va0.val=0
}


Mit dem Code wird der Quellwert für das Bild in p0.pic durch den va0.val ersetzt. va0.val wird dann um 1 erhöht und mit der If abfrage werden die 20 (21 weil mit 0 begonnen wird) gezählt und dann wieder auf 0 gesetzt wenn die 21 erreicht ist. Jetzt braucht Ihr den Code nur noch auf das Display laden und schon funktioniert es.




3.Animation auf dem Intelligent Modell

Beim Intelligent Display ist es etwas einfacher. Ihr muss euch erst ein Gmov erzeugen und das geht so.

Beim Intelligent Display ist es etwas einfacher. Ihr muss euch erst ein Gmov erzeugen und das geht so. Dazu unter Tools -> Open GmovMaker wählen.


Auf Add klicken und eure Bilder auswählen, noch die gewünschte Aubspielgeschwindigkeit auswählen und speichern.


Nun das erzeugt Gmov in euer Projekt importieren. Dazu auf das + klicken und die Datei auswählen.



Jetzt das Gmov aus der Toolbox wählen und die Datei unter vid auswählen.


Und das war es schon, die Animation ist fertig. Nur noch auf das Display laden und fertig.








Folgende Bauteile wurden verwendet:

1x Nextion 3.5″ Discovery Touch Display 480×320 HMI – NX4832F035 - https://ap-url.de/nextion35d
1x Nextion 3.5″ Enhanced Touch Display 480×320 HMI – NX4832K035 - https://ap-url.de/nextion35e
1x Nextion 5" Intelligent Touch Display 800x600 HMI - https://ap-url.de/nextio5

Arduino Nextion Display

Hinterlassen Sie einen Kommentar

Bitte beachten Sie, dass Kommentare vor der Veröffentlichung genehmigt werden müssen.