Adafruit_GFX/ImageReader exercises to load bmp images from MicroSD and display on 240×320 ST7789 SPI TFT, run on Seeed Studio XIAO ESP32S3 Sense (Arduino Platform).

Previous exercise of Seeed Studio XIAO ESP32S3 Sense display on 2.4" TFT 240×320 ST7789V using Adafruit_ST7789 lib in Arduino framework. In this exercise, load and display images from expansion board MicroSD card.


Connection between XIAO ESP32S3 Sense and 2.4" TFT 240×320 ST7789V,  refer to previous exercise.

Remark about the card slot on XIAO ESP32S3 Sense expansion boards

Refer to File System and XIAO ESP32S3 Sense document, Card slot circuit design for expansion boards part:

The GPIO assigned to microSD Card Slot's CS is GPIO21, and SCK/MISO/MOSI are assigned to GPIO7/8/9 (the hardware SPI). And it's also stated that "if you choose to use the microSD card function of the expansion board, you cannot also use the SPI function of the XIAO ESP32S3. You can turn on/off the microSD card function by connecting/cutting the pads of J3".


But in my exercise as shown in the video:
- It's no hardware modification on the expansion board.
- Both expansion board SD card slot and the ST7789 SPI TFT share the hardware SPI (GPIO7/8/9).

Exercise code:

XiaoS3_ST7789_240x320_GFX_SD.ino
Read and display bmp image /bluescreen_240x320.bmp from SD Card.
/**************************************************************************
  XIAO ESP32S3 Sense exercise to read bmp from SD Card and display on
  2.4" IPS 240x320 SPI (ST7789V)

  Connection:
  ST7789      XIAO ESP32S3
  1 GND	      GND
  2 VCC	      3V3
  3 SCL	      GPIO7 (hardware SPI SCK)
  4 SDA	      GPIO9 (hardware SPI MOSI)
  5 RST	      GPIO2
  6 DC	      GPIO3
  7 CS	      GPIO4
  8 BL	      3V3

  microSD Card Slot:
  SD_CS       GPIO21
  SCK         GPIO7
  MISO        GPIO8
  MOSI        GPIO9
  ref: https://wiki.seeedstudio.com/xiao_esp32s3_sense_filesystem/#card-slot-circuit-design-for-expansion-boards
 **************************************************************************/
#include <Adafruit_GFX.h>    // Core graphics library
#include <Adafruit_ST7789.h> // Hardware-specific library for ST7789
#include <SPI.h>

#include <SdFat.h>                // SD card & FAT filesystem library
#include <Adafruit_ImageReader.h> // Image-reading functions
#include <Adafruit_SPIFlash.h>    // SPI / QSPI flash library

#define TFT_RST       2
#define TFT_DC        3
#define TFT_CS        4

#define SD_CS         21

SdFat                SD;         // SD card filesystem
Adafruit_ImageReader reader(SD); // Image-reader object, pass in SD filesys

// For ST7789, using hardware SPI (SCK=GPIO7, MOSI=GPIO9): 
Adafruit_ST7789 tft = Adafruit_ST7789(TFT_CS, TFT_DC, TFT_RST);
Adafruit_Image       img;        // An image loaded into RAM

void setup(void) {
  ImageReturnCode stat; // Status from image-reading functions

  delay(500);
  Serial.begin(115200);
  delay(500);

  Serial.println();
  Serial.println("=======================================");
  Serial.println("XIAO ESP32S3 Sense exercise");
  Serial.println("to read bmp from SD Card and display on");
  Serial.println("2.4\" IPS 240x320 SPI (ST7789V)");
  Serial.println("=======================================");

  Serial.printf("MOSI: %d\n", MOSI);
  Serial.printf("MISO: %d\n", MISO);
  Serial.printf("SCK:  %d\n", SCK);

  Serial.printf("TFT_RST:  %d\n", TFT_RST);
  Serial.printf("TFT_DC:   %d\n", TFT_DC);
  Serial.printf("TFT_CS:   %d\n", TFT_CS);
  Serial.printf("SD_CS:    %d\n", SD_CS);
  Serial.println();

  // using a 2.4" IPS 240x320 SPI (ST7789V):
  tft.init(240, 320);           // Init ST7789 240x320
  tft.setRotation(2);
  tft.fillScreen(ST77XX_BLACK);
  
  Serial.println(F("TFT Initialized"));
  Serial.printf("%d x %d\n", tft.width(), int(tft.height()));

  String ex_info = "XIAO ESP32S3 Sense exercise:\nto read bmp from SD Card and display on 2.4\" IPS 240x320 SPI (ST7789V)";
  tft.setCursor(10, 10);
  tft.setTextColor(ST77XX_WHITE);
  tft.setTextSize(2);
  tft.setTextWrap(true);
  tft.print(ex_info);
  delay(3000);

  // The Adafruit_ImageReader constructor call (above, before setup())
  // accepts an uninitialized SdFat or FatVolume object. This MUST
  // BE INITIALIZED before using any of the image reader functions!
  Serial.print(F("Initializing filesystem..."));

  // SD card is pretty straightforward, a single call...
  if(!SD.begin(SD_CS)) { // 
    Serial.println(F("SD begin() failed"));
    for(;;); // Fatal error, do not continue
  }

  Serial.println(F("OK!"));

  // Load BMP 's1.bmp' into a GFX canvas in RAM.
  Serial.print(F("Loading bluescreen_240x320.bmp to canvas..."));
  stat = reader.loadBMP("/bluescreen_240x320.bmp", img);
  reader.printStatus(stat); // How'd we do?

  img.draw(tft, 0, 0);  //draw from RAM-resident images:

}

void loop() {
}


XiaoS3_ST7789_240x320_GFX_SD_images.ino
to display 01~10.bmp 240x240 images in SD /images_24320/ directory (or 320x320 images in SD /images_320/ directory). The image used in the video was resized/converted from jpg to bmp using Python/OpenCV on Raspberry Pi.
/**************************************************************************
  XIAO ESP32S3 Sense exercise to read bmp from SD Card and display on
  2.4" IPS 240x320 SPI (ST7789V)
  loop to display images in images_320/ directory.

  Connection:
  ST7789      XIAO ESP32S3
  1 GND	      GND
  2 VCC	      3V3
  3 SCL	      GPIO7 (hardware SPI SCK)
  4 SDA	      GPIO9 (hardware SPI MOSI)
  5 RST	      GPIO2
  6 DC	      GPIO3
  7 CS	      GPIO4
  8 BL	      3V3

  microSD Card Slot:
  SD_CS       GPIO21
  SCK         GPIO7
  MISO        GPIO8
  MOSI        GPIO9
  ref: https://wiki.seeedstudio.com/xiao_esp32s3_sense_filesystem/#card-slot-circuit-design-for-expansion-boards
 **************************************************************************/
#include <Adafruit_GFX.h>    // Core graphics library
#include <Adafruit_ST7789.h> // Hardware-specific library for ST7789
#include <SPI.h>

#include <SdFat.h>                // SD card & FAT filesystem library
#include <Adafruit_ImageReader.h> // Image-reading functions
#include <Adafruit_SPIFlash.h>    // SPI / QSPI flash library

#define TFT_RST       2
#define TFT_DC        3
#define TFT_CS        4

#define SD_CS         21

SdFat                SD;         // SD card filesystem
Adafruit_ImageReader reader(SD); // Image-reader object, pass in SD filesys

// For ST7789, using hardware SPI (SCK=GPIO7, MOSI=GPIO9): 
Adafruit_ST7789 tft = Adafruit_ST7789(TFT_CS, TFT_DC, TFT_RST);
Adafruit_Image       img;        // An image loaded into RAM

const char *bmpFile[] = {"images_320/01.bmp", "images_320/02.bmp", "images_320/03.bmp", "images_320/04.bmp", "images_320/05.bmp",
                         "images_320/06.bmp", "images_320/07.bmp", "images_320/08.bmp", "images_320/09.bmp", "images_320/10.bmp"};

void setup(void) {
  ImageReturnCode stat; // Status from image-reading functions

  delay(500);
  Serial.begin(115200);
  delay(500);

  Serial.println();
  Serial.println("=======================================");
  Serial.println("XIAO ESP32S3 Sense exercise");
  Serial.println("to read bmp from SD Card and display on");
  Serial.println("2.4\" IPS 240x320 SPI (ST7789V)");
  Serial.println("=======================================");

  Serial.printf("MOSI: %d\n", MOSI);
  Serial.printf("MISO: %d\n", MISO);
  Serial.printf("SCK:  %d\n", SCK);

  Serial.printf("TFT_RST:  %d\n", TFT_RST);
  Serial.printf("TFT_DC:   %d\n", TFT_DC);
  Serial.printf("TFT_CS:   %d\n", TFT_CS);
  Serial.printf("SD_CS:    %d\n", SD_CS);
  Serial.println();

  // using a 2.4" IPS 240x320 SPI (ST7789V):
  tft.init(240, 320);           // Init ST7789 240x320
  tft.setRotation(2);
  tft.fillScreen(ST77XX_BLACK);
  
  Serial.println(F("TFT Initialized"));
  Serial.printf("%d x %d\n", tft.width(), int(tft.height()));

  String ex_info = "XIAO ESP32S3 Sense exercise:\nto read bmp from SD Card and display on 2.4\" IPS 240x320 SPI (ST7789V), \n\nloop to display images in images_320/ directory.";
  tft.setCursor(10, 10);
  tft.setTextColor(ST77XX_WHITE);
  tft.setTextSize(2);
  tft.setTextWrap(true);
  tft.print(ex_info);
  delay(3000);

  // The Adafruit_ImageReader constructor call (above, before setup())
  // accepts an uninitialized SdFat or FatVolume object. This MUST
  // BE INITIALIZED before using any of the image reader functions!
  Serial.print(F("Initializing filesystem..."));

  // SD card is pretty straightforward, a single call...
  if(!SD.begin(SD_CS)) { // 
    Serial.println(F("SD begin() failed"));
    for(;;); // Fatal error, do not continue
  }

  Serial.println(F("OK!"));

}

void loop() {
  for(int i=0; i<10; i++) {
      reader.drawBMP(bmpFile[i], tft, 0, 0);
      delay(3000);
    }
}


Related:
Adafruit_ImageReader exercises run on Raspberry Pi Pico to load images from SD Card, display on 320x240 IPS SPI ILI9341.

Comments

Popular posts from this blog

480x320 TFT/ILI9488 SPI wih EP32C3 (arduino-esp32) using Arduino_GFX Library

MicroPython/ESP32-C3 + 1.8" 128x160 TFT ST7735 SPI, using boochow/MicroPython-ST7735 library.