Konfigurieren, das heißt:
- Eine neue Datei der Kategorie Display öffnen, über das Seitensymbol mit dem Plus oben links
- Die gewünschten Elemente auf den gerasterten Bereich ziehen (er stellt den konfigurierbaren Teil des Displays dar)
- Bei Bedarf Spezifikationen anpassen.
Programmieren, das heißt:
- Im Hauptprogramm mit den Blöcken der Kategorie Display die Wirkung von Interaktion mit dem Display programmieren.

Blöcke

Beschriftungsfeld

Mit dem Element "Beschriftungsfeld" kann man einen Text auf dem Bildschirm platzieren. Das Symbol im Anzeigekonfigurator ist das Etikett. Zieht man dieses Symbol in den gerasterten Bereich, öffnet sich rechts ein Fenster. Hier kann unter Inspektor

die Größe des Beschriftungsfelds in Pixeln,
die Position des Beschriftungsfelds in Pixeln (auf dem angegebenen Punkt liegt die obere linke Ecke des Textfeldes),
der Name des Beschriftungsfelds und
der Inhalt des Beschriftungsfelds (dieser Text wird bei Start des Displays abgebildet)

festgelegt werden.

Mit dem Block "setze Beschriftungsfeld [] Text ..." lässt sich der abgebildete Text im Laufe des Programms ändern. Um den aktuellen Text des Beschriftungsfelds zu erhalten, kann der Block "hole Beschriftungsfeld [] Text" verwendet werden. Dies ist nützlich, um den Text zu lesen und in anderen Teilen des Programms zu verwenden oder zu überprüfen.

Eingaben

Das Element "Eingabe" erlaubt es, dass Nutzer*innen über den Controller Text eingeben. Das zugehörige Symbol im Anzeigekonfigurator ist das "T" Zeichen. Zieht man dieses Symbol in den gerasterten Bereich, öffnet sich rechts ein Fenster. Hier kann unter Inspektor

die Größe des Eingabefeldes in Pixeln,
die Position des Eingabefeldes in Pixeln (auf dem angegebenen Punkt liegt die obere linke Ecke des Eingabefeldes),
der Name des Eingabefeldes und
der Inhalt des Eingabefeldes (dieser Text wird bei Start des Displays abgebildet)

festgelegt werden.

Mit dem Block "setze Eingabefeld [] Text ..." lässt sich der abgebildete Text im Laufe des Programms ändern. Um den Text aus dem Eingabefeld abzurufen, wird der Block "hole Eingabefeld [] Text" verwendet.

Eingabe-Programm

Das Eingabe-Programm läuft ab, wenn eine Eingabe abgeschlossen wurde. Es wird separat vom Hauptprogramm geschrieben. Variablen funktionieren global über beide Programme hinweg. Das Eingabe-Programm läuft im Block "wenn Eingabe [] abgeschlossen" ab. Der "Ereignis ~~...~~[]"-Block wird im Eingabe-Programm auf "text" gesetzt. In diesem Beispiel wird die Variable "Name" auf den eingegebenen Text gesetzt, sie wird dann im Hauptprogramm genutzt, um den eingegebenen Text auszugeben:

Ereignisabfrage

Der Block "Ereignis ~~...~~[]" ruft den Rückgabewert eines Elements ab. Dieser Block kann nur in den Ereignisprogrammen genutzt werden. In diesen Ereignisprogrammen bezieht sich der Block automatisch auf das Ereignis, in dessen Programm er verwendet wird. Der geeignete Typ für den Rückgabewert kann über das Dropdown-Menü (kleines Dreieck) gewählt werden:

Messinstrument

Die "Messinstrument"-Funktion kann Werte (keine Werte kleiner 1) darstellen. Das zugehörige Symbol im Displaykonfigurator ist die Skalierung. Zieht man dieses Symbol in den gerasterten Bereich, öffnet sich rechts ein Fenster. Hier kann unter Inspektor

die Größe des Messinstruments in Pixeln,
die Position des Messinstruments in Pixeln (auf dem angegebenen Punkt liegt die obere linke Ecke der Messlehre),
der Name des Messinstruments,
die Ausrichtung des Messinstruments
der Wertebereich, den das Messinstrument darstellt, und
der Wert des Messinstruments, der bei Start des Displays gezeigt wird

festgelegt werden.

Mit dem Block "setze Messinstrument [] auf ~~Wert"~~Wert ..." lässt sich das Messinstrument auf den eingegebenen Wert setzen. Dieser Wert sollte im vorher definierten Wertebereich liegen. Liegt der Wert außerhalb des Wertebereichs, wird, je nachdem, ob der Wert zu groß oder zu klein ist, eine der Grenzen des Wertebereichs dargestellt. Um den aktuellen Wert des Messinstruments abzurufen, wird der Block "hole Messinstrument [] Wert" verwendet.

Statusanzeige

Der Statusindikator zeigt die Aktivität von etwas an. Je nach Status leuchtet er ("aktiv") oder tut dies nicht ("inaktiv"). Das Symbol im Displaykonfigurator ist eine leuchtende Diode. Zieht man dieses Symbol in den gerasterten Bereich, öffnet sich rechts ein Fenster. Hier kann unter Inspektor

die Größe der Statusanzeige in Pixeln,
die Position der Statusanzeige in Pixeln (auf dem angegebenen Punkt liegt die obere linke Ecke des Statusindikators),
der Name der Statusanzeige,
die Farbe der Statusanzeige und
ob die Statusanzeige zu Beginn aktiv oder inaktiv sein soll,

festgelegt werden.

Mit dem Block "setze Statusanzeige ~~aktiv"~~[] aktiv ..." lässt sich die Statusanzeige aktivieren bzw. deaktivieren. Im Dropdown-Menü (kleines Dreieck) lässt sich wählen, ob die Statusanzeige auf aktiv oder inaktiv gesetzt werden soll. Um den aktuellen Status der Statusanzeige zu überprüfen, kann der Block "ist die Statusanzeige [] aktiv" verwendet werden.

Schieberegler

Der Schieberegler gibt Werte abhängig von seiner Position zurück. Die Position kann dabei vom Nutzer*innen über den Touchscreen verändert werden. Der Wert kann über den "Ereignis []"-Block abgerufen werden, sobald der Schieberegler ruht. Der abgerufene Wert ist eine Dezimalzahl. Will man den Wert des Schiebereglers ganzzahlig haben, muss man den "runde"-Block einsetzen. Das zugehörige Symbol für den Schieberegler ist der Strich mit dem Kreis. Zieht man dieses Symbol in den gerasterten Bereich, öffnet sich rechts ein Fenster. Hier kann unter Inspektor

die Größe des Schiebereglers in Pixeln,
die Position des Schiebereglers in Pixeln (auf dem angegebenen Punkt liegt dann die obere linke Ecke des Schiebereglers)
der Name des Schiebereglers,
die Aktivität des Schiebereglers,
die Ausrichtung des Schiebereglers,
den Wertebereich, der über den Schieberegler abgedeckt wird und
der Wert, auf dem der Regler bei Start des Displays steht

festgelegt werden.

Mit dem Block "~~Setze~~setze Schieberegler ~~Wert"~~[] Wert ... " kann der Wert des Schiebereglers geändert werden. Mit dem Block "Setze Schieberegler aktiviert" kann die Aktivität des Schiebereglers über das Dropdown-Menü geändert werden, wobei zwischen "aktiviert" und "deaktiviert" gewählt werden kann.

Um den aktuellen Wert des Schiebereglers zu erhalten, wird der Block "~~Hole~~hole Schieberegler ~~Wert"~~[] Wert ..." verwendet. Dieser Block gibt den aktuellen Wert des Schiebereglers als Dezimalzahl zurück. Um den Aktivitätsstatus des Schiebereglers zu überprüfen, kann der Block "~~Ist~~ist Schieberegler [] aktiv" verwendet werden. Dieser Block gibt einen Booleschen Wert zurück, der angibt, ob der Schieberegler aktiv ist.

Schieberegler-Programm

Das Schieberegler-Programm läuft ab, nachdem der Schieberegler verschoben wurde. Es wird separat vom Hauptprogramm geschrieben. Variablen funktionieren global über beide Programme hinweg. Das Schieberegler-Programm läuft im Block "wenn Schieberegler [] bewegt" ab. Der "Ereignis []"-Block wird im Schieberegler-Programm auf "value" gesetzt. In diesem Beispiel wird die Geschwindigkeit des Motors über den Schieberegler gesteuert. Der Wert des Schiebereglers muss gerundet werden, da der Motor nur ganze Zahlen als Drehzahl akzeptiert:

Schaltfläche

Die Schaltfläche ist ein beschriftetes Feld, das gedrückt werden kann. Drückt man die Schaltfläche, läuft das Schaltflächen-Programm ab, sobald sie wieder losgelassen wird. Das zugehörige Symbol für die Schaltfläche ist das Quadrat mit der "OK" Beschriftung. Zieht man dieses Symbol in den gerasterten Bereich, öffnet sich rechts ein Fenster. Hier kann unter Inspektor

die Größe der Schaltfläche in Pixeln,
die Position der Schaltfläche in Pixeln (auf dem angegebenen Punkt liegt die obere linke Ecke des Knopfes),
der Name der Schaltfläche,
den Text, der auf der Schaltfläche steht und
die Aktivität der Schaltfläche

festgelegt werden.

Mit dem Block "setze Schaltfläche [] aktiviert []..." kann man die Aktivität über das Dropdown-Menü (kleines Dreieck) wechseln. Um zu überprüfen, ob die Schaltfläche aktiv ist, kann der Block "ist Schaltfläche aktiviert" verwendet werden.

Schaltflächen-Programm

Das Schaltflächen-Programm läuft ab, sobald die Schaltfläche nicht mehr gedrückt ist. Es wird separat vom Hauptprogramm geschrieben. Variablen funktionieren global über beide Programme hinweg. Das Schaltflächen-Programm läuft im Block "wenn Schaltfläche [] angeklickt" ab. Der "Ereignis []"-Block kann im Schaltflächen-Programm nicht verwendet werden, da die Schaltfläche keinen Rückgabewert hat. In diesem Beispiel wird die LED aktiviert, wenn die Schaltfläche gedrückt wurde.

Schalter

Der Schalter kann zwei Positionen einnehmen und befindet sich immer in genau einer dieser beiden Positionen. Je nach Position gibt er ~~"wahr"~~wahr oder ~~"falsch"~~falsch zurück. Das zugehörige Symbol für den Schalter ist das Oval mit dem Punkt. Zieht man dieses Symbol in den gerasterten Bereich, öffnet sich rechts ein Fenster. Hier kann unter Inspektor

die Größe des Schalters in Pixeln,
die Position des Schalters in Pixeln (auf dem angegebenen Punkt liegt die obere linke Ecke des Schalters),
der Name des Schalters,
den Text, der neben dem Schalter steht,
die Aktivität des Schalters und
den Zustand in dem sich der Schalter bei Start des Programms befinden soll

angepasst werden.

Der Block

übernimmt zwei Funktionen. Man kann entweder die Aktivität (enabled im Dropdown-Menü wählen) oder den Zustand (checked im Dropdown-Menü wählen) auf ~~"wahr"~~wahr oder ~~"falsch"~~falsch setzen. Um den aktuellen Zustand des Schalters abzufragen, wird der Block "ist Schalter ~~eingeschaltet"~~[] []" verwendet.

Schalter-Programm

Das Schalter-Programm läuft jedes Mal ab, wenn der Schalter umgelegt wird. Es wird separat vom Hauptprogramm geschrieben. Variablen funktionieren global über beide Programme hinweg. Das Schalter-Programm läuft im Block "wenn Schalter [] umgeschaltet" ab. Der "Ereignis []"-Block wird im Schalter-Programm auf "checked" gesetzt, er gibt ~~"wahr"~~wahr oder ~~"falsch"~~falsch zurück. Dieses Beispielprogramm schaltet die LED ein, wenn der Schalter umgelegt ist, andernfalls wird die LED ausgeschaltet:

Kontrollkästchen

Das Kontrollkästchen kann zwei Zustände annehmen und befindet sich immer in genau einem dieser beiden. Je nach Zustand gibt es ~~"wahr"~~wahr oder ~~"falsch"~~falsch zurück. Das Symbol für das Kontrollkästchen ist das Quadrat mit dem Haken. Zieht man dieses Symbol in den gerasterten Bereich, öffnet sich rechts ein Fenster. Hier kann unter Inspektor

die Größe des Kontrollkästchens in Pixeln,
die Position des Kontrollkästchens in Pixeln (auf dem angegebenen Punkt liegt die obere linke Ecke des Kontrollkästchens),
der Name des Kontrollkästchens,
den Text, der neben dem Kontrollkästchen steht,
die Aktivität des Kontrollkästchens und
den Zustand in dem sich das Kontrollkästchen bei Start des Programms befinden soll

festgelegt werden.

Der folgende Block übernimmt zwei Funktionen. Über das Dropdown-Menü (kleines Dreieck) kann gewählt werden, welche man nutzt. Man kann entweder die Aktivität (enabled im Dropdown-Menü wählen) oder den Zustand (checked im Dropdown-Menü wählen) auf ~~"wahr"~~wahr oder ~~"falsch"~~falsch setzen.

Um den aktuellen Zustand des Kontrollkästchens abzufragen, wird der Block "ist Kontrollkästchen ~~markiert"~~[] []" verwendet. ~~Dieser Block gibt einen Booleschen Wert zurück, der anzeigt, ob das Kontrollkästchen markiert ist.~~

Kontrollkästchen-Programm

Das Kontrollkästchen-Programm läuft jedes Mal ab, wenn das Kontrollkästchen gedrückt wird. Es wird separat vom Hauptprogramm geschrieben. Variablen funktionieren über beide Programme hinweg. Das Kontrollkästchen-Programm läuft im Block "wenn Kontrollkästchen [] umgeschaltet" ab. Der "Ereignis []"-Block wird im Schalter-Programm auf "checked" gesetzt, er gibt ~~"wahr"~~wahr oder ~~"falsch"~~falsch zurück. Dieses Beispielprogramm schaltet die LED ein, wenn das Kontrollkästchen angehakt ist, andernfalls wird die LED ausgeschaltet.

Bild

Der "setze ~~Bild"~~Bild [] Base64-Bild ... " Block erlaubt es, ein Bild zu ändern, indem ein Base64-codierter Bildstring verwendet wird. Der Vorteil dieses Blocks ist die Fähigkeit, dynamisch verschiedene Bilder anzeigen zu können, indem einfach der Base64-String geändert wird. Dies ermöglicht eine flexible Anpassung der Bildinhalte zur Laufzeit.

Hinweis: Base64 ist eine Kodierungsmethode, die dazu dient, binäre Daten in eine Zeichenkette aus lesbaren ASCII-Zeichen zu konvertieren. Diese Kodierung wird häufig verwendet, um Daten, die ursprünglich in einem binären Format vorliegen, wie z.B. Bilder oder Audiofiles, in Formate zu übertragen, die ausschließlich Text verarbeiten können.