Your browser’s preferred language is English. Would you like to switch?

O idioma preferido do seu navegador é português. Deseja mudar?

브라우저의 기본 언어는 한국어입니다. 전환하시겠어요?

ブラウザーの優先言語は日本語です。 切り替えますか?

La langue préférée de votre navigateur est le français. Voulez-vous changer de langue ?

Die bevorzugte Sprache Ihres Browsers ist Deutsch. Möchten Sie wechseln?

La lingua preferita del tuo browser è l’italiano. Vuoi cambiare lingua?

El idioma preferido de tu navegador es el español. ¿Quieres cambiar de idioma?

你的瀏覽器首選語言是繁體中文,切換嗎?

你的浏览器首选语言是简体中文,切换吗?

Spritix
  • 功能
  • 价格
  • 博客
登录注册
Spritix
Spritix 导出格式指南:Sprite Sheet、GIF、Atlas JSON 与 PNG Frames
发布于: 2026/08/07

Spritix 导出格式指南:Sprite Sheet、GIF、Atlas JSON 与 PNG Frames

逐项介绍 Spritix 的四种导出文件,说明帧顺序和播放时长保存在哪里,并给出游戏项目中的选用建议。

同一个动作可以下载四种文件。Sprite Sheet PNG 把所有帧排在一张图里,GIF 用来预览,Atlas JSON 记录每帧的位置和播放时长,PNG Frames ZIP 则保留独立帧。选哪一种,取决于你是要在游戏里播放、逐帧编辑,还是只发给别人预览。

Spritix 导出页,展示 Sprite Sheet、GIF、Atlas JSON 与 Frames ZIP 下载

四种格式快速对照

导出文件里有什么单靠它看不出什么常见用途
Sprite Sheet PNG一张静态 RGBA 图像,所有采样帧排在方形网格中动作名称、播放顺序和每帧时长使用单张纹理的游戏运行时
动画 GIF多张图像、帧延迟和透明索引PNG 完整的半透明边缘和 Atlas 帧坐标分享和快速预览
Atlas JSON有序文件名、x/y/w/h 矩形、每帧 durationMs、动作、图像名、尺寸和有效 fps像素数据告诉程序如何切分和播放 Sprite Sheet
PNG Frames ZIP按顺序命名的 frame_000.png,每帧一张已处理图像每帧时长和引擎专用动画设置逐帧编辑、重新打包和自定义导入

为什么一张 Sprite Sheet 不能单独播放?

W3C PNG 规范定义了一种支持颜色和可选 Alpha 的无损图像格式。在 Spritix Sprite Sheet 中,所有帧只是排在同一张静态 PNG 里。PNG 文件本身不知道 frame_006 应该在 frame_005 之后播放,也不知道每帧应该停留多久。

不要把 Sprite Sheet 和 APNG 混为一谈。PNG 第三版为 APNG 定义了动画控制和帧控制块;Spritix Sprite Sheet 是普通静态 PNG,播放所需的帧位置和时长来自网格设置或配套 Atlas JSON。详见 W3C APNG 结构。

当前可选帧数为 4、16、25、49 和 64,分别构成 2×2、4×4、5×5、7×7 和 8×8 的方形网格。每个导出单元格的宽高相同。

Atlas JSON 记录每帧在哪里、播放多久

当前导出的 Atlas 版本号是 1。每个帧条目都有补零文件名、Sprite Sheet 中的矩形和毫秒时长。meta 里则有动作名、配套图像名、整张纹理的尺寸、单帧尺寸和有效帧率。

{
  "frames": [
    {
      "filename": "frame_000.png",
      "frame": { "x": 0, "y": 0, "w": 256, "h": 256 },
      "durationMs": 40
    },
    {
      "filename": "frame_001.png",
      "frame": { "x": 256, "y": 0, "w": 256, "h": 256 },
      "durationMs": 40
    }
  ],
  "meta": {
    "app": "Spritix",
    "version": 1,
    "action": "walk",
    "image": "character-walk.png",
    "size": { "w": 1280, "h": 1280 },
    "frameWidth": 256,
    "frameHeight": 256,
    "fps": 25
  }
}

上面是 25 帧、256 像素、1× 速度的缩短示例。完整文件会有 25 个帧条目,坐标顺序是从左到右、再从上到下。

Atlas JSON 没有通用的跨引擎格式。PixiJS Spritesheet API展示了 PixiJS 如何读取帧矩形和动画列表,但各家工具要求的 JSON 格式并不相同。精灵图 PNG 可按等大网格直接导入 Godot、Unity、Phaser 与 PixiJS;Atlas JSON 采用上述 Spritix 格式,用代码读取时可能需要一步小转换。

GIF 适合预览,不适合当源文件

GIF89a 可以在一个文件里保存多张图像,并以百分之一秒为单位设置延迟。它的透明只能指定调色板中的一种颜色,没有 PNG 那样的逐像素多级 Alpha;每个活动调色板最多有 256 个条目。详细定义可查看 GIF89a 原始规范。

因此,GIF 适合在浏览器、Issue 或消息中快速看动作,不适合保留 PNG 的原始边缘、颜色和 Alpha。GIF89a 本身也没有标准的循环次数字段;如果某个工具依赖精确的循环次数,最好直接检查导出 GIF 中的应用扩展。

PNG Frames ZIP 适合逐帧编辑

Frames ZIP 包含 frame_000.png、frame_001.png 等文件,顺序与 Sprite Sheet 和 GIF 一致。它适合需要单帧图像的编辑器或导入器。ZIP 里没有 durationMs;如果项目需要准确的播放时长,请把 Atlas JSON 一起保留。

该选哪一种?

  • 游戏里使用一张纹理,并且程序需要知道每帧的位置和时长:选 Sprite Sheet + Atlas JSON。
  • 需要逐帧修图或重新打包,同时不能丢掉帧顺序和播放时长:选 PNG Frames ZIP + Atlas JSON。
  • 只是发给别人看动作:选 GIF,但不要把它当作透明游戏图片的源文件。
  • 请把同一次生成的几种导出放在一起。更改帧数、单元格、裁剪、背景处理、速度或起始帧后,相关文件需要重新导出。

检查画面时打开 PNG;程序读取帧位置和播放时长时,使用 Atlas JSON 或已经验证过的导入设置。

全部文章

作者

avatar for Spritix 团队
Spritix 团队

分类

  • 产品
四种格式快速对照为什么一张 Sprite Sheet 不能单独播放?Atlas JSON 记录每帧在哪里、播放多久GIF 适合预览,不适合当源文件PNG Frames ZIP 适合逐帧编辑该选哪一种?

更多文章

Luna 动画案例:一张角色图生成五个动作
产品

Luna 动画案例:一张角色图生成五个动作

用 Luna 原图和五组实际生成结果,检查角色是否保持一致、循环是否顺畅,并列出这次案例缺失的模型和提示词记录。

avatar for Spritix 团队
Spritix 团队
2026/08/07
从单张角色图到游戏动作:操作流程与常见问题
产品

从单张角色图到游戏动作:操作流程与常见问题

从上传角色图到导出动画的完整操作指南,并列出最常见的输入问题和返工方法。

avatar for Spritix 团队
Spritix 团队
2026/08/07
Spritix

用 AI 精灵图生成器,将一张角色图变成一致、可直接用于游戏的动画资产。

DiscordYouTubeYouTubeEmail
产品
  • 功能
  • 价格
  • 常见问题
资源
  • 博客
公司
  • 关于我们
  • 联系我们
法律
  • Cookie政策
  • 隐私政策
  • 退款政策
  • 服务条款
🇺🇸English🇧🇷Português (Brasil)🇰🇷한국어🇯🇵日本語🇫🇷Français🇩🇪Deutsch🇮🇹Italiano🇪🇸Español🇨🇳繁體中文🇨🇳简体中文
© 2026 Spritix All Rights Reserved.