VS Code环境下LVGL模拟器的配置与运行
- 一、前言
- [二、安装Visual Studio Code](#二、安装Visual Studio Code)
- 三、配置LVGL模拟器运行环境
- 四、创建LVGL模拟器工程
- 五、编译并运行LVGL工程
- 六、总结
一、前言
借助模拟器，开发者无需嵌入式硬件就能直接在PC端进行LVGL的GUI设计。而LVGL本身也支持Windows、Linux、Mac多系统，官方提供了适配多种集成开发环境的模拟运行方案。本文将基于Visual Studio Code结合SDL驱动，讲解LVGL模拟器的环境配置与运行步骤。尽管Windows系统并非官方推荐的Visual Studio Code开发场景，但该方案无需安装虚拟机，就能直接在Windows上运行模拟器，使用起来更加便捷。
二、安装Visual Studio Code
下载地址：https://code.visualstudio.com
● 打开VSCode官方网站的下载页面，选择适配Windows系统的安装包进行下载。
● 下载完成后，双击运行VSCode安装包，在弹出的许可协议界面勾选"我同意此协议"，再点击"下一步"。
● 点击"浏览"选择安装路径，再点击"下一步"。
● 勾选以下配置，再点击"下一步"。
● 点击"安装"，等待安装进程完成后，重启电脑确保环境配置生效。
● 可以打开cmd，输入命令查看当期VSCode版本。
若重启后环境仍未生效，可以手动配置环境变量：打开电脑的高级系统设置，切换到"高级"标签页点击"环境变量"，在系统变量中找到"Path"并进入编辑页面，添加VSCode的bin文件根目录路径后，再次重启电脑，再次确认安装是否成功。
三、配置LVGL模拟器运行环境
1、安装VSCode插件
（1）LVGL编译运行需要安装C/C++语言、CMake、CMake Tools插件安装包，其余的可以选择性安装。
（2）若VSCode自带的CMake插件无法正常运行，可以手动下载CMake工具软件进行安装，Windows系统请选择windows-x86_64版本的安装包。
勾选CMake添加到环境变量选项，点击"Next"。
更改安装路径后，点击"Next"，等待安装完成。
最后确认CMake环境配置是否已生效；若配置失败，可参照前文安装VSCode时的方法，手动添加环境变量完成配置。
下载地址：https://cmake.org/download/
2、安装MinGW编译器
MinGW编译器是以GCC为核心的C/C++开发工具链，可编译生成不依赖额外运行时环境的Windows可执行文件，是本教程中编译LVGL模拟器必需的编译工具。
下载MinGW编译器压缩包（可从官网或 GitHub 获取），解压后将 bin 目录的路径复制，并手动添加至系统环境变量中完成配置。
最后确认MinGW环境配置是否已生效。
下载地址：https://github.com/niXman/mingw-builds-binaries/releases
3、安装SDL2开发库
SDL2开发库为LVGL模拟器和上层应用提供底层硬件访问支持，可处理图像渲染、音频输出、触摸屏、鼠标、键盘等输入设备交互等核心功能，是模拟器正常运行必不可少的依赖库。
下载SDL2开发库的压缩包，解压后，将其中两个文件夹复制到MinGW安装的根目录下。
下载地址：https://github.com/libsdl-org/SDL/releases/
四、创建LVGL模拟器工程
1、下载LVGL的模拟器项目源码
将PC端模拟器项目源码的压缩包下载，可以按照实际需要下载其他版本。
下载地址：https://github.com/lvgl/lv_port_pc_eclipse/tree/release/v8.3
2、下载LVGL的驱动源码
将LVGL驱动源码的压缩包下载，可以按照实际需要下载其他版本。
下载地址：https://github.com/lvgl/lv_drivers/tree/release/v8.3
3、下载LVGL的源码
将LVGL源码的压缩包下载，可以按照实际需要下载其他版本。
下载地址：https://github.com/lvgl/lvgl/tree/release/v8.3
4、创建工程
先在全英文路径下新建一个空白文件夹（如lv_demo），将提前下载好的三个压缩包解压后，把lv_port_pc_eclipse-release-v8.3文件夹内的全部文件复制到新建的文件夹中。
接着把解压得到的lv_drivers-release-v8.3文件夹内的所有文件，复制到目标目录下的lv_drivers文件夹中。
再将lvgl-release-v8.3文件夹内的全部文件，复制到目标目录下的lvgl文件夹中。
五、编译并运行LVGL工程
1、打开LVGL工程
完成文件准备后，右键点击新建的lv_demo文件夹，选择"通过 Code 打开"即可；也可以先打开VSCode，通过顶部菜单栏"文件"→"打开文件夹"，定位到目标lv_demo文件夹打开项目。
2、选择编译器
若打开项目后未自动配置编译器，可以点击VSCode底部状态栏的"未选择任何配置预设"，在弹出的选项中选择"扫描工具包"，等待工具扫描完成后，选中已经安装好的MinGW编译器完成配置。
3、编译工程
点击VSCode底部状态栏的编译生成按钮启动编译，待提示编译成功后，将MinGW安装目录下的SDL2.dll文件，复制到LVGL项目编译生成的bin文件夹中。
4、运行程序
点击VSCode底部状态栏的运行按钮，若成功弹出LVGL模拟器窗口，就说明LVGL已经在VSCode环境下成功配置并运行了。
LVGL表格demo模拟器
5、替换或编写其他LVGL内容
（1）若想要运行其他示例Demo程序，打开项目主文件，在main函数中将默认的LVGL展示函数替换为lv_demo_music。
接着在配置文件lv_conf.h中通过宏定义启用该功能，重新编译并运行程序，即可在模拟器中查看最终效果。
LVGL 音乐demo模拟器
（2）或者添加自己编写代码。
6、扩展说明
（1）在实际项目开发中，可以通过修改lv_conf.h和lv_drv_conf.h配置文件，调整 LVGL 核心功能及底层驱动的相关参数，以满足具体的项目需求。
（2）编译过程中遇到任何问题，可以点击VSCode右上角的"切换辅助侧栏"打开AI助手面板，把编译报错信息复制到对话框中，让AI分析并引导一步步修复问题。
（3）在模拟器调试完成后，只需把你编写好的LVGL代码添加到Keil工程中重新编译，编译通过后直接下载到目标硬件板卡中即可运行。可以参考文章《【STM32】基于HAL库的LVGL移植》 。
六、总结
完成基础环境搭建，安装VSCode、适配架构的编译工具链与SDL开发依赖，克隆LVGL官方PC适配仓库，并初始化拉取完整子模块源码。接着编写代码，完成编译后复制对应位数的SDL动态链接库，直接运行生成的可执行文件，即可实现界面模拟调试预览。遇到配置问题可借助内置AI助手排查，也可使用腾讯代码助手等第三方AI插件辅助排错。
搜索关注「YouziTech」 ，获取更多内容！