


Mit Hilfe einer Fernbedienung wird auf einem TFT-Monitor ein Ball durch ein kleines Labyrinth bewegt. Beim Druck auf die *-Taste wird die Zeitmessung gestartet
So sieht es aus:
Benötigte Bauteile:
- Keyes Fernbedienung
- Infrarotempfänger
- Adafruit 1,8 Zoll TFT ST7735
- Leitungsdrähte
Baue die Schaltung auf:

1 -> Gnd -> GND
2 -> VCC -> 5V
3 -> RESET -> D9
4 -> D/C -> D8
5 -> CARD_CS (nicht angeschlossen)
6 -> TFT_CS -> D10
7 -> MOSI -> D11
8 -> SCK -> D13
9 -> MISO (nicht angeschlossen)
10 -> LITE ->5V
Pinbelegung Adafruit 1,8 Zoll TFT ST7735
Achte auf die Pinbelegung des Infrarotempfängers.

Achte darauf, dass die Batterie richtig eingelegt wurde. Der Minus-Pol liegt oben.

Die Anleitung bezieht sich auf die Version 3.x der Bibliothek IRremote.

🔗 Anpassung von der Version 2.7x zu 3.x (externer Link, abgerufen am 5.6.2022)

🔗 Umwandlung von Zahlensystem (externer Link, abgerufen am 5.6.2022)
Die Fernbedienung sendet beim Druck auf die Tasten einen Zahlencode.

Die Tastencodes beziehen sich auf die Keyes-Fernbedienung.

Tastencodes Keyes-Fernbedienung (hexadezimal und dezimal)
oben | links | rechts | unten | OK | 1 | 2 | 3 | 4 |
0×46 70 | 0×44 68 | 0×43 67 | 0×15 21 | 0×40 64 | 0×16 22 | 0×19 25 | 0xD 13 | 0xC 12 |
5 | 6 | 7 | 8 | 9 | + | 0 | # | |
0×18 24 | 0x5E 94 | 0×8 8 | 0x1C 28 | 0x5A 90 | 0×42 66 | 0×52 82 | 0x4A 74 |
Die Tastencodes kannst du mit folgendem Programm herausfinden. Sie werden im Seriellen Monitor angezeigt.
# include <IRremote.h>
int EmpfaengerPin = 6;
void setup()
{
Serial.begin(9600);
// auf serielle Verbindung warten
while (!Serial) {;}
// Empfänger starten
IrReceiver.begin(EmpfaengerPin);
}
void loop()
{
// Daten lesen
if (IrReceiver.decode())
{
/*
printIRResultMinimal zeigt die verwendete Taste
P = Protokoll
C = Kommando in Hex
*/
Serial.print(F("P = Protokoll C = Taste hexadezimal: "));
IrReceiver.printIRResultMinimal(&Serial);
Serial.print(F(" Dezimal: "));
Serial.println(IrReceiver.decodedIRData.command);
delay(200);
// nächsten Wert lesen
IrReceiver.resume();
}
}

Die rot umrandeten Werte werden von der Keyes-Fernbedienung ausgegeben, die blau umrandeten stammen von einer TV-Fernbedienung.
Benötigte Bibliotheken:
Arduino IDE 1.8x:
Sketch → Bibliothek einbinden → Bibliotheken verwalten



Arduino IDE 2.x:


Methoden der Bibliothek Adafruit ST7735/TFT
Methode | Anweisung | Parameter |
---|---|---|
TFT starten | begin(); | |
Farbschema bestimmen | initR(initR(INITR_*TAB);); | BLACKTAB GREENTAB REDTAB |
Bildschirm ausrichten | setRotation(Richtung); | Richtung = 0 → nicht drehen Richtung = 1 → 90° drehen Richtung = 2 → 180° drehen Richtung = 3 → 270 ° drehen |
Bildschirmhintergrund | fillScreen(Farbe); | Bildschirmhintergrund füllen |
Linie zeichnen | drawLine(StartX, StartY, EndeX, EndeY, Farbe); | |
horizontale Linie zeichnen | drawFastHLine(StartX, StartY, Länge, Farbe); | |
vertikale Linie zeichnen | drawFastVLine(StartX, StartY, Länge, Farbe); | |
Rechteck zeichnen | drawRect(StartX, StartY,, Breite, Höhe, Farbe); | |
abgerundetes Rechteck zeichnen | drawRoundRect(StartX, StartY, Breite, Höhe, Eckenradius, Farbe); | |
ausgefülltes Rechteck zeichnen | fill.Rect(StartX, StartY, Breite, Höhe, Füllfarbe); | |
Kreis zeichnen | drawCircle(MittelpunkX, MittelpunktY, Radius, Farbe); | |
Ausgefüllten Kreis zeichnen | fillCircle(MittelpunktX, MittelpunktY, Radius, Füllfarbe); | |
Cursor setzen | setCursor(x, y); | |
Textgröße setzen | setTextSize(Textgröße); | Textgröße: 1 - 4 |
Textfarbe bestimmen | setTextColor(Farbe); | |
Text schreiben | print("Text"); println("Text"); | |
Zeilenumbruch | setTextWrap(true/false); | false → Text fließt über den Rand des TFTs hinaus true → Text wird am Ende umgebrochen |

➨Beispiel mit Grafik und Text
So sieht es aus:

Adressierung der Bildpunkte
Binde die benötigen Bibliotheken ein und definiere die Variablen. Beachte die Kommentare.
/*
Pinbelegung:
GND (1) - GND
VCC (2) - 5V
RESET (3) - D9
D/C (4) - D8
CARD-CS (5) -
TFT-CS (6) - D10
MOSI (7) - D11
SCK (8) - D13
MISO (9) -
LITE (10) - 5V
*/
# include <IRremote.h>
int EmpfaengerPin = 6;
# include <Adafruit_GFX.h>
# include <Adafruit_ST7735.h>
# include <SPI.h>
// Pins definieren
# define TFT_CS 10
# define TFT_RST 9
# define TFT_DC 8
Adafruit_ST7735 tft = Adafruit_ST7735(TFT_CS, TFT_DC, TFT_RST);
/*
Farben als hexadezimal definiert
alternativ:
int SCHWARZ = 0;
int BLAU = 15;
. . .
*/
// Farben
# define SCHWARZ 0x0000 // dezimal 0
# define BLAU 0x000F // dezimal 15
# define ROT 0xF800 // dezimal 406664
# define GRUEN 0x0E81 // dezimal 3713
# define CYAN 0x07FF // dezimal 2047
# define MAGENTA 0xF81F // dezimal 63519
# define GELB 0xAFE5 // dezimal 65504
# define WEISS 0xFFFF // dezimal 65535
# define BRAUN 0xFC00 // dezimal 64512
# define GRAU 0xF7F0 // dezimal 63472
# define GRUENGELB 0xAFE5 // dezimal 45029
# define DUNKELCYAN 0x03EF // dezimal 1007
# define ORANGE 0xFD20 // dezimal 64800
# define PINK 0xFC18 // dezimal 64536
// Farbe der Blöcke
# define FARBE GRUEN
// Farbe des Kreises
# define KREISFARBE GELB
// Farbe der Schrift
# define SCHRIFTFARBE WEISS
// Spiel starten wenn * gedrückt wurde
bool SpielStart = false;
// Radius des kreises
const int Radius = 10;
// Abstand zu den Rändern
const int Abstand = Radius * 2;
// je höher, dest langsamer
const int Geschwindigkeit = 100;
// Bewegung des Kreises in Pixeln
const int Bewegung = 5;
// Startposition des Kreises
int CursorX = Radius;
int CursorY = tft.height() / 2 - Abstand;
// Variable für die Zeitmessung
long Start;
Der setup-Teil:
void setup()
{
// Startbildschirm
// schwarzes Farbschema vertkale Ausrichtung (nicht drehen)
// Cursor setzen, Schriftgröße und -farbe definieren
tft.initR(INITR_BLACKTAB);
tft.setRotation(0);
tft.fillScreen(SCHWARZ);
tft.setTextSize(2);
tft.setCursor(1, 10);
tft.setTextColor(ROT);
tft.println("Start:");
tft.print("-> *");
IrReceiver.begin(EmpfaengerPin);
}
Der loop-Teil. Beachte die Kommentare.
void loop()
{
if (IrReceiver.decode())
{
delay(100);
// nächsten Wert lesen
IrReceiver.resume();
// Start mit *
if (IrReceiver.decodedIRData.command == 0x42)
{
// Spiel wird gestartet
SpielStart = true;
// Parcours bauen
ParcoursBauen();
// Zeitmessung starten
Start = millis();
}
}
// wenn der Button * gedrückt wurde
if (SpielStart)
{
// Taste OK
if (IrReceiver.decodedIRData.command == 0x40)
{
// Kreis an der aktuellen Position anhalten
tft.fillCircle(CursorX, CursorY, Radius, KREISFARBE);
}
// Taste nach oben
if (IrReceiver.decodedIRData.command == 0x46)
{
// Kreis an der aktuellen Position "löschen"
tft.fillCircle(CursorX, CursorY, Radius, SCHWARZ);
// wenn der Bildschirmrand oben noch nicht erreicht wurde
// rückwärts -> Richtung x = 1 bewegen
if (CursorY > Radius) CursorY -= Bewegung;
// Kreis an der neuen Position zeichnen
tft.fillCircle(CursorX, CursorY, Radius, KREISFARBE);
delay(Geschwindigkeit);
}
// Taste nach unten
if (IrReceiver.decodedIRData.command == 0x15)
{
// Kreis an der aktuellen Position "löschen"
tft.fillCircle(CursorX, CursorY, Radius, SCHWARZ);
// wenn der Bildschirmrand rechts noch nicht erreicht wurde
// vorwärts -> Richtung tft.height() bewegen
if (CursorY < tft.height() - Radius) CursorY += Bewegung;
// Kreis an der neuen Position zeichnen
tft.fillCircle(CursorX, CursorY, Radius, KREISFARBE);
delay(Geschwindigkeit);
}
// Taste nach links
if (IrReceiver.decodedIRData.command == 0x44)
{
// Kreis an der aktuellen Position "löschen"
tft.fillCircle(CursorX, CursorY, Radius, SCHWARZ);
// wenn der Bildschirmrand links noch nicht erreicht wurde
// rückwärts -> Richtung linken Bildschirmrand bewegen
if (CursorX > Radius) CursorX -= Bewegung;
// Kreis an der neuen Position zeichnen
tft.fillCircle(CursorX, CursorY, Radius, KREISFARBE);
delay(Geschwindigkeit);
}
// Taste nach rechts
if (IrReceiver.decodedIRData.command == 0x43)
{
// Kreis an der aktuellen Position "löschen"
tft.fillCircle(CursorX, CursorY, Radius, SCHWARZ);
// Abfrage, ob der rechte Rand erreicht wurde, nicht nötig
// wird in der nächsten bedingung abgefragt
CursorX += Bewegung;
// Kreis an der neuen Position zeichnen
tft.fillCircle(CursorX, CursorY, Radius, KREISFARBE);
delay(Geschwindigkeit);
}
// rechter Bildschirmrand erreicht -> Spielende
if (CursorX > tft.height() - Radius)
{
ErgebnisZeigen();
}
}
}
Jetzt fehlen noch die Methoden ErgebnisZeigen() und ParcoursBauen():
void ErgebnisZeigen()
{
// Zeit berechnen
int Sekunden;
long VerstricheneZeit = millis() - Start;
Sekunden = int(VerstricheneZeit / 1000);
// Zeit anzeigen
tft.fillScreen(SCHWARZ);
tft.setTextSize(2);
tft.setCursor(1, 10);
tft.println("Zeit:");
tft.println(String(Sekunden) + " s");
tft.setCursor(1, 40);
tft.setTextColor(ROT);
tft.println();
tft.println("Neustart:");
tft.println("-> *");
SpielStart = false;
}
void ParcoursBauen()
{
CursorX = Radius;
CursorY = tft.height() / 2 - Abstand;
tft.fillScreen(SCHWARZ);
// Kreis anzeigen
tft.fillCircle(CursorX, CursorY, Radius, KREISFARBE);
// Parcours "bauen"
tft.fillRect(65, 35, 5, 45, FARBE);
tft.fillRect(1, 1, 35, 35, FARBE);
tft.fillRect(1, 80, 70, 80, FARBE);
tft.fillRect(110, 1, 70, 95, FARBE);
tft.fillRect(110, 130, 140, 160, FARBE);
}
Verwandte Aufgaben:
- Countdown mit einer einstelligen 7-Segment-Anzeige
- Countdown mit einem OLED-Display
- Farbenspiele mit einer RGB-Matrix
- Labyrinthspiel mit Joystick und TFT
- Länder-Info
- LED-Matrix - Countdown
- LED-Matrix - Joystick-Spiel
- LED-Matrix - Lauflicht
- LED-Matrix - Würfeln
- Lottozahlen - Anzeige auf einem LCD
- Lottozahlen - Anzeige auf einem OLED-Display
- Multiplikations-Taschenrechner
- Spiel mit einer RGB-Matrix
- Taschenrechner Grundrechenarten
- Würfeln einstellige 7-Segment-Anzeige und Fernbedienung
- Würfeln - Anzeige auf einem OLED-Display
- Würfelspiel mit einer vierstelligen Anzeige
- Würfeln mit einer einstelligen Anzeige
Letzte Aktualisierung: