CODEWITHSUNDEEP
imagemagickanimated-gifgraphicsmagicksprite-sheet
user
user

Reputation: 25738

Convert sprite sheet to gif animation

The frames go in the order left to right, top to bottom, the animations go sequentially, all frames are of the same size.

1234
5612
345

I need a command that would take frame size, coordinates of the first frame and frame count as input and give an animated gif as output. Preferably without generating intermediate files.

I could do this using a programming language, but isn't there a way to do it easier with a command line tool like ImageMagick or GraphicsMagick? It feels to me like it should be a common task, yet I've found only questions about how to convert gif to sprite sheet, not the other way around.

Upvotes: 2

Views: 7189

Answers (2)

GeeMack
GeeMack

Reputation: 5395

If you set variables in your shell for the width and height of an individual sprite, the X and Y offsets for the starting sprite, and the number of sprites to use, an ImageMagick command like this will extract the requested sprites from the sheet and turn them into an animated GIF.

This is in Windows CMD syntax...

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

The variables %WIDE% and %HIGH% are the dimensions of an individual sprite.

The variables %XCOORD% and %YCOORD% are the offsets of the first sprite you need from left and top of the sheet.

The variable %FRAMES% is the total number of sprites to extract.

The command starts by reading the input sheet. It uses the input image dimensions and your provided variables to define some settings for IM to use later. First is the dimensions of the viewport needed to isolate the requested number of sprites. Second, it calculates the offset where the first sprite will be after the sheet has been cropped into single sprites and appended into one horizontal row.

Next it "-crop"s the image into individual sprites and "+append"s them into a single horizontal row.

Then it uses "-distort affine" to slide the whole row of sprites the required distance – "%[slider]" – to the left, some amount out of the viewport if needed, and reduces the viewport to just show the proper number of sprites.

After that it crops that image into individual sprites again, sets a delay for the animation, and writes the output GIF.

For a Windows BAT script you'll need to double the percent signs "%%" on the IM variables and FX expressions, but not the shell variables like %WIDE%.

For a *nix shell or script you'll need to set those variables and access them differently. Also you'll need to replace the continued line carets "^" with backslashes "\".

For ImageMagick version 7 start the command with "magick" instead of "convert".

Before writing the output GIF you'll want to set your required dispose method, the delay, and probably "-loop 0".

Upvotes: 1

emcconville
emcconville

Reputation: 24419

With ImageMagick you would extract each frame sub-image with -crop WxH +adjoin +repage, and then animate the frames together.

For example, given a sprite of 300x289 sub-images like the following...

sprite

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

output

See Animation Basics, and Animation Modifications for other examples.

Upvotes: 4

Related Questions