第一章：LVGL概述与环境搭建

大家好，我是你们这门课的老朋友。今天咱们来聊聊LVGL——这个在嵌入式圈子里越来越火的图形库。

说实话，我第一次接触LVGL是在一个智能家居项目里。当时客户要求做一块3.5寸的彩色触摸屏，要显示温湿度曲线、设备状态、还要有动画效果。我一开始想用传统的emWin，但那个授权费用...嗯，你懂的。后来同事推荐了LVGL，一试就回不去了。

1.1 LVGL是什么？

LVGL的全称是Light and Versatile Graphics Library，翻译过来就是「轻量且通用的图形库」。它专门为嵌入式系统设计，说白了就是让那些资源有限的MCU也能跑出漂亮的图形界面。

我个人的理解是：LVGL就像嵌入式界的「小程序框架」。你不需要关心底层像素怎么画，只需要调用API就能创建按钮、滑块、图表这些控件。它帮你把底层的脏活累活都干了。

核心定位：面向嵌入式MCU的、开源的、功能丰富的GUI库。

1.2 核心特性

为什么我推荐大家学LVGL？因为它有几个让我特别心动的特性：

  • 开源免费——MIT协议，商用也没问题。这点比emWin、TouchGFX香多了。
  • 资源占用极低——最低只要16KB RAM、64KB Flash就能跑。我在STM32F103上就跑起来过，你敢信？
  • 控件丰富——按钮、标签、图表、滑块、下拉列表...30多种内置控件，基本覆盖了常见需求。
  • 支持触摸和输入——触摸屏、鼠标、键盘、编码器，统统支持。
  • 内置字体和图片解码——支持UTF-8多语言，还能解码PNG、JPEG、BMP。
  • 动画引擎——这个是我最喜欢的。做过渡动画、滑动效果，几行代码就搞定。
  • 样式系统——类似CSS，可以灵活定制控件外观。

我的经验：LVGL的动画引擎特别适合做仪表盘。比如指针旋转、数值跳变，用lv_anim做出来效果非常丝滑。我在一个车载仪表项目里，用动画实现了转速表的平滑过渡，客户看了直点头。

1.3 支持平台

LVGL的移植性做得相当好。我列一下它支持的主要平台：

平台类型 具体例子 说明
MCU STM32、ESP32、NXP、瑞萨 主流ARM Cortex-M系列都支持
Linux 树莓派、全志、瑞芯微 通过FrameBuffer或DRM驱动
PC模拟 Windows、macOS、Linux 用SDL或X11模拟运行
RTOS FreeRTOS、RT-Thread、uCOS 多任务环境下也能稳定运行

我个人建议：刚开始学的时候，先在PC上搭模拟环境。这样调试方便，不用反复烧录固件。等逻辑调通了，再移植到目标板子上。

1.4 在PC上搭建模拟开发环境

好，接下来咱们动手。我会用VS Code + SDL的方式在Windows上搭建模拟环境。为什么选这个组合？因为VS Code免费、轻量、插件丰富，SDL则能模拟显示和输入。

第一步：安装VS Code

去官网下载安装就行。记得装上这几个插件：

  • C/C++（微软官方那个）
  • CMake Tools
  • GitLens（可选，但看代码历史很方便）

第二步：安装SDL2

SDL2是模拟显示的后端。在Windows上，我建议用vcpkg来安装：

git clone https://github.com/Microsoft/vcpkg.git
cd vcpkg
.\bootstrap-vcpkg.bat
.\vcpkg install sdl2:x64-windows

如果你不想用vcpkg，也可以直接去SDL官网下载开发包，手动配置include和lib路径。不过我个人觉得vcpkg更省事，一条命令搞定依赖。

第三步：克隆LVGL模拟器项目

LVGL官方提供了一个模拟器模板，咱们直接拿来用：

git clone https://github.com/lvgl/lv_port_pc_eclipse.git
cd lv_port_pc_eclipse

这个项目已经配置好了LVGL源码和SDL驱动。你只需要用VS Code打开它，然后配置CMake即可。

第四步：编译运行

在VS Code里按Ctrl+Shift+P，选择「CMake: Configure」，然后选择「CMake: Build」。编译成功后，按F5运行。如果一切顺利，你会看到一个灰色的窗口，中间有个「Hello World」的标签。

注意：我曾经遇到过SDL2版本不匹配的问题。如果你编译时报错找不到SDL2，检查一下vcpkg安装的版本是不是64位的。另外，CMakeLists.txt里要正确设置vcpkg的toolchain文件路径。

1.5 第一个Hello World程序

环境搭好了，咱们写个真正的Hello World。打开main.c，找到lv_example_get_started_1这个函数，改成这样：

void lv_example_get_started_1(void)
{
    // 创建一个标签控件
    lv_obj_t * label = lv_label_create(lv_scr_act());
    
    // 设置文本内容
    lv_label_set_text(label, "Hello, LVGL!");
    
    // 让标签居中显示
    lv_obj_align(label, LV_ALIGN_CENTER, 0, 0);
    
    // 设置字体大小（可选）
    lv_obj_set_style_text_font(label, &lv_font_montserrat_20, 0);
}

这段代码做了三件事：

  1. 在活动屏幕上创建一个标签
  2. 设置标签的文字为「Hello, LVGL!」
  3. 把标签居中显示

编译运行后，你会看到窗口中央显示了一行文字。嗯，虽然简单，但这是你踏入LVGL世界的第一步。

我的建议：第一次跑通后，可以试着改改文字内容、换个字体、或者调整对齐方式。多动手试试，比光看文档强多了。我记得我第一次跑通时，兴奋地把文字改成了「I ❤️ LVGL」，然后截图发到了朋友圈...

本章小结

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

  • 知道了LVGL是什么——一个轻量、开源、功能强大的嵌入式GUI库
  • 了解了它的核心特性——资源占用低、控件丰富、动画引擎强大
  • 亲手搭建了PC模拟环境——VS Code + SDL，跑通了第一个Hello World程序

下一章，咱们会深入LVGL的对象系统，聊聊控件是怎么创建、怎么管理、怎么销毁的。到时候我会分享一些我在项目中踩过的坑，比如内存泄漏的问题——嗯，那都是血泪教训啊。

好了，今天就到这里。如果你在搭建环境时遇到问题，欢迎在评论区留言。咱们下章见！

公众号:蓝海资料掘金营，微信deep3321

← 上一章 📖 返回目录 下一章 →