LVGL在STM32上的移植全过程：手把手教程（从零实现）

手把手教你把LVGL移植到STM32：从零开始打造嵌入式GUI

你有没有遇到过这样的项目？功能都做完了，主控逻辑跑得飞起，传感器数据准确无误——结果客户一看界面：“这还是上世纪的风格吧？”

别急。今天我们就来解决这个“有功能没脸面”的痛点。用一块普通的STM32F407开发板，加上开源图形库LVGL，让你的设备拥有媲美智能手机的UI体验。整个过程不依赖操作系统，代码可裁剪、资源占用极低，适合批量生产。

这不是理论讲解，而是一份真实可复现的实战指南。我会带你一步步配置环境、对接屏幕和触摸芯片、编写驱动、初始化LVGL，并最终点亮第一个按钮。准备好了吗？我们开始。

为什么是LVGL + STM32？

在动手之前，先回答一个问题：为什么选LVGL？为什么不直接用TouchGFX或者裸机画点？

很简单——自由、轻量、灵活。

LVGL采用MIT协议，完全免费且无厂商绑定；它用纯C实现，可以在任何带几KB RAM的MCU上运行；更重要的是，它的架构设计非常清晰：你只需要提供两个底层接口——“怎么刷屏”和“怎么读触摸”，剩下的布局、动画、事件处理全由它搞定。

而STM32，则是我们最熟悉的“万金油”平台。特别是F4系列，主频168MHz，自带FSMC接口支持TFT屏，价格还不到5美元。两者结合，就成了中低端HMI开发的事实标准组合。

准备工作：硬件与软件清单

硬件部分（以典型配置为例）

• 主控：STM32F407VGT6（最小系统或开发板）
• 显示屏：3.5寸TFT LCD模块（ILI9341驱动，8位并口/FSMC）
• 触摸屏：电容触摸IC GT911（I2C通信）
• 外设连接：
• FSMC控制LCD数据/地址线
• I2C1连接GT911
• 定时器TIM6用于tick计数

如果没有外部SRAM，至少保证内部RAM ≥ 64KB（推荐使用F407ZGT6及以上型号）

软件工具链

• 开发环境：Keil MDK / STM32CubeIDE（任选）
• 图形库版本：LVGL v8.3+
• 配置工具：STM32CubeMX（生成初始化代码）
• 辅助调试：串口打印日志 + 示波器监测刷新频率

第一步：搭建基础工程（基于HAL库）

打开STM32CubeMX，新建项目选择STM32F407VG，进行如下关键配置：

1. 时钟树设置

HCLK = 168 MHz PCLK1 (for TIM6) = 42 MHz → 经TIMx倍频后实际计数时钟为84MHz

2. FSMC配置（驱动ILI9341）

• 启用FSMC，模式设为Asynchronous NAND/PC Card
• 地址引脚：FSMC_A16 接 LCD的DC脚（命令/数据切换）
• 数据宽度：16-bit
• 时序参数建议：
• AddressSetupTime = 5
• DataSetupTime = 15
• 模式B（Mode B）适用于大多数ILI9341模块

这样我们就能通过访问0x60000000（片选CS0）和0x60020000（A16=1）分别发送命令和数据。

3. I2C1配置（读取GT911）

• Standard Mode (100kHz)
• 上拉电阻必须焊接（通常模块已内置）
• 地址：0x5D（GT911默认）

4. TIM6定时器（提供5ms tick）

• 自动重载值：42000 - 1（PCLK1=42MHz，不分频）
• 更新中断使能
• 在中断服务函数中调用lv_tick_inc(5);

生成代码后导入Keil或IDE即可。

第二步：集成LVGL源码

下载与添加文件

前往 https://github.com/lvgl/lvgl 下载最新版源码包。

将以下内容加入工程：
-/src目录下所有.c文件（共约20个）
- 头文件路径包含./lvgl,./lvgl/src

创建 lv_conf.h 配置文件

这是LVGL的核心配置开关。务必复制lv_conf_template.h并重命名为lv_conf.h，放在头文件搜索路径中，并定义宏：

#define LV_CONF_INCLUDE_SIMPLE

关键配置项示例：

#define LV_USE_USER_DATA 1 // 允许附加用户数据 #define LV_COLOR_DEPTH 16 // 匹配ILI9341的RGB565 #define LV_HOR_RES_MAX 320 #define LV_VER_RES_MAX 240 #define LV_TICK_PERIOD_MS 5 #define LV_DISP_DEFAULT_BUFFER_SIZE (320 * 10) // 单行缓冲 #define LV_USE_LOG 1 #define LV_LOG_LEVEL LV_LOG_LEVEL_INFO

⚠️ 注意：不要忘记在C/C++ Compiler的预处理器定义中加入LV_BUILD_TEST=0

第三步：实现显示驱动（Display Driver）

LVGL不关心你怎么把像素写进屏幕，只关心你能不能实现一个flush_cb回调函数。

分配显示缓冲区

static lv_color_t disp_buf_area[LV_DISP_DEFAULT_BUFFER_SIZE]; static lv_disp_draw_buf_t disp_buf;

在main函数早期初始化：

lv_disp_draw_buf_init(&disp_buf, disp_buf_area, NULL, LV_DISP_DEFAULT_BUFFER_SIZE);

注册显示驱动结构体

static lv_disp_drv_t disp_drv; lv_disp_drv_init(&disp_drv); disp_drv.draw_buf = &disp_buf; disp_drv.flush_cb = disp_flush; disp_drv.hor_res = 320; disp_drv.ver_res = 240; lv_disp_drv_register(&disp_drv);

编写 flush 回调函数

这才是真正的“临门一脚”。

static void 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_SetWindow(area->x1, area->y1, area->x2, area->y2); // 设置显存区域 LCD_WriteData((uint16_t *)color_p, w * h); // 写入颜色数组 lv_disp_flush_ready(disp); // 必须调用！否则LVGL会卡住 }

其中LCD_SetWindow()和LCD_WriteData()是你自己封装的底层函数，利用FSMC完成操作。例如：

#define LCD_CMD_ADDR ((volatile uint16_t *)0x60000000) #define LCD_DATA_ADDR ((volatile uint16_t *)0x60020000) void LCD_WriteCommand(uint8_t cmd) { *LCD_CMD_ADDR = cmd; } void LCD_WriteData(uint16_t *data, uint32_t len) { for (int i = 0; i < len; i++) { *LCD_DATA_ADDR = data[i]; } }

📌重点提醒：lv_disp_flush_ready()必须在DMA传输完成或SPI写完后调用。如果你用了DMA异步传输，请在DMA中断里调用它。

第四步：接入触摸输入（Input Device）

没有交互的界面只是“花瓶”。接下来让屏幕能“感知”手指。

初始化GT911

确保I2C能正常通信。初始化代码大致如下：

if (!GT911_Init()) { Error_Handler(); }

注册输入设备驱动

static lv_indev_drv_t indev_drv; lv_indev_drv_init(&indev_drv); indev_drv.type = LV_INDEV_TYPE_POINTER; indev_drv.read_cb = touch_read; lv_indev_drv_register(&indev_drv);

实现 read 回调函数

每10ms左右被LVGL轮询一次：

static bool touch_read(lv_indev_drv_t *indev, lv_indev_data_t *data) { static int16_t last_x = 0, last_y = 0; if (GT911_Read_Coordinate(&last_x, &last_y)) { >lv_init(); // 此前已完成disp/indev注册

启动Tick机制

在TIM6_IRQHandler中：

if (__HAL_TIM_GET_FLAG(&htim6, TIM_FLAG_UPDATE)) { __HAL_TIM_CLEAR_FLAG(&htim6, TIM_FLAG_UPDATE); lv_tick_inc(5); // 告知LVGL过去了5ms }

同时开启定时器：

HAL_TIM_Base_Start_IT(&htim6);

主循环中执行任务调度

while (1) { lv_task_handler(); // 让LVGL处理动画、事件等 HAL_Delay(5); // 控制调用频率，避免CPU满载 }

创建第一个按钮试试看

lv_obj_t *btn = lv_btn_create(lv_scr_act()); lv_obj_set_pos(btn, 100, 80); lv_obj_set_size(btn, 120, 50); lv_obj_t *label = lv_label_create(btn); lv_label_set_text(label, "Hello World");

烧录程序……如果一切顺利，你会看到屏幕上出现一个漂亮的圆角按钮，点击时还有按下反馈！

常见坑点与调试秘籍

我在实际项目中踩过的坑，现在一次性告诉你：

❌ 黑屏无显示？

• 检查是否在lv_init()之前完成了LCD初始化。
• 确保flush_cb中正确设置了窗口区域（X/Y范围错误会导致写入无效地址）。

❌ 动画卡顿像幻灯片？

• 查看lv_tick_inc()是否每5ms准时执行。若使用FreeRTOS，不要放在高优先级任务中阻塞。
• 启用局部刷新：#define LV_DISP_PARTIAL_REFRESH 1

❌ 触摸位置偏移？

• GT911返回的是原始坐标，需映射到LVGL坐标系（通常是0~320, 0~240）。
• 可使用LVGL内置校准功能lv_indev_calibration_start()。

❌ 内存溢出崩溃？

• 默认heap太小（Keil默认仅1KB）。修改startup_stm32f407xx.s中的Heap_Size为0x1000（4KB）以上。
• 使用LV_MEM_CUSTOM 1启用外部SDRAM分配。

❌ 字体模糊不清？

• 默认字体较小。可通过 LVGL字体生成器 导出自定义大字号字体（如roboto_20），并启用抗锯齿。

性能优化建议（进阶必看）

当你想进一步榨干STM32性能时，这些技巧很有用：

✅ 使用双缓冲减少撕裂

static lv_color_t buf1[320*10], buf2[320*10]; lv_disp_draw_buf_init(&disp_buf, buf1, buf2, 320*10);

配合DMA传输，在后台刷新的同时前台继续渲染。

✅ 利用DMA加速像素传输

若使用SPI屏，可用DMA搬运数据。对于FSMC屏，虽然不能DMA，但可降低等待周期提升吞吐。

✅ 开启GPU加速（F7/H7专属）

在支持DMA2D的芯片上启用硬件填充：

#define LV_USE_GPU_STM32_DMA2D 1

然后调用lv_gpu_stm32_dma2d_fill()替代软件清屏，速度提升3~5倍。

✅ 裁剪不必要的模块

关闭不用的功能节省空间：

#define LV_USE_ANIMATION 0 // 不要动画？ #define LV_USE_FILESYSTEM 0 // 不需要加载图片文件 #define LV_USE_IMG_DECODER_BMP 0

最终ROM占用可压缩至60KB以内，RAM动态池仅需8KB。

结语：这不是终点，而是起点

当你第一次看到那个按钮在TFT上亮起，手指滑过触发点击效果的时候，你会明白：嵌入式GUI并没有想象中那么遥不可及。

LVGL的强大之处不仅在于它能做什么，更在于它允许你以极低的成本去尝试各种交互设计。你可以轻松做出仪表盘、音乐播放器、设置菜单、甚至带滚动列表的日志查看器。

而且这套方案完全可以复制到其他项目中——换块屏幕？改个分辨率？加个编码器？都不是问题。只要掌握“注册显示+注册输入+主循环调度”这个铁三角模型，你就能快速构建出属于自己的HMI系统。

如果你正在做智能家电、工业面板、医疗设备或教育仪器，现在就可以动手尝试。让每个产品都有“好看又好用”的能力，不该是高端产品的特权。

💬互动时间：你在移植LVGL时遇到的最大挑战是什么？欢迎留言分享经验，我们一起解决问题。