how to create sprite animations dynamically

Recommended Posts



I'd like to programmatically create a sprite animation rather than have to create a spritesheet and load it. Is there a way of doing that?


Basically I want to be able to create a bitmap data object and draw to it then have it treated as a set of frames that I could use to play animations from.



Share this post

Link to post
Share on other sites

I just found a way! Thought I would share...  With help from another post related to dynamic image creation I was successful by doing the following:


in the game loader I created a bitmapData object and drew to it using the bitmap context drawing methods then got the bitmap data's canvas and from that did a toDataURL... then did a game.load.spritesheet with the dataURL as if it was an image file.

var dataURL, bmd, ctx, width, height;width = 100;height = 100;bmd = game.add.bitmapData( width * 2, height );ctx = bmd.context;bmd.clear();ctx.fillStyle = "#2E8B57";ctx.fillRect(0,0,width,height);ctx.fillStyle = "#FFFFFF";ctx.fillRect(0,0,width/2,height/2);ctx.fillRect(width/2,height/2,width/2,height/2);ctx.fillStyle = "#2E8B57";ctx.fillRect(width,0,width,height);ctx.fillStyle = "#FFFFFF";ctx.fillRect(width+width/2,0,width/2,height/2);ctx.fillRect(width,height/2,width/2,height/2);dataURL = bmd.canvas.toDataURL();game.load.spritesheet('myDynamicSpritesheet', dataURL, width, height);

The above creates a spritesheet of 2 frames dynamically... of a box composed of smaller green and white boxes.

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.