next »

[Ethan_Hall]

Hey all,

Hopefully this question isn't too noob. I'm a programmer, not an artist, so I'm not versed in this stuff.

I made a game a while back using XNA and I'm making one now using Allegron 5. When I made my spritesheets for my game (in MS Paint... see, not an artist) the animation frames had to be lined up perfectly on the spritesheet so that when I switched frames in game, everything would look smooth. Is there a way you could have a spritesheet with frames/images that are relatively in line, but aren't spaced in a pixel perfect way? That would save a bit of manual work on my part.

Not sure if I am making any sense here, but hopefully someone knows what I'm getting at.

Thanks everyone!

[retrohelix]

I'm sure there are a few good utils out there that will line them up for you, these look somewhat promising:

http://spritesheetmaker.com/
http://www.codeandweb.com/texturepacker.

[ASnogarD]

You could in theory program your code to adjust the image on the fly, something along the lines of finding the top most pixel , bottom pixel and widest pixels , with a variable to hold a center value for the image...

... or just use a editor with a grid built in that makes alignment a snap, give old GraphicsGale a whirl, it has a free version you can download and try out.
here: http://www.humanbalance.net/gale/us/

[EdgeOfProphecy]

There are tons and tons of utilities that already exist to help make the whole spritesheet process easier for you.  I'd definitely recommend you investigate pre-existing sprite sheet utilities before you set out trying to make your own sheets by hand.  You'll save a lot of time and heartache.

TexturePacker is one, it's pretty widely used on mobile devices.  I think there's a new thing floating around called ShoeBox that seemed pretty cool.

Anyway, yes, it is possible to have sprites not aligned on a grid in a sprite sheet.  TexturePacker supports this natively, and I'm sure many other utilities do the same.  I'll talk about TexturePacker for now, but the method should be pretty similar no matter what you use.

The basic way it works is that you drop individual frames into TexturePacker (or an entire gif, I think, and it can bust out the frames, but I don't recall for sure), and it will lay them out on a spritesheet.  If you have trimming enabled, it will remove excess whitespace from the frames as it places them on the sheet.  Now bear in mind the original frames you import into the sprite sheet must be uniformly sized, otherwise your animation frames will be off.

In addition to the sprite sheet, TexturePacker generates a data file to describe each individual frame on the sheet.  It contains information like the name of the frame, its position, and offset (if you've enabled frame trimming).  Using the offset information, it can reconstruct the original frame with its uniform positioning when your sprite rendering library loads a sprite from the sheet.  This means your animation frames will load as if everything were laid out on a grid, without resorting to doing so.  This also means you can mix and match different sprite sizes within the same sheet.  You can have 64x64 sprite coexisting alongside 128x256 sprites no problem.

tl;dr:  I would not manually lay out my sprite sheets.  That's far too much work.  Find a sprite sheet creation utility that has a good feature set and write (or find, someone may have already written it) some code that will load sprites from the data file it generates.