Javascript 只运行一次精灵工作表,createjs
我想知道是否有人可以帮助我制作我正在用createjs库制作的精灵表动画。所以我有一个狐狸的角色,我想在用户打开页面时立即加载它。我得到了运行好,它重放一遍又一遍,但我只希望它运行一次。是否有方法停止动画,或者有一个事件侦听器在动画到达最后一帧时停止动画?任何帮助都将不胜感激。谢谢大家!Javascript 只运行一次精灵工作表,createjs,javascript,createjs,sprite-sheet,Javascript,Createjs,Sprite Sheet,我想知道是否有人可以帮助我制作我正在用createjs库制作的精灵表动画。所以我有一个狐狸的角色,我想在用户打开页面时立即加载它。我得到了运行好,它重放一遍又一遍,但我只希望它运行一次。是否有方法停止动画,或者有一个事件侦听器在动画到达最后一帧时停止动画?任何帮助都将不胜感激。谢谢大家! function projectFox() { createjs.Ticker.addEventListener("tick", stage); createjs.Ticker.setFP
function projectFox() {
createjs.Ticker.addEventListener("tick", stage);
createjs.Ticker.setFPS(8);
foxanimation();
function foxanimation() {
var data = {
"images": ["images/foxes.png"],
"frames": [
[2, 2, 833, 833],
[2507, 837, 833, 833],
[3342, 1672, 833, 833],
[3342, 2507, 833, 833],
[4177, 837, 833, 833],
[5012, 837, 833, 833],
[4177, 1672, 833, 833],
[4177, 2507, 833, 833],
[5012, 1672, 833, 833],
[5012, 2507, 833, 833],
[2, 837, 833, 833],
[2, 1672, 833, 833],
[2, 2507, 833, 833],
[837, 2, 833, 833],
[837, 837, 833, 833],
[837, 1672, 833, 833],
[837, 2507, 833, 833],
[1672, 2, 833, 833],
[1672, 837, 833, 833],
[1672, 1672, 833, 833],
[1672, 2507, 833, 833],
[2507, 2, 833, 833],
[2507, 1672, 833, 833],
[2507, 2507, 833, 833],
[3342, 2, 833, 833],
[4177, 2, 833, 833],
[5012, 2, 833, 833],
[3342, 837, 833, 833]
],
"animations": {
"start":{frames:[0, 1, 2, 3, 4, 5, 5, 5, 5, 5, 6, 1, 0]},
"blink":{frames:[0, 7, 8, 7, 0]},
"sleep":{frames:[0, 9, 10, 11, 12, 0]},
"where":{frames:[0, 13, 14, 15, 16, 17, 18, 13, 0]},
"love":{frames:[0, 19, 20, 21, 22, 23, 24, 23, 22, 0]},
"tail":{frames:[0, 25, 0, 26, 27, 0, 25, 0, 26, 27, 0]}
}
};
var spritesheet = new createjs.SpriteSheet(data);
var intro = new createjs.Sprite(spritesheet,'start');
var introBounds = intro.getBounds();
intro.regX = introBounds.width/2;
intro.regY = introBounds.height/2;
intro.scaleX=0.5;
intro.scaleY=0.5;
intro.x = stageW/2;
intro.y = stageH/2;
intro.cursor = "pointer";
stage.addChild(intro);
stage.update();
}
你可以这样做
太好了,成功了!非常感谢。所以我也想要它,这样当只运行一次后,它就会从舞台上移除……我是否需要写一个if语句s
function projectFox() {
createjs.Ticker.addEventListener("tick", stage);
createjs.Ticker.setFPS(8);
foxanimation();
function foxanimation() {
var data = {
"images": ["images/foxes.png"],
"frames": [
[2, 2, 833, 833],
[2507, 837, 833, 833],
[3342, 1672, 833, 833],
[3342, 2507, 833, 833],
[4177, 837, 833, 833],
[5012, 837, 833, 833],
[4177, 1672, 833, 833],
[4177, 2507, 833, 833],
[5012, 1672, 833, 833],
[5012, 2507, 833, 833],
[2, 837, 833, 833],
[2, 1672, 833, 833],
[2, 2507, 833, 833],
[837, 2, 833, 833],
[837, 837, 833, 833],
[837, 1672, 833, 833],
[837, 2507, 833, 833],
[1672, 2, 833, 833],
[1672, 837, 833, 833],
[1672, 1672, 833, 833],
[1672, 2507, 833, 833],
[2507, 2, 833, 833],
[2507, 1672, 833, 833],
[2507, 2507, 833, 833],
[3342, 2, 833, 833],
[4177, 2, 833, 833],
[5012, 2, 833, 833],
[3342, 837, 833, 833]
],
"animations": {
"start":{
frames:[0, 1, 2, 3, 4, 5, 5, 5, 5, 5, 6, 1, 0],
next: false
},
"blink":{
frames:[0, 7, 8, 7, 0],
next: false
},
"sleep":{
frames:[0, 9, 10, 11, 12, 0],
next: false
},
"where":{
frames:[0, 13, 14, 15, 16, 17, 18, 13, 0],
next: false
},
"love":{
frames:[0, 19, 20, 21, 22, 23, 24, 23, 22, 0],
next: false
},
"tail":{
frames:[0, 25, 0, 26, 27, 0, 25, 0, 26, 27, 0],
next: false
}
}
};
var spritesheet = new createjs.SpriteSheet(data);
var intro = new createjs.Sprite(spritesheet,'start');
var introBounds = intro.getBounds();
intro.regX = introBounds.width/2;
intro.regY = introBounds.height/2;
intro.scaleX=0.5;
intro.scaleY=0.5;
intro.x = stageW/2;
intro.y = stageH/2;
intro.cursor = "pointer";
stage.addChild(intro);
stage.update();
}