windows下的lvgl ui editor环境搭建

lvgl ui editor

LVGL官方提供的UI提供UI辅助软件,可以去官网下载也可以去GITHUB上面下载,目前最新版本到v0.3
https://lvgl.io/editor
相关说明网址 https://github.com/lvgl/lvgl_editor

lvgl ui editor显示预览机制个人理解

lvgl不装依赖(虚拟机),也可以写XML以及生成代码,但是无法对编辑的xml进行预览,不知道写的有没有问题

虚拟机创建

虚拟机使用的是podman这个软件来生成的linux虚拟机,只是依赖于windows的wsl

安装LVGL 相关DOCKER

相当于是一个虚拟容量,统一屏蔽底层的虚拟化显示,虚拟机运行后,预览效果还需要依赖这个LVGL的这个DOCKER来实现预览

在windows平台下面需要有WSL组件,即运行虚拟子系统的组件,因此WIN10之前的WINDOWS是用不了的

安装LVGL UI EDITOR

找到powershell使用管理员身份打开,输入wsl安装命令

wsl --install

打开lvgl ui editor

lvgl会自动创建虚拟机

下载LVGL DOCKER

正常来说,会自动下载DOCKER并安装,但是因为网络的网络的问题下载失败,导致一直启动不了
需要对虚拟机的docker进行配置代理,理论上讲更换相关的国内源也可以实现下载,这里并没有尝试
d83cd076-bffe-49d5-9d44-59659e661272
提示容量安装成功,实际下载超时并没有成功安装

进入虚拟机对docker的代理进行设置
powershell用管理员身份打开

bash //进入虚拟机
sudo vi /etc/profile.d/podman-docker.sh

添加代理设置,其中x.x.x.x是网址,yyyy是相关的端口

export HTTP_PROXY=http://x.x.x.x:yyyy
export HTTPS_PROXY=http://x.x.x.x:yyyy

保存代理之后,退出下虚机,再重进下虚拟机
使用docker下载命令,下载相应的lvgl容器,大概700多M的样子

docker pull lvglio/emscripten-sdl2:0.2.0

4e19c9e2-2c28-4c2f-ad6b-642eeb9fa143

安装成功之后,重新再打开LVGL UI EDITOR就可以使用了
7c533ce5-4a98-4516-852a-e63dd1b4180a
点击右上角的生成代码,与编译工程就可以实现界面预览功能了,例子可以通过github上面下载相关版本的官方xml例子
39ea567b-cee2-4baa-b9e3-1bc4fec54a4d

总结

LVGL UI EDITOR官方提供的UI软件,多了一种LVGL开发界面的途径,无论是作为参考,还是对理解LVGL的具体界面开发,都是有所帮助的。
官方针对这个软件还有相关的讲解视频,可以找过来看下,帮忙理解使用

参考

https://github.com/containers/podman/issues/22373

posted @ 2025-08-18 08:25  cau_par  阅读(1150)  评论(0)    收藏  举报