2. 开发环境搭建对比:LVGL的模拟器与TouchGFX的PC模拟器安装与配置

做嵌入式GUI开发,环境搭建是第一道坎。我见过不少新手,代码写得挺好,结果卡在环境配置上,一卡就是半天。说实话,LVGL和TouchGFX在这条路上的走法完全不同——一个偏手工,一个偏自动化。今天我们就来把这两套环境从头捋一遍。

核心结论先放这:LVGL的模拟器搭建更灵活,但需要你手动处理依赖;TouchGFX Designer开箱即用,但受限于STM32生态。选哪个,取决于你的项目背景和个人习惯。

2.1 LVGL的PC模拟器:SDL方式

LVGL官方推荐用SDL(Simple DirectMedia Layer)在PC上跑模拟。说白了,就是用SDL模拟一个显示窗口,把LVGL的绘制输出到你的电脑屏幕上。这样你写UI逻辑,不用每次烧到板子上看效果。

2.1.1 安装SDL库

先装SDL2。不同平台命令不一样:

  • Ubuntu/Debian:sudo apt-get install libsdl2-dev
  • macOS(Homebrew):brew install sdl2
  • Windows:去SDL官网下载开发库,或者用vcpkg:vcpkg install sdl2

我个人习惯在Ubuntu下开发,一条命令搞定,省心。Windows上我踩过坑——SDL的路径配置容易乱,建议直接用vcpkg统一管理。

2.1.2 拉取LVGL模拟器工程

LVGL官方在GitHub上提供了现成的模拟器模板:

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

这个仓库已经配好了CMakeLists.txt,你只需要确保SDL2的路径正确。打开CMakeLists.txt,找到SDL2相关的find_package,如果系统里装了SDL2,CMake会自动找到。

小技巧:如果你在Windows上遇到SDL2找不到的问题,可以手动设置环境变量SDL2_DIR指向SDL2的安装路径。我曾经因为这个折腾了半小时,后来发现是路径里多了个空格。

2.1.3 编译与运行

mkdir build && cd build
cmake ..
make -j4
./lv_sim

如果一切顺利,你会看到一个窗口弹出来,上面跑着LVGL的默认demo。嗯,到这里,LVGL的PC模拟环境就搭好了。

注意:LVGL的模拟器默认分辨率是800x480,你可以通过修改lv_conf.h里的LV_HOR_RES_MAX和LV_VER_RES_MAX来调整。我建议一开始用默认值,跑通了再改。

2.2 TouchGFX的PC模拟器:TouchGFX Designer

TouchGFX这边就简单多了。它走的是“全家桶”路线——一个IDE搞定所有。你不需要手动装SDL、配CMake,因为TouchGFX Designer自带模拟器。

2.2.1 安装TouchGFX Designer

去ST官网下载TouchGFX Designer,目前最新是4.22版本。安装过程就是一路Next,没什么好说的。但有一点要注意:

  • 需要Java运行环境:TouchGFX Designer基于Eclipse,所以你得先装JDK 11或更高版本。
  • 建议装STM32CubeMX:虽然模拟器不需要,但后续生成工程代码时,CubeMX是必须的。

我记得第一次装TouchGFX Designer时,没注意Java版本,结果启动报错。后来换了JDK 11,问题就解决了。所以,装之前先检查一下你的Java版本:java -version。

2.2.2 创建第一个模拟器项目

打开TouchGFX Designer,点击“New Project”。你会看到几个模板:

  • Empty Application:空白工程,适合从零开始。
  • TouchGFX Demo:官方demo,适合学习。
  • Board Template:基于特定开发板的模板。

选“Empty Application”,然后设置分辨率。我一般设成480x272,这是常见的嵌入式屏幕尺寸。点击“Create”,项目就生成了。

2.2.3 运行模拟器

在TouchGFX Designer界面右上角,有一个“Run Simulator”按钮。点一下,等几秒钟,模拟器窗口就会弹出来。你可以在Designer里拖控件,保存后模拟器会自动刷新——这个体验比LVGL的“改代码→编译→运行”流程要流畅得多。

对比一下:LVGL的模拟器需要你手动编译,每次改UI都要重新make;TouchGFX Designer是所见即所得,改完直接看效果。但代价是——TouchGFX Designer只能做UI布局,复杂的逻辑还得去IDE里写代码。

2.3 核心差异对比

我把两套环境的关键差异整理成了表格,方便你对照:

对比项 LVGL (SDL模拟) TouchGFX Designer
安装复杂度 中等,需手动装SDL、配置CMake 低,安装包自带模拟器
依赖环境 SDL2、CMake、编译器 JDK 11+、STM32CubeMX(可选)
UI编辑方式 纯代码(C语言) 拖拽式(所见即所得)
模拟器刷新 手动编译后运行 自动刷新(保存即更新)
跨平台支持 Windows/Linux/macOS Windows为主(macOS/Linux需额外配置)
硬件绑定 无,可移植到任何平台 强绑定STM32生态

你想想看,如果你只是想在PC上快速验证UI效果,TouchGFX Designer确实更省事。但如果你需要跨平台、或者最终产品不是STM32,那LVGL的SDL模拟器才是正解。

2.4 避坑指南

环境搭建这块,我踩过的坑比走过的路还多。挑几个典型的说说:

  • LVGL模拟器窗口黑屏:我曾经遇到过SDL窗口弹出来了,但里面一片黑。后来发现是lv_conf.h里LV_COLOR_DEPTH设成了32,但SDL默认只支持16位色深。改成16就好了。
  • TouchGFX模拟器启动慢:第一次启动可能要等30秒,别急。如果一直卡住,检查一下Java堆内存,在TouchGFX Designer.ini里加一行-Xmx1024m。
  • 路径中文问题:这个老生常谈了。LVGL的CMake工程路径里不要有中文,TouchGFX也一样。我有个同事项目名用了中文,编译报错找了一下午,最后发现是路径编码问题。

2.5 本章知识体系

下面这张图帮你理清两套环境的搭建流程和核心组件:

开发环境搭建对比:LVGL vs TouchGFX LVGL 模拟器(SDL方式) ① 安装SDL2库 ② 克隆 lv_port_pc_eclipse ③ 配置CMakeLists.txt ④ cmake && make 编译 ⑤ 运行 ./lv_sim TouchGFX Designer ① 安装JDK 11+ ② 安装TouchGFX Designer ③ 创建新项目(选模板) ④ 拖拽设计UI界面 ⑤ 点击“Run Simulator” LVGL:手动编译,灵活跨平台 | TouchGFX:所见即所得,绑定STM32生态

从这张图可以看得很清楚:LVGL的搭建流程是线性的,每一步都需要你手动介入;TouchGFX Designer则把大部分步骤封装在了IDE里。说白了,一个给你全部控制权,一个给你便利性。没有绝对的好坏,只有适不适合。

我的建议:如果你是初学者,或者项目周期紧,先用TouchGFX Designer快速上手。如果你追求跨平台、或者想深入理解GUI底层机制,LVGL的SDL模拟器会让你学到更多。我个人两个都用,平时原型验证用TouchGFX,正式项目用LVGL。