GC9A01 rundes TFT Display mit Arduino ansteuern: Analoge Zifferblätter & Rundinstrumente selbst gestalten

Was das GC9A01-Display besonders macht

Das 1,28 Zoll GC9A01 Display nutzt einen dedizierten Grafik-Controller-Chip, der wie das verbreitete ST7735 oder ILI9341 über SPI angesprochen wird – der Unterschied liegt einzig in der runden Form und der quadratischen 240x240-Auflösung. Dadurch ist es ideal für alles, was ein klassisches, rundes Ziffernblatt braucht: Analoguhren, Tacho-artige Sensoranzeigen, runde Lautstärkeregler oder Ladezustandsanzeigen.

Da der Controller intern eine vollwertige Grafikbibliothek unterstützt (Linien, Kreise, Text, Bitmaps), lassen sich mit wenigen Zeilen Code komplette Zifferblätter zeichnen – die Adafruit-GFX-kompatible Bibliothek Arduino_GFX bzw. TFT_eSPI übernimmt dabei die komplette Pixel-Ansteuerung.

Was du brauchst

Schaltungsaufbau

Für den DS3231 (I2C) verbindest du zusätzlich SDA mit A4 und SCL mit A5 sowie VCC mit 5V und GND mit GND. Der Rotary Encoder benötigt zwei digitale Pins für CLK/DT (z. B. Pin 2 und 3) sowie einen für den Taster (z. B. Pin 4).

Code 1: Grundgerüst & Kreis-Zifferblatt zeichnen

Installiere über den Bibliotheksverwalter Arduino_GFX_Library von moononournation, die den GC9A01-Treiber direkt mitbringt. Dieser erste Sketch zeichnet ein rundes Zifferblatt mit Stundenmarkierungen.

#include <Arduino_GFX_Library.h>

#define TFT_CS   10
#define TFT_DC    9
#define TFT_RST   8

Arduino_DataBus *bus = new Arduino_HWSPI(TFT_DC, TFT_CS);
Arduino_GFX *gfx = new Arduino_GC9A01(bus, TFT_RST, 0 /* rotation */, true /* IPS */);

const int MITTE_X = 120;
const int MITTE_Y = 120;
const int RADIUS = 110;

void zeichneZifferblatt() {
  gfx->fillScreen(BLACK);
  gfx->drawCircle(MITTE_X, MITTE_Y, RADIUS, WHITE);

  for (int i = 0; i < 12; i++) {
    float winkel = i * 30 * PI / 180.0;
    int x1 = MITTE_X + (RADIUS - 15) * sin(winkel);
    int y1 = MITTE_Y - (RADIUS - 15) * cos(winkel);
    int x2 = MITTE_X + RADIUS * sin(winkel);
    int y2 = MITTE_Y - RADIUS * cos(winkel);
    gfx->drawLine(x1, y1, x2, y2, WHITE);
  }
}

void setup() {
  gfx->begin();
  zeichneZifferblatt();
}

void loop() {
}

Die Trigonometrie mit sin()/cos() berechnet für jede der 12 Stunden-Positionen einen Punkt auf dem Kreisrand – dieses Grundprinzip nutzt du gleich für die Zeiger und später für das Gauge-Instrument wieder.

Code 2: Analoguhr mit DS3231 Echtzeituhr

Jetzt ergänzt du bewegliche Zeiger, deren Winkel aus der aktuellen Uhrzeit des DS3231-Moduls berechnet werden.

#include <Arduino_GFX_Library.h>
#include <Wire.h>
#include <RTClib.h>

#define TFT_CS   10
#define TFT_DC    9
#define TFT_RST   8

Arduino_DataBus *bus = new Arduino_HWSPI(TFT_DC, TFT_CS);
Arduino_GFX *gfx = new Arduino_GC9A01(bus, TFT_RST, 0, true);
RTC_DS3231 rtc;

const int MITTE_X = 120;
const int MITTE_Y = 120;

void zeichneZeiger(int stunde, int minute, int sekunde) {
  gfx->fillScreen(BLACK);
  gfx->drawCircle(MITTE_X, MITTE_Y, 110, WHITE);

  float sekWinkel = sekunde * 6 * PI / 180.0;
  float minWinkel = (minute * 6 + sekunde * 0.1) * PI / 180.0;
  float stdWinkel = ((stunde % 12) * 30 + minute * 0.5) * PI / 180.0;

  int sx = MITTE_X + 95 * sin(sekWinkel);
  int sy = MITTE_Y - 95 * cos(sekWinkel);
  gfx->drawLine(MITTE_X, MITTE_Y, sx, sy, RED);

  int mx = MITTE_X + 80 * sin(minWinkel);
  int my = MITTE_Y - 80 * cos(minWinkel);
  gfx->drawLine(MITTE_X, MITTE_Y, mx, my, WHITE);

  int hx = MITTE_X + 55 * sin(stdWinkel);
  int hy = MITTE_Y - 55 * cos(stdWinkel);
  gfx->drawLine(MITTE_X, MITTE_Y, hx, hy, WHITE);
}

void setup() {
  gfx->begin();
  rtc.begin();
  // Einmalig zum Stellen der Uhrzeit auskommentieren:
  // rtc.adjust(DateTime(F(__DATE__), F(__TIME__)));
}

void loop() {
  DateTime jetzt = rtc.now();
  zeichneZeiger(jetzt.hour(), jetzt.minute(), jetzt.second());
  delay(1000);
}

Code 3: Rundinstrument (Gauge) für Sensorwerte

Statt einer Uhr eignet sich das runde Display genauso gut als Tacho-artige Anzeige, z. B. für einen Temperaturwert von 0-100°C, dargestellt als Bogen von -135° bis +135°.

#include <Arduino_GFX_Library.h>

#define TFT_CS   10
#define TFT_DC    9
#define TFT_RST   8

Arduino_DataBus *bus = new Arduino_HWSPI(TFT_DC, TFT_CS);
Arduino_GFX *gfx = new Arduino_GC9A01(bus, TFT_RST, 0, true);

const int MITTE_X = 120;
const int MITTE_Y = 120;
const float START_WINKEL = -135;
const float END_WINKEL = 135;

void zeichneGauge(float wert, float minWert, float maxWert) {
  gfx->fillScreen(BLACK);
  gfx->drawCircle(MITTE_X, MITTE_Y, 110, WHITE);

  // Skala als Bogen aus einzelnen Strichen
  for (float w = START_WINKEL; w <= END_WINKEL; w += 15) {
    float rad = w * PI / 180.0;
    int x1 = MITTE_X + 95 * sin(rad);
    int y1 = MITTE_Y - 95 * cos(rad);
    int x2 = MITTE_X + 105 * sin(rad);
    int y2 = MITTE_Y - 105 * cos(rad);
    gfx->drawLine(x1, y1, x2, y2, WHITE);
  }

  // Zeiger entsprechend dem aktuellen Wert
  float anteil = (wert - minWert) / (maxWert - minWert);
  float zeigerWinkel = START_WINKEL + anteil * (END_WINKEL - START_WINKEL);
  float rad = zeigerWinkel * PI / 180.0;
  int zx = MITTE_X + 80 * sin(rad);
  int zy = MITTE_Y - 80 * cos(rad);
  gfx->drawLine(MITTE_X, MITTE_Y, zx, zy, RED);

  gfx->setCursor(90, 160);
  gfx->setTextColor(WHITE);
  gfx->setTextSize(2);
  gfx->print(wert, 1);
}

void setup() {
  gfx->begin();
}

void loop() {
  float simulierterWert = 20 + 15 * sin(millis() / 2000.0);
  zeichneGauge(simulierterWert, 0, 40);
  delay(200);
}

Ersetze den simulierterWert in loop() durch einen echten Sensorwert – etwa von unserem BMP280-Luftdrucksensor oder DHT22 –, um ein individuelles Analog-Instrument für dein Wetterstation- oder Monitoring-Projekt zu bauen.

Praxistipps

Troubleshooting