试用 LVGL Pro,一套完整的工具包,助您高效构建、测试、分享和交付 UI!
LVGL
版本发布

LVGL Pro Editor v1.2.1:内置运行时、LVGL 9.5 支持与本地 Emscripten

LVGL Pro Editor v1.2.1 内置运行时实现开箱即用的实时预览,全面支持 LVGL 9.5.0,并以本地 Emscripten 取代 Podman。

威廉·森伯威廉·森伯8 分钟阅读

我们非常高兴地宣布最新发布的 LVGL Pro Editor v1.2.1 带来了 3 项重大改进!这些改进围绕增强的 LVGL 支持和更加流畅的用户体验展开。

  1. 内置运行时——实时预览现已开箱即用
  2. LVGL v9.5.0 支持——带来多项出色的新功能
  3. 本地 Emscripten 支持——告别繁重的 Podman 安装

内置运行时#

在过去一年多的时间里,要让 Editor 中的实时预览正常工作,必须先编译项目。这需要安装 Podman 并编译 liblvgl 等多个步骤。现在,我们将运行时与 Editor 一起打包,带来以下优势:

  1. 安装 Editor 并打开项目后,预览立即可用
  2. 对于不含自定义 C 代码或自定义控件的项目(绝大多数项目都属此类),无需编译
  3. 对于确实需要编译才能获得准确预览的项目,我们内置了预编译的 liblvgl,只需编译您自己的项目代码
  4. 最后,我们内置了 LVGL v9.4.0 和 v9.5.0 的运行时 / 库。这也引出了下一项重大公告……
提示

注意:如果您有自定义 C 代码 / 控件且未进行编译,实时预览将不准确或不完整。


LVGL 9.5.0 支持#

LVGL v9.5.0 发布已经几个月了。该版本带来了多项出色的全新 XML 功能。如今,这些功能在 Editor 中已获得一流支持。

重要迁移说明

注意:LVGL 版本通过 project.xml<project ...> 标签的 lvgl_version 属性按项目设置。请参考此示例。为避免对项目所用版本产生混淆,lvgl_version 现在为必填项。

插槽(Slots)#

插槽允许组件 / 控件定义可复用的布局,也可以用于向组件 / 控件注入任意自定义内容。下面是一个定义了头部区域和内容区域的组件示例:

slotted_componenet.xml
插槽模板布局

下面这个屏幕使用了该模板:

screen_from_template.xml
由插槽组件模板渲染出的屏幕
文档Pro语法APISlots
Read documentation

查阅完整的 Slots 参考文档,了解完整语法、嵌套规则和更多示例。


局部样式属性绑定#

这个小而强大的功能允许将 subject 绑定到任何局部样式属性。

您可以在拖动滑块时改变滑块手柄的透明度……

绑定滑块手柄透明度
滑块手柄透明度绑定到 subject

……改变按钮的内边距和标签的透明度……

绑定按钮内边距与标签透明度
按钮内边距与标签透明度绑定到 subject

(如您所见,选择器是可选的。)

……以及其他成百上千种可能性。您会如何使用这个功能?

文档Pro语法StylesLocal Style Binding
Read documentation

查阅完整的局部样式绑定参考,了解支持的属性和选择器语法。


选择器语法#

最后,选择器可以直接附加到局部样式上,例如下面这个示例仅在按下时为滑块的指示器设置样式:

<lv_slider style_bg_opa-indicator-pressed="200"/>
xml
文档Pro语法StylesLocal Styles
Read documentation

查阅局部样式参考,了解完整的选择器语法和支持的属性列表。


本地 Emscripten 支持#

上文提到,在此版本之前,让预览正常工作一直都需要先编译。与之相关,Editor 一直都需要容器化服务来完成编译。Editor 最初使用 Docker,后来切换到 Podman,因为它更轻量、通常更容易安装。然而,尽管 Podman 是一款优秀的容器化服务,但对于我们的使用场景,它也存在一些局限性:

  1. 在 Mac / Windows 上的安装(包括 LVGL 专用容器)约为 8 GB。(Linux 上约为一半。)
  2. 下载过程理所当然地较慢。
  3. Podman 在 Linux 上工作非常可靠,但在 Mac 和 Windows 上的多种边缘情况下表现欠佳(包括但不限于安全设置和 WSL 配置)。

内置运行时通过让编译变为可选项,已经缓解了大部分痛点。但我们希望做得更好。为此,我们已经测试本地安装 Emscripten 工具链约半年时间。我们发现它是 Podman 的绝佳替代品,现在也推荐您使用。

其优势包括:

  1. 在 Mac / Windows 上所需的磁盘空间约为 Podman 的 1/4。
  2. Emscripten 项目在让工具链易于管理和安装方面做得非常出色,所有操作系统上皆是如此。
  3. 在 Mac 和 Windows 上,编译速度有明显提升。

前置依赖:

  • git
  • Python >= 3.10
  • 构建工具:Windows 使用 ninja,Mac/Linux 使用 make

此外,还需要以下设置以支持图像转换:

python3 -m pip install pypng lz4
bash
提示

注意:我们正在考虑如何以最佳方式自动化以上 ☝🏻 全部安装步骤。


最后,您需要使用命令行参数 local-emsdk 启动 Editor。

/Applications/LVGL\ Editor.app/Contents/MacOS/LVGL\ Editor local-emsdk
bash

之后,当您首次进行编译时,Editor 会提示完整安装并配置 Emscripten 4.0.6。


结语#

希望您能试用本次发布的 LVGL Pro Editor,也由衷期待它能改善您的使用体验。以上是本次发布的主要改进,此外我们还完成了许多错误修复。欢迎查看发布说明。(如果您对此感兴趣的话。)

干杯!🍻

关于作者

威廉·森伯
威廉·森伯

LVGL Pro 团队负责人

LVGL Pro 团队负责人,拥有近二十年的工业和小型企业软件及网页开发经验。致力于打造高质量的编辑工具,帮助用户实现嵌入式 UI 设计。

认识博客背后的作者们

了解那些分享 LVGL 知识的优秀作者们

查看作者

订阅我们的通讯 不错过任何关于 LVGL 的新闻。我们每月最多发送 2 封邮件。

LVGL

LVGL 是最受欢迎的免费开源嵌入式图形库,支持任何 MCU、MPU 和显示类型,助您构建精美的用户界面。

我们还提供 UI 设计、实现和咨询等服务。

© 2026 LVGL。保留所有权利。
YouTubeGitHubLinkedIn