enchant.jsのSpriteでアニメーションしてみる
2014年4月9日
htmlはとりあえず前回用意したものと同じ(index.html)で。
Spriteでアニメーション
enchant();
window.onload = function(){
var game = new Core( 500, 500 );
game.fps = 24;
game.preload(
'/enchant.js-builds-0.8.1/images/chara1.png'
);
game.onload = function() {
var sprite = new Sprite(32,32); // 横幅,高さ
sprite.image = game.assets['/enchant.js-builds-0.8.1/images/chara1.png'];
sprite.frame = [1,2]; // 1コマ目と2コマ目をループ
game.rootScene.addChild(sprite);
};
game.start();
これだとfps=24だと、1秒間に12回の切り替えで、走ってるようにしか見えないので、ちょっと変更。
sprite.frame = [1,1,1,1,2,2,2,2];
これで、1を4回表示、2を4回表示をループするようになりました。
このくらいなら歩いてるように見えるかな?
(これだけならfpsを下げてもいいですけどね・・)