关于 PicoPixel — 基于浏览器的 LVGL 编辑器
什么是 PicoPixel?
一款基于浏览器的可视化设计工具,专为 LVGL 驱动的嵌入式用户界面打造。
将控件拖放到像素级精确的画布上,通过可视化方式设置样式,用可视化事件编辑器连接事件处理程序,管理可复用资源,并为目标平台导出可直接用于生产的 C 代码。 可以将它视为嵌入式 UI 的 Figma。
一切都在浏览器中运行,无需安装。PicoPixel 可免费使用。
按钮、滑块、开关、弧形、图表、下拉菜单、滚轮、复选框、文本区域、标签视图、容器、图像
无需编写 C 代码即可连接交互
由 WebAssembly 驱动的逐像素硬件预览
实时光标、标注、可分享的模拟器链接
精细的会话历史记录,一键回滚
面向 ESP32、STM32、RP2040 等平台的干净 LVGL 8.x 代码
站在巨人的肩膀上
如果没有 LVGL,以及 LVGL 团队将该库完全开源所付出的卓越工作,这一切都不会存在。正是他们让 LVGL 保持免费且易于访问,才让 PicoPixel 这样的工具成为可能。
我们由衷感谢所有为 LVGL 生态做出贡献的人:核心维护者、提交 issue 和编写驱动的社区成员,以及每一位选择使用 LVGL 构建产品的开发者。谢谢你们。
PicoPixel 的前端最初基于 Penpot 的分支开发。我们衷心感谢 Penpot 团队和社区,他们的开源工作为我们奠定了基础。我们计划在 PicoPixel 达到稳定版本后尽快发布我们的版本。
为了让 PicoPixel 适用于 LVGL,我们对原始代码库进行了大量修改,其中包括多个专用渲染器,将通用设计平台转变为原生 LVGL 编辑器和模拟器。如果没有这些深入的架构工作,PicoPixel 只能是一个基础的 LVGL 插件,而不会成为今天这样专为 LVGL 打造的平台。
PicoPixel 发布时,LVGL 团队带着非常友善的话语和祝贺联系了我们。
他们欢迎这个项目成为生态中的积极补充,并真诚地为围绕 LVGL 构建更多工具感到兴奋。
为什么我们要打造它
为嵌入式设备构建 UI 传统上意味着手写像素坐标,并与底层图形库反复打交道:编写 C 代码、烧录、检查显示、调整、再次烧录。
我们相信嵌入式开发者也应该拥有 Web 和移动开发者熟悉的可视化设计体验。PicoPixel 通过拖放编辑器、精确展示 UI 在硬件上渲染效果的实时模拟器,以及支持团队实时协作的工作流来弥合这一差距。
工作原理
从画布到硬件,只需六步。
设计
将 LVGL 控件拖到像素级精确的画布上,并通过可视化方式设置样式。
连接交互
将按钮点击连接到屏幕导航,将滑块变化连接到标签更新。无需 C 代码。
预览
在由 WebAssembly 驱动的实时 LVGL 模拟器中查看 UI。这是真正的渲染引擎,不是模型图。
导出
生成可直接用于生产的 LVGL C 代码(.c 和 .h 文件),不含专有依赖。
烧录
将导出的文件添加到 ESP-IDF、Arduino 或 PlatformIO 项目中,并烧录到硬件。
迭代
使用内置版本控制与团队实时协作。
Ed 的一段话

我目前正在构建一个仪表显示集群,并且有相当多时间往返于 Tokyo 和 Shenzhen。如果您也在做硬件,或者刚好在这两个城市之一,我很乐意一起喝一杯聊聊项目。
在 PicoPixel 之前,我曾在一家大型券商工作了几年。也曾在一家被 Apple 收购的创业公司工作,参与过几个 Watch 原型。正是在那里,我开始想重新靠近硬件,并最终走到了现在这个项目。
我很想听听您正在构建什么,以及希望 PicoPixel 做出哪些改变。欢迎随时联系。
公开测试
坦诚说明我们所处的阶段。
PicoPixel 目前处于 公开测试阶段,由一位独立开发者构建和维护。控件集正在积极扩展,LVGL v9.x 支持已在规划中,并且会定期发布新功能,包括最近上线的基于时间线关键帧的动画模式。
随着基础设施扩展,可能会出现一些临时限制。您的耐心和反馈对我们非常重要。如果遇到任何问题,请随时联系我们。