gamesprites
v1.1.0
Published
make spritesheets for use in games
Downloads
3
Readme
gamesprites
A Node.js script for creating spritesheets for use in games.
Currently it outputs layout/animation data suitable for using with CreateJS, though support for other engines could be added in the future.
Usage
After sprites = require('gamesprites')
, call sprites.compile(dir, outname)
where dir
is a path to a directory of images to be
packed into a spritesheet, and outname
is where to save the output image and data, sans extension.
For example, sprites.compile("resources/sprites", "static/images/spritesheet")
will pack
all of the images in resources/sprites and output static/images/spritesheet.png and static/images/spritesheet.json.
Offsets, Framerates, Animations
The script will pack all valid images in the provided directory into a single texture atlas, and assign names to the animations based on the source images' filenames. If a filename ends with an underscore followed by a number, it'll truncate that and use the number as a cue for ordering within an animation. For example:
idle.png
will generate a single-frame animation called "idle".walk_0.png
,walk_1.png
,walk_2.png
will generate a three-frame animation called "walk".
Other options can be set by adding a suffix to the filename followed by the options. The options are:
- l, c, r: x-offset of the sprite. Left, center, right, respectively.
- t, m, b: y-offset. Top, middle, bottom.
- s: speed of the animation. (currently not implemented)
- p: flag the animation as ping-pong. (currently not implemented)
- d: duplicate this frame.(currently not implemented)
s and p affect the whole animation, but only need to be marked on the first frame of that animation.
For example:
idle__bc.png
will generate a single frame with a registration point at the bottom-center of the sprite.walk_0__s0.5cm.png
,walk_1.png
,walk_2.png
will generate a three-frame animation with a registration point at the center/middle of each frame at half speed.
The frames will just be ordered by the frame number given. That is, x_0.png
, x_3.png
, x_5.png
will generate a three-frame animation in that order; the "missing" frames 1, 2, and 4 won't break anything.