模板: ESP32-S3-Touch-LCD-3.5-Aruidno-Demo
Arduino开发
本章介绍 Arduino 环境搭建,包括 Arduino IDE、ESP32板管理、相关库的安装,程序编译下载及示例程序测试,帮助用户掌握开发板,便于二次开发。
环境搭建
下载和安装 Arduino IDE
- 点击访问Arduino官网,选择对应的系统和系统位数下载。

- 运行安装程序,全部默认安装即可。
安装 ESP32 开发板
- ESP32相关主板在Arduino IDE使用,须先安装“esp32 by Espressif Systems”开发板的软件包
- 根据板安装要求进行安装,一般推荐“在线安装”, 若在线安装失败,则使用“离线安装”
- 安装教程,详见:Arduino 板管理教程
| 板名称 | 板安装要求 | 版本号要求 |
|---|---|---|
| esp32 by Espressif Systems | “离线”安装/“在线”安装 | ≥3.2.0 |
安装库
- 在安装 Arduino 库时,通常有两种方式可供选择:在线安装 和 离线安装。若库安装要求离线安装,则必须使用提供的库文件
对于大多数库,用户可以通过 Arduino 软件的在线库管理器轻松搜索并安装。然而,一些开源库或自定义库未被同步到 Arduino 库管理器中,因此无法通过在线搜索获取。在这种情况下,用户只能通过离线方式手动安装这些库。 - ESP32-S3-Touch-LCD-3.5 库文件存放于示例程序中,点击此处跳转:ESP32-S3-Touch-LCD-3.5示例程序
- 库安装教程,详见:Arduino 库管理教程
| 库名称 | 说明 | 版本 | 库安装要求 |
|---|---|---|---|
| lvgl | LVGL图形化库 | v8.4.0 | “在线”安装 |
| GFX_Library_for_Arduino | GFX图形化库 | v1.5.5 | “在线”安装 |
| JPEGDEC | JPG解码库 | v1.8.2 | “在线”安装 |
| PNGdec | PNG解码库 | v1.1.3 | “在线”安装 |
| XPowersLib | PNG解码库 | v0.2.9 | “在线”安装 |
| SensorLib | PNG解码库 | v0.3.1 | “在线”安装 |
| ESP32-audioI2S-master | 音频处理库 | v3.3.0 | “在线”安装 |
| TCA9554 | 扩展IO库 | v0.1.2 | “在线”安装 |
| es8311 | es8311驱动库 | --- | “离线”安装 |
运行第一个 Arduino 程序
示例程序
| 示例程序 | 基础例程说明 | 依赖库 |
|---|---|---|
| 01_audio_out | 读取SD卡的音频文件,并播放 | ESP32-audioI2S-master |
| 02_axp2101_example | 打印电源管理芯片的数据 | XPowersLib |
| 03_camera_web_server | 在网页上显示摄像头图像 | XPowersLib |
| 04_es8311_example | 录音一段时间,并播放 | es8311 |
| 05_pcf85063_time | 打印RTC获取的数据 | SensorLib |
| 06_qmi8658_getdata | 打印IMU的数据 | SensorLib |
| 07_sd_card_test | 测试SD卡的读写 | --- |
| 08_gfx_helloworld | 屏幕上显示HelloWorld | GFX_Library_for_Arduino、TCA9554 |
| 09_gfx_jpeg | 解码JPG文件并显示在屏幕上 | GFX_Library_for_Arduino、TCA9554、JPEGDEC |
| 10_gfx_png | 解码PNG文件并显示在屏幕上 | GFX_Library_for_Arduino、TCA9554、PNGdec |
| 11_lvgl_arduino_v8 | lvgl示例程序 | GFX_Library_for_Arduino、TCA9554、lvgl、SensorLib |
| 12_lvgl_pcf85063 | lvgl显示时间和日期 | GFX_Library_for_Arduino、TCA9554、lvgl、SensorLib |
| 13_lvgl_qmi8658 | lvgl显示IMU的数据 | GFX_Library_for_Arduino、TCA9554、lvgl、SensorLib |
| 14_lvgl_image | lvgl显示图片 | GFX_Library_for_Arduino、TCA9554、lvgl、SensorLib |
- ESP32-S3-Touch-LCD-3.5 Arduino 工程参数设置
01_audio_out
【程序说明】
本示例演示ESP32-S3-Touch-LCD-3.5读取SD卡的音频文件并使用喇叭播放,支持MP3、AAC、WAV等格式。
【准备工作】
- 将SD卡插入电脑
- 在SD卡根目录新建文件夹 music
- 把本工程下data文件夹里面的1.mp3拷贝到SD卡的music文件夹里
- 将SD卡插入 ESP32-S3-Touch-LCD-3.5
【代码分析】
- 初始化
Wire.begin(I2C_SDA, I2C_SCL);
es8311_codec_init();
SD_MMC.setPins(SD_MMC_CLK, SD_MMC_CMD, SD_MMC_D0);
if (!SD_MMC.begin("/sdmmc", true, false, 20000))
{
esp_rom_printf("Card Mount Failed\n");
while (1)
{
};
}
audio.setPinout(I2S_BCLK, I2S_LRCK, I2S_SDOUT, I2S_MCLK);
audio.setVolume(21); // 0...21
- 设置播放的音频文件
audio.connecttoFS(SD_MMC, "music/1.mp3");
【运行效果】
- 播放音频文件,屏幕无现象
02_axp2101_example
【程序说明】
03_camera_web_server
【程序说明】
本示例演示了如何使用驱动摄像头。在连接 WiFi 后,程序会创建一个网页服务器,用户只需在浏览器中输入设备的 IP 地址即可访问。网页上可以显示摄像头的图像,并支持分辨率、镜像等设置操作
【代码分析】
- 定义摄像头相关的引脚
#define PWDN_GPIO_NUM -1 #define RESET_GPIO_NUM -1 #define XCLK_GPIO_NUM 38 #define SIOD_GPIO_NUM 8 #define SIOC_GPIO_NUM 7 #define Y9_GPIO_NUM 21 #define Y8_GPIO_NUM 39 #define Y7_GPIO_NUM 40 #define Y6_GPIO_NUM 42 #define Y5_GPIO_NUM 46 #define Y4_GPIO_NUM 48 #define Y3_GPIO_NUM 47 #define Y2_GPIO_NUM 45 #define VSYNC_GPIO_NUM 17 #define HREF_GPIO_NUM 18 #define PCLK_GPIO_NUM 41
- 要连接的wifi名称和密码
const char *ssid = "waveshare"; const char *password = "12345678";
- 启动服务器,开始提供 HTTP 视频流服务
startCameraServer();
Serial.print("Camera Ready! Use 'http://");
Serial.print(WiFi.localIP());
Serial.println("' to connect");
04_es8311_example
【程序说明】
本示例演示使用ESP32-S3-Touch-LCD-3.5驱动ES8311音频编解码器,实现音频录制及回放功能。
【代码分析】
- 初始化
Wire.begin(I2C_SDA, I2C_SCL); es8311_codec_init(); setupI2S();
- 音频录制5s,并播放录制的内容
wav_buffer = i2s.recordWAV(5, &wav_size);
delay(1000);
Serial.println("I2S playWAV");
i2s.playWAV(wav_buffer, wav_size);
【运行效果】
- 屏幕无现象
- 按下ESP32-S3-Touch-LCD-3.5的RST按键进入音频录制状态,5s后播放录制的内容。
05_pcf85063_time
【程序说明】
本实例演示ESP32-S3-Touch-LCD-3.5驱动PCF85063,设置时间、日期以及获取时间。
【代码分析】
- 初始化
if (!rtc.begin(Wire, PCF85063_SLAVE_ADDRESS, SENSOR_SDA, SENSOR_SCL)) {
Serial.println("Failed to find PCF8563 - check your wiring!");
while (1) {
delay(1000);
}
}
- 设置时间、日期
rtc.setDateTime(year, month, day, hour, minute, second);
- 获取时间、日期
RTC_DateTime datetime = rtc.getDateTime();
06_qmi8658_getdata
【程序说明】
本实例演示ESP32-S3-Touch-LCD-3.5驱动QMI8658,获取并打印Accel、Gyro和IMU的温度。
【代码分析】
- 初始化
if (!qmi.begin(Wire, QMI8658_L_SLAVE_ADDRESS, SENSOR_SDA, SENSOR_SCL)) {
Serial.println("Failed to find QMI8658 - check your wiring!");
while (1) {
delay(1000);
}
}
- 获取数据
if (qmi.getDataReady()) {
if (qmi.getAccelerometer(acc.x, acc.y, acc.z)) {
}
if (qmi.getGyroscope(gyr.x, gyr.y, gyr.z)) {
}
}
07_sd_card_test
【程序说明】
本示例演示使用 ESP32-S3-Touch-LCD-3.5 测试SD卡的读写功能
【硬件连接】
- 将板子接入电脑
- 将Micro SD卡插入卡槽(SD卡需要格式化为FAT32)
【代码分析】
- 初始化
if(!SD_MMC.setPins(clk, cmd, d0)){
Serial.println("Pin change failed!");
return;
}
if (!SD_MMC.begin( "/sdcard", true)) {
Serial.println("Card Mount Failed");
return;
}
08_gfx_helloworld
【程序说明】
本示例演示 ESP32-S3-Touch-LCD-3.5 使用GFX_Library_for_Arduino库驱动屏幕并在屏幕上显示HelloWorld
【代码分析】
- 配置屏幕接口以及屏幕的分辨率等
Arduino_DataBus* bus = new Arduino_ESP32SPI(LCD_DC /* DC */, LCD_CS /* CS */, SPI_SCLK /* SCK */, SPI_MOSI /* MOSI */, SPI_MISO /* MISO */); Arduino_GFX* gfx = new Arduino_ST7796( bus, LCD_RST /* RST */, 0 /* rotation */, true, LCD_HOR_RES, LCD_VER_RES);
09_gfx_jpeg
【程序说明】
本示例演示 ESP32-S3-Touch-LCD-3.5 使用JPEGDEC库对SD卡的jpg文件进行解码,并通过GFX_Library_for_Arduino驱动屏幕显示jpg的内容。
【准备工作】
- 将SD卡插入电脑
- 在SD卡根目录新建文件夹 images
- 把本工程下data文件夹里面的 octocat.jpg 拷贝到SD卡的images文件夹里
- 将SD卡插入 ESP32-S3-Touch-LCD-3.5
【代码分析】
- 解码jpg文件并显示
jpegDraw(JPEG_FILENAME, jpegDrawCallback, true /* useBigEndian */,
0 /* x */, 0 /* y */, gfx->width() /* widthLimit */, gfx->height() /* heightLimit */);
10_gfx_png
【程序说明】
本示例演示 ESP32-S3-Touch-LCD-3.5 使用PNGdec库对SD卡的png文件进行解码,并通过GFX_Library_for_Arduino驱动屏幕显示png的内容。
【准备工作】
- 将SD卡插入电脑
- 在SD卡根目录新建文件夹 images
- 把本工程下data文件夹里面的 octocat.png、octocat-4bpp.png 拷贝到SD卡的images文件夹里
- 将SD卡插入 ESP32-S3-Touch-LCD-3.5
【代码分析】
- 解码jpg文件并显示
rc = png.open(PNG_FILENAME, myOpen, myClose, myRead, mySeek, PNGDraw);
if (rc == PNG_SUCCESS)
{
int16_t pw = png.getWidth();
int16_t ph = png.getHeight();
xOffset = (w - pw) / 2;
yOffset = (h - ph) / 2;
rc = png.decode(NULL, 0);
Serial.printf("Draw offset: (%d, %d), time used: %lu\n", xOffset, yOffset, millis() - start);
Serial.printf("image specs: (%d x %d), %d bpp, pixel type: %d\n", png.getWidth(), png.getHeight(), png.getBpp(), png.getPixelType());
png.close();
}
11_lvgl_example_v8
【程序说明】
本示例演示了使用 ESP32-S3-Touch-LCD-3.5B 运行lvgl( v8.4.0)示例程序。
【代码分析】
- UI初始化
lv_obj_t *label = lv_label_create(lv_scr_act());
lv_label_set_text(label, "Hello Arduino! (V" GFX_STR(LVGL_VERSION_MAJOR) "." GFX_STR(LVGL_VERSION_MINOR) "." GFX_STR(LVGL_VERSION_PATCH) ")");
lv_obj_align(label, LV_ALIGN_CENTER, 0, 0);
lv_obj_t *sw = lv_switch_create(lv_scr_act());
lv_obj_align(sw, LV_ALIGN_TOP_MID, 0, 50);
sw = lv_switch_create(lv_scr_act());
lv_obj_align(sw, LV_ALIGN_BOTTOM_MID, 0, -50);
12_lvgl_pcf85063
【程序说明】
本示例演示使用 ESP32-S3-Touch-LCD-3.5 获取PCF85063的时间、日期数据,并通过lvgl库显示。
【代码分析】
- ui初始化
void lvgl_pcf85063_ui_init(lv_obj_t *parent) {
lv_obj_t *list = lv_list_create(parent);
lv_obj_set_size(list, lv_pct(100), lv_pct(100));
lv_obj_t *list_item = lv_list_add_btn(list, NULL, "data");
label_data = lv_label_create(list_item);
lv_label_set_text(label_data, "2025-01-01");
list_item = lv_list_add_btn(list, NULL, "time");
label_time = lv_label_create(list_item);
lv_label_set_text(label_time, "00:00:00");
pcf85063_timer = lv_timer_create(pcf85063_callback, 100, NULL);
}
13_lvgl_qmi8658
【程序说明】
本示例演示使用 ESP32-S3-Touch-LCD-3.5 获取qmi8658的数据,并通过lvgl库显示。
【代码分析】
- ui的初始化
void lvgl_qmi8658_ui_init(lv_obj_t *parent) {
lv_obj_t *list = lv_list_create(parent);
lv_obj_set_size(list, lv_pct(100), lv_pct(100));
lv_obj_t *list_item = lv_list_add_btn(list, NULL, "accel_x");
label_accel_x = lv_label_create(list_item);
lv_label_set_text(label_accel_x, "0.00");
list_item = lv_list_add_btn(list, NULL, "accel_y");
label_accel_y = lv_label_create(list_item);
lv_label_set_text(label_accel_y, "0.00");
list_item = lv_list_add_btn(list, NULL, "accel_z");
label_accel_z = lv_label_create(list_item);
lv_label_set_text(label_accel_z, "0.00");
list_item = lv_list_add_btn(list, NULL, "gyro_x");
label_gyro_x = lv_label_create(list_item);
lv_label_set_text(label_gyro_x, "0.00");
list_item = lv_list_add_btn(list, NULL, "gyro_y");
label_gyro_y = lv_label_create(list_item);
lv_label_set_text(label_gyro_y, "0.00");
list_item = lv_list_add_btn(list, NULL, "gyro_z");
label_gyro_z = lv_label_create(list_item);
lv_label_set_text(label_gyro_z, "0.00");
list_item = lv_list_add_btn(list, NULL, "temp");
label_temp = lv_label_create(list_item);
lv_label_set_text(label_temp, "0.00C");
qmi8658_timer = lv_timer_create(qmi8658_callback, 100, NULL);
}
14_lvgl_image
【程序说明】
本示例演示 ESP32-S3-Touch-LCD-3.5 使用lvgl显示SD卡的图片,支持jpg、bmp、png、bin等格式的图片。
【准备工作】
- 需要安装 lvgl v8.4.0 版本,如已安装其他版本,请重新安装。
- 将SD卡插入电脑
- 在SD卡根目录新建文件夹 images
- 把本工程下data文件夹里面的全部文件拷贝到SD卡的images文件夹里
- 将SD卡插入 ESP32-S3-Touch-LCD-3.5
【代码分析】
- 设置显示的图片
lv_obj_t *img = lv_img_create(lv_scr_act()); lv_obj_align(img, LV_ALIGN_CENTER, 0, 0); // lv_img_set_src(img, "S:images/octocat.jpg"); lv_img_set_src(img, "S:images/octocat.png");








