Game Development Reference
In-Depth Information
Creating the Runner Sprite
The
Runner
sprite will be created first. Start with the template code you've used to start your other custom classes in
this chapter (see Listing 8-17).
Listing 8-17.
Runner Class Declaration
(function () {
window.sprites = window.sprites || {};
var Runner = function (spritesheet) {
this.initialize(spritesheet);
}
var p = Runner.prototype = new createjs.Sprite();
p.Sprite_initialize = p.initialize;
p.initialize = function (spritesheet) {
this.Sprite_initialize(spritesheet, 'idle');
}
window.sprites.Runner = Runner;
}());
Only one property will be needed in this sprite. Create a property named
speed
before the
initialize
function.
p.speed = 0;
Moving back into the initialize function, add a tick listener that will move the sprite's x position.
p.initialize = function (spritesheet) {
this.Sprite_initialize(spritesheet, 'idle');
this.on('tick',function(e){
this.x += this.speed;
if(this.x > stage.canvas.width){
this.x = -this.getBounds().width;
}
});
}
Since speed is set to 0 and the initial animation set to
idle
, the instance of this sprite will simply sit on the
stage with no movement when created. Add the remainder of the methods now, directly following
initialize
, as
shown in Listing 8-18.
