可视化拖放式 LVGL 编辑器。
PicoPixel 的工作原理
PicoPixel 将 LVGL 开发从代码优先的流程转变为可视化拖放工作流。从空白画布到生产就绪的嵌入式 UI 只需几分钟 — 可视化设计、通过实时 LVGL 模拟器预览，并导出干净的 C code。无需安装。
免费开始使用！从设计到设备只需 6 步
设计您的界面
在浏览器中打开 PicoPixel — 无需下载，无需安装。从组件面板将 LVGL 组件拖放到像素级精准的画布上，并进行可视化样式设置。
- • 按钮、标签、滑块、开关、弧形、图表、下拉菜单、滚轮、复选框、文本区域、选项卡视图、容器和图片
- • 设置目标显示分辨率以匹配您的硬件
- • 设置颜色、边框、内边距、字体、透明度、渐变和阴影样式
- • 使用对齐和分布工具精确定位组件
- • 组织多页界面的屏幕和图层
连接交互
使用可视化事件编辑器连接组件操作，无需编写一行 C code。PicoPixel 自动生成 LVGL 事件回调。
- • 按钮按下 → 导航到另一个屏幕
- • 滑块值变化 → 更新标签
- • 复选框切换 → 显示或隐藏面板
- • 下拉菜单选择 → 更改样式或触发操作
- • 将操作拖放到组件上 — 无需回调代码
在实时模拟器中预览
PicoPixel 将 LVGL 编译为 WebAssembly 并直接在您的浏览器中运行。预览是实际的 LVGL 渲染引擎 — 不是模型展示。
- • 准确查看 UI 在硬件上的渲染效果
- • 测试触摸交互、滚动和动画
- • 交互叠加层显示可以点击和滚动的元素
- • 与团队或客户分享模拟器链接 — 无需开发环境
导出生产就绪的代码
将您的项目下载为干净的 LVGL C 源文件。输出使用标准 LVGL API 调用，无任何专有依赖 — 直接放入任何 LVGL 项目中。
- • 组件定义和布局代码
- • 样式声明
- • 事件处理程序绑定
- • 字体和图片资源引用
- • 标准 LVGL 8.x API — 无 PicoPixel 运行时库
集成并烧录
将导出的文件添加到您的 ESP-IDF、Arduino 或 PlatformIO 项目中。编译、烧录，设备上的 UI 与模拟器逐像素匹配。
- • 支持 ESP32、STM32、Arduino、Raspberry Pi Pico 及任何 LVGL 兼容平台
- • 包含 UI 头文件，在显示驱动配置完成后调用 ui_init()
- • 大多数设置无需更改构建系统
- • 或将 zip 文件交给 AI 代码助手，让它处理集成
协作与迭代
邀请团队成员加入您的项目。所有人实时编辑同一画布。使用内置版本控制跟踪更改并在需要时回滚。
- • 实时协作编辑 — 实时光标、反馈、标注
- • 内置版本控制，具有细粒度的会话历史记录
- • 回滚到任何先前状态并比较版本
- • 分享模拟器链接供相关方审查
为什么为 LVGL 选择拖放方式？
传统上使用 LVGL 构建嵌入式 UI 意味着逐行编写 C code — 用像素坐标定位组件、通过函数调用应用样式，每次更改后重新编译。这种方式可以工作，但反馈循环很慢，代码也难以可视化。
PicoPixel 的拖放方式用一个可以即时看到结果的可视化编辑器取代了那个循环。将按钮拖到画布上，调整大小，更改颜色，添加标签 — 实时 LVGL 模拟器会准确显示它在目标硬件上的外观。完成后，导出可在 ESP32、STM32、Arduino 及任何 LVGL 兼容平台上编译的干净 C code。
可视化工作流在原型设计中更快，对团队来说更容易（设计师和工程师可以实时协作），并生成与手写相同质量的生产级 LVGL 代码。查看所有 PicoPixel 功能或阅读与其他 LVGL 编辑器的详细对比。
常见问题
使用 PicoPixel 需要安装什么吗？
不需要。PicoPixel 完全在浏览器中运行。打开编辑器 URL，登录即可开始设计。没有桌面应用程序、没有插件、没有 SDK 需要安装。
编辑器中可以使用哪些 LVGL 组件？
PicoPixel 支持核心 LVGL 组件集，包括按钮、标签、滑块、开关、下拉菜单、滚轮、弧形、进度条、图表、图片、复选框、文本区域、选项卡视图、容器等。我们正在持续添加对更多组件的支持。
实时模拟器的准确度如何？
模拟器运行的是编译为 WebAssembly 的实际 LVGL 渲染引擎 — 不是模型展示或 CSS 近似效果。您在预览中看到的与目标硬件逐像素匹配。
导出的代码使用什么格式？
PicoPixel 导出一个包含干净、人类可读的 LVGL C code（.c 和 .h 文件）的 zip 文件。输出包括组件创建、样式设置、布局和事件处理程序设置 — 全部使用标准 LVGL API 调用，无任何专有依赖。
导出的代码可以与 ESP-IDF、Arduino 或 PlatformIO 一起使用吗？
可以。导出的代码使用标准 LVGL API 调用，因此可以与任何支持 LVGL 的构建系统一起使用 — 包括 ESP-IDF、Arduino IDE 和 PlatformIO。只需将文件添加到您的项目中，并在显示驱动配置完成后调用 ui_init()。有关特定平台的详细信息，请参阅我们的 ESP32 指南。
PicoPixel 是免费的吗？
是的。PicoPixel 免费使用 — 包括商业项目。无需信用卡。随着平台的发展和更多用户的加入，可能会推出付费计划以覆盖存储和服务成本。始终会有免费层级。