Arduino Uno R4 - ILI9341 ILI9488 ST7789 TFT LCD Touch Display SPI-Schnittstelle
Der Arduino Uno R4 – erhältlich als Minima und WiFi – verfügt über einen 48-MHz-Renesas-RA4M1-Prozessor und mehr SRAM als der klassische Uno, behält aber das gleiche Header-Layout. Die Hardware-SPI-Pins befinden sich an den gleichen physikalischen Positionen, daher funktioniert jede TFT-Verdrahtung, die auf dem Uno R3 funktioniert, direkt auf dem Uno R4 ohne Änderungen.
In dieser Anleitung werden Sie:
- Ein SPI-TFT-Display mit dem Arduino Uno R4 verdrahten.
- Formen zeichnen und Bereiche mit Farbe füllen.
- Text und Zahlen auf dem Bildschirm anzeigen.
- Bitmap-Bilder zeichnen, die im Programmspeicher (PROGMEM) gespeichert sind.
- Bitmap-Bilder zeichnen, die von einer SD-Karte geladen sind.
- Text mit einer benutzerdefinierten externen Schriftart rendern.
- Rohe Touch-Koordinaten von einem XPT2046-Controller auslesen.
- Auf dem Bildschirm zeichnen, indem Sie einen Finger über das Display ziehen.
- Interaktive Touch-Schaltflächen erstellen.
- Den Touchscreen kalibrieren.
- Einen sekundären oder benutzerdefinierten SPI-Bus für das Display verwenden.
Diese Anleitung behandelt Touch- und Non-Touch-SPI-TFT-LCD-Displays. Sie funktioniert mit 1,3, 1,54, 2,2, 2,4, 2,8, 3,2 und 3,5 Zoll Panels mit ILI9341-, ILI9488- oder ST7789-Controller-Chips.
Tipp – einfachere und schnellere Alternative: Wenn Sie einen Arduino Uno R4 verwenden, ziehen Sie den TFT Touch Shield in Betracht. Er wird direkt auf den Uno R4-Header gesteckt – ohne Jumper-Kabel und ohne Pegelwandler erforderlich. Verwendetes eine 8-Bit-Parallelschnittstelle, die Pixeldaten erheblich schneller überträgt als SPI.
Erforderliche Hardware
Oder Sie können die folgenden Kits kaufen:
| 1 | × | DIYables STEM V4 IoT Starter-Kit (Arduino enthalten) | |
| 1 | × | DIYables STEM V4B IoT Starter-Kit (Arduino enthalten) | |
| 1 | × | DIYables Sensor-Kit (18 Sensoren/Displays) |
Offenlegung: Einige der in diesem Abschnitt bereitgestellten Links sind Amazon-Affiliate-Links. Wir können eine Provision für Käufe erhalten, die über diese Links getätigt werden, ohne zusätzliche Kosten für Sie. Wir schätzen Ihre Unterstützung.
SPI-TFT-Display-Übersicht
Ein SPI-TFT-Display ist ein Farb-LCD-Panel, das von einem Controller-Chip über den SPI-Bus gesteuert wird. Die DIYables_TFT_SPI-Bibliothek unterstützt drei häufige Driver-Chips:
- ILI9341 - 16-Bit-RGB565-Farbe, bis 40 MHz SPI.
- ILI9488 - 18-Bit-RGB666-Farbe, bis 24 MHz SPI.
- ST7789 - 16-Bit-RGB565-Farbe, bis 40 MHz SPI.
Empfehlung: Falls Sie noch kein Display gekauft haben, empfehlen wir den ST7789-Treiber. Er ist weit verbreitet, läuft mit voller 40-MHz-SPI-Geschwindigkeit und ist die unkomplizierteste Wahl für neue Projekte.
Die Bibliothek erweitert Adafruit GFX, daher sind alle Standard-Zeichnungs- und Textfunktionen verfügbar.
Pinbelegung
Die meisten SPI-TFT-LCD-Displays haben die folgenden Pins:
Display-Pins:
| Pin | Funktion |
|---|---|
| VCC | Stromversorgung |
| GND | Masse |
| CS | Chip Select – auf niedrig gezogen, um das Display auf dem SPI-Bus auszuwählen |
| DC / RS | Daten / Befehl wählen – hoch für Pixeldaten, niedrig für Befehle |
| RST | Hardware-Reset – optional; mit 3,3V verbinden, falls nicht verwendet |
| MOSI / SDI / SDA | SPI-Daten eingang (MCU → Display) |
| SCK / CLK | SPI-Takt |
| MISO / SDO | SPI-Datenausgang (Display → MCU) – optional für nur Display |
| LED / BL / BLK | Hintergrundbeleuchtung – mit 3,3V oder PWM-Pin verbinden zum Dimmen |
SD-Karten-Pins (falls Ihre Anwendung auf die SD-Karte zugreifen muss):
| Pin | Funktion |
|---|---|
| SD_CS / TF_CS | SD-Karten-Chip-Select |
| MOSI / SDI | MOSI – Daten von MCU zur SD-Karte |
| SCK / CLK | SCK – SPI-Takt |
| MISO / SDO | MISO – Daten von SD-Karte zu MCU |
Für TFT-Displays, die Touch unterstützen, gibt es zusätzliche Touch-Pins (falls Ihre Anwendung die Touch-Funktion verwendet und das Display diese unterstützt):
| Pin | Funktion |
|---|---|
| T_CS | Touch-Controller-Chip-Select |
| T_CLK | SCK – SPI-Takt |
| T_DIN | MOSI – Daten von MCU zu Touch-Controller |
| T_DO | MISO – Daten von Touch-Controller zu MCU |
| T_IRQ | Touch-Interrupt – optional; signalisiert, wenn der Bildschirm berührt wird |
Hinweis: Einige Non-Touch-Display-Module geben auch T_CS-, T_CLK-, T_DIN-, T_DO- und T_IRQ-Pins frei. Diese sind auf diesen Platinen nicht funktional – der Touch-Controller IC ist nicht bestückt. Sie erscheinen, weil die Leiterplatte das gleiche Layout wie die Touch-fähige Version wiederverwendet, um Herstellungsvarianten zu reduzieren.
Verdrahtungsschema
⚠ Wichtig – Spannungskonflikt: Der Arduino Uno R4 ist ein 5V-Board. Seine GPIO-Pins geben 5V-Logik aus, aber SPI-TFT-Displays arbeiten mit 3,3V. Das direkte Verbinden der Signalleitungen (MOSI, SCK, CS, DC, RST und T_CS bei Touch-Verwendung) vom Uno R4 zum Display beschädigt das Display. Sie müssen einen 5V-auf-3,3V-Pegelwandler auf jede vom MCU gesteuerte Signalleitung zwischen dem Uno R4 und dem Display verwenden. Die MISO-Leitung (Display → MCU) benötigt keinen Pegelwandler. Ein einzelnes 4-Kanal-Modul reicht für die Non-Touch-Verdrahtung aus; die With-Touch-Verdrahtung benötigt insgesamt 6 Kanäle (T_CS hinzufügen), daher verwenden Sie zwei 4-Kanal-Module oder ein 8-Kanal-Modul. Verbinden Sie das TFT-VCC mit dem 3,3V-Pin auf dem Uno R4.
Ohne Touch
Verbinden Sie MOSI mit D11, SCK mit D13 und MISO mit D12 auf dem Uno R4. CS, DC und RST können alle verfügbaren GPIO sein – D10, D9 und D8 werden in den Beispielen verwendet.
Display:
| TFT-Pin | Arduino Uno R4 Pin | Beschreibung |
|---|---|---|
| VCC | 3,3V oder 5V | Stromversorgung |
| GND | GND | Masse |
| CS | D10 | Chip Select |
| DC / RS | D9 | Daten / Befehl wählen |
| RST | D8 | Reset (optional) |
| MOSI / SDI | D11 | Hardware SPI MOSI |
| SCK | D13 | Hardware SPI Takt |
| MISO / SDO | D12 | Hardware SPI MISO (optional) |
| LED / BL | 3,3V | Hintergrundbeleuchtung |
SD-Karte (falls Ihre Anwendung auf die SD-Karte zugreifen muss):
| SD-Pin | Arduino Uno R4 Pin | Beschreibung |
|---|---|---|
| SD_CS / TF_CS | beliebiger freier GPIO | SD-Karten-Chip-Select |
| MOSI / SDI | D11 | Mit Display MOSI gemeinsam genutzt (D11) |
| SCK / CLK | D13 | Mit Display SCK gemeinsam genutzt (D13) |
| MISO / SDO | D12 | Mit Display MISO gemeinsam genutzt (D12) |
Dieses Bild wurde mit Fritzing erstellt. Klicken Sie, um das Bild zu vergrößern.
Mit Touch
Verbinden Sie den XPT2046-Touch-Controller mit dem Arduino Uno R4 SPI-Bus und teilen Sie D11, D13 und D12 mit dem Display.
Display:
| TFT-Pin | Arduino Uno R4 Pin | Beschreibung |
|---|---|---|
| VCC | 3,3V oder 5V | Stromversorgung |
| GND | GND | Masse |
| CS | D10 | Chip Select |
| DC / RS | D9 | Daten / Befehl wählen |
| RST | D8 | Reset (optional) |
| MOSI / SDI | D11 | Hardware SPI MOSI |
| SCK | D13 | Hardware SPI Takt |
| MISO / SDO | D12 | Hardware SPI MISO (optional) |
| LED / BL | 3,3V | Hintergrundbeleuchtung |
Touch-Controller (falls Ihre Anwendung die Touch-Funktion verwendet und das Display diese unterstützt):
| Touch-Pin | Arduino Uno R4 Pin | Beschreibung |
|---|---|---|
| T_CS | beliebiger freier GPIO | Touch-Chip-Select |
| T_IRQ | beliebiger freier GPIO | Touch-Interrupt (optional) |
| T_DIN | D11 | Mit Display MOSI gemeinsam genutzt (D11) |
| T_CLK | D13 | Mit Display SCK gemeinsam genutzt (D13) |
| T_DO | D12 | Mit Display MISO gemeinsam genutzt (D12) |
Dieses Bild wurde mit Fritzing erstellt. Klicken Sie, um das Bild zu vergrößern.
Siehe Der beste Weg, den Arduino Uno R4 und andere Komponenten mit Strom zu versorgen.
Falls Ihr MCU zwei oder mehr Hardware-SPI-Schnittstellen hat, können Sie jedes Gerät (Display, SD-Karte, Touch-Controller) seinem eigenen dedizierten SPI-Bus zuweisen. Falls Ihr MCU nur eine Hardware-SPI-Schnittstelle hat, teilen sich alle drei Geräte die gleichen drei Datenleitungen (MOSI, SCK, MISO) – auf dem Uno R4 sind diese D11, D13 und D12. Jedes Gerät hat seinen eigenen CS-Pin, daher ist nur einer gleichzeitig aktiv. Die DIYables_TFT_SPI-Bibliothek verwaltet sowohl das Display als auch den XPT2046-Touch-Controller über eine einzige API – es ist keine separate SPI-Bibliothek für die Touch-Seite erforderlich.
So installieren Sie die Bibliothek
- Stecken Sie den Arduino Uno R4 mit einem USB-Typ-C-Kabel in Ihren Computer.
- Überprüfen Sie in der Arduino IDE, dass das richtige Board (Arduino Uno R4 Minima oder WiFi) und der richtige serieller Anschluss ausgewählt sind.
- Klicken Sie auf das Symbol Bibliotheken in der linken Seitenleiste.
- Geben Sie "DIYables_TFT_SPI" in das Suchfeld ein und suchen Sie die von DIYables veröffentlichte Bibliothek.
- Klicken Sie auf Installieren um die Bibliothek hinzuzufügen. Installieren Sie bei Aufforderung auch die Abhängigkeit Adafruit GFX Library.
- Search for DIYables TFT SPI created by DIYables.io and click the Install button.
1
void setup() {
Minimale Sketch-Struktur
Alle Sketches, die die DIYables_TFT_SPI-Bibliothek verwenden, haben dieses Skelett:
#include <DIYables_TFT_SPI.h>
#define TFT_CS_PIN 10
#define TFT_DC_PIN 9
#define TFT_RST_PIN 8
// Heben Sie die Zeile auf, die Ihrem Driver-Chip entspricht:
// DIYables_ILI9341_SPI TFT_display(240, 320, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
// DIYables_ILI9488_SPI TFT_display(320, 480, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
DIYables_ST7789_SPI TFT_display(240, 320, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
void setup() {
TFT_display.begin();
TFT_display.setRotation(1);
}
void loop() {
// drawing code here
}
Übergeben Sie die physikalischen Pixelabmessungen Ihres Panels an den Konstruktor. Module mit dem gleichen Driver-Chip gibt es in verschiedenen Größen.
Formen zeichnen
Das DrawShapes-Beispiel zeigt die Adafruit GFX-Zeichnungsprimitiven: Kreise, Dreiecke, Rechtecke, abgerundete Rechtecke und Linien.
/*
* Dieser Arduino UNO R4 Code wurde von newbiely.de entwickelt
* Dieser Arduino UNO R4 Code wird der Öffentlichkeit ohne jegliche Einschränkung zur Verfügung gestellt.
* Für vollständige Anleitungen und Schaltpläne besuchen Sie bitte:
* https://newbiely.de/tutorials/arduino-uno-r4/arduino-uno-r4-tft-lcd-touch-display-spi
*/
/*
Created by DIYables
This example code is in the public domain
Product page: https://diyables.io
*/
// =============================================
// Single include brings in the base class plus all driver classes.
// =============================================
#include <DIYables_TFT_SPI.h>
// =============================================
// Wiring (Arduino Uno / Nano)
// ---------------------------------------------
// TFT module Arduino Uno / Nano
// ------------ ---------------------------------
// VCC -> 5V
// GND -> GND
// CS -> D10 (TFT_CS_PIN)
// RESET -> D9 (TFT_RST_PIN)
// DC / RS -> D8 (TFT_DC_PIN)
// SDI / MOSI -> D11 (hardware SPI MOSI)
// SCK -> D13 (hardware SPI SCK)
// LED -> 3.3V (or any GPIO via initBacklight)
// SDO / MISO -> D12 (only needed when reading from display)
// =============================================
// =============================================
// SPI pin definitions (adjust for your board)
// =============================================
#define TFT_CS_PIN 10
#define TFT_DC_PIN 8
#define TFT_RST_PIN 9
// Panel resolution in native (portrait) orientation - change to match your module
#define TFT_WIDTH 240
#define TFT_HEIGHT 320
// MOSI and SCK use default hardware SPI pins
// =============================================
// Create display object (uncomment matching driver)
// =============================================
// DIYables_ILI9341_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
// DIYables_ILI9488_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
DIYables_ST7789_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
#define BLACK DIYables_TFT_SPI::colorRGB(0, 0, 0)
#define BLUE DIYables_TFT_SPI::colorRGB(0, 0, 255)
#define RED DIYables_TFT_SPI::colorRGB(255, 0, 0)
#define GREEN DIYables_TFT_SPI::colorRGB(0, 255, 0)
#define ORANGE DIYables_TFT_SPI::colorRGB(255, 165, 0)
#define PINK DIYables_TFT_SPI::colorRGB(255, 192, 203)
#define VIOLET DIYables_TFT_SPI::colorRGB(148, 0, 211)
#define TURQUOISE DIYables_TFT_SPI::colorRGB(64, 224, 208)
#define WHITE DIYables_TFT_SPI::colorRGB(255, 255, 255)
// Helper to draw a filled diamond
void fillDiamond(int cx, int cy, int h, int v, uint16_t color) {
int x0 = cx, y0 = cy - v;
int x1 = cx + h, y1 = cy;
int x2 = cx, y2 = cy + v;
int x3 = cx - h, y3 = cy;
TFT_display.fillTriangle(x0, y0, x1, y1, x2, y2, color);
TFT_display.fillTriangle(x0, y0, x2, y2, x3, y3, color);
}
void setup() {
TFT_display.begin();
TFT_display.setRotation(1); // Landscape
}
void loop() {
TFT_display.fillScreen(WHITE);
uint16_t w = TFT_display.width();
uint16_t h = TFT_display.height();
// Scale positions relative to screen size with better spacing
int col1 = w / 8;
int col2 = w * 3 / 8;
int col3 = w * 5 / 8;
int col4 = w * 7 / 8;
int row1 = h / 4;
int row2 = h / 2;
int row3 = h * 3 / 4;
// Outlined circle
TFT_display.drawCircle(col1, row1, 30, RED);
// Filled circle
TFT_display.fillCircle(col2, row1, 30, RED);
// Outlined triangle
TFT_display.drawTriangle(col3 - 30, row1 + 25, col3 + 30, row1 + 25, col3, row1 - 25, BLUE);
// Filled triangle
TFT_display.fillTriangle(col4 - 30, row1 + 25, col4 + 30, row1 + 25, col4, row1 - 25, GREEN);
// Outlined rectangle
TFT_display.drawRect(col1 - 35, row2 - 20, 70, 40, ORANGE);
// Filled rectangle
TFT_display.fillRect(col2 - 35, row2 - 20, 70, 40, TURQUOISE);
// Outlined round rectangle
TFT_display.drawRoundRect(col3 - 35, row2 - 20, 70, 40, 10, VIOLET);
// Filled round rectangle
TFT_display.fillRoundRect(col4 - 35, row2 - 20, 70, 40, 10, PINK);
// Outlined diamond (centered between col1 and col2)
int diamond1_x = (col1 + col2) / 2;
TFT_display.drawLine(diamond1_x, row3 - 30, diamond1_x + 25, row3, GREEN);
TFT_display.drawLine(diamond1_x + 25, row3, diamond1_x, row3 + 30, GREEN);
TFT_display.drawLine(diamond1_x, row3 + 30, diamond1_x - 25, row3, GREEN);
TFT_display.drawLine(diamond1_x - 25, row3, diamond1_x, row3 - 30, GREEN);
// Filled diamond (centered between col3 and col4)
int diamond2_x = (col3 + col4) / 2;
fillDiamond(diamond2_x, row3, 25, 30, BLUE);
delay(10000);
}
So führen Sie es aus
- Verdrahten Sie das TFT-Modul mit dem Arduino Uno R4, wie in der Verdrahtungsanleitung gezeigt.
- Stecken Sie das USB-Typ-C-Kabel ein.
- Fügen Sie den Code in Arduino IDE ein, wählen Sie die richtige Platine und den richtigen Anschluss, und drücken Sie Upload.
- Das Display zeigt ein Gitter farbiger Formen, das sich alle paar Sekunden aktualisiert.
Kurzreferenz Methoden
| Methode | Was sie macht | Verwendung |
|---|---|---|
| begin() | Initialisieren Sie den Display-Controller. Rufen Sie einmal in setup() auf. | TFT_display.begin(); |
| setRotation(r) | Drehen Sie das Koordinatensystem. 0=Hochformat, 1=Querformat. | TFT_display.setRotation(1); |
| fillScreen(color) | Bildschirm mit einer Volltonfarbe löschen. | TFT_display.fillScreen(WHITE); |
| colorRGB(r,g,b) | Erstellen Sie eine 16-Bit-RGB565-Farbe aus 8-Bit-Komponenten. | colorRGB(0, 128, 255) |
| fillCircle(x,y,r,color) | Zeichnen Sie einen ausgefüllten Kreis. | TFT_display.fillCircle(80, 80, 40, RED); |
| fillRect(x,y,w,h,color) | Zeichnen Sie ein ausgefülltes Rechteck. | TFT_display.fillRect(10, 10, 60, 40, BLUE); |
| drawRoundRect(x,y,w,h,r,color) | Zeichnen Sie eine abgerundete Rechteckkontour. | TFT_display.drawRoundRect(5,5,100,50,10,GREEN); |
Text und Zahlen anzeigen
Das ShowTextAndNumber-Beispiel zeigt, wie Sie Zeichenketten und Zahlen in verschiedenen Größen, Farben und Positionen drucken.
/*
* Dieser Arduino UNO R4 Code wurde von newbiely.de entwickelt
* Dieser Arduino UNO R4 Code wird der Öffentlichkeit ohne jegliche Einschränkung zur Verfügung gestellt.
* Für vollständige Anleitungen und Schaltpläne besuchen Sie bitte:
* https://newbiely.de/tutorials/arduino-uno-r4/arduino-uno-r4-tft-lcd-touch-display-spi
*/
/*
Created by DIYables
This example code is in the public domain
Product page: https://diyables.io
*/
// =============================================
// Single include brings in the base class plus all driver classes.
// =============================================
#include <DIYables_TFT_SPI.h>
// =============================================
// Wiring (Arduino Uno / Nano)
// ---------------------------------------------
// TFT module Arduino Uno / Nano
// ------------ ---------------------------------
// VCC -> 5V
// GND -> GND
// CS -> D10 (TFT_CS_PIN)
// RESET -> D9 (TFT_RST_PIN)
// DC / RS -> D8 (TFT_DC_PIN)
// SDI / MOSI -> D11 (hardware SPI MOSI)
// SCK -> D13 (hardware SPI SCK)
// LED -> 3.3V (or any GPIO via initBacklight)
// SDO / MISO -> D12 (only needed when reading from display)
// =============================================
// =============================================
// SPI pin definitions (adjust for your board)
// =============================================
#define TFT_CS_PIN 10
#define TFT_DC_PIN 8
#define TFT_RST_PIN 9
// Panel resolution in native (portrait) orientation - change to match your module
#define TFT_WIDTH 240
#define TFT_HEIGHT 320
// =============================================
// Create display object (uncomment matching driver)
// =============================================
// DIYables_ILI9341_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
// DIYables_ILI9488_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
DIYables_ST7789_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
#define MAGENTA DIYables_TFT_SPI::colorRGB(255, 0, 255)
#define WHITE DIYables_TFT_SPI::colorRGB(255, 255, 255)
void setup() {
Serial.begin(9600);
Serial.println(F("TFT SPI Display - Show text and numbers"));
TFT_display.begin();
TFT_display.setRotation(1); // Landscape
TFT_display.fillScreen(WHITE);
// Set text color and size
TFT_display.setTextColor(MAGENTA);
TFT_display.setTextSize(3);
// Sample values
float temperature = 23.5;
float humidity = 78.6;
// Display temperature
TFT_display.setCursor(20, 20);
TFT_display.print("Temperature: ");
TFT_display.print(temperature, 1);
TFT_display.print(char(247));
TFT_display.println("C");
// Display humidity
TFT_display.setCursor(20, 60);
TFT_display.print("Humidity: ");
TFT_display.print(humidity, 1);
TFT_display.print("%");
}
void loop() {
}
So führen Sie es aus
- Verdrahten und laden Sie wie oben hoch.
- Das Display druckt mehrere Textzeilen und numerische Werte.
Kurzreferenz Methoden
| Methode | Was sie macht | Verwendung |
|---|---|---|
| setTextColor(color) | Legen Sie die Vordergrundtextfarbe fest. | TFT_display.setTextColor(BLACK); |
| setTextSize(size) | Skalieren Sie Text. Größe 1 ist 6x8 Pixel. | TFT_display.setTextSize(2); |
| setCursor(x, y) | Positionieren Sie den Textcursor. | TFT_display.setCursor(10, 30); |
| print(value) | Drucken Sie eine Zeichenkette oder Zahl am Cursor. | TFT_display.print("Temp: "); |
| println(value) | Drucken Sie und fahren Sie zur nächsten Zeile. | TFT_display.println(25.4); |
Bild zeichnen
Das DrawImage-Beispiel zeigt ein vollständiges RGB565-Bitmap-Bild, das im Programmspeicher gespeichert ist. Die Bilddaten werden in bitmap.h als const uint16_t Array mit PROGMEM deklariert. Dies speichert die Pixeldaten im Flash statt im SRAM, damit das Display auch auf Boards mit begrenztem RAM korrekt funktioniert. Kopieren Sie bitmap.h in den Sketch-Ordner, bevor Sie kompilieren.
/*
* Dieser Arduino UNO R4 Code wurde von newbiely.de entwickelt
* Dieser Arduino UNO R4 Code wird der Öffentlichkeit ohne jegliche Einschränkung zur Verfügung gestellt.
* Für vollständige Anleitungen und Schaltpläne besuchen Sie bitte:
* https://newbiely.de/tutorials/arduino-uno-r4/arduino-uno-r4-tft-lcd-touch-display-spi
*/
/*
Created by DIYables
This example code is in the public domain
Product page: https://diyables.io
*/
// =============================================
// Single include brings in the base class plus all driver classes.
// =============================================
#include <DIYables_TFT_SPI.h>
#include "bitmap.h"
// =============================================
// Wiring (Arduino Uno / Nano)
// ---------------------------------------------
// TFT module Arduino Uno / Nano
// ------------ ---------------------------------
// VCC -> 5V
// GND -> GND
// CS -> D10 (TFT_CS_PIN)
// RESET -> D9 (TFT_RST_PIN)
// DC / RS -> D8 (TFT_DC_PIN)
// SDI / MOSI -> D11 (hardware SPI MOSI)
// SCK -> D13 (hardware SPI SCK)
// LED -> 3.3V (or any GPIO via initBacklight)
// SDO / MISO -> D12 (only needed when reading from display)
// =============================================
// =============================================
// SPI pin definitions (adjust for your board)
// =============================================
#define TFT_CS_PIN 10
#define TFT_DC_PIN 8
#define TFT_RST_PIN 9
// Panel resolution in native (portrait) orientation - change to match your module
#define TFT_WIDTH 240
#define TFT_HEIGHT 320
// =============================================
// Create display object (uncomment matching driver)
// =============================================
// DIYables_ILI9341_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
// DIYables_ILI9488_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
DIYables_ST7789_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
#define WHITE DIYables_TFT_SPI::colorRGB(255, 255, 255)
int img_width = 120;
int img_height = 53;
void setup() {
Serial.begin(9600);
Serial.println(F("TFT SPI Display - Draw Image"));
TFT_display.begin();
uint16_t SCREEN_WIDTH = TFT_display.width();
uint16_t SCREEN_HEIGHT = TFT_display.height();
int x = (SCREEN_WIDTH - img_width) / 2;
int y = (SCREEN_HEIGHT - img_height) / 2;
TFT_display.fillScreen(WHITE);
TFT_display.drawRGBBitmap(x, y, myBitmap, img_width, img_height);
}
void loop() {
delay(2000);
TFT_display.invertDisplay(true);
delay(2000);
TFT_display.invertDisplay(false);
}
So führen Sie es aus
- Platzieren Sie bitmap.h im gleichen Ordner wie die Sketch-Datei.
- Verdrahten Sie das TFT-Modul mit dem Arduino Uno R4, wie in der Verdrahtungsanleitung gezeigt.
- Stecken Sie das USB-Typ-C-Kabel ein.
- Fügen Sie den Code in Arduino IDE ein, bestätigen Sie die Platine und den Anschluss, und drücken Sie Upload.
- Das Display zeigt das Bitmap-Bild, das aus dem Programmspeicher geladen wurde.
Kurzreferenz Methoden
| Methode | Was sie macht | Verwendung |
|---|---|---|
| drawRGBBitmap(x,y,bitmap,w,h) | Zeichnen Sie ein RGB565-PROGMEM-Bitmap, das bei Pixel (x, y) beginnt. | TFT_display.drawRGBBitmap(0, 0, myImage, 240, 320); |
| fillScreen(color) | Löschen Sie den Bildschirm vor dem Zeichnen des Bildes. | TFT_display.fillScreen(BLACK); |
Bild von SD-Karte zeichnen
Das DrawImageSDcard-Beispiel liest eine roh RGB565-Binärdatei von einer Micro-SD-Karte und überträgt Pixeldaten direkt in kleinen Chunks an das Display. Dieser Ansatz streamt das Bild, ohne jemals das vollständige Bild im RAM zu halten, was es praktisch für große Panels macht.
Verbinden Sie das SD-Kartenmodul mit dem gleichen SPI-Bus wie das Display. Teilen Sie MOSI (D11), SCK (D13) und MISO (D12). Weisen Sie dem SD-Modul einen separaten CS-Pin zu – definieren Sie ihn als SD_CS_PIN im Sketch.
/*
* Dieser Arduino UNO R4 Code wurde von newbiely.de entwickelt
* Dieser Arduino UNO R4 Code wird der Öffentlichkeit ohne jegliche Einschränkung zur Verfügung gestellt.
* Für vollständige Anleitungen und Schaltpläne besuchen Sie bitte:
* https://newbiely.de/tutorials/arduino-uno-r4/arduino-uno-r4-tft-lcd-touch-display-spi
*/
/*
Created by DIYables
This example code is in the public domain
Product page: https://diyables.io
*/
// =============================================
// Single include brings in the base class plus all driver classes.
// =============================================
#include <DIYables_TFT_SPI.h>
#include <SD.h>
// =============================================
// Wiring (Arduino Uno / Nano)
// ---------------------------------------------
// TFT + SD module Arduino Uno / Nano
// ----------------------- ---------------------------------
// VCC -> 5V
// GND -> GND
// TFT CS -> D10 (TFT_CS_PIN)
// TFT RESET -> D9 (TFT_RST_PIN)
// TFT DC / RS -> D8 (TFT_DC_PIN)
// SD CS -> D4 (SD_CS)
// SDI / MOSI (shared) -> D11 (hardware SPI MOSI)
// SDO / MISO (shared) -> D12 (hardware SPI MISO)
// SCK (shared) -> D13 (hardware SPI SCK)
// LED -> 3.3V (or any GPIO via initBacklight)
// =============================================
// =============================================
// SPI pin definitions (adjust for your board)
// =============================================
#define TFT_CS_PIN 10
#define TFT_DC_PIN 8
#define TFT_RST_PIN 9
// Panel resolution in native (portrait) orientation - change to match your module
#define TFT_WIDTH 240
#define TFT_HEIGHT 320
#define SD_CS 4 // SD card chip select (must differ from TFT_CS_PIN)
// =============================================
// Create display object (uncomment matching driver)
// =============================================
// DIYables_ILI9341_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
// DIYables_ILI9488_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
DIYables_ST7789_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
#define WHITE DIYables_TFT_SPI::colorRGB(255, 255, 255)
#define BUFFPIXEL 20
File bmpFile;
uint16_t SCREEN_WIDTH;
uint16_t SCREEN_HEIGHT;
// Helper functions to read BMP file header
uint16_t read16(File &f) {
uint16_t result;
result = f.read();
result |= (f.read() << 8);
return result;
}
uint32_t read32(File &f) {
uint32_t result;
result = f.read();
result |= ((uint32_t)f.read() << 8);
result |= ((uint32_t)f.read() << 16);
result |= ((uint32_t)f.read() << 24);
return result;
}
int32_t readS32(File &f) {
int32_t result;
result = f.read();
result |= ((uint32_t)f.read() << 8);
result |= ((uint32_t)f.read() << 16);
result |= ((uint32_t)f.read() << 24);
return result;
}
bool getBMPDimensions(const char *filename, uint32_t &w, uint32_t &h) {
File f = SD.open(filename);
if (!f) return false;
if (read16(f) != 0x4D42) { f.close(); return false; }
read32(f); // file size
read32(f); // reserved
read32(f); // image offset
read32(f); // DIB header size
w = read32(f);
int32_t sh = readS32(f);
h = (sh < 0) ? -sh : sh;
f.close();
return true;
}
void drawBMP(const char *filename, int x, int y) {
bmpFile = SD.open(filename);
if (!bmpFile) {
Serial.println("File not found");
return;
}
if (read16(bmpFile) != 0x4D42) {
Serial.println("Not a BMP file");
bmpFile.close();
return;
}
uint32_t fileSize = read32(bmpFile);
read32(bmpFile); // Reserved
uint32_t imageOffset = read32(bmpFile);
uint32_t dibHeaderSize = read32(bmpFile);
uint32_t bmpWidth = read32(bmpFile);
int32_t bmpHeight = readS32(bmpFile);
bool topDown = false;
if (bmpHeight < 0) {
bmpHeight = -bmpHeight;
topDown = true;
}
if (read16(bmpFile) != 1) {
Serial.println("Invalid BMP file");
bmpFile.close();
return;
}
uint16_t depth = read16(bmpFile);
if (depth != 24) {
Serial.println("Only 24-bit BMP is supported");
bmpFile.close();
return;
}
if (read32(bmpFile) != 0) {
Serial.println("Unsupported BMP compression");
bmpFile.close();
return;
}
bmpFile.seek(imageOffset);
uint8_t sdbuffer[3 * BUFFPIXEL];
uint16_t color;
uint32_t rowSize = (bmpWidth * 3 + 3) & ~3;
if (x >= SCREEN_WIDTH || y >= SCREEN_HEIGHT) return;
uint32_t maxRow = min((uint32_t)bmpHeight, (uint32_t)(SCREEN_HEIGHT - y));
uint32_t maxCol = min(bmpWidth, (uint32_t)(SCREEN_WIDTH - x));
for (uint32_t row = 0; row < maxRow; row++) {
int32_t rowPos = topDown ? row : bmpHeight - 1 - row;
uint32_t filePosition = imageOffset + rowPos * rowSize;
bmpFile.seek(filePosition);
for (uint32_t col = 0; col < maxCol; col += BUFFPIXEL) {
uint32_t pixelsToRead = min((uint32_t)BUFFPIXEL, maxCol - col);
bmpFile.read(sdbuffer, 3 * pixelsToRead);
for (uint32_t i = 0; i < pixelsToRead; i++) {
uint8_t b = sdbuffer[i * 3];
uint8_t g = sdbuffer[i * 3 + 1];
uint8_t r = sdbuffer[i * 3 + 2];
color = DIYables_TFT_SPI::colorRGB(r, g, b);
if ((x + col + i) < SCREEN_WIDTH && (y + row) < SCREEN_HEIGHT) {
TFT_display.drawPixel(x + col + i, y + row, color);
}
}
}
}
bmpFile.close();
Serial.println("BMP drawn");
}
void setup() {
Serial.begin(9600);
if (!SD.begin(SD_CS)) {
Serial.println("SD card initialization failed!");
return;
}
Serial.println("SD card initialized.");
TFT_display.begin();
TFT_display.setRotation(1); // Landscape
SCREEN_WIDTH = TFT_display.width();
SCREEN_HEIGHT = TFT_display.height();
TFT_display.fillScreen(WHITE);
uint32_t imgWidth, imgHeight;
if (getBMPDimensions("diyables.bmp", imgWidth, imgHeight)) {
int x = (SCREEN_WIDTH - imgWidth) / 2;
int y = (SCREEN_HEIGHT - imgHeight) / 2;
drawBMP("diyables.bmp", x, y);
} else {
Serial.println("Failed to get BMP dimensions");
}
}
void loop() {
}
So führen Sie es aus
- Verdrahten Sie das SD-Modul mit dem Arduino Uno R4. Teilen Sie den SPI-Bus (D11/D13/D12) mit dem Display und verbinden Sie SD CS mit Ihrem gewählten Pin.
- Kopieren Sie eine roh RGB565-Binärdatei auf die Wurzel der SD-Karte. Bilddimensionen müssen der Panel-Auflösung entsprechen.
- Stecken Sie das USB-Typ-C-Kabel ein.
- Fügen Sie den Code in Arduino IDE ein, bestätigen Sie Platine und Anschluss, und drücken Sie Upload.
- Das Bild wird von der Karte gelesen und auf dem Bildschirm angezeigt.
Kurzreferenz Methoden
| Methode | Was sie macht | Verwendung |
|---|---|---|
| startWrite() | Beginnen Sie eine direkte SPI-Transaktion, halten Sie CS bestätigt. | TFT_display.startWrite(); |
| setAddrWindow(x0,y0,x1,y1) | Definieren Sie den rechteckigen Pixelbereich zum Schreiben. | TFT_display.setAddrWindow(0, 0, 239, 319); |
| pushColors(buf, len) | Senden Sie einen Buffer von RGB565-Pixelwerten an das Display. | TFT_display.pushColors(buf, 512); |
| endWrite() | Beenden Sie die SPI-Transaktion und geben Sie CS frei. | TFT_display.endWrite(); |
Externe Schriftart verwenden
Das UseExternalFont-Beispiel renderiert Bildschirmtext mit einer benutzerdefinierten Adafruit GFX-kompatiblen Schriftart. Im Vergleich zur integrierten 5×7-Bitmap-Schriftart bieten benutzerdefinierte Schriftarten bessere Lesbarkeit und Gestaltung. Die Schriftartdatei ist als Header enthalten und wird mit einem einzigen setFont()-Aufruf aktiviert.
/*
* Dieser Arduino UNO R4 Code wurde von newbiely.de entwickelt
* Dieser Arduino UNO R4 Code wird der Öffentlichkeit ohne jegliche Einschränkung zur Verfügung gestellt.
* Für vollständige Anleitungen und Schaltpläne besuchen Sie bitte:
* https://newbiely.de/tutorials/arduino-uno-r4/arduino-uno-r4-tft-lcd-touch-display-spi
*/
/*
Created by DIYables
This example code is in the public domain
Product page: https://diyables.io
*/
// =============================================
// Single include brings in the base class plus all driver classes.
// =============================================
#include <DIYables_TFT_SPI.h>
#include <Fonts/FreeSansBold12pt7b.h>
// =============================================
// Wiring (Arduino Uno / Nano)
// ---------------------------------------------
// TFT module Arduino Uno / Nano
// ------------ ---------------------------------
// VCC -> 5V
// GND -> GND
// CS -> D10 (TFT_CS_PIN)
// RESET -> D9 (TFT_RST_PIN)
// DC / RS -> D8 (TFT_DC_PIN)
// SDI / MOSI -> D11 (hardware SPI MOSI)
// SCK -> D13 (hardware SPI SCK)
// LED -> 3.3V (or any GPIO via initBacklight)
// SDO / MISO -> D12 (only needed when reading from display)
// =============================================
// =============================================
// SPI pin definitions (adjust for your board)
// =============================================
#define TFT_CS_PIN 10
#define TFT_DC_PIN 8
#define TFT_RST_PIN 9
// Panel resolution in native (portrait) orientation - change to match your module
#define TFT_WIDTH 240
#define TFT_HEIGHT 320
// =============================================
// Create display object (uncomment matching driver)
// =============================================
// DIYables_ILI9341_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
// DIYables_ILI9488_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
DIYables_ST7789_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
#define MAGENTA DIYables_TFT_SPI::colorRGB(255, 0, 255)
#define WHITE DIYables_TFT_SPI::colorRGB(255, 255, 255)
void setup() {
Serial.begin(9600);
Serial.println(F("TFT SPI Display - Use external font"));
TFT_display.begin();
TFT_display.setFont(&FreeSansBold12pt7b);
TFT_display.setRotation(1); // Landscape
TFT_display.fillScreen(WHITE);
TFT_display.setTextColor(MAGENTA);
TFT_display.setTextSize(1);
float temperature = 23.5;
float humidity = 78.6;
TFT_display.setCursor(20, 30);
TFT_display.print("Temperature: ");
TFT_display.print(temperature, 1);
TFT_display.print(char(247));
TFT_display.println("C");
TFT_display.setCursor(20, 70);
TFT_display.print("Humidity: ");
TFT_display.print(humidity, 1);
TFT_display.print("%");
}
void loop() {
}
So führen Sie es aus
- Verdrahten Sie das TFT-Modul mit dem Uno R4, wie in der Verdrahtungsanleitung gezeigt.
- Stecken Sie das USB-Typ-C-Kabel ein.
- Fügen Sie den Code in Arduino IDE ein, bestätigen Sie Platine und Anschluss, und drücken Sie Upload.
- Das Display renderiert Text in der benutzerdefinierten Schriftart. Beachten Sie die verbesserte Glyphqualität im Vergleich zur integrierten Schriftart.
Kurzreferenz Methoden
| Methode | Was sie macht | Verwendung |
|---|---|---|
| setFont(&FontName) | Aktivieren Sie eine benutzerdefinierte GFX-kompatible Schriftart. Übergeben Sie NULL, um die integrierte 5×7-Schriftart wiederherzustellen. | TFT_display.setFont(&FreeSans12pt7b); |
| setCursor(x, y) | Verschieben Sie den Textcursor an die angegebene Position. | TFT_display.setCursor(10, 40); |
| setTextColor(color) | Legen Sie die Vordergrundtextfarbe fest. | TFT_display.setTextColor(WHITE); |
| print(text) | Drucken Sie eine Zeichenkette an der aktuellen Cursorposition mit der aktiven Schriftart. | TFT_display.print("Hello!"); |
Touch Punkt abrufen
Das TouchGetPoint-Beispiel liest rohe ADC-Koordinaten von einem XPT2046-Touch-Controller und druckt sie auf dem seriellen Monitor. Dies zuerst auszuführen hilft Ihnen, den Zahlenbereich Ihres spezifischen Panels zu verstehen – Daten, die Sie zur Kalibrierung des Touchscreens in späteren Beispielen verwenden werden.
Verdrahtung: T_CLK→D13, T_DIN→D11, T_DO→D12 (gemeinsamer SPI-Bus mit Display). T_CS→D7, T_IRQ→D6.
/*
* Dieser Arduino UNO R4 Code wurde von newbiely.de entwickelt
* Dieser Arduino UNO R4 Code wird der Öffentlichkeit ohne jegliche Einschränkung zur Verfügung gestellt.
* Für vollständige Anleitungen und Schaltpläne besuchen Sie bitte:
* https://newbiely.de/tutorials/arduino-uno-r4/arduino-uno-r4-tft-lcd-touch-display-spi
*/
/*
Touch Get Point Example
-----------------------
This example demonstrates how to read and display touch coordinates
using a DIYables SPI TFT display with a 4-wire resistive touch panel.
When you touch the screen, the sketch prints the mapped (screen) X and Y
coordinates to the Serial Monitor and draws a red dot at the touched location.
NOTE:
Run the TouchCalibration example first and paste the calibration values
into setTouchCalibration() below if the touch coordinates are inaccurate.
Created by DIYables
This example code is in the public domain
Product page: https://diyables.io
*/
// =============================================
// Single include brings in the base class plus all driver classes.
// =============================================
#include <DIYables_TFT_SPI.h>
// =============================================
// Wiring (Arduino Uno / Nano)
// =============================================
// TFT pins (always required)
// TFT module Arduino Uno / Nano
// ------------ ---------------------------------
// VCC -> 5V
// GND -> GND
// CS -> D10 (TFT_CS_PIN)
// RESET -> D9 (TFT_RST_PIN)
// DC / RS -> D8 (TFT_DC_PIN)
// SDI / MOSI -> D11 (hardware SPI MOSI)
// SCK -> D13 (hardware SPI SCK)
// SDO / MISO -> D12 (only needed when reading from display)
// LED -> 3.3V (or any GPIO via initBacklight)
//
// XPT2046 / HR2046 / ADS7843 SPI touch controller
// (modules with pins: T_CS, T_CLK, T_DIN, T_DO, T_IRQ)
// Touch pin Arduino Uno / Nano
// ------------ ---------------------------------
// T_CS -> D2 (TOUCH_CS_PIN)
// T_IRQ -> D2 (TOUCH_IRQ_PIN, optional - use -1 to skip)
// T_CLK -> D13 (shared with display SCK)
// T_DIN -> D11 (shared with display MOSI)
// T_DO -> D12 (shared with display MISO)
// =============================================
// =============================================
// SPI pin definitions (adjust for your board)
// =============================================
#define TFT_CS_PIN 10
#define TFT_DC_PIN 8
#define TFT_RST_PIN 9
// Panel resolution in native (portrait) orientation - change to match your module
#define TFT_WIDTH 240
#define TFT_HEIGHT 320
// MOSI and SCK use default hardware SPI pins
// =============================================
// Touch pin definitions (XPT2046 / HR2046 SPI touch controller)
// =============================================
#define TOUCH_CS_PIN 2 // T_CS (any GPIO)
#define TOUCH_IRQ_PIN -1 // T_IRQ (any GPIO, or -1 if not connected)
// =============================================
// =============================================
// Calibration values.
// Run the TouchCalibration example and update these if touch is inaccurate.
// Typical raw ranges:
// - XPT2046 / HR2046 : ~200..3900 (default below)
// - 4-wire resistive : ~100..900
// =============================================
#define TOUCH_LEFT_X 300
#define TOUCH_RIGHT_X 3700
#define TOUCH_TOP_Y 300
#define TOUCH_BOT_Y 3700
// =============================================
// Create display object (uncomment matching driver)
// =============================================
// DIYables_ILI9341_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
// DIYables_ILI9488_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
DIYables_ST7789_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
#define RED DIYables_TFT_SPI::colorRGB(255, 0, 0)
#define WHITE DIYables_TFT_SPI::colorRGB(255, 255, 255)
void setup() {
Serial.begin(9600);
TFT_display.begin();
TFT_display.setRotation(0);
TFT_display.fillScreen(WHITE);
TFT_display.initTouchSPI(TOUCH_CS_PIN, TOUCH_IRQ_PIN);
// If touch X is mirrored on your board, uncomment:
//TFT_display.setTouchInvertX(true);
// If touch Y is mirrored on your board, uncomment:
//TFT_display.setTouchInvertY(false);
TFT_display.setTouchCalibration(TOUCH_LEFT_X, TOUCH_RIGHT_X,
TOUCH_TOP_Y, TOUCH_BOT_Y);
Serial.println("Touch the screen to see coordinates.");
}
void loop() {
int x, y;
if (TFT_display.getTouch(x, y)) {
Serial.print("Touch at: ");
Serial.print(x);
Serial.print(", ");
Serial.println(y);
TFT_display.fillCircle(x, y, 4, RED);
delay(200);
}
}
So führen Sie es aus
- Verdrahten Sie den XPT2046-Controller mit dem Uno R4 und teilen Sie den SPI-Bus mit dem Display. T_CS zu D7, T_IRQ zu D6.
- Stecken Sie das USB-Typ-C-Kabel ein.
- Fügen Sie den Code ein, bestätigen Sie Platine und Anschluss, und drücken Sie Upload.
- Öffnen Sie den seriellen Monitor mit 9600 Baud. Drücken Sie und ziehen Sie auf dem Display, um rohe X-, Y- und Druckwerte zu sehen.
Kurzreferenz Methoden
| Methode | Was sie macht | Verwendung |
|---|---|---|
| initTouchSPI(cs, irq) | Initialisieren Sie den XPT2046 auf dem gemeinsamen SPI-Bus. Verwenden Sie -1 für irq, wenn der Interrupt-Pin nicht verbunden ist. | TFT_display.initTouchSPI(7, 6); |
| readTouchRaw(x, y, z) | Rückgabe rohe ADC-Touch-Werte ohne Anwendung von Kalibrierung. Gibt „true" zurück, wenn gedrückt. | TFT_display.readTouchRaw(x, y, z); |
Touch zeichnen
Das TouchDraw-Beispiel erstellt eine einfache Finger-Zeichen-Anwendung. Kalibrierte Touch-Koordinaten werden verwendet, um kleine gefüllte Kreise an jedem Punkt zu platzieren, an dem der Finger das Display berührt, wodurch eine kontinuierliche Zeichnung entsteht, wenn er sich bewegt.
/*
* Dieser Arduino UNO R4 Code wurde von newbiely.de entwickelt
* Dieser Arduino UNO R4 Code wird der Öffentlichkeit ohne jegliche Einschränkung zur Verfügung gestellt.
* Für vollständige Anleitungen und Schaltpläne besuchen Sie bitte:
* https://newbiely.de/tutorials/arduino-uno-r4/arduino-uno-r4-tft-lcd-touch-display-spi
*/
/*
Touch Draw Lines Example
-------------------------
Draws lines on the screen following the pen.
- Touch and drag on the screen to draw.
- Lift the pen to stop drawing.
- Touch again to start a new line from the last point.
NOTE:
Run the TouchCalibration example and update setTouchCalibration() below
if the touch coordinates are inaccurate.
Created by DIYables
This example code is in the public domain
Product page: https://diyables.io
*/
// =============================================
// Single include brings in the base class plus all driver classes.
// =============================================
#include <DIYables_TFT_SPI.h>
// =============================================
// Wiring (Arduino Uno / Nano)
// =============================================
// TFT pins (always required)
// TFT module Arduino Uno / Nano
// ------------ ---------------------------------
// VCC -> 5V
// GND -> GND
// CS -> D10 (TFT_CS_PIN)
// RESET -> D9 (TFT_RST_PIN)
// DC / RS -> D8 (TFT_DC_PIN)
// SDI / MOSI -> D11 (hardware SPI MOSI)
// SCK -> D13 (hardware SPI SCK)
// SDO / MISO -> D12 (only needed when reading from display)
// LED -> 3.3V (or any GPIO via initBacklight)
//
// XPT2046 / HR2046 / ADS7843 SPI touch controller
// (modules with pins: T_CS, T_CLK, T_DIN, T_DO, T_IRQ)
// Touch pin Arduino Uno / Nano
// ------------ ---------------------------------
// T_CS -> D2 (TOUCH_CS_PIN)
// T_IRQ -> D2 (TOUCH_IRQ_PIN, optional - use -1 to skip)
// T_CLK -> D13 (shared with display SCK)
// T_DIN -> D11 (shared with display MOSI)
// T_DO -> D12 (shared with display MISO)
// =============================================
// =============================================
// SPI pin definitions (adjust for your board)
// =============================================
#define TFT_CS_PIN 10
#define TFT_DC_PIN 8
#define TFT_RST_PIN 9
// Panel resolution in native (portrait) orientation - change to match your module
#define TFT_WIDTH 240
#define TFT_HEIGHT 320
// =============================================
// Touch pin definitions (XPT2046 / HR2046 SPI touch controller)
// =============================================
#define TOUCH_CS_PIN 2 // T_CS (any GPIO)
#define TOUCH_IRQ_PIN -1 // T_IRQ (any GPIO, or -1 if not connected)
// =============================================
// =============================================
// Calibration values.
// Run the TouchCalibration example and update these if touch is inaccurate.
// Typical raw ranges:
// - XPT2046 / HR2046 : ~200..3900 (default below)
// - 4-wire resistive : ~100..900
// =============================================
#define TOUCH_LEFT_X 300
#define TOUCH_RIGHT_X 3700
#define TOUCH_TOP_Y 300
#define TOUCH_BOT_Y 3700
// =============================================
// Create display object (uncomment matching driver)
// =============================================
// DIYables_ILI9341_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
// DIYables_ILI9488_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
DIYables_ST7789_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
#define RED DIYables_TFT_SPI::colorRGB(255, 0, 0)
#define WHITE DIYables_TFT_SPI::colorRGB(255, 255, 255)
#define PEN_RADIUS 3
void setup() {
TFT_display.begin();
TFT_display.setRotation(0);
TFT_display.fillScreen(WHITE);
TFT_display.initTouchSPI(TOUCH_CS_PIN, TOUCH_IRQ_PIN);
// If touch X is mirrored on your board, uncomment:
//TFT_display.setTouchInvertX(true);
// If touch Y is mirrored on your board, uncomment:
//TFT_display.setTouchInvertY(false);
TFT_display.setTouchCalibration(TOUCH_LEFT_X, TOUCH_RIGHT_X,
TOUCH_TOP_Y, TOUCH_BOT_Y);
}
void loop() {
int x, y;
if (TFT_display.getTouch(x, y)) {
TFT_display.fillCircle(x, y, PEN_RADIUS, RED);
}
}
So führen Sie es aus
- Verdrahten Sie den XPT2046 mit dem Uno R4, wie im Abschnitt „Touch Punkt abrufen" oben beschrieben.
- Stecken Sie das USB-Typ-C-Kabel ein.
- Fügen Sie den Code ein, bestätigen Sie Platine und Anschluss, und drücken Sie Upload.
- Ziehen Sie einen Finger über das Display, um auf dem Bildschirm zu malen.
Kurzreferenz Methoden
| Methode | Was sie macht | Verwendung |
|---|---|---|
| initTouchSPI(cs, irq) | Richten Sie den XPT2046 auf dem gemeinsamen SPI-Bus ein. | TFT_display.initTouchSPI(7, 6); |
| setTouchCalibration(minX,maxX,minY,maxY) | Ordnen Sie rohe ADC-Werte Bildschirm-Pixelkoordinaten zu. Rufen Sie diese Werte aus dem TouchCalibration-Beispiel ab. | TFT_display.setTouchCalibration(200, 3800, 300, 3700); |
| setTouchInvertX(invert) / setTouchInvertY(invert) | Kehrt die Touch-Achse um, wenn X oder Y auf Ihrem spezifischen Panel oder Batch gespiegelt ist. Rufen Sie VOR setTouchCalibration() auf. | TFT_display.setTouchInvertY(true); |
| getTouch(x, y) | Rufen Sie kalibrierte Touch-Koordinaten in Bildschirm-Pixeln ab. Gibt „true" zurück, wenn der Bildschirm gedrückt wird. | if (TFT_display.getTouch(x, y)) { ... } |
| fillCircle(x, y, r, color) | Zeichnen Sie einen kleinen Punkt am Berührungspunkt. | TFT_display.fillCircle(x, y, 3, RED); |
Touch-Schaltfläche
Das TouchButton-Beispiel zeichnet rechteckige Schaltflächen auf dem Bildschirm und prüft Touch-Koordinaten gegen die Grenzen jeder Schaltfläche. Wenn auf eine Schaltfläche getippt wird, wird sie hervorgehoben und führt eine Aktion aus. Dies zeigt, wie Sie eine minimale touchgesteuerte Benutzeroberfläche erstellen.
Der T_IRQ-Pin ist für dieses Beispiel optional. Übergeben Sie -1 als irq-Argument, wenn Sie ihn lieber nicht verbinden möchten.
/*
* Dieser Arduino UNO R4 Code wurde von newbiely.de entwickelt
* Dieser Arduino UNO R4 Code wird der Öffentlichkeit ohne jegliche Einschränkung zur Verfügung gestellt.
* Für vollständige Anleitungen und Schaltpläne besuchen Sie bitte:
* https://newbiely.de/tutorials/arduino-uno-r4/arduino-uno-r4-tft-lcd-touch-display-spi
*/
/*
Touch Button Press/Release Example
------------------------------------
This example shows how to detect press and release events on a rectangular
button using a DIYables SPI TFT display with a 4-wire resistive touch panel.
When you touch inside the button, it changes colour and shows "PRESSED".
When you release, it returns to its original state.
NOTE:
Run the TouchCalibration example and update setTouchCalibration() below
if the touch coordinates are inaccurate.
Created by DIYables
This example code is in the public domain
Product page: https://diyables.io
*/
// =============================================
// Single include brings in the base class plus all driver classes.
// =============================================
#include <DIYables_TFT_SPI.h>
// =============================================
// Wiring (Arduino Uno / Nano)
// =============================================
// TFT pins (always required)
// TFT module Arduino Uno / Nano
// ------------ ---------------------------------
// VCC -> 5V
// GND -> GND
// CS -> D10 (TFT_CS_PIN)
// RESET -> D9 (TFT_RST_PIN)
// DC / RS -> D8 (TFT_DC_PIN)
// SDI / MOSI -> D11 (hardware SPI MOSI)
// SCK -> D13 (hardware SPI SCK)
// SDO / MISO -> D12 (only needed when reading from display)
// LED -> 3.3V (or any GPIO via initBacklight)
//
// XPT2046 / HR2046 / ADS7843 SPI touch controller
// (modules with pins: T_CS, T_CLK, T_DIN, T_DO, T_IRQ)
// Touch pin Arduino Uno / Nano
// ------------ ---------------------------------
// T_CS -> D2 (TOUCH_CS_PIN)
// T_IRQ -> D2 (TOUCH_IRQ_PIN, optional - use -1 to skip)
// T_CLK -> D13 (shared with display SCK)
// T_DIN -> D11 (shared with display MOSI)
// T_DO -> D12 (shared with display MISO)
// =============================================
// =============================================
// SPI pin definitions (adjust for your board)
// =============================================
#define TFT_CS_PIN 10
#define TFT_DC_PIN 8
#define TFT_RST_PIN 9
// Panel resolution in native (portrait) orientation - change to match your module
#define TFT_WIDTH 240
#define TFT_HEIGHT 320
// =============================================
// Touch pin definitions (XPT2046 / HR2046 SPI touch controller)
// =============================================
#define TOUCH_CS_PIN 2 // T_CS (any GPIO)
#define TOUCH_IRQ_PIN -1 // T_IRQ (any GPIO, or -1 if not connected)
// =============================================
// =============================================
// Calibration values.
// Run the TouchCalibration example and update these if touch is inaccurate.
// Typical raw ranges:
// - XPT2046 / HR2046 : ~200..3900 (default below)
// - 4-wire resistive : ~100..900
// =============================================
#define TOUCH_LEFT_X 300
#define TOUCH_RIGHT_X 3700
#define TOUCH_TOP_Y 300
#define TOUCH_BOT_Y 3700
// =============================================
// Create display object (uncomment matching driver)
// =============================================
// DIYables_ILI9341_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
// DIYables_ILI9488_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
DIYables_ST7789_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
#define BLACK DIYables_TFT_SPI::colorRGB( 0, 0, 0)
#define WHITE DIYables_TFT_SPI::colorRGB(255, 255, 255)
#define GRAY DIYables_TFT_SPI::colorRGB(128, 128, 128)
#define RED DIYables_TFT_SPI::colorRGB(255, 0, 0)
#define BUTTON_X 30
#define BUTTON_Y 100
#define BUTTON_W 180
#define BUTTON_H 60
#define DEBOUNCE_DELAY 50
bool lastPressed = false;
bool stablePressed = false;
unsigned long lastDebounceTime = 0;
void drawButton(bool pressed) {
uint16_t bg = pressed ? GRAY : RED;
TFT_display.fillRect(BUTTON_X, BUTTON_Y, BUTTON_W, BUTTON_H, bg);
TFT_display.drawRect(BUTTON_X, BUTTON_Y, BUTTON_W, BUTTON_H, BLACK);
TFT_display.setTextColor(WHITE, bg);
TFT_display.setTextSize(3);
TFT_display.setCursor(BUTTON_X + 10, BUTTON_Y + 16);
TFT_display.print(pressed ? "PRESSED" : " PRESS ");
}
void setup() {
Serial.begin(9600);
TFT_display.begin();
TFT_display.setRotation(0);
TFT_display.fillScreen(WHITE);
TFT_display.initTouchSPI(TOUCH_CS_PIN, TOUCH_IRQ_PIN);
// If touch X is mirrored on your board, uncomment:
//TFT_display.setTouchInvertX(true);
// If touch Y is mirrored on your board, uncomment:
//TFT_display.setTouchInvertY(false);
TFT_display.setTouchCalibration(TOUCH_LEFT_X, TOUCH_RIGHT_X,
TOUCH_TOP_Y, TOUCH_BOT_Y);
drawButton(false);
}
void loop() {
int x, y;
bool pressed = false;
if (TFT_display.getTouch(x, y)) {
if (x >= BUTTON_X && x < (BUTTON_X + BUTTON_W) &&
y >= BUTTON_Y && y < (BUTTON_Y + BUTTON_H)) {
pressed = true;
}
}
if (pressed != lastPressed) {
lastDebounceTime = millis();
}
lastPressed = pressed;
if ((millis() - lastDebounceTime) > DEBOUNCE_DELAY) {
if (pressed != stablePressed) {
stablePressed = pressed;
drawButton(stablePressed);
Serial.println(stablePressed ? "Button PRESSED" : "Button RELEASED");
}
}
}
So führen Sie es aus
- Verbinden Sie T_CS mit D7. T_IRQ kann unverbunden bleiben – legen Sie es im Sketch auf -1 fest.
- Stecken Sie das USB-Typ-C-Kabel ein.
- Fügen Sie den Code ein, bestätigen Sie Platine und Anschluss, und drücken Sie Upload.
- Tippen Sie auf die auf dem Bildschirm angezeigten Schaltflächen. Jede Schaltfläche wechselt die Farbe, wenn sie gedrückt wird.
Kurzreferenz Methoden
| Methode | Was sie macht | Verwendung |
|---|---|---|
| initTouchSPI(cs, irq) | Initialisieren Sie den XPT2046. Übergeben Sie -1 für irq, um ohne Interrupt-Pin zu umfragen. | TFT_display.initTouchSPI(7, -1); |
| setTouchCalibration(minX,maxX,minY,maxY) | Wenden Sie Kalibrierung an, damit getTouch() Anzeigepikel-Koordinaten zurückgibt. | TFT_display.setTouchCalibration(200, 3800, 300, 3700); |
| setTouchInvertX(invert) / setTouchInvertY(invert) | Kehrt die Touch-Achse um, wenn X oder Y auf Ihrem spezifischen Panel oder Batch gespiegelt ist. Rufen Sie VOR setTouchCalibration() auf. | TFT_display.setTouchInvertY(true); |
| getTouch(x, y) | Rufen Sie die aktuelle kalibrierte Berührungsposition ab. Gibt „true" zurück, während der Bildschirm gedrückt wird. | if (TFT_display.getTouch(x, y)) { ... } |
| fillRect(x, y, w, h, color) | Zeichnen Sie ein durchgehend farbiges Rechteck für den Schaltflächenhintergrund. | TFT_display.fillRect(10, 10, 120, 60, BLUE); |
Touch-Kalibrierung
Das TouchCalibration-Beispiel führt Sie durch die Messung des rohen ADC-Bereichs Ihres XPT2046-Touch-Panels. Berühren Sie jede Ecke, wenn Sie dazu aufgefordert werden, und beobachten Sie die auf dem seriellen Monitor gedruckten Mindest- und Höchstwerte für X und Y. Verwenden Sie diese vier Zahlen im setTouchCalibration()-Aufruf in allen Ihren anderen Touch-Sketches.
/*
* Dieser Arduino UNO R4 Code wurde von newbiely.de entwickelt
* Dieser Arduino UNO R4 Code wird der Öffentlichkeit ohne jegliche Einschränkung zur Verfügung gestellt.
* Für vollständige Anleitungen und Schaltpläne besuchen Sie bitte:
* https://newbiely.de/tutorials/arduino-uno-r4/arduino-uno-r4-tft-lcd-touch-display-spi
*/
/*
Touch Screen Calibration Example
---------------------------------
This example measures the raw touch coordinates at all four screen corners
and prints ready-to-use calibration values to the Serial Monitor.
It uses readTouchRaw() directly — it does NOT rely on getTouch() or any
existing calibration values, so it works even when touch is completely broken.
INSTRUCTIONS:
1. Upload this sketch to your board.
2. Open the Serial Monitor (Ctrl+Shift+M) and set baud rate to 9600.
3. The screen shows a blinking red dot in each corner, numbered 1–4:
1 = Top-left
2 = Top-right
3 = Bottom-right
4 = Bottom-left
4. Press and HOLD firmly on the blinking dot.
Keep holding until the Serial Monitor prints "Captured!" for that corner.
5. Release, then wait for the next dot to appear and repeat.
6. After all 4 corners, the Serial Monitor prints the calibration values and
a ready-to-use setTouchCalibration() call. Copy it into your sketch.
NOTE: While waiting, the Serial Monitor continuously prints the live raw
Z/X/Y readings so you can confirm that touch is being detected.
Created by DIYables
This example code is in the public domain
Product page: https://diyables.io
*/
// =============================================
// Single include brings in the base class plus all driver classes.
// =============================================
#include <DIYables_TFT_SPI.h>
// =============================================
// Wiring (Arduino Uno / Nano)
// =============================================
// TFT pins (always required)
// TFT module Arduino Uno / Nano
// ------------ ---------------------------------
// VCC -> 5V
// GND -> GND
// CS -> D10 (TFT_CS_PIN)
// RESET -> D9 (TFT_RST_PIN)
// DC / RS -> D8 (TFT_DC_PIN)
// SDI / MOSI -> D11 (hardware SPI MOSI)
// SCK -> D13 (hardware SPI SCK)
// SDO / MISO -> D12 (only needed when reading from display)
// LED -> 3.3V (or any GPIO via initBacklight)
//
// XPT2046 / HR2046 / ADS7843 SPI touch controller
// (modules with pins: T_CS, T_CLK, T_DIN, T_DO, T_IRQ)
// Touch pin Arduino Uno / Nano
// ------------ ---------------------------------
// T_CS -> D2 (TOUCH_CS_PIN)
// T_IRQ -> D2 (TOUCH_IRQ_PIN, optional - use -1 to skip)
// T_CLK -> D13 (shared with display SCK)
// T_DIN -> D11 (shared with display MOSI)
// T_DO -> D12 (shared with display MISO)
// =============================================
// =============================================
// SPI pin definitions (adjust for your board)
// =============================================
#define TFT_CS_PIN 10
#define TFT_DC_PIN 8
#define TFT_RST_PIN 9
// Panel resolution in native (portrait) orientation - change to match your module
#define TFT_WIDTH 240
#define TFT_HEIGHT 320
// =============================================
// Touch pin definitions (XPT2046 / HR2046 SPI touch controller)
// =============================================
#define TOUCH_CS_PIN 2 // T_CS (any GPIO)
#define TOUCH_IRQ_PIN -1 // T_IRQ (any GPIO, or -1 if not connected)
// =============================================
// =============================================
// Create display object (uncomment matching driver)
// =============================================
// DIYables_ILI9341_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
// DIYables_ILI9488_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
DIYables_ST7789_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN);
// Minimum pressure to count as a valid touch.
#define TOUCH_Z_MIN 10
// How many consecutive valid samples required before a corner is accepted.
#define SAMPLES_NEEDED 10
// Delay between samples (ms).
#define SAMPLE_DELAY_MS 30
#define DOT_RADIUS 12
#define BLACK DIYables_TFT_SPI::colorRGB( 0, 0, 0)
#define WHITE DIYables_TFT_SPI::colorRGB(255, 255, 255)
#define RED DIYables_TFT_SPI::colorRGB(255, 0, 0)
// Corner pixel positions — filled in setup() once display size is known.
// Order: 0=top-left, 1=top-right, 2=bottom-right, 3=bottom-left
int cx[4], cy[4];
// Captured averaged raw values per corner.
int cap_x[4], cap_y[4];
// -----------------------------------------------------------------------
void drawDot(int corner, bool on) {
uint16_t color = on ? RED : WHITE;
TFT_display.fillCircle(cx[corner], cy[corner], DOT_RADIUS, color);
TFT_display.setTextSize(2);
TFT_display.setTextColor(BLACK, color);
TFT_display.setCursor(cx[corner] - 6, cy[corner] - 8);
TFT_display.print(corner + 1);
}
void captureCorner(int corner) {
const char* names[] = { "Top-left", "Top-right", "Bottom-right", "Bottom-left" };
Serial.println();
Serial.print("Corner "); Serial.print(corner + 1);
Serial.print(" ("); Serial.print(names[corner]); Serial.println(")");
Serial.println(" Press and HOLD firmly on the blinking dot.");
Serial.println(" Keep holding until you see 'Captured!'");
unsigned long lastBlink = 0;
unsigned long lastPrint = 0;
bool dotOn = false;
int goodSamples = 0;
long sumX = 0, sumY = 0;
while (true) {
// Blink the dot
if (millis() - lastBlink > 400) {
lastBlink = millis();
dotOn = !dotOn;
drawDot(corner, dotOn);
}
int raw_x, raw_y, z;
TFT_display.readTouchRaw(raw_x, raw_y, z);
// Print live readings every 500 ms
if (millis() - lastPrint > 500) {
lastPrint = millis();
Serial.print(" Z="); Serial.print(z);
Serial.print(" X="); Serial.print(raw_x);
Serial.print(" Y="); Serial.println(raw_y);
}
if (z >= TOUCH_Z_MIN) {
sumX += raw_x;
sumY += raw_y;
goodSamples++;
if (goodSamples >= SAMPLES_NEEDED) {
cap_x[corner] = sumX / goodSamples;
cap_y[corner] = sumY / goodSamples;
Serial.print(" Captured! raw_x="); Serial.print(cap_x[corner]);
Serial.print(" raw_y="); Serial.println(cap_y[corner]);
drawDot(corner, false);
delay(500);
return;
}
} else {
goodSamples = 0;
sumX = 0;
sumY = 0;
}
delay(SAMPLE_DELAY_MS);
}
}
// -----------------------------------------------------------------------
void setup() {
Serial.begin(9600);
TFT_display.begin();
TFT_display.setRotation(0); // Always calibrate in rotation 0
TFT_display.fillScreen(WHITE);
TFT_display.initTouchSPI(TOUCH_CS_PIN, TOUCH_IRQ_PIN);
// If touch X is mirrored on your board, uncomment the line below
// BEFORE calibrating (so the printed values match your panel):
//TFT_display.setTouchInvertX(true);
// If touch Y is mirrored on your board, uncomment:
//TFT_display.setTouchInvertY(false);
int w = TFT_display.width();
int h = TFT_display.height();
int m = DOT_RADIUS + 4;
cx[0] = m; cy[0] = m;
cx[1] = w - m; cy[1] = m;
cx[2] = w - m; cy[2] = h - m;
cx[3] = m; cy[3] = h - m;
Serial.println("=== Touch Calibration ===");
for (int i = 0; i < 4; i++) {
captureCorner(i);
}
// Derive calibration values from the four corners
int min_x = (cap_x[0] + cap_x[3]) / 2; // left edge
int max_x = (cap_x[1] + cap_x[2]) / 2; // right edge
int min_y = (cap_y[0] + cap_y[1]) / 2; // top edge
int max_y = (cap_y[2] + cap_y[3]) / 2; // bottom edge
Serial.println();
Serial.println("=== Calibration Results ===");
Serial.print(" Left X (min_x): "); Serial.println(min_x);
Serial.print(" Right X (max_x): "); Serial.println(max_x);
Serial.print(" Top Y (min_y): "); Serial.println(min_y);
Serial.print(" Bot Y (max_y): "); Serial.println(max_y);
Serial.println();
Serial.println("Copy this line into your sketch:");
Serial.print(" TFT_display.setTouchCalibration(");
Serial.print(min_x); Serial.print(", ");
Serial.print(max_x); Serial.print(", ");
Serial.print(min_y); Serial.print(", ");
Serial.print(max_y); Serial.println(");");
TFT_display.fillScreen(WHITE);
TFT_display.setTextColor(BLACK);
TFT_display.setTextSize(2);
TFT_display.setCursor(10, 10);
TFT_display.println("Done! Check");
TFT_display.setCursor(10, 35);
TFT_display.println("Serial Monitor");
}
void loop() {}
So führen Sie es aus
- Verdrahten Sie den XPT2046 mit dem Uno R4, wie im Abschnitt „Touch Punkt abrufen" beschrieben.
- Stecken Sie das USB-Typ-C-Kabel ein.
- Fügen Sie den Code ein, bestätigen Sie Platine und Anschluss, und drücken Sie Upload.
- Öffnen Sie den seriellen Monitor mit 9600 Baud. Befolgen Sie die auf dem Bildschirm angezeigten Aufforderungen, um jede Ecke des Displays zu berühren.
- Notieren Sie die vier gedruckten Werte und fügen Sie sie in setTouchCalibration() in Ihren anderen Touch-Sketches ein.
Kurzreferenz Methoden
| Methode | Was sie macht | Verwendung |
|---|---|---|
| initTouchSPI(cs, irq) | Initialisieren Sie den XPT2046-Touch-Controller. | TFT_display.initTouchSPI(7, 6); |
| readTouchRaw(x, y, z) | Lesen Sie rohe ADC-Werte, um den Kalibrierungsbereich zu messen. | TFT_display.readTouchRaw(x, y, z); |
| setTouchCalibration(minX,maxX,minY,maxY) | Speichern Sie die Kalibrierungswerte, damit getTouch() korrekt Pixelkoordinaten zuordnet. | TFT_display.setTouchCalibration(200, 3800, 300, 3700); |
| setTouchInvertX(invert) / setTouchInvertY(invert) | Kehrt die Touch-Achse um, wenn X oder Y auf Ihrem spezifischen Panel oder Batch gespiegelt ist. Rufen Sie VOR Kalibrierung auf, damit die gespeicherten Werte Ihrem Panel entsprechen. | TFT_display.setTouchInvertY(true); |
Benutzerdefinierten SPI verwenden
Das CustomSPI-Beispiel zeigt, wie Sie dem Display-Konstruktor eine explizite SPIClass-Instanz bereitstellen. Verwenden Sie diesen Ansatz, wenn der Standard-SPI-Bus mit einer anderen Peripherie beschäftigt ist, wenn Sie den Bus mit zusätzlicher Konfiguration teilen müssen oder wenn Sie eine benutzerdefinierte SPI-Taktfrequenz festlegen möchten.
Der Uno R4 Minima und WiFi geben jeweils einen einzelnen Hardware-SPI-Bus auf D11/D13/D12 frei. Das Beispiel zeigt das Übergeben von &SPI explizit und das Anpassen der maximalen SPI-Taktgeschwindigkeit.
/*
* Dieser Arduino UNO R4 Code wurde von newbiely.de entwickelt
* Dieser Arduino UNO R4 Code wird der Öffentlichkeit ohne jegliche Einschränkung zur Verfügung gestellt.
* Für vollständige Anleitungen und Schaltpläne besuchen Sie bitte:
* https://newbiely.de/tutorials/arduino-uno-r4/arduino-uno-r4-tft-lcd-touch-display-spi
*/
/*
Created by DIYables
This example code is in the public domain
Product page: https://diyables.io
This example demonstrates how to use a custom (non-default) SPI bus
with the DIYables TFT SPI library. This is useful on boards that have
multiple SPI interfaces, such as:
- ESP32: HSPI / VSPI
- Arduino Giga / Portenta: SPI1
- Raspberry Pi Pico: SPI1
*/
// =============================================
// Single include brings in the base class plus all driver classes.
// =============================================
#include <DIYables_TFT_SPI.h>
// =============================================
// Wiring (Arduino Uno / Nano - default SPI bus)
// ---------------------------------------------
// NOTE: Uno / Nano have only ONE hardware SPI bus, so this example is
// most useful on boards with multiple buses (ESP32, Giga, RP2040...).
// On Uno / Nano, MY_SPI must remain &SPI and the wiring is the standard
// hardware SPI mapping below.
//
// TFT module Arduino Uno / Nano
// ------------ ---------------------------------
// VCC -> 5V
// GND -> GND
// CS -> D10 (TFT_CS_PIN)
// RESET -> D9 (TFT_RST_PIN)
// DC / RS -> D8 (TFT_DC_PIN)
// SDI / MOSI -> D11 (hardware SPI MOSI)
// SCK -> D13 (hardware SPI SCK)
// LED -> 3.3V (or any GPIO via initBacklight)
// SDO / MISO -> D12 (only needed when reading from display)
// =============================================
// =============================================
// SPI pin definitions (adjust for your board)
// =============================================
#define TFT_CS_PIN 10
#define TFT_DC_PIN 8
#define TFT_RST_PIN 9
// Panel resolution in native (portrait) orientation - change to match your module
#define TFT_WIDTH 240
#define TFT_HEIGHT 320
// =============================================
// Select alternate SPI bus (uncomment for your board)
// =============================================
// --- ESP32: use HSPI ---
// SPIClass hspi(HSPI);
// #define MY_SPI &hspi
// --- Arduino Giga / Portenta / RP2040: use SPI1 ---
// #define MY_SPI &SPI1
// --- Default SPI (fallback) ---
#define MY_SPI &SPI
// =============================================
// Create display object with custom SPI bus
// (uncomment matching driver)
// =============================================
// DIYables_ILI9341_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN, MY_SPI);
// DIYables_ILI9488_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN, MY_SPI);
DIYables_ST7789_SPI TFT_display(TFT_WIDTH, TFT_HEIGHT, TFT_CS_PIN, TFT_DC_PIN, TFT_RST_PIN, MY_SPI);
#define BLACK DIYables_TFT_SPI::colorRGB(0, 0, 0)
#define WHITE DIYables_TFT_SPI::colorRGB(255, 255, 255)
#define RED DIYables_TFT_SPI::colorRGB(255, 0, 0)
#define GREEN DIYables_TFT_SPI::colorRGB(0, 255, 0)
#define BLUE DIYables_TFT_SPI::colorRGB(0, 0, 255)
void setup() {
Serial.begin(9600);
// For ESP32 HSPI: optionally remap pins before begin()
// hspi.begin(14, 12, 13, -1); // SCK, MISO, MOSI, SS
TFT_display.begin();
TFT_display.setRotation(1); // Landscape
TFT_display.fillScreen(BLACK);
uint16_t w = TFT_display.width();
uint16_t h = TFT_display.height();
// Draw a simple test pattern
TFT_display.fillRect(0, 0, w / 3, h, RED);
TFT_display.fillRect(w / 3, 0, w / 3, h, GREEN);
TFT_display.fillRect(w * 2 / 3, 0, w / 3, h, BLUE);
TFT_display.setTextColor(WHITE);
TFT_display.setTextSize(2);
TFT_display.setCursor(10, h / 2 - 10);
TFT_display.print("Custom SPI bus OK");
}
void loop() {
// Nothing to do
}
So führen Sie es aus
- Verdrahten Sie das TFT-Display mit dem Uno R4, wie in der Verdrahtungsanleitung gezeigt.
- Stecken Sie das USB-Typ-C-Kabel ein.
- Fügen Sie den Code ein, bestätigen Sie Platine und Anschluss, und drücken Sie Upload.
- Das Display wird auf dem expliziten SPI-Bus gestartet und rendert ein Farbbalkentestmuster.
Kurzreferenz Methoden
| Methode | Was sie macht | Verwendung |
|---|---|---|
| DIYables_ILI9341_SPI(w,h,cs,dc,rst,spi) | Konstruktor-Variante, die einen Zeiger auf alle SPIClass akzeptiert. Standardmäßig &SPI, wenn das Argument weggelassen wird. | DIYables_ILI9341_SPI tft(240, 320, 10, 9, 8, &SPI); |
| begin() | Initialisieren Sie das Display auf dem konfigurierten SPI-Bus. | TFT_display.begin(); |
Fehlerbehebung
- Schwarzer Bildschirm - Bestätigen Sie, dass CS, DC, MOSI und SCK alle verbunden sind. Eine fehlende CS-Leitung lässt das Display inaktiv.
- Falscher Treiber - Nur eine Konstruktor-Zeile sollte aktiv sein. Die anderen müssen auskommentiert sein.
- Verschobenes oder zugeschnittenes Bild - Die Breite und Höhe im Konstruktor müssen der physischen Panelgröße entsprechen.
- Touch funktioniert nicht - Führen Sie das TouchCalibration-Beispiel aus, um Kalibrierungswerte speziell für Ihren Panel zu erhalten.
Plattformunterstützung
Die Bibliothek stützt sich ausschließlich auf Arduino-Standard-APIs (SPI, digitalWrite, millis) und läuft auf allen Arduino-kompatiblen Plattformen, einschließlich des Uno R4 Minima und WiFi.