Question

我在Javascript中创建了一个小游戏，我创建了一个碰撞检测功能，可以检测我的2个图像何时发生碰撞。我有一个玩家形象和敌人形象，我用箭头键移动玩家。当我与敌人的图像碰撞时，我希望玩家不能越过图像，但仍能够移动，就像与墙壁碰撞一样。我真的不知道该怎么做，所以我不能提供和示例代码，但我可以给你我的碰撞功能和玩家对象;

//玩家对象

var playerImg = new Image();
playerImg.src = "../Images/player.png";
var playerReady = false;
playerImg.onload = function(){
        playerReady = true;
};
var player = {
        x: 300,
        y: 150,
        speed: 200
};

// COLLIDE FUNCTION

function CollisionCheck(Img1, Img2, Obj1, Obj2, width){
    var colliding = false;

    if(Obj1.x < Obj2.x + width && Obj1.x + width > Obj2.x && Obj1.y < Obj2.y + width && Obj1.y + width > Obj2.y){
        colliding = true;
    }else{
        colliding = false;
    }

    return colliding;
}

也许我能够发现碰撞的哪一侧并且在碰撞时阻止玩家朝向图像移动？

我用以下函数调用该函数：

if(CollisionCheck(player, enemy, 32)){

}

Answer 1

function checkTouching(img1, img2)
{
    // checks if the two images are touching at any coordinate
    // given two objects with x, y, width, and height
    var touching =
        img1.x + img1.width >= img2.x
        && img1.x <= img1.x + img1.width
        && img1.height + img1.y >= img2.y
        && img2.y <= img2.y + img2.y;

    if (touching)
    {
        // images are touching
    }
    else
    {
        // images aren't touching
    }
}

在碰撞时停止运动

1 个答案: