我正在尝试在舞台上绘制动画位图,但似乎无法正常工作。我可以确认动画已添加到控制台中的舞台,但没有显示。
HTML:
<canvas id="canvas" width="300" height="300"></canvas>
JavaScript:
var canvas = document.getElementById('canvas'),
stage = new createjs.Stage(canvas),
chopperImg = document.createElement('img'),
spriteSheet,
animation;
chopperImg.addEventListener('load', function ( e ) {
spriteSheet = new createjs.SpriteSheet({
images: [ chopperImg ],
frames: { width: 64, height: 75, count: 10 },
animations: {
idle: [ 0, 9, 'idle', 4 ]
}
});
animation = new createjs.BitmapAnimation(spriteSheet);
animation.gotoAndPlay('idle');
stage.addChild(animation);
createjs.Ticker.setFPS(30);
createjs.Ticker.addListener(stage);
});
chopperImg.src = 'http://dutchnoobz.nl/chopper.gif';
我做了一个JSFiddle,在这里演示了我的问题:http : //jsfiddle.net/WWpVX/1/
您的GIF高度只有73像素,您的帧尺寸不能超过图像尺寸,我已经更新了您的小提琴,它可以在此处使用:http : //jsfiddle.net/WWpVX/2/
frames: { width: 64, height: 73, count: 10 }
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句