在IF / ELSE语句中隐藏Javascript“<canvas>”中的“Component”图像

时间:2016-06-21 06:07:49

标签: javascript canvas

嗨,所以我正在为学校的编码主题设计一个 Javascript 游戏并遇到轻微的打嗝。目前的要点是获取密钥并到达终点区域以便在尽可能短的时间内停止计时器...当你触摸钥匙时警报一直弹出,因为IfTouching的声明只是循环,所以我喜欢隐藏密钥,如果它被触摸,我不知道如何这样做?这是重要的代码比特;

function startGame() {
    myGameArea.start();
    cleararray()
    myBackground = new component(650, 375, "img/MAP.png", 0, 0, "image");
    myGamePiece = new component(60, 60, "img/forward.gif", 38, 160, "image");
    myHitBox = new component(275, 20, "img/hitbox.png", 250, 240, "image");
    myHitBox1 = new component(30, 180, "img/hitbox.png", 250, 240, "image");
    myHitBox2 = new component(280, 25, "img/hitbox.png", 0, 115, "image");
    myHitBox3 = new component(30, 140, "img/hitbox.png", 120, 111, "image");
    myHitBox4 = new component(145, 25, "img/hitbox.png", 375, 115, "image");
    myHitBox5 = new component(30, 140, "img/hitbox.png", 375, 0, "image");
    item1 = new component(50,50, "img/key.png", 430,40, "image");
}

项目ID喜欢HIDE是item1 (最后一个),其图片路径为img/key.png

命中检测是这样的:

this.touching = function(otherthing) {
    var myleft = this.x;
    var myright = this.x + (this.width);
    var mytop = this.y;
    var mybottom = this.y + (this.height);
    var otherleft = otherthing.x;
    var otherright = otherthing.x + (otherthing.width);
    var othertop = otherthing.y;
    var otherbottom = otherthing.y + (otherthing.height);
    var touch = true;
    if ((mybottom < othertop) || (mytop > otherbottom) || (myright < otherleft) || (myleft > otherright)) {
        touch = false;
    }
    return touch;

}

然后If语句在这里(这是隐藏功能需要去的地方)

else if (myGamePiece.touching(item1))  {

        alert("You have the KEY!!!! Head to the gate and stop the timer!");
        addTurnToArray(); 
     }

如果你知道怎么做,请帮助&lt; 3

1 个答案:

答案 0 :(得分:1)

您可以为对象添加可见性标记:

function component( /* ... */ ) {
  // ...
  this.visible = true;
}

然后在命中测试中检查可见性:

else if (myGamePiece.touching(item1) && item1.visible)  {
    item1.visible = false;    // hide
    alert("You have the KEY!!!! Head to the gate and stop the timer!");
    addTurnToArray(); 
}

然后在代码渲染帧时使用相同的标志,以排除它。