圆与矩形的碰撞检测

Question

我正在编写一个游戏，涉及碰撞的一个移动的圆，由用户控制，和一个移动的矩形，由计算机控制。

完整的代码可以在这里找到：游戏

我在圆和矩形之间的碰撞检测方面遇到了麻烦。当矩形是静态的，碰撞检测工作完美。当圆和矩形的边缘在任一边接触时，程序就会按照它应该的方式进行操作。

这是碰撞检测功能。

function collisionDetection(player,rect) {
  var distX = Math.abs(player.x - player.dx - rect.x - rect.w/2);
  var distY = Math.abs(player.y - rect.y - rect.h/2);

  if (distX >= (rect.w / 2 + player.r - player.dx)) {
    return false;
  }
  if (distY > (rect.h / 2 + player.r)) {
    return false;
  }

  if (distX <= rect.w/2) {
    return true;
  }
  if (distY <= rect.h/2) {
    return true;
  }
}

if(collisionDetection(player,rect)) {
  alert("You Lose");
  document.location.reload();
}

谢谢。

Answer 1

你的碰撞功能出了点小故障。

下面是检测矩形与圆形冲突的工作代码：

function collisionDetection(player,rect){
    var distX = Math.abs(circle.x - rect.x - rect.w/2);
    var distY = Math.abs(circle.y - rect.y - rect.h/2);

    if (distX > (rect.w/2 + circle.r)) { return false; }
    if (distY > (rect.h/2 + circle.r)) { return false; }

    if (distX <= (rect.w/2)) { return true; } 
    if (distY <= (rect.h/2)) { return true; }

    // also test for corner collisions
    var dx=distX-rect.w/2;
    var dy=distY-rect.h/2;
    return (dx*dx+dy*dy<=(circle.r*circle.r));
}