Sprite Sheet and animator for Cocos Creator

GitHub:

Preview:
http://yiyizu.com/spritesheet/

Recently some developers asked how to use Sprite Sheet in Cocos Creater, since Cocos has not supported sprite sheet yet, so they have to use texturepacker to repack it into spriteatlas file.

In this demo, it will demonstrate how to use sprite sheet and animator for sprite sheet in Cocos.

anm1

By reading Cocos Sprite Component’s source code, it is found out that Cocos uses assembler to updateUVs of the spriteframe, which is same as Cocos 2.4.

And the spriteframe’s uv is created with its rect, so to use sprite sheet , it only needs to recalculate the UV when it has to change the frame.

For the solution, firstly it needs the Tiles X&Y numbers, which is collected which Cocos’s property panel, and it is also supported witch Json files.

Then it will caculate the rect’s width and height with the texture’s size divided by X&Y Tiles number.

At last it uses schedule to update the animation, with the frame time from the property config. (Schedule can set interval time more accurately, and it is also easy to stop and resume)

image

This solution has not been completed yet, it does not support sprite atlas / auto-atlas at the moment.

Please disable package in spritesheet config.

Please give me some stars if u like it ^ ^.

Pixel Arts Used

6 Likes

Well done. :rofl: :rofl: :rofl:

Amazing!!! Mark!