CommunityForumWikiBlogLearn
Go Back
FireBeetle ESP32-S3 AI Acceleration Board
  • wiki
  • dfr0975
  • Example Code for Arduino - Drive a Display on ESP32-S3

Example Code for Arduino - Drive a Display on ESP32-S3

This guide shows how to drive a TFT display on the FireBeetle 2 ESP32-S3 using the GDI interface, including setup instructions and example code for basic graphics and text display.

Hardware Preparation

FireBeetle 2 ESP32-S3 AI Board with OV2640 Camera x 1

Software Preparation

When you use the ESP32 for the first time, you need to know the following steps:

  1. Add the ESP32 development board in Arduino IDE (How to add the ESP32 board to Arduino IDE?)

  2. Select the development board and serial port

  3. Burn the program

Sample Code

The example is for driving 1.8”128x160 IPS TFT LCD on ESP32-S3. Please download DFRobot_GDL library before use.

#include "DFRobot_GDL.h"

#define TFT_DC  3
#define TFT_CS  18
#define TFT_RST 38

DFRobot_ST7735_128x160_HW_SPI screen(/*dc=*/TFT_DC,/*cs=*/TFT_CS,/*rst=*/TFT_RST);
/* M0 mainboard DMA transfer */
//DFRobot_ST7735_128x160_DMA_SPI screen(/*dc=*/TFT_DC,/*cs=*/TFT_CS,/*rst=*/TFT_RST);


void setup() {
  Serial.begin(115200);
  screen.begin();
}

void loop(){
    testLine();
    testFastLines(COLOR_RGB565_PURPLE,COLOR_RGB565_YELLOW);       
    testRects(COLOR_RGB565_BLACK,COLOR_RGB565_WHITE);
    testRoundRects();
    testCircles(24,COLOR_RGB565_BLUE);
    testTriangles(COLOR_RGB565_YELLOW);
    testPrint();
}


void testLine(){
  uint16_t color = 0x00FF;
  screen.fillScreen(COLOR_RGB565_BLACK);
  for (int16_t x=0; x < screen.width(); x+=6) {
    screen.drawLine(/*x0=*/screen.width()/*Screen width*//2, /*y0=*/screen.height()/*Screen height*//2, /*x1=*/x, /*y1=*/0, /*c=*/color+=0x0700);
  }
  for (int16_t y=0; y < screen.height(); y+=6) {
    screen.drawLine(screen.width()/2, screen.height()/2, screen.width(), y, color+=0x0700);
  }

  for (int16_t x = screen.width(); x >= 0; x-=6) {
    screen.drawLine(screen.width()/2, screen.height()/2, x,screen.height(), color+=0x0700);
  }

  for (int16_t y = screen.height(); y >= 0; y-=6) {
    screen.drawLine(screen.width()/2, screen.height()/2, 0, y, color+=0x0700);
  }
}

void testFastLines(uint16_t color1, uint16_t color2) {
  for (int16_t y=0; y < screen.height(); y+=4) {
    screen.drawFastHLine(/*x=*/0, /*y=*/y, /*w=*/screen.width(),/*c=*/color2);
    delay(10);
  }

  for(int16_t x=0; x < screen.width(); x+=3) {
    screen.drawFastVLine(/*x=*/x, /*y=*/0, /*h=*/screen.height(), /*c=*/color1);
    delay(10);
  }
}

void testRects(uint16_t color1, uint16_t color2) { 
    screen.fillScreen(COLOR_RGB565_BLACK);
    int16_t x=screen.width()-12;
    for (; x > 100; x-=screen.width()/40) {
      screen.drawRect(/*x=*/screen.width()/2 -x/2, /*y=*/screen.height()/2 -x/2 , /*w=*/x, /*h=*/x, /*color=*/color2+=0x0F00);
      delay(100);
    }

    screen.fillRect(/*x=*/screen.width()/2 -x/2, /*y=*/screen.height()/2 -x/2 , /*w=*/x, /*h=*/x, /*color=*/color2);
    delay(100);
    for(; x > 6; x-=screen.width()/40){
      screen.drawRect(screen.width()/2 -x/2, screen.height()/2 -x/2 , x, x, color1);
      delay(100);
    }
}

void testRoundRects() {
  screen.fillScreen(COLOR_RGB565_BLACK);
  int color = 0xF00F;
  int i;
  int x = 0;
  int y = 0;
  int w = screen.width()-3;
  int h = screen.height()-3;
  for(i = 0 ; i <= 10; i+=2) {
    screen.drawRoundRect(/*x0=*/x, /*y0=*/y, /*w=*/w, /*h=*/h, /*radius=*/20, /*color=*/color);
    x+=5;
    y+=5;
    w-=10;
    h-=10;
    color+=0x0100;
    delay(50);
  }
  for(i = 0 ; i <= 10; i+=2) {
    screen.fillRoundRect(/*x0=*/x, /*y0=*/y, /*w=*/w, /*h=*/h, /*radius=*/10, /*color=*/color);
    x+=5;
    y+=5;
    w-=10;
    h-=10;
    color+=0x0500;
    delay(50);
  }
}

void testCircles(uint8_t radius, uint16_t color) {
  screen.fillScreen(COLOR_RGB565_BLACK);
  for (int16_t x=radius; x <=screen.width()-radius; x+=radius*2) {
    for (int16_t y=radius; y <=screen.height()-radius; y+=radius*2) {
      screen.drawCircle(/*x0=*/x, /*y0=*/y, /*r=*/radius, /*color=*/color);
        if(x == y ||x == -y ||x == y + 2*radius)
          screen.fillCircle(/*x0=*/x, /*y0=*/y, /*r=*/radius, /*color=*/color);
       color += 800;
       delay(100);
    }
  }
}

void testTriangles(uint16_t color){
  screen.fillScreen(COLOR_RGB565_BLACK);

  for (int16_t i=0; i <=screen.width(); i+=24)
    screen.drawTriangle(/*x0=*/i,/*y0=*/0,/*x1=*/0,/*y1=*/screen.height()-i,/*x2=*/screen.width()-i,/*y2=*/screen.height(), /*color=*/color);

  for (int16_t i=0; i <screen.width(); i+=24)
    screen.drawTriangle(screen.width(),i*4/3,0,screen.height()-i*4/3,i,0, color);

  for (int16_t i=0; i <screen.width(); i+=24)
    screen.drawTriangle(screen.width(),i*4/3,i,0,screen.width()-i,screen.height(), color);

  color = COLOR_RGB565_RED;
  for (int16_t i=0; i <=screen.width(); i+=24)
    screen.fillTriangle(/*x0=*/i,/*y0=*/0,/*x1=*/0,/*y1=*/screen.height()-i,/*x2=*/screen.width()-i,/*y2=*/screen.height(), /*color=*/color+=100);

  for (int16_t i=0; i <screen.width(); i+=24)
    screen.fillTriangle(screen.width(),i*4/3,0,screen.height()-i*4/3,i,0, color+=100);

  for (int16_t i=0; i <screen.width(); i+=24)
    screen.fillTriangle(screen.width(),i*4/3,i,0,screen.width()-i,screen.height(), color+=100);
}

void testPrint() {
  int16_t color = 0x00FF;
  screen.setTextWrap(false);
  screen.fillScreen(COLOR_RGB565_BLACK);
  screen.setCursor(0, 50);
  screen.setTextColor(color+=0x3000);
  screen.setTextSize(0);
  screen.println("Hello World!");
  screen.setTextColor(color+=0x3000);
  screen.setTextSize(1);
  screen.println("Hello World!");
  screen.setTextColor(color+=0x3000);
  screen.setTextSize(2);
  screen.println("Hello World!");
  screen.setTextColor(color+=0x3000);
  screen.setTextSize(3);
  screen.println("Hello World!");
  screen.setTextColor(color+=0x3000)
  screen.setTextSize(4);
  screen.println("Hello!"); 
  screen.setTextSize(5);
  screen.print("Hello!");
  delay(2000);
  screen.setCursor(0, 0);
  screen.fillScreen(COLOR_RGB565_BLACK);
  screen.setTextSize(2);
  screen.setTextColor(color+=0x3000);
  screen.print("a = ");
  screen.setTextColor(color+=0x3000);
  int a = 1234;
  screen.println(a, 1);
  screen.setTextColor(color+=0x3000);
  screen.print(8675309, HEX);
  screen.println("this is HEX!");
  screen.println("");
  screen.setTextColor(color+=0x0F00);
  screen.println("running for: ");
  screen.setTextColor(color+=0x0F00);
  screen.print(millis());
  screen.setTextColor(color+=0x0F00);
  screen.println("/1000 seconds.");
  char text[] = "Hi DFRobot!";
  screen.setTextColor(color+=0x0F00);
  screen.setTextWrap(true);
  screen.setTextSize(3);
  screen.println(text);
  //screen.setFonts((const gdl_Font_t *)SIMKAIFont18ptBitmaps);
  screen.println(text);
  delay(2000);
}

Other Supplementary Information

The DFRbot dedicated GDI display interface is for connecting a screen using a 18pin-FPC wire.

Displays that support GDI:

The pin list for using GDI display interface is shown below:

|FPC PINS| Beetle ESP32 S3 Pins |Description
|---|---|
|VCC| 3V3 |3.3V
|LCD_BL |21/D13| Backlight
|GND| GND |GND
|SCLK| 17/SCK| SPI clock
|MOSI |15/MOSI| Host output, slave input
|MISO |16/MISO| Host input, slave output
|LCD_DC| 3/D2| Data/command
|LCD_RST| 38/D3 |Reset
|LCD_CS |18/D6 |TFT Chip Select
|SD_CS| 9/D7| SD card chip select
|FCS |7/D6| Font library chip select
|TCS| 12/D12 |Touch chip select
|SCL| 2/SCL |I2C clock
|SDA |1/SDA| I2C data
|INT |13/D11| INT
|BUSY| 4/D10 |Tearproof pins
|X1 |NC| custom pin 1
|X2| NC |custom pin 2

Was this article helpful?

ON THIS PAGE

TOP