游戏 / 图片

精灵图制作、切割与动画工具

将图片排列成精灵图集或纹理图集,拆分图集中的独立帧并制作动画。无需上传图片,即可保存PNG、JSON哈希元数据、CSS类、ZIP文件或GIF动画。

精灵图制作、切割与动画工具: “制作”模式会将PNG、JPG、WebP图片和解码后的GIF帧合并为网格、按行、按列或紧凑排列的图集。统一大小的单元格会适配最大图片,并支持居中或底部居中对齐、内边距、间距以及可选的二次幂尺寸。 “切割”模式可按网格数量或像素尺寸切片,也可以检测由透明区域或背景色键分隔的图块。保存ZIP前,或将帧发送到“动画”模式前,你可以排除矩形区域、跳过空单元格,并裁剪透明边缘。“动画”模式可以按1–60 FPS播放选定的帧范围,支持循环或往返顺序、像素缩放和可选的洋葱皮效果。它可以保存GIF或横向PNG条带。如果需要先绘制帧,请使用像素画制作工具。 完全在浏览器中本地运行,文件不会上传到服务器。

使用次数
在浏览器中
费用
免费·无需注册
可用性
可直接使用
精灵图集工作台本地处理

完全在浏览器中运行

将帧排列成适用于游戏的图集。

统一单元格会使用最大帧的尺寸,并在每侧增加内边距。间距用于分隔单元格。

添加帧以开始。你也可以在“剪切”中切分图集,然后将帧发送到这里。

你的图片和导出文件会保留在此浏览器中。请在自己的游戏项目中使用已保存的文件。

精灵表与纹理图集

精灵表会将多个动画帧或游戏图片存储在一张图片中。规则网格通过单元格位置描述每一帧。纹理图集可以使用大小不一的矩形,因此需要用坐标描述每张图片。Godot的AtlasTexture文档(https://docs.godotengine.org/en/stable/classes/class_atlastexture.html)说明了如何将图集中的一个区域用作纹理。

底部居中对齐可以让角色的脚在各帧中保持同一基线。紧凑排列会保留每张图片的原始尺寸,并避免旋转。使用2的幂次方设置尺寸时,会在右侧或底部增加未使用的像素;这不会缩放你的作品。PNG会保留完整的alpha透明度,而GIF的颜色更少,且只支持1位透明度。

JSON哈希坐标

JSON哈希导出会将帧名称作为frames下的键。每个条目包含一个带有x、y、w和h的帧矩形、一个sourceSize、一个spriteSourceSize,以及rotated和trimmed标志。坐标从图集左上角开始,以像素计数。meta对象会记录图片文件名和图集总尺寸。Phaser的JSON哈希图集加载器(https://docs.phaser.io/api-documentation/class/loader-loaderplugin#atlasJSONHash)介绍了这种命名帧格式。

导出时应使用原始图片边界,而不是带内边距的单元格边界,并将trimmed和rotated设为false。裁剪功能可以导出单独的选定矩形列表。只有在需要紧凑裁剪时才裁掉透明边缘;如果要保留规则动画单元格及其定位点,请关闭此功能。在项目中使用图集前,请将保存的矩形与游戏引擎的导入器进行比较。

使用方法

  1. 选择“制作”“切割”或“动画”;每种模式都有可收藏的链接。
  2. 添加帧或图集,然后调整布局、切片网格或动画设置。
  3. 预览结果并下载用于游戏项目的文件。

隐私与限制

你的文件会留在浏览器中,不会上传。

相关工具

常见问题

应该使用网格还是紧凑排列的纹理图集?

网格会让每一帧使用相同的单元格尺寸,便于切片或作为常规动画导入。紧凑图集会将不同尺寸的帧分层排列,以节省空间。紧凑排列的帧不会旋转,因此你的游戏引擎需要使用导出的JSON矩形区域或等效的区域设置。

为什么要使用内边距、间距或边缘扩展?

经过滤波的纹理可能会采样相邻像素,从而产生颜色接缝,这称为纹理渗色。内边距会在每个单元格内部留出空间;间距会在单元格之间留出空隙。本工具添加的是透明像素或背景色像素,而不是复制的边缘像素。边缘扩展会将精灵图的边缘颜色延伸到边框中;如果项目需要,尤其是在使用mipmap时,请使用游戏引擎的纹理设置,或使用支持边缘扩展的图集打包工具。

如何将图集导入Godot、Unity或Phaser?

在Godot中,可以将图集的区域用作图集纹理或动画帧。在Unity中,将图片作为多个精灵图处理,然后切割规则网格或定义矩形区域。Phaser可以使用常规精灵图集或JSON哈希图集。请将PNG及其JSON文件放在一起。导入设置会因项目而异:要保持像素画清晰,请选择最近邻过滤;检查透明度和单元格尺寸,并确保帧名称和JSON格式符合项目要求。

GIF的透明度和计时有哪些限制?

GIF最多支持256种调色板颜色,并且只能有一个透明调色板条目,因此像素只能是完全透明或完全不透明。低于50%的Alpha会变为透明,其他Alpha值会变为不透明。你也可以选择哑色来混合平滑边缘。帧延迟会四舍五入到10 ms,且最小值为20 ms,因此无法精确表示60 FPS。导出的GIF会持续循环播放;往返模式会添加返回帧,但不会重复端点帧。

我的文件会离开浏览器吗?

不会。读取图片、排列图集、检测图块和生成导出文件都在你的设备上完成。较大的图集和较长的动画需要更多内存。帧数超过400或单边超过8,192像素时会显示警告。工作限制为:最多导入1,000帧,单边最多16,384像素,每张图片或动画导出最多64 million像素。

免费工具·使用在浏览器中次·无需账户