ESP32 HMI Demo Code Updated - compatible with new version of esp32 package
When we first edited the demo code, we based it on the 2.0.3 version of the esp32 package, which resulted in compilation errors for many users who installed the new version of esp32. To solve this problem, we updated the esp32 demo code. The updated content is as follows:
For 5-inch esp32 screen:
Modify the following code
https://forum.elecrow.com/uploads/111/5FZCYAHAOJCQ.png
into
Arduino_RPi_DPI_RGBPanel *lcd = new Arduino_RPi_DPI_RGBPanel( bus, 800 /* width */, 0 /* hsync_polarity */, 210 /* hsync_front_porch */, 4 /* hsync_pulse_width */, 43 /* hsync_back_porch */, 480 /* height */, 0 /* vsync_polarity */, 22 /* vsync_front_porch */, 4 /* vsync_pulse_width */, 12 /* vsync_back_porch */, 1 /* pclk_active_neg */, 16000000 /* prefer_speed */, true /* auto_flush */); #endif /* !defined(DISPLAY_DEV_KIT) */For 7-inch esp32 screen:
Step 1: Download the LovyanGFX library
https://forum.elecrow.com/uploads/893/XTEWU22K7BIT.png
Step 2: Modify the code of HMI-7.0
Add the following code:
#define LGFX_USE_V1 #include <LovyanGFX.hpp> #include <lgfx/v1/platforms/esp32s3/Panel_RGB.hpp> #include <lgfx/v1/platforms/esp32s3/Bus_RGB.hpp> // Define a class named LGFX, inheriting from the LGFX_Device class. class LGFX : public lgfx::LGFX_Device { public: // Instances for the RGB bus and panel. lgfx::Bus_RGB _bus_instance; lgfx::Panel_RGB _panel_instance; // Constructor for the LGFX class. LGFX(void) { // Configure the RGB bus. { auto cfg = _bus_instance.config(); cfg.panel = &_panel_instance; // Configure data pins. cfg.pin_d0 = GPIO_NUM_15; // B0 cfg.pin_d1 = GPIO_NUM_7; // B1 cfg.pin_d2 = GPIO_NUM_6; // B2 cfg.pin_d3 = GPIO_NUM_5; // B3 cfg.pin_d4 = GPIO_NUM_4; // B4 cfg.pin_d5 = GPIO_NUM_9; // G0 cfg.pin_d6 = GPIO_NUM_46; // G1 cfg.pin_d7 = GPIO_NUM_3; // G2 cfg.pin_d8 = GPIO_NUM_8; // G3 cfg.pin_d9 = GPIO_NUM_16; // G4 cfg.pin_d10 = GPIO_NUM_1; // G5 cfg.pin_d11 = GPIO_NUM_14; // R0 cfg.pin_d12 = GPIO_NUM_21; // R1 cfg.pin_d13 = GPIO_NUM_47; // R2 cfg.pin_d14 = GPIO_NUM_48; // R3 cfg.pin_d15 = GPIO_NUM_45; // R4 // Configure sync and clock pins. cfg.pin_henable = GPIO_NUM_41; cfg.pin_vsync = GPIO_NUM_40; cfg.pin_hsync = GPIO_NUM_39; cfg.pin_pclk = GPIO_NUM_0; cfg.freq_write = 15000000; // Configure timing parameters for horizontal and vertical sync. cfg.hsync_polarity = 0; cfg.hsync_front_porch = 40; cfg.hsync_pulse_width = 48; cfg.hsync_back_porch = 40; cfg.vsync_polarity = 0; cfg.vsync_front_porch = 1; cfg.vsync_pulse_width = 31; cfg.vsync_back_porch = 13; // Configure polarity for clock and data transmission. cfg.pclk_active_neg = 1; cfg.de_idle_high = 0; cfg.pclk_idle_high = 0; // Apply configuration to the RGB bus instance. _bus_instance.config(cfg); } // Configure the panel. { auto cfg = _panel_instance.config(); cfg.memory_width = 800; cfg.memory_height = 480; cfg.panel_width = 800; cfg.panel_height = 480; cfg.offset_x = 0; cfg.offset_y = 0; // Apply configuration to the panel instance. _panel_instance.config(cfg); } // Set the RGB bus and panel instances. _panel_instance.setBus(&_bus_instance); setPanel(&_panel_instance); } }; LGFX lcd;and delete the following code:
#include <Arduino_GFX_Library.h> #define TFT_BL 2 //#define GFX_BL DF_GFX_BL // default backlight pin, you may replace DF_GFX_BL to actual backlight pin /* More dev device declaration: https://github.com/moononournation/Arduino_GFX/wiki/Dev-Device-Declaration */ #if defined(DISPLAY_DEV_KIT) Arduino_GFX *lcd = create_default_Arduino_GFX(); #else /* !defined(DISPLAY_DEV_KIT) */ //Arduino_ESP32RGBPanel *bus = new Arduino_ESP32RGBPanel( // GFX_NOT_DEFINED /* CS */, GFX_NOT_DEFINED /* SCK */, GFX_NOT_DEFINED /* SDA */, // 40 /* DE */, 41 /* VSYNC */, 39 /* HSYNC */, 42 /* PCLK */, // 45 /* R0 */, 48 /* R1 */, 47 /* R2 */, 21 /* R3 */, 14 /* R4 */, // 5 /* G0 */, 6 /* G1 */, 7 /* G2 */, 15 /* G3 */, 16 /* G4 */, 4/* G5 */, // 8 /* B0 */, 3 /* B1 */, 46 /* B2 */, 9 /* B3 */, 1 /* B4 */ //); Arduino_ESP32RGBPanel *bus = new Arduino_ESP32RGBPanel( GFX_NOT_DEFINED /* CS */, GFX_NOT_DEFINED /* SCK */, GFX_NOT_DEFINED /* SDA */, 41 /* DE */, 40 /* VSYNC */, 39 /* HSYNC */, 0 /* PCLK */, 14 /* R0 */, 21 /* R1 */, 47 /* R2 */, 48 /* R3 */, 45 /* R4 */, 9 /* G0 */, 46 /* G1 */, 3 /* G2 */, 8 /* G3 */, 16 /* G4 */, 1 /* G5 */, 15 /* B0 */, 7 /* B1 */, 6 /* B2 */, 5 /* B3 */, 4 /* B4 */ ); // option 1: // 7寸 50PIN 800*480 Arduino_RPi_DPI_RGBPanel *lcd = new Arduino_RPi_DPI_RGBPanel( bus, // 800 /* width */, 0 /* hsync_polarity */, 8/* hsync_front_porch */, 2 /* hsync_pulse_width */, 43/* hsync_back_porch */, // 480 /* height */, 0 /* vsync_polarity */, 8 /* vsync_front_porch */, 2/* vsync_pulse_width */, 12 /* vsync_back_porch */, // 1 /* pclk_active_neg */, 16000000 /* prefer_speed */, true /* auto_flush */); // 800 /* width */, 0 /* hsync_polarity */, 40 /* hsync_front_porch */, 48 /* hsync_pulse_width */, 40 /* hsync_back_porch */, // 480 /* height */, 0 /* vsync_polarity */, 13 /* vsync_front_porch */, 1 /* vsync_pulse_width */, 31 /* vsync_back_porch */, // 1 /* pclk_active_neg */, 16000000 /* prefer_speed */, true /* auto_flush */); // 800 /* width */, 0 /* hsync_polarity */, 210 /* hsync_front_porch */, 30 /* hsync_pulse_width */, 16 /* hsync_back_porch */, // 480 /* height */, 0 /* vsync_polarity */, 22 /* vsync_front_porch */, 13 /* vsync_pulse_width */, 10 /* vsync_back_porch */, // 0 /* pclk_active_neg */, 16000000 /* prefer_speed */, true /* auto_flush */); 800 /* width */, 0 /* hsync_polarity */, 210 /* hsync_front_porch */, 1 /* hsync_pulse_width */, 46 /* hsync_back_porch */, 480 /* height */, 0 /* vsync_polarity */, 22 /* vsync_front_porch */, 1 /* vsync_pulse_width */, 23 /* vsync_back_porch */, 0 /* pclk_active_neg */, 16000000 /* prefer_speed */, true /* auto_flush */); #endif /* !defined(DISPLAY_DEV_KIT) */ /******************************************************************************* End of Arduino_GFX setting ******************************************************************************/modify the following code
/* Display flushing */ void my_disp_flush(lv_disp_drv_t *disp, const lv_area_t *area, lv_color_t *color_p) { uint32_t w = (area->x2 - area->x1 + 1); uint32_t h = (area->y2 - area->y1 + 1); #if (LV_COLOR_16_SWAP != 0) lcd->draw16bitBeRGBBitmap(area->x1, area->y1, (uint16_t *)&color_p->full, w, h); #else lcd->draw16bitRGBBitmap(area->x1, area->y1, (uint16_t *)&color_p->full, w, h); #endif lv_disp_flush_ready(disp); }into
/* Display flushing */ void my_disp_flush(lv_disp_drv_t *disp, const lv_area_t *area, lv_color_t *color_p) { uint32_t w = (area->x2 - area->x1 + 1); uint32_t h = (area->y2 - area->y1 + 1); //lcd.fillScreen(TFT_WHITE); #if (LV_COLOR_16_SWAP != 0) lcd.pushImageDMA(area->x1, area->y1, w, h,(lgfx::rgb565_t*)&color_p->full); #else lcd.pushImageDMA(area->x1, area->y1, w, h,(lgfx::rgb565_t*)&color_p->full);// #endif lv_disp_flush_ready(disp); }Step 3: Use the quick search function(Ctrl+F) to replace lcd-> in the code with lcd.
Comments
Q: Why the pin alignment is different than the schematic?
A: Because the esp32 chip limits our RGB connection method to RGB565, that is, the screen has 3 R pins, 2 G pins and 3 B pins connected to the ground.
From the hardware schematic diagram, you can see that R0 R1 R2 is connected to ground, and R3~R7 are connected to IO14, IO21, IO47, IO48, IO45 respectively.
Therefore, when writing the code, R0 actually corresponds to R3 in the schematic diagram.
Similarly, G pins and B pins are also defined this way.
LCD Specification: