Example Code for Arduino-UI Coordinate (Broken Line Graph)

This article presents a detailed guide on creating a broken line graph using Arduino C with an ESP32 and a TFT LCD display, covering hardware and software preparation, wiring configuration, and sample code implementation for seamless integration.

Hardware Preparation

  • FireBeetle ESP32-E (or similar) x 1
  • 1.8Inch 128×160 TFT LCD Display with MicroSD Card Slot x1
  • Wires

Software Preparation

Wiring Diagram

The following figure shows two ways of connection: SPI and GDI.

Connection

Other Preparation Work

  1. For using GDI, please make sure your controller has GDI interface.
  2. It is recommended to use Arduino version 1.8.10 and above.
  3. If the SD card slot is not well connected, the initialization may fail, and it will succeed after unplugging and plugging again.
  4. Arduino UNO is not recommended for memory reasons.
  5. All the Demos of this product are stored in the file of DFRobot_GDL->ST7735_128x160-.
  6. Before burning the Demo, please open the corresponding substantiation function (DFRobot_ST7789_128x160_HW_SPI)

Note

Sample Code

#include "DFRobot_UI.h"
#include "Arduino.h"
#include "DFRobot_GDL.h"
#include "DFRobot_Touch.h"
/*M0*/
#if defined ARDUINO_SAM_ZERO
#define TFT_DC  7
#define TFT_CS  5
#define TFT_RST 6
/*ESP32 ESP8266*/
#elif defined(ESP32)
#define TFT_DC  D2
#define TFT_CS  D6
#define TFT_RST D3
/*ESP8266*/
#elif defined(ESP8266)
#define TFT_DC  D4
#define TFT_CS  D6
#define TFT_RST D5
/* AVR series mainboard */
#else
#define TFT_DC  2
#define TFT_CS  3
#define TFT_RST 4
#endif


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);

DFRobot_UI ui(&screen, NULL);

int16_t point3[7][2] ={{0,50},{10,55},{15,65},{20,70},{63,75},{70,80},{80,90}};
void setup()
{

  Serial.begin(9600);
  ui.begin();
  DFRobot_UI::sCoordinate_t &coord = ui.creatCoordinate();

  coord.setPoint(point3,7,COLOR_RGB565_RED);
  ui.draw(&coord);

}


void loop()
{
  ui.refresh();
}

Result

0928-8

Was this article helpful?

TOP