矩形碰撞检测

Question

我试着做了一个带有碰撞检测的小"game"。

问题是，在某些情况下，对象只是通过。我对原因完全视而不见。

我尝试创建自己的检测，它已被注释掉，然后我尝试了这个：

function rectanglesIntersect( minAx, minAy, maxAx, maxAy, minBx, minBy, maxBx, maxBy ) {
    var aLeftOfB = maxAx < minBx;
    var aRightOfB = minAx > maxBx;
    var aAboveB = minAy > maxBy;
    var aBelowB = maxAy < minBy;

    return !( aLeftOfB || aRightOfB || aAboveB || aBelowB );
}

Answer 1

幸运的是，你的直肠在移动时具有这些简化的特性：

它们只在 Y 方向（向上或向下）移动。
它们都以每次移动 30px 的速度移动。

所以你可以像这样确定一个矩形对是否和在哪里碰撞：

在移动的开始，通过测试矩形对是否垂直对齐来计算它们是否可能发生碰撞。
```
rect1.x > rect2.x && rect1.x < rect2.x + rect2.width;
```
如果这对矩形正向彼此移动，则计算这对矩形是否在 60 个垂直像素内。 60 很重要，因为每个矩形每次移动可以移动 30 个像素，因此矩形对可以每次移动 30+30=60px 相互靠近。
```
var willCollideThisMove = Math.abs(rect1.y-rect2.y)<=60;
```
如果这对将发生碰撞，那么这对将在距离差的中点发生碰撞：
```
var collisionY = Math.min(rect1.y,rect2.y)+Math.abs(rect1.y-rect2.y)/2;
```

对所有矩形对进行这 3 次计算。

矩形碰撞检测

Collision detection with rectangles

javascript

canvas

collision-detection