当前位置：首页 > news >正文

ESP32 开发板动态数字与 GIF 图显示实现技术分享（课程作业）

news 2026/5/12 16:57:25

一、开发背景与目标

在 ESP32 开发板基础显示功能学习完成后，本次开发聚焦于实现两大核心功能：一是基于软件定时器的动态数字（时间）实时显示，二是 GIF 动图在开发板上的循环播放，进一步掌握 ESP32 外设驱动、资源管理及代码工程化开发方法。

二、动态数字（时间）显示实现流程

（一）定时器模块构建

创建 Timer.c 文件：用于实现定时器核心逻辑，文件内引入 Timer.h 头文件，定义全局时间变量及定时器回调函数，完成 1 秒周期计时功能的封装。
创建 Timer.h 头文件：用于声明外部可调用的变量与函数，为避免头文件重复包含导致编译错误，添加头文件保护机制：
c
运行
```
#ifndef __TIMER_H_ #define __TIMER_H_ // 声明定时器初始化函数 void ESP_Timer_Init(void); #endif
```

（二）主函数集成与时间显示

头文件引入：在主函数文件中引入 Timer.h，确保定时器相关函数可调用。
变量定义：
- 定义int sec = 0;，用于记录上一次刷新的秒数，作为时间变化判断依据；
- 定义char str[20] = {0};，用于存储格式化后的时间字符串。
定时器启用：调用ESP_Timer_Init();初始化并启动 1 秒周期定时器。

死循环实现实时刷新：

运行

while(1) { // 仅在秒数变化时执行刷新，避免无效刷屏 if(sec != timer_sec) { sec = timer_sec; // 更新记录的秒数 // 总秒数转换为"时:分:秒"格式，%02d保证两位数显示，%24限制小时不超24 sprintf(str,"%02d:%02d:%02d", sec/3600%24, sec/60%60, sec%60); // 在LCD屏(180,160)坐标以白字黑底显示时间字符串 LCD_ShowString32(180,160,str,White,BLACK); } }

其中：

sec/3600%24：将总秒数转换为小时数并限制在 24 小时内；
sec/60%60：将总秒数转换为分钟数；
sec%60：提取总秒数中的秒数。

三、GIF 动图显示实现流程

（一）GIF 图预处理

素材准备：自行准备目标 GIF 图，若分辨率或体积过大，使用 GIFResizerChs 工具压缩尺寸；
帧分解：通过 zhs9 工具将 GIF 图分解为单帧图片，降低开发板解析压力；
资源限制：本次使用的 ESP32S3 开发板 FLASH 容量为 16MB、PSRAM 容量为 8MB，为避免烧录失败，需控制 GIF 帧数在 10-20 帧范围内，且优先选择小尺寸素材。

（二）代码集成与显示

资源存放：将处理后的 GIF 单帧图片文件夹放置在工程 main 目录下，确保编译时可识别；
图片声明：在主函数中定义图片指针数组，按播放顺序声明所有帧图片：
c
运行
```
const unsigned char *images[] = {/* 按播放顺序填入各帧图片路径/标识 */};
```

循环播放实现：

运行

while(1) { for(uint8_t i=0;i<=5;i++){ // 逐帧绘制图片，实现GIF动态效果 lcd_draw_pictrue(0,0,images[i]); } vTaskDelay(1); // 延时控制播放速度，释放CPU资源 }

四、开发过程中的问题与解决

本次开发中，定时器模块功能实现无明显问题，但 GIF 图显示环节出现核心问题：因初始选择的 GIF 图体积过大，超出 ESP32S3 FLASH 存储上限，导致程序无法正常烧录。解决措施：更换小尺寸、少帧数的 GIF 素材，经压缩和帧分解处理后，满足开发板存储资源限制，最终实现 GIF 图正常循环播放。