将精灵表转换为 gif 动画

Posted 2023-03-25

技术标签:

【中文标题】将精灵表转换为 gif 动画【英文标题】：Convert sprite sheet to gif animation 【发布时间】：2019-09-26 03:27:54 【问题描述】：

帧按从左到右、从上到下的顺序播放，动画按顺序播放，所有帧大小相同。

1234
5612
345

我需要一个命令，它将帧大小、第一帧的坐标和帧数作为输入，并给出一个动画 gif 作为输出。最好不要生成中间文件。

我可以使用编程语言来做到这一点，但有没有办法使用 ImageMagick 或 GraphicsMagick 等命令行工具更轻松地做到这一点？我觉得这应该是一项常见的任务，但我发现的只是关于如何将 gif 转换为精灵表的问题，而不是相反。

【问题讨论】：

【参考方案1】：

使用 ImageMagick，您可以使用 -crop WxH +adjoin +repage 提取每个帧子图像，然后将这些帧一起制作动画。

例如，给定一个由300x289 子图像组成的精灵，如下所示...

convert sprite.png -crop 300x289 +adjoin +repage -adjoin -loop 0 -delay 1 output.gif

有关其他示例，请参阅 Animation Basics 和 Animation Modifications。

【讨论】：

谢谢。但是我有issues with transperency 这个答案，使用-dispose 没有帮助。此外，我仍然不清楚如何指定起始帧位置和帧数以从同一个精灵表中提取多个动画。试试-layers optimize 透明度问题已通过在输入文件前指定-dispose 解决（但-layers optimize 不起作用）。其他问题仍然悬而未决。【参考方案2】：

如果您在 shell 中为单个精灵的宽度和高度、起始精灵的 X 和 Y 偏移量以及要使用的精灵数量设置变量，像这样的 ImageMagick 命令将从工作表并将它们变成动画 GIF。

这是在 Windows CMD 语法中...

set WIDE=100
set HIGH=100

set XCOORD=100
set YCOORD=300

set FRAMES=5

convert spritesheet.png ^
   -set option:distort:viewport %[fx:%FRAMES%*%WIDE%]x%HIGH% ^
   -set option:slider %[fx:%YCOORD%*(w/%WIDE%)+%XCOORD%] ^
   -crop %WIDE%x%HIGH% +append +repage ^
   -distort affine "%[slider],0 0,0" ^
   -crop %WIDE%x%HIGH% +repage ^
   -set delay 50 -loop 0 result.gif

变量 %WIDE% 和 %HIGH% 是单个精灵的尺寸。

变量 %XCOORD% 和 %YCOORD% 是您需要的第一个精灵从页面左侧和顶部的偏移量。

变量 %FRAMES% 是要提取的精灵总数。

该命令从读取输入表开始。它使用输入图像尺寸和您提供的变量来定义 IM 稍后使用的一些设置。首先是隔离请求数量的精灵所需的视口尺寸。其次，它计算第一个精灵将在表被裁剪成单个精灵并附加到一个水平行之后的偏移量。

接下来它将图像“-crop”成单独的精灵，并将它们“+append”成一个水平行。

然后它使用“-distort affine”将整行精灵滑动所需的距离 - “%[slider]” - 向左，如果需要，一些量超出视口，并缩小视口以仅显示适当数量的精灵。

之后，它再次将该图像裁剪为单独的精灵，为动画设置延迟，并写入输出 GIF。

对于 Windows BAT 脚本，您需要在 IM 变量和 FX 表达式上加倍百分号“%%”，而不是像 %WIDE% 这样的 shell 变量。

对于 *nix shell 或脚本，您需要设置这些变量并以不同的方式访问它们。此外，您还需要用反斜杠“\”替换连续的插入符号“^”。

对于 ImageMagick 版本 7，以“magick”而不是“convert”开始命令。

在编写输出 GIF 之前，您需要设置所需的处理方法、延迟，可能还有“-loop 0”。

【讨论】：