Animating Sprites from a Texture Packer Image
I’ve been experimenting with animation and recently ran into a little trouble with spritesheets, TexturePacker, Corona SDK and animation. The problem started when I wanted to animate some sprites from opengameart.org. The download included 89 animation sequences and each animation contained 8 individual character sprites, which looked like:
Instead of including 89 .png files into my project, I used TexturePacker to condense them into one .png file. That made the spritesheet look something like:
I ran into trouble because I was able load an animation sequence as a single image, but I had trouble splitting that sequence into the individual 8 frames required for animation. Here’s what I came up with to solve the issue.
What we’re doing here is loading the spritesheet.lua file, which references the spritesheet.png file. Once we have the spritesheet information, we create an options table associated with one specific animation sequence, which is called amg1 in our example.
We then add width and numFrames variables to the options table so that Corona knows that the animation sequence contains 8 single frames, and each sprite frame is of equal size.
Finally, we generate an imageSheet object by passing in the spritesheet.png file and the options table.
Here we create a sequenceData table to store information on our animation’s name, which frame it should start on, how many frames should run, and how long each frame should run.
We then build the sprite object by passing the imageSheet and sequenceData info. Finally, we run the animation, which results in something like:
You can download the files that I used for this on Github.