I created this app to work with areas/regions of an atlas image to create sprite. This app can let you visualize a sprite sheet by creating frames of desired areas of image. It can export the frames in % size, % position of image. Means resizing image doesn't affect the frame information. However editing positions of framed areas can corrupt the information.
The package contains a default Sprite sheet i created using my SpriteEditor app.
Tutorial:
1. Open the app by executing "bat" file on Windows, or SH (shell script) file on Linux.
2. Now Open your desired png image with sprites.
3. Select Frame 0, using the Rectangular blinking selection choose your frame area.
4. Create frame 2, do the same.
5. Adjust the animation time by setting value in Delta (ms) field.
The rectangular marker has 2 blinking circles, Left circle moves frame, right circle resizes frame.
You can export the frame information in a text file. This file is specific to the image you opened.
Try the inbuilt animation by executing the app and then opening the
walk.conf file from res directory.
Download link:
SpriteFrameDesigner.7zSoftware requirements:
1. Linux / BSDs / Windows
2. JRE - java runtime Environment. JDK 5 is used for development.
Example output of frame information in
walk.conf present in
res directory:
/* start */
kull_frames = 4; /* Total frames in walk animation */
Frame_1 = [array] 0.0 0.0 26.171875 93.75 0.0 0.0 100;
Frame_# ...Frame_4 = [array] 71.09375 0.0 28.125 97.65625 -2.734375 0.0 100;/* Finish */Frame_# = [array] X% Y% Width% Height% HotSpotX% HotSpotY% Delta_Milliseconds;X% = X% of image width. Same for Y%.
Width% = Frame width in % of image width.
Height% = Frame height in % of image height.
HotSpotX,Y = Game Engine dependent thing, ignorable.
Delta = Delta draw time of this frame in milliseconds.
calculated frame pixel positions by example:
Let Image size = 200x100
And Frame_1 is X = 50%, Y = 20%, W = 100%, H = 50%.
X = 100, Y = 20, W = 200, H = 50.
Search tags:
Sprite sheet visualizer, sprite sheet area exporter,