PicoPixel

如何提交 pet

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

PI PicoPixel
pets sprites petdex submission
已更新 2026-05-30
01 /07

概览

pet 是一个 animated sprite,一个通过帧循环动起来的小角色。提交后,它可以出现在社区 Pets gallery 中,供所有人使用和欣赏。

提交 pet 有两种方式。最快的是通过 Petdex:粘贴一个 URL 就完成。另一种是通过 GitHub,适用于你自己托管的 spritesheet 和 sprite.json。你可以提交现有的 Petdex pet,也可以创建一个原创 pet。

两种方式都在 PicoPixel 应用内完成,因此你需要先登录。

02 /07

开始之前

所有操作都在 PicoPixel 应用中进行。进入提交页面:

  1. app.picopixel.io 打开应用。
  2. 如果还没有登录,请先登录,登录使用 Google 或 GitHub OAuth。如果跳过这一步,提交前会提示你登录。
  3. 点击左侧边栏底部的账号。
  4. 选择 "Your account"。
  5. 打开 "Submit Sprite"。

Submit Sprite 页面会提供下面介绍的两种方式。

NOTE

提交任何内容都必须登录。如果未登录,应用会在继续前提示你。

03 /07

通过 Petdex 提交

这是推荐且最快的方法。Petdex 是位于 petdex.crafter.run 的外部 pet 目录,你可以浏览、创建和托管 pet。那里的每个 pet 都有类似 https://petdex.crafter.run/pets/<pet-id> 的可分享 URL。

提交步骤:

  1. 在 Petdex 上找到或创建 pet,并复制它的 URL。
  2. 在 Submit Sprite 页面选择 "Submit via Petdex"。
  3. 将 pet URL 粘贴到 "Petdex URL" 字段。
  4. 在可选的 "Notes" 字段中添加有用信息。
  5. 发送。
TIP

通过 Petdex 提交是最快路径,它标着 RECOMMENDED 和 FASTEST 是有原因的。你只需要一个 URL。

04 /07

通过 GitHub 提交

当你自己托管 sprite 时使用这种方式。你提供的是原始文件,而不是 Petdex 链接。

  1. 将 spritesheet 图片和匹配的 sprite.json 放入公开 GitHub 仓库。
  2. 在 Submit Sprite 页面选择 "Submit via GitHub"。
  3. 粘贴仓库 URL(https://github.com/...)。
  4. 填写 "Credits / Author",让作品正确署名。
  5. 在可选的 "Notes" 字段中添加有用信息,然后发送。

spritesheet 和 sprite.json 需要遵循特定格式。下一节会说明。

05 /07

创建你自己的独特 pet

你不必复用精选的 Petdex pet,也可以制作原创 pet。OpenAI Codex 或 AI image generators 等 AI 工具,是从零生成角色 spritesheet 的实用方式。

spritesheet 是一张单独的图片(PNG 或 WebP),按统一网格排列,也叫 "atlas"。请让每一行放一个动画,并保持每一帧尺寸完全一致。

WARNING

每一帧都必须拥有完全相同的宽度和高度。单元格不一致的网格无法干净切片,动画会跳动或损坏。

sprite.json 描述这张 sheet。它主要有两部分:

  • atlas,网格布局:columnsrowsframeWidthframeHeight
  • states,动画数组。每个 state 都有 idlabel、所在 rowframes 数量、可选的 durationMsgroupcaption

常见 state 包括 idlewavejumprun-rightrun-leftrunningwaitingfailedreview。sprite 至少需要两个 state,因此请至少生成 idle 加一个动作。

一个好的流程是:以一致尺寸生成帧,把它们按每行一个动画排列到规则网格中,然后在 sprite.json 中描述网格和 states,并通过 Petdex 或 GitHub 提交。

TIP

sprite 的概念、states、phases 和复用,在 LVGL Sprites 中有更深入的说明。

06 /07

接下来会发生什么

提交后,PicoPixel 团队会审核你的 pet,必要时会联系你澄清问题。通过审核的 pet 会出现在 Pets gallery 中,并显示你的署名。之后,社区中的任何人都可以找到并使用你的创作。

07 /07

下一步

继续阅读

继续前进。

如何在 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
什么是 sprite? thumbnail
PICOPIXEL

什么是 sprite?

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

sprite · picopixel