学习 LVGL

Build with
PicoPixel.

面向 Web 编辑器、ESP32 开发板,以及支撑项目流程的分步指南。

如何在 PicoPixel 中使用宠物 thumbnail
置顶 · PICOPIXEL

如何在 PicoPixel 中使用宠物

宠物是预制的动画精灵,具有多种模式,可以在任意条件下触发。从目录中选一个,添加到项目中,然后将其连接起来,让它对设备正在做的任何事情做出反应:获取数据、过热、代码审查等等。

pets · sprites · picopixel 查看
如何使用 PicoPixel templates、UI kits 和 full apps thumbnail
PICOPIXEL

如何使用 PicoPixel templates、UI kits 和 full apps

查找 PicoPixel templates、UI kits、examples、sprites、widgets 和 full app files,然后打开、下载、导入、自定义,并将它们导出为适用于设备的 LVGL C code。

templates · ui-kits · full-apps
使用 LVGL Animated Image 组件 thumbnail
LVGL

使用 LVGL Animated Image 组件

了解 LVGL animated image 组件的工作方式:上传一组尺寸一致的帧,设置时长和循环方式,并在显示屏上播放逐帧动画。

lvgl · animated-image · animimg
什么是 sprite? thumbnail
PICOPIXEL

什么是 sprite?

了解 sprite 是什么,如何创建多状态 animated widgets,以及如何在项目之间复用它们。

sprite · picopixel
使用 event editor thumbnail
PICOPIXEL

使用 event editor

使用 PicoPixel 的 event editor 让 UI 可交互:从一个 widget 拖出连接到另一个 widget,选择 click 或 value change 等 trigger,然后选择会发生什么。

events · interactions · picopixel
PicoPixel 中 libraries 和可复用 LVGL components 指南 thumbnail
PICOPIXEL

PicoPixel 中 libraries 和可复用 LVGL components 指南

了解 PicoPixel 中 libraries 如何工作:发布一个文件会让它的 assets 可在团队 workspaces 之间复用,而不是公开发布。包括 library 包含什么、如何 publish 和 link、发布后的 libraries 出现在哪里,以及内容离开团队的唯一两种方式。

library · components · sharing
使用 fonts thumbnail
PICOPIXEL

使用 fonts

了解为什么 LVGL fonts 需要转换,如何从 bundled 或 uploaded font 创建 font,如何设置 Arabic 和 Hebrew 等 right-to-left scripts,处理大型 CJK fonts,并清理未使用的 fonts。

font · picopixel · lvgl
ESP32 LVGL 教程:构建触摸屏 UI thumbnail
硬件

ESP32 LVGL 教程:构建触摸屏 UI

使用 LVGL 为 ESP32 构建触摸屏 UI,在浏览器中可视化设计,实时预览,并导出可直接烧录的 C 代码。适合初学者的入门指南。

esp32 · lvgl · ui
如何提交 pet thumbnail
PICOPIXEL

如何提交 pet

向 PicoPixel 社区添加你的 pet 有两种方式:粘贴 Petdex URL 是最快路径,或者将 spritesheet 和 sprite.json 上传到 GitHub。还包括如何用 AI 工具生成自己的独特 pet。

pets · sprites · petdex
如何提交 template thumbnail
PICOPIXEL

如何提交 template

通过创建包含 .picopixel 文件、展示图片和 README 描述的 GitHub repo,将你的 PicoPixel 文件作为社区 template 分享。

templates · submission · sharing
如何举报内容 thumbnail
PICOPIXEL

如何举报内容

发现不该出现的 pet、template 或其他社区内容?通过 Give feedback 表单举报,了解应包含哪些信息、如何标记版权问题,以及提交后会发生什么。

report · copyright · moderation
有教程想法?
请发邮件至 hello@picopixel.io