Fotoschau mit ESP32 TFT und SD-Kartenleser (Lösung) – Projekte für Arduino und ESP32-Mikrocontroller

Inhalt

mit internem Kartenleser
mit externem SD-Kartenleser

mit internem Kartenleser

#include "SdFat.h"
#include "Adafruit_ST7796S_kbv.h"
#include "Adafruit_ImageReader.h"

// ESP32-WROOM
#define TFT_CS        5
#define TFT_RST       4 
#define TFT_DC        2

/* 
  SD VSPI Standard-Pins
  CLK    18
  MOSI   23
  MISO   19
  CS      5
*/

// Objekt tft der Bibliothek Adafruit_ST7796S_kbv erstellen
Adafruit_ST7796S_kbv tft = Adafruit_ST7796S_kbv(TFT_CS, TFT_DC, TFT_RST);

// Objekt SD der Bibliothek SdFat erstellen
SdFat SD;              

// Objekt des Kartenlesers wird an das Dateisystem der SD-Karte übertragen
Adafruit_ImageReader reader(SD);

Adafruit_Image Bild;  

// Farben
#define SCHWARZ     0x0000
#define WEISS       0xFFFF
#define BLAU        0x001F

// 3 = FAT32
#define SD_FAT_TYPE 3

// SPI-Geschwindigkeit
#define SPI_SPEED SD_SCK_MHZ(10)

// CSPin der SD-Karte
int CSPin = 15;

// Anzeigedauer
int Intervall = 6000;

bool Beschreibung = true;

void setup() 
{
  Serial.begin(9600);

  // auf serielle Verbindung warten
  while (!Serial);
  delay(1000);
 
  // TFT starten
  tft.begin();
  
  tft.invertDisplay(1);

  // Rotation anpassen
  tft.setRotation(3);

  // schwarzer Hintergrund
  tft.fillScreen(SCHWARZ);
  tft.setTextSize(3);
  tft.setTextColor(WEISS);
  tft.setCursor(1, 20);

  /*
     SD-Karte mit Angabe des CSPins und  der SPI-Geschwindigkeit starten
     wenn die Intialisierung fehlschlägt
     - keine SD-Karte vorhanden
     - falsche Pinbelegung
     -> es wird eine Fehlermeldung angezeigt
  */
  if (!SD.begin(CSPin, SPI_SPEED)) 
  {
    tft.println("Start der SD-Karte");
    tft.print("fehlgeschlagen!");
    Serial.println("Start der SD-Karte fehlgeschlagen!");
  } 
  else 
  {
    Serial.println("SD-Karte gestartet");
    tft.print("SD-Karte gestartet!");
  }

  delay(5000);
}

void loop() 
{  
  reader.drawBMP("koeln.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.setCursor(10, 295);  
    tft.print("K");
    // ö = 0x94
    tft.write(0x94);
    tft.println("ln Blick vom Messeturm");
  }
  
  delay(Intervall);
 
  reader.drawBMP("duenen.bmp", tft, 0, 0);
  
  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("D");
    // ü = 0x81
    tft.write(0x81);
    tft.print("nen Ibiza");
  }

  delay(Intervall);  
 
  reader.drawBMP("overath_bahnhof.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Overath Bahnhof");
  }

  delay(Intervall);
 
  reader.drawBMP("dresden_frauenkirche.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Dresden Frauenkirche");
  }

  delay(Intervall);
 
  reader.drawBMP("chartres.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Chartres Dom");
  }

  delay(Intervall);

  reader.drawBMP("bonn_uni.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Bonn Uni");
  }

  delay(Intervall);

  reader.drawBMP("braunwald.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Braunwald Schweiz");
  }

  delay(Intervall);
   
  reader.drawBMP("koeln_deutz.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("K");
    // ö = 0x94
    tft.write(0x94);
    tft.println("ln Deutz");
  }

  delay(Intervall);

  reader.drawBMP("st_michelle.bmp", tft, 0, 0);
  
  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("St. Michelle Frankreich");
  }
  delay(Intervall);

  reader.drawBMP("lindos.bmp", tft, 0, 0);
  
  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Lindos Rhodos");
  }

  delay(Intervall);
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

#include “SdFat.h”

#include “Adafruit_ST7796S_kbv.h”

#include “Adafruit_ImageReader.h”

// ESP32-WROOM

#define TFT_CS 5

#define TFT_RST 4

#define TFT_DC 2

SD VSPI Standard-Pins

CLK 18

MOSI 23

MISO 19

CS 5

// Objekt tft der Bibliothek Adafruit_ST7796S_kbv erstellen

Adafruit_ST7796S_kbv tft = Adafruit_ST7796S_kbv(TFT_CS, TFT_DC, TFT_RST);

// Objekt SD der Bibliothek SdFat erstellen

SdFat SD;

// Objekt des Kartenlesers wird an das Dateisystem der SD-Karte übertragen

Adafruit_ImageReader reader(SD);

Adafruit_Image Bild;

// Farben

#define SCHWARZ 0x0000

#define WEISS 0xFFFF

#define BLAU 0x001F

// 3 = FAT32

#define SD_FAT_TYPE 3

// SPI-Geschwindigkeit

#define SPI_SPEED SD_SCK_MHZ(10)

// CSPin der SD-Karte

int CSPin = 15;

// Anzeigedauer

int Intervall = 6000;

bool Beschreibung = true;

void setup()

{

Serial.begin(9600);

// auf serielle Verbindung warten

while (!Serial);

delay(1000);

// TFT starten

tft.begin();

tft.invertDisplay(1);

// Rotation anpassen

tft.setRotation(3);

// schwarzer Hintergrund

tft.fillScreen(SCHWARZ);

tft.setTextSize(3);

tft.setTextColor(WEISS);

tft.setCursor(1, 20);

SD-Karte mit Angabe des CSPins und der SPI-Geschwindigkeit starten

wenn die Intialisierung fehlschlägt

— keine SD-Karte vorhanden

— falsche Pinbelegung

-> es wird eine Fehlermeldung angezeigt

if (!SD.begin(CSPin, SPI_SPEED))

{

tft.println(“Start der SD-Karte”);

tft.print(“fehlgeschlagen!”);

Serial.println(“Start der SD-Karte fehlgeschlagen!”);

}

else

{

Serial.println(“SD-Karte gestartet”);

tft.print(“SD-Karte gestartet!”);

}

delay(5000);

}

void loop()

{

reader.drawBMP(“koeln.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.setCursor(10, 295);

tft.print(“K”);

// ö = 0x94

tft.write(0x94);

tft.println(“ln Blick vom Messeturm”);

}

delay(Intervall);

reader.drawBMP(“duenen.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“D”);

// ü = 0x81

tft.write(0x81);

tft.print(“nen Ibiza”);

}

delay(Intervall);

reader.drawBMP(“overath_bahnhof.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Overath Bahnhof”);

}

delay(Intervall);

reader.drawBMP(“dresden_frauenkirche.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Dresden Frauenkirche”);

}

delay(Intervall);

reader.drawBMP(“chartres.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Chartres Dom”);

}

delay(Intervall);

reader.drawBMP(“bonn_uni.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Bonn Uni”);

}

delay(Intervall);

reader.drawBMP(“braunwald.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Braunwald Schweiz”);

}

delay(Intervall);

reader.drawBMP(“koeln_deutz.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“K”);

// ö = 0x94

tft.write(0x94);

tft.println(“ln Deutz”);

}

delay(Intervall);

reader.drawBMP(“st_michelle.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“St. Michelle Frankreich”);

}

delay(Intervall);

reader.drawBMP(“lindos.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Lindos Rhodos”);

}

delay(Intervall);

}

mit externem SD-Kartenleser

#include "SdFat.h"
#include "Adafruit_ST7796S_kbv.h"
#include "Adafruit_ImageReader.h"

// TFT HSPI
#define TFT_CS        15
#define TFT_RST        4 
#define TFT_DC         2
#define TFT_CLK       14
#define TFT_MOSI      13 

/* 
  SD VSPI Standard-Pins
  CLK    18
  MOSI   23
  MISO   19
  CS      5
*/

// Objekt tft der Bibliothek Adafruit_ST7796S_kbv erstellen
Adafruit_ST7796S_kbv tft = Adafruit_ST7796S_kbv(TFT_CS, TFT_DC, TFT_MOSI, TFT_CLK, TFT_RST);

// Objekt SD der Bibliothek SdFat erstellen
SdFat SD;              

// Objekt des Kartenlesers wird an das Dateisystem der SD-Karte übertragen
Adafruit_ImageReader reader(SD);

Adafruit_Image Bild;  

// Farben
#define SCHWARZ     0x0000
#define WEISS       0xFFFF
#define BLAU        0x001F

// 3 = FAT32
#define SD_FAT_TYPE 3

// SPI-Geschwindigkeit
#define SPI_SPEED SD_SCK_MHZ(4)

// CSPin der SD-Karte
int CSPin = 5;

// Anzeigedauer
int Intervall = 5000;

// true -> Beschreibung anzeigen
// false -> Bild ohne Beschriftung anzeigen
bool Beschreibung = true;

void setup() 
{
  Serial.begin(9600);

  // auf serielle Verbindung warten
  while (!Serial);
  delay(1000);
 
  // TFT starten
  tft.begin();

  // Rotation anpassen
  tft.setRotation(1);

  // schwarzer Hintergrund
  tft.fillScreen(SCHWARZ);
  tft.setTextSize(3);
  tft.setTextColor(WEISS);
  tft.setCursor(1, 20);

  /*
     SD-Karte mit Angabe des CSPins und  der SPI-Geschwindigkeit starten
     wenn die Intialisierung fehlschlägt
     - keine SD-Karte vorhanden
     - falsche Pinbelegung
     -> es wird eine Fehlermeldung angezeigt
  */
  if (!SD.begin(CSPin, SPI_SPEED)) 
  {
    tft.println("Start der SD-Karte");
    tft.print("fehlgeschlagen!");
    Serial.println("Start der SD-Karte fehlgeschlagen!");
  } 
  else 
  {
    Serial.println("SD-Karte gestartet");
    tft.print("SD-Karte gestartet!");
  }

  delay(5000);
}
void loop() 
{  
  reader.drawBMP("koeln.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.setCursor(10, 295);  
    tft.print("K");
    // ö = 0x94
    tft.write(0x94);
    tft.println("ln Blick vom Messeturm");
  }
  
  delay(Intervall);
 
  reader.drawBMP("duenen.bmp", tft, 0, 0);
  
  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("D");
    // ü = 0x81
    tft.write(0x81);
    tft.print("nen Ibiza");
  }

  delay(Intervall);  
 
  reader.drawBMP("overath_bahnhof.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Overath Bahnhof");
  }

  delay(Intervall);
 
  reader.drawBMP("dresden_frauenkirche.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Dresden Frauenkirche");
  }

  delay(Intervall);
 
  reader.drawBMP("chartres.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Chartres Dom");
  }

  delay(Intervall);

  reader.drawBMP("bonn_uni.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Bonn Uni");
  }

  delay(Intervall);

  reader.drawBMP("braunwald.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Braunwald Schweiz");
  }

  delay(Intervall);
   
  reader.drawBMP("koeln_deutz.bmp", tft, 0, 0);

  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("K");
    // ö = 0x94
    tft.write(0x94);
    tft.println("ln Deutz");
  }

  delay(Intervall);

  delay(Intervall);

  reader.drawBMP("st_michelle.bmp", tft, 0, 0);
  
  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("St. Michelle Frankreich");
  }
  delay(Intervall);

  reader.drawBMP("lindos.bmp", tft, 0, 0);
  
  if (Beschreibung)
  {
    tft.setCursor(10, 295);  
    tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120); 
    tft.print("Lindos Rhodos");
  }

  delay(Intervall);
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

#include “SdFat.h”

#include “Adafruit_ST7796S_kbv.h”

#include “Adafruit_ImageReader.h”

// TFT HSPI

#define TFT_CS 15

#define TFT_RST 4

#define TFT_DC 2

#define TFT_CLK 14

#define TFT_MOSI 13

SD VSPI Standard-Pins

CLK 18

MOSI 23

MISO 19

CS 5

// Objekt tft der Bibliothek Adafruit_ST7796S_kbv erstellen

Adafruit_ST7796S_kbv tft = Adafruit_ST7796S_kbv(TFT_CS, TFT_DC, TFT_MOSI, TFT_CLK, TFT_RST);

// Objekt SD der Bibliothek SdFat erstellen

SdFat SD;

// Objekt des Kartenlesers wird an das Dateisystem der SD-Karte übertragen

Adafruit_ImageReader reader(SD);

Adafruit_Image Bild;

// Farben

#define SCHWARZ 0x0000

#define WEISS 0xFFFF

#define BLAU 0x001F

// 3 = FAT32

#define SD_FAT_TYPE 3

// SPI-Geschwindigkeit

#define SPI_SPEED SD_SCK_MHZ(4)

// CSPin der SD-Karte

int CSPin = 5;

// Anzeigedauer

int Intervall = 5000;

// true -> Beschreibung anzeigen

// false -> Bild ohne Beschriftung anzeigen

bool Beschreibung = true;

void setup()

{

Serial.begin(9600);

// auf serielle Verbindung warten

while (!Serial);

delay(1000);

// TFT starten

tft.begin();

// Rotation anpassen

tft.setRotation(1);

// schwarzer Hintergrund

tft.fillScreen(SCHWARZ);

tft.setTextSize(3);

tft.setTextColor(WEISS);

tft.setCursor(1, 20);

SD-Karte mit Angabe des CSPins und der SPI-Geschwindigkeit starten

wenn die Intialisierung fehlschlägt

— keine SD-Karte vorhanden

— falsche Pinbelegung

-> es wird eine Fehlermeldung angezeigt

if (!SD.begin(CSPin, SPI_SPEED))

{

tft.println(“Start der SD-Karte”);

tft.print(“fehlgeschlagen!”);

Serial.println(“Start der SD-Karte fehlgeschlagen!”);

}

else

{

Serial.println(“SD-Karte gestartet”);

tft.print(“SD-Karte gestartet!”);

}

delay(5000);

}

void loop()

{

reader.drawBMP(“koeln.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.setCursor(10, 295);

tft.print(“K”);

// ö = 0x94

tft.write(0x94);

tft.println(“ln Blick vom Messeturm”);

}

delay(Intervall);

reader.drawBMP(“duenen.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“D”);

// ü = 0x81

tft.write(0x81);

tft.print(“nen Ibiza”);

}

delay(Intervall);

reader.drawBMP(“overath_bahnhof.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Overath Bahnhof”);

}

delay(Intervall);

reader.drawBMP(“dresden_frauenkirche.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Dresden Frauenkirche”);

}

delay(Intervall);

reader.drawBMP(“chartres.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Chartres Dom”);

}

delay(Intervall);

reader.drawBMP(“bonn_uni.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Bonn Uni”);

}

delay(Intervall);

reader.drawBMP(“braunwald.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Braunwald Schweiz”);

}

delay(Intervall);

reader.drawBMP(“koeln_deutz.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“K”);

// ö = 0x94

tft.write(0x94);

tft.println(“ln Deutz”);

}

delay(Intervall);

reader.drawBMP(“st_michelle.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“St. Michelle Frankreich”);

}

delay(Intervall);

reader.drawBMP(“lindos.bmp”, tft, 0, 0);

if (Beschreibung)

{

tft.setCursor(10, 295);

tft.fillRect(1, 290, tft.width(), tft.height(), 0x0120);

tft.print(“Lindos Rhodos”);

}

delay(Intervall);

}

Letzte Aktualisierung: Nov. 19, 2025 @ 19:31