1. 课程导入

大家好，我是你们这门课的老朋友。今天咱们正式开篇，聊聊 LVGL 到底是什么，以及怎么把它的开发环境跑起来。

说实话，我最早接触 LVGL 是在一个智能家居项目里。当时老板扔给我一块小屏幕，说「三天内把界面跑起来」。我翻遍了各种 GUI 库，最后选了 LVGL。为什么？因为它轻量、开源，而且社区活跃。嗯，三天后我确实交差了。

LVGL 是什么？

LVGL（Light and Versatile Graphics Library），全称是轻量级多功能图形库。说白了，它就是一套专门给嵌入式设备用的 UI 框架。你想想看，你的单片机、开发板，甚至只有几百 KB 内存的芯片，都能用它画出漂亮的界面。

它跟 PC 上的 Qt 或 Android UI 不一样。那些东西动辄几十 MB，嵌入式设备根本跑不动。LVGL 的核心设计哲学就是：用最少的资源，做最炫的界面。

核心特性

我挑几个最关键的说说，这些都是我在项目中真正用到的。

特性	说明	我的感受
轻量级	最小配置仅需 16KB RAM + 64KB Flash	我在 STM32F103 上跑过，绰绰有余
丰富控件	按钮、滑块、图表、键盘、动画等 30+ 控件	基本覆盖了 90% 的界面需求
硬件无关	只需提供显示缓冲区和输入设备驱动	换平台时只改底层，上层代码不用动
内置样式系统	支持 CSS 风格的样式设置	比纯画点方便太多了
开源免费	MIT 许可证，商用无限制	老板最喜欢这条

支持平台

LVGL 几乎能跑在任何有 C 编译器的平台上。我列几个常见的：

• MCU 类：STM32、ESP32、NXP i.MX RT、GD32、AT32 等
• Linux 类：树莓派、全志、瑞芯微、BeagleBone
• 模拟器：Windows（SDL2/VS）、macOS、Linux 桌面
• 其他：Arduino、Zephyr、RT-Thread、裸机

我个人习惯是：先在模拟器上把界面调好，再移植到目标硬件。这样调试效率高，而且不用反复烧录。

源码获取

获取 LVGL 源码很简单，就两个地方：

1. GitHub 官方仓库：搜索 lvgl/lvgl，直接下载或 clone
2. 官方示例项目：lvgl/lv_port_pc_vscode，这是专门为 VS Code + SDL2 模拟器准备的

我建议你直接 clone 第二个。因为它已经把模拟器环境配好了，省去很多麻烦。

开发环境搭建：VS Code + Simulator

好，重头戏来了。咱们把环境跑起来。我用的是 Windows 系统，但 macOS 和 Linux 步骤基本一样。

第一步：安装必要工具

• VS Code：代码编辑器，免费
• CMake：构建工具，版本 3.10+
• MinGW 或 MSYS2：Windows 下的 GCC 编译器
• SDL2 库：模拟器依赖的图形后端

我曾经在配置 SDL2 时卡了半天，后来发现是路径没写对。这里给你个避坑指南：

第二步：克隆项目并配置

打开终端，执行：

git clone https://github.com/lvgl/lv_port_pc_vscode.git
cd lv_port_pc_vscode
git submodule update --init --recursive

这会把 LVGL 核心库和依赖一起拉下来。然后你用 VS Code 打开这个文件夹。

第三步：编译与运行

在 VS Code 里按 Ctrl+Shift+P，选择 CMake: Configure，然后选 GCC 编译器。配置完成后，按 F7 编译，再按 F5 运行。

如果一切顺利，你会看到一个窗口弹出来，上面有 LVGL 的演示界面。嗯，到这里环境就搭好了。

知识体系总览

为了让你对本章内容有个整体印象，我画了张图。它把 LVGL 的核心概念、平台支持、开发流程串在了一起。

小结

这一章我们搞定了三件事：

• 理解了 LVGL 是什么，以及它为什么适合嵌入式
• 掌握了它的核心特性和支持平台
• 亲手搭建了 VS Code + Simulator 开发环境

环境跑起来之后，后面的学习就顺畅多了。下一章我们会深入 LVGL 的对象系统，看看那些控件到底是怎么组织起来的。不过那是后话了，你先确保模拟器能正常显示再说。