跳到主要内容

ESP32 开发

本章节介绍使用 Arduino IDE，在 ESP32-C3 和 ESP32-S3 上运行 0.71inch DualEye LCD Module 示例程序的方法。接线图片和工程配置截图以 ESP32-C3-Zero 为例。

Arduino 入门教程​

初次接触 Arduino ESP32 开发，想要快速上手？我们为您准备了一套通用的 入门教程。

请注意：该教程使用 ESP32-S3-Zero 作为教学示例，所有硬件代码均基于其引脚布局。在动手实践前，建议您对照手中的开发板引脚图，确认引脚配置无误。

配置开发环境​

1. 安装和配置 Arduino IDE​

参考 安装和配置 Arduino IDE 教程，安装 Arduino IDE 并添加 ESP32 开发板支持。

2. 安装库​

  • Arduino 库支持在线安装和离线安装。
  • 本示例所需的配套库位于示例程序包的 ESP32/Arduino/libraries 目录。
库或文件名称说明安装方式
TFT_eSPIGC9D01 LCD 驱动、文字及图形绘制离线安装
Lvgl图片及图形界面显示离线安装
lv_conf.hLVGL 配置文件随配套库复制
版本兼容性说明

本示例使用 ESP32/Arduino/libraries 目录提供的 TFT_eSPI、Lvgl 和 lv_conf.h。其中 TFT_eSPI 已包含 GC9D01 驱动及本示例所需的引脚配置。请使用配套文件，避免因库版本或配置不一致导致编译失败或显示异常。

安装步骤：

  1. 下载并解压 0.71inch DualEye LCD Module 示例程序。

  2. 将 ESP32/Arduino/libraries 目录中的 TFT_eSPI、Lvgl 文件夹及 lv_conf.h 文件复制到 Arduino 的库文件夹中，使三个项目位于同一层级。

    信息

    Arduino 库文件夹的路径通常为 C:\Users\<用户名>\Documents\Arduino\libraries。

    也可以在 Arduino IDE 中点击“文件” > “首选项”，查看“项目文件夹位置”。库文件夹是该路径下的 libraries 文件夹。

  3. 重新启动 Arduino IDE，使库文件被重新加载。

  4. 其他安装方法参考 Arduino 库管理教程。

0.71inch DualEye LCD Module 所需开发板安装说明

ESP32 开发板支持包版本要求

本示例要求安装 v2.0.12 版本的 ESP32 开发板支持包。国内网络环境可下载 ESP32 Arduino 开发板支持包 v2.0.12（离线包），并参考 Arduino IDE 教程中的开发板离线安装说明完成安装。

开发板支持包安装方式版本号要求
ESP32 by Espressif Systems离线安装 / 在线安装v2.0.12

Arduino 工程配置：

ESP32-C3 Arduino 工程参数设置

硬件连接​

通过 11PIN 杜邦线连接 LCD 模块与开发板，引脚对应关系如下：

LCDESP32-C3 / ESP32-S3
VCC3V3
GNDGND
DINGPIO4
CLKGPIO7
CS1GPIO6
CS2GPIO2
DCGPIO9
RST1GPIO8
RST2GPIO5
BL1GPIO1
BL2GPIO3

ESP32-C3-Zero 接线示意如下：

0.71inch DualEye LCD Module 与 ESP32-C3-Zero 接线

确认接线后，通过支持数据传输的 USB 线将开发板连接到计算机。

示例说明与运行效果​

示例文件夹功能依赖库
01_Text_and_Number_Display文字及数字显示TFT_eSPI
02_Shapes_on_Circular_Display几何图形绘制TFT_eSPI
03_Animated_Eye1仿真眼睛样式 1TFT_eSPI
04_Animated_Eye2仿真眼睛样式 2TFT_eSPI
05_Animated_Eye12交替显示两种眼睛样式TFT_eSPI
06_Image_Display图片显示TFT_eSPI、LVGL
07_Clock时钟界面TFT_eSPI、LVGL

01_Text_and_Number_Display​

程序说明​

程序启动时显示颜色过渡，随后显示文字和从 00 到 99 循环递增的两位数数字，每秒更新一次。

代码分析​

  • setup()：设置背光与片选引脚，调用 tft.init() 初始化屏幕，使用 tft.fillScreen() 切换背景颜色，再设置文字颜色。
  • loop()：控制两块屏幕的片选和显示方向，通过 tft.drawString() 绘制文字和数字。
  • 将数字转换为字符串后，为个位数补充前导零；数字超过 99 后归零，通过 delay(1000) 控制更新间隔。

运行效果​

ESP32 文字及两位数数字显示效果

02_Shapes_on_Circular_Display​

程序说明​

在屏幕中心依次绘制随机颜色的正方形、三角形和圆形，每隔 3 秒切换一次图形。

代码分析​

  • drawSquare()：计算正方形的位置和尺寸，调用 fillRect() 填充随机颜色。
  • drawTriangle()：计算三角形的三个顶点，调用 fillTriangle() 绘制图形。
  • drawCircleInCenter()：调用 fillCircle() 在屏幕中心绘制半径为 30 像素的圆形。
  • 当前示例包使用画布保存图像，updateDisplays() 将图像及其旋转后的版本分别更新到两块屏幕。

运行效果​

ESP32 几何图形绘制效果

03_Animated_Eye1​

程序说明​

使用 TFT_eSPI 绘制仿真眼睛样式 1，通过眼睛状态和虹膜大小变化生成动画。

代码分析​

  • config.h：选择眼睛图像资源并配置动画参数。
  • updateEye()：更新虹膜大小和眼睛状态。未定义 LIGHT_PIN 时，使用随机目标值和平滑过渡生成虹膜变化。
  • 如果另行连接光传感器并配置 LIGHT_PIN，程序可读取模拟值，并根据光感范围、曲线和平滑选项调整虹膜；默认配置未启用该引脚，接线表也不包含光传感器。
  • 源码包含由 USE_DMA 控制的缓冲区分支，是否使用 DMA 取决于相应平台和库配置，不代表所有开发板均已启用。

运行效果​

ESP32 仿真眼睛样式 1 显示效果

04_Animated_Eye2​

程序说明​

控制两块屏幕显示仿真眼睛样式 2，通过连续图像形成眼睛动画。

代码分析​

  • loop()：在循环中多次调用 Demo_1()，持续更新动画。
  • Demo_1()：通过片选信号选择屏幕，使用 pushImage() 显示图像序列。

运行效果​

ESP32 仿真眼睛样式 2 显示效果

05_Animated_Eye12​

程序说明​

交替显示仿真眼睛样式 1 和样式 2。

代码分析​

  • loop()：根据变量 a 切换两种动画。
  • a == 1 时，清屏后调用 Demo_1()，并延时 2 秒。
  • a == 2 时，多次调用 Demo_2()，依次显示图像序列。

运行效果​

ESP32 交替眼睛示例中的样式 1

ESP32 交替眼睛示例中的样式 2

06_Image_Display​

程序说明​

初始化 TFT_eSPI 和 LVGL，创建图像对象并在屏幕上显示图片。

代码分析​

  • setup()：初始化串口、LVGL 和屏幕，配置显示缓冲区，注册显示驱动与刷新回调。
  • LV_IMG_DECLARE(A3)：声明图像资源，通过 lv_img_create() 创建图像对象，再使用 lv_img_set_src() 设置图像内容和位置。
  • lv_disp_flush()：根据待刷新区域设置屏幕写入窗口，通过 tft.pushColors() 发送像素数据，最后调用 lv_disp_flush_ready() 通知 LVGL 刷新完成。
  • loop()：处理屏幕片选和显示方向，调用 lv_timer_handler() 处理 LVGL 任务。

运行效果​

ESP32 使用 LVGL 显示图片的效果

07_Clock​

程序说明​

使用 TFT_eSPI 和 LVGL 初始化屏幕并显示时钟界面。

代码分析​

  • setup()：初始化串口、LVGL、屏幕和显示缓冲区，注册显示驱动，并调用 ui_init() 创建界面。
  • lv_disp_flush()：将待刷新区域的像素数据发送到第一块屏幕，再将像素旋转后发送到第二块屏幕，最后通知 LVGL 刷新完成。
  • loop()：持续调用 lv_timer_handler() 处理界面任务。

运行效果​

ESP32 时钟界面显示效果