UIFlow-Eingabe für 5-Tasten mit Makey: Unterschied zwischen den Versionen

Aus Attraktor Wiki

Wechseln zu: Navigation, Suche
K
Zeile 12: Zeile 12:
  
 
Diese Routine besteht aus drei Teilen. Ganz links ist das Hauptprogramm, ind der Mitte die Routine zur Darstellung auf dem Display und rechts die Routine, die einen Tastendruck von der 5-Tasten-Kombination holt, auswertet und ausführt.
 
Diese Routine besteht aus drei Teilen. Ganz links ist das Hauptprogramm, ind der Mitte die Routine zur Darstellung auf dem Display und rechts die Routine, die einen Tastendruck von der 5-Tasten-Kombination holt, auswertet und ausführt.
 +
 +
== Display-new ==
  
 
Die Funktion "display-new" löscht das Display und baut es neu auf.
 
Die Funktion "display-new" löscht das Display und baut es neu auf.
  
 
[[image:M5-Soft-5T0-003.png]]
 
[[image:M5-Soft-5T0-003.png]]
 +
 +
Zuerst wird das Display gelöscht. Dann wird mit dem Aufbau begonnen. Zuerst wird der blaue Balken hinter dem Titel gezeichnet und dann die Programmmeldung daraufgeschrieben. Diese Reihenfolge ist wichtig,da der Balken die Schrift sonst überdeckt. Die grafischen Elemente wurden mit dem Oberflächeneditor von UIFlow entworfen. Da das diese Editor die Ausrichtung auf dem Display nicht darstellt gestaltet sich der ein wenig kompliziert. Beim Einsatz des Titelelements und gedrehtem Display wird nur ein 80px breiter blauer Balken erzeugt. Deshalb habe ich diesen per dazugesetzt.
 +
 +
[[image:M5-Soft-5T0-004.png]]
 +
 +
Dann wird der Modus abgefragt in dem sich das Programm befindet. Modus 0 ist der normale Modus, Modus 1 der Eingabemodus. In diesem wird die gerade aktive Stelle der Eingabe grau hinterlegt. Im Modus 0 wird kein Cursor angezeigt.
 +
 +
[[image:M5-Soft-5T0-005.png]]
 +
 +
Anschliessend erfolgt die Anzeige des aktuellen Wertes. "Anzeige disp-wert show" ist erforderlich, damit der Wert auch sicher angezeigt wird. Ohne diesen Block hängt die Anzeige von irgendwelchen anderen Einflüssen ab.
 +
 +
[[image:M5-Soft-5T0-006.png]]
 +
 +
Schliesslich wird noch die Statusleiste erzeugt. Auch hier wieder zuerst der grüne Hintergrundbalken und dann der Text. In diesem Fall soll die Spannung an dem Gerät und die im Wärme umgesetzte Leistung angezeigt werden.
 +
 +
[[image:M5-Soft-5T0-007.png]]
 +
 +
Bei der Überschreitung eines Grenzwertes kann der Balken z.B. auf die Farbe rot umgestellt werden. Die Farbe kann im z.B. Hauptprogramm geändert werden.
 +
 +
[[image:M5-Soft-5T0-008.png]]
 +
 +
 +
== Das Hauptprogramm ==
 +
 +
 +
 +
 +
== Die Tastenabfrage und Auswertung ==
 +
 +
 +
  
  
  
 +
== Der grafische Oberflächeneditor ==
  
 
[[Category:M5Stack-Software]]
 
[[Category:M5Stack-Software]]

Version vom 8. März 2020, 17:55 Uhr

von Peter (peter@attraktor.org)

Bilderfrefix: M5-Soft-5T0-...

Der M5StickC ist zur Steuerung vieler Geräte ausreichend. Er hat jedoch ein Manko: Er besitzt nur 2 Tasten und nach den Einbau in ein Gehäuse nur noch eine. Ich habe deshalb eine Routine geschrieben mit der man 3 unterschiedliche Tastendrücke mit dieser einen Taste ausführen kann. Das ist aber nicht sonderlich komfortabel. Der Einsatz einer 5-Tasten-Kombination für rauf-runter-links-rechts-ok schein mir ein optimaler Konpromiss zwischen Bedienungskomfort und Platzbedarf. Deshalb habe ich eine Routine geschrieben, die eine Dateneingabe mit einer solchen Tasten-Kombi ermöglicht.

Konkret soll sie mir zur Eingabe von Stromwerten für eine Elektronische-Last dienen. Mit der 5-Tasten-Kombination lässt sich der Strom einstellen und mit der Taste A des M5StickC wird der Strom ein- und ausgeschaltet.

M5-Soft-5T0-002.png

Diese Bild gibt nur eine Übersicht. Die einzelnen Teile dieser Routine werden im Folgenden größer geteigt und ihre Funktion erklärt.

Diese Routine besteht aus drei Teilen. Ganz links ist das Hauptprogramm, ind der Mitte die Routine zur Darstellung auf dem Display und rechts die Routine, die einen Tastendruck von der 5-Tasten-Kombination holt, auswertet und ausführt.

Display-new

Die Funktion "display-new" löscht das Display und baut es neu auf.

M5-Soft-5T0-003.png

Zuerst wird das Display gelöscht. Dann wird mit dem Aufbau begonnen. Zuerst wird der blaue Balken hinter dem Titel gezeichnet und dann die Programmmeldung daraufgeschrieben. Diese Reihenfolge ist wichtig,da der Balken die Schrift sonst überdeckt. Die grafischen Elemente wurden mit dem Oberflächeneditor von UIFlow entworfen. Da das diese Editor die Ausrichtung auf dem Display nicht darstellt gestaltet sich der ein wenig kompliziert. Beim Einsatz des Titelelements und gedrehtem Display wird nur ein 80px breiter blauer Balken erzeugt. Deshalb habe ich diesen per dazugesetzt.

M5-Soft-5T0-004.png

Dann wird der Modus abgefragt in dem sich das Programm befindet. Modus 0 ist der normale Modus, Modus 1 der Eingabemodus. In diesem wird die gerade aktive Stelle der Eingabe grau hinterlegt. Im Modus 0 wird kein Cursor angezeigt.

M5-Soft-5T0-005.png

Anschliessend erfolgt die Anzeige des aktuellen Wertes. "Anzeige disp-wert show" ist erforderlich, damit der Wert auch sicher angezeigt wird. Ohne diesen Block hängt die Anzeige von irgendwelchen anderen Einflüssen ab.

M5-Soft-5T0-006.png

Schliesslich wird noch die Statusleiste erzeugt. Auch hier wieder zuerst der grüne Hintergrundbalken und dann der Text. In diesem Fall soll die Spannung an dem Gerät und die im Wärme umgesetzte Leistung angezeigt werden.

M5-Soft-5T0-007.png

Bei der Überschreitung eines Grenzwertes kann der Balken z.B. auf die Farbe rot umgestellt werden. Die Farbe kann im z.B. Hauptprogramm geändert werden.

M5-Soft-5T0-008.png


Das Hauptprogramm

Die Tastenabfrage und Auswertung

Der grafische Oberflächeneditor

Von „https://wiki.attraktor.org/index.php?title=UIFlow-Eingabe_für_5-Tasten_mit_Makey&oldid=34017“