Labyrinth-Spiel mit TFT und Fernbedienung

Mit Hil­fe einer Fern­be­die­nung wird auf einem TFT-Monitor ein Ball durch ein klei­nes Laby­rinth bewegt. Beim Druck auf die *-Tas­te wird die Zeit­mes­sung gestartet 

So sieht es aus:

Benö­tig­te Bauteile:

• Keyes Fern­be­die­nung
• Adaf­ruit 1,8 Zoll TFT ST7735
• Lei­tungs­dräh­te

Baue die Schal­tung auf:

1 -> Gnd -> GND
2 -> VCC -> 5V
3 -> RESET -> D9
4 -> D/C -> D8
5 -> CARD_CS (nicht ange­schlos­sen)
6 -> TFT_CS -> D10
7 -> MOSI -> D11
8 -> SCK -> D13
9 -> MISO (nicht ange­schlos­sen)
10 -> LITE ->5V

Pin­be­le­gung Adaf­ruit 1,8 Zoll TFT ST7735

Ach­te auf die Pin­be­le­gung des Infrarotempfängers.

Ach­te dar­auf, dass die Bat­te­rie rich­tig ein­ge­legt wur­de. Der Minus-Pol liegt oben.

Die Anlei­tung bezieht sich auf die Ver­si­on 3.x der Biblio­thek IRre­mo­te.

➨Anpas­sung von der Ver­si­on 2.7x zu 3.x (exter­ner Link, abge­ru­fen am 12.3.2021)

➨Umwand­lung von Zah­len­sys­tem (exter­ner Link, abge­ru­fen am 12.3.2021)

Die Fern­be­die­nung sen­det beim Druck auf die Tas­ten einen Zahlencode.

Die Tas­ten­codes bezie­hen sich auf die Keyes-Fernbedienung.

Die Tas­ten­codes kannst du mit fol­gen­dem Pro­gramm her­aus­fin­den. Sie wer­den im Seri­el­len Moni­tor 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 umran­de­ten Wer­te wer­den von der Keyes-Fernbedienung aus­ge­ge­ben, die blau umran­de­ten stam­men von einer TV-Fernbedienung. 

Benö­tig­te Biblio­theken:

Ardui­no IDE 1.8x:

Sketch → Biblio­thek ein­bin­den → Biblio­the­ken verwalten

Ardui­no IDE 2.x:

➨Bei­spiel mit Gra­fik und Text

So sieht es aus:

Adres­sie­rung der Bildpunkte

Bin­de die benö­ti­gen Biblio­the­ken ein und defi­nie­re die Varia­blen. Beach­te 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. Beach­te 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 feh­len noch die Metho­den Ergeb­nis­Zei­gen() 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);
}

Ver­wand­te Aufgaben:

• Count­down mit einer ein­stel­li­gen 7-Segment-Anzeige
• Count­down mit einem OLED-Display
• DHT22 - Durch­schnitts­tem­pe­ra­tur berech­nen und auf einem OLED-Display anzeigen
• Far­ben­spie­le mit einer RGB-Matrix
• Laby­rinth­spiel mit Joy­stick und TFT
• Länder-Info
• LED-Matrix - Countdown
• LED-Matrix - Joystick-Spiel
• LED-Matrix - Lauflicht
• LED-Matrix - Würfeln

Letzte Aktualisierung: 21. Jan 2022 @ 19:59