如何在另一个对象通过它时显示对象

时间:2016-11-07 20:25:19

标签: javascript createjs tween

我使用createjs和tween创建一个包含5个对象的动画。

第一个物体是一个水平穿过屏幕的汽车,其他4个物体是4个建筑物,每次汽车经过物体时(我最初隐藏),我想一次展示一次。

这是我将位置和alpha设置为0的代码的一部分。

卡车是穿过屏幕块的对象,是我想要在时间显示的建筑物。

truck = new createjs.Shape();
truck = new createjs.Bitmap(loader.getResult("truck"));
truck.x=-truck.image.width;
truck.y=0;
createjs.Tween.get(truck, { loop: true })
    .wait(250)
    .to({ x: w }, 5600, createjs.Ease.getPowInOut(0.5));
block1 = new createjs.Bitmap(loader.getResult("block3"));
block1.x=0;
block1.y=truck.image.height-block1.image.height;
block1.alpha=0.0;
createjs.Tween.get(block1, { override: true })
    .wait(250)
    .to({ alpha: 1 }, 600, createjs.Ease.getPowInOut(0.5));
block2 = new createjs.Bitmap(loader.getResult("block2"));
block2.x=0;
block2.y=truck.image.height-block2.image.height-block1.image.height;
block2.alpha=0.0;
createjs.Tween.get(block2, { override: true })
    .wait(500)
    .to({ alpha: 1 }, 1600, createjs.Ease.getPowInOut(0.5));
block3 = new createjs.Bitmap(loader.getResult("block1"));
block3.x=block1.image.width;
block3.y=truck.image.height-block3.image.height;;
block3.alpha=0.0;
block4 = new createjs.Bitmap(loader.getResult("block4"));
block4.x=block1.image.width+block3.image.width;
block4.y=truck.image.height-block4.image.height;;
block4.alpha=0.0;
block5 = new createjs.Bitmap(loader.getResult("block5"));
block5.x=block1.image.width+block3.image.width+block4.image.width;
block5.y=truck.image.height-block5.image.height;;
block5.alpha=0.0;

1 个答案:

答案 0 :(得分:0)

使用此

var index = truck.parent.getChildIndex(truck);

以获取truck对象的索引。然后,您需要设置要在上面显示的对象的索引,使用:

block.parent.setChildIndex(block, index + 1);

或者,您可以删除然后重新添加对象,以使其位于画布上所有其他对象的上方(最高索引):

var parent = block.parent;
parent.removeChild(block);
parent.addChild(block);