“等一下，我碰！”——常见的2D碰撞检测

一、引言：碰撞检测的重要性

在2D游戏开发中，“碰撞检测”是不可或缺的核心环节。无论是角色与敌人的交锋、子弹击中目标，还是物体间的物理交互，都离不开精准的碰撞判断。一句“等一下，我碰！”不仅是对碰撞瞬间的生动描述，更是开发者对技术细节的严谨把控。本文将系统梳理2D碰撞检测的常见方法、优化策略及实际应用场景，帮助开发者提升游戏体验与性能。

二、基础概念：碰撞检测的原理

1. 碰撞检测的定义

碰撞检测（Collision Detection）是指通过算法判断两个或多个物体在空间中是否发生接触或重叠的过程。在2D游戏中，物体通常以矩形、圆形或多边形表示，碰撞检测的核心是计算这些几何形状之间的关系。

2. 碰撞检测的分类

• 静态碰撞检测：检测物体在某一固定时刻是否发生碰撞，适用于非动态场景。
• 动态碰撞检测：检测物体在运动过程中是否发生碰撞，需考虑时间因素，适用于实时交互场景。
• 离散碰撞检测：按帧检测碰撞，可能漏检高速移动物体的“穿透”问题。
• 连续碰撞检测：通过数学方法预测碰撞发生的时间点，避免漏检，但计算复杂度较高。

三、常见2D碰撞检测方法

1. 矩形碰撞检测（AABB）

原理：轴对齐边界框（Axis-Aligned Bounding Box，AABB）是最简单的碰撞检测方法，通过比较两个矩形的边界坐标判断是否重叠。

代码示例：

function checkAABBCollision(rect1, rect2) {
    return (
        rect1.x < rect2.x + rect2.width &&
        rect1.x + rect1.width > rect2.x &&
        rect1.y < rect2.y + rect2.height &&
        rect1.y + rect1.height > rect2.y
    );
}

适用场景：角色、障碍物等规则形状的快速检测。
优缺点：计算简单，但无法处理旋转或非矩形物体。

2. 圆形碰撞检测

原理：通过比较两个圆形的圆心距离与半径之和判断是否碰撞。

代码示例：

function checkCircleCollision(circle1, circle2) {
    const dx = circle1.x - circle2.x;
    const dy = circle1.y - circle2.y;
    const distance = Math.sqrt(dx * dx + dy * dy);
    return distance < circle1.radius + circle2.radius;
}

适用场景：子弹、粒子等圆形物体的检测。
优缺点：计算高效，但仅适用于圆形物体。

3. 像素级碰撞检测

原理：通过比较两个物体的像素数据判断是否重叠，通常使用遮罩（Mask）或位图（Bitmap）实现。

实现步骤：

1. 为每个物体生成遮罩图像。
2. 检测遮罩图像的重叠像素。

适用场景：不规则形状或需要高精度的检测（如文字碰撞）。
优缺点：精度高，但性能开销大，适合特定场景。

4. 多边形碰撞检测（分离轴定理，SAT）

原理：分离轴定理（Separating Axis Theorem，SAT）通过投影多边形的边到轴上，判断是否存在分离轴来确定是否碰撞。

代码示例：

function checkSATCollision(polygon1, polygon2) {
    const polygons = [polygon1, polygon2];
    for (let i = 0; i < polygons.length; i++) {
        const polygon = polygons[i];
        for (let j = 0; j < polygon.edges.length; j++) {
            const edge = polygon.edges[j];
            const normal = { x: -edge.y, y: edge.x }; // 垂直于边的法线
            const min1 = projectPolygon(polygon1, normal);
            const min2 = projectPolygon(polygon2, normal);
            if (min1.max < min2.min || min2.max < min1.min) {
                return false; // 存在分离轴，无碰撞
            }
        }
    }
    return true; // 无分离轴，发生碰撞
}

适用场景：不规则多边形物体的检测。
优缺点：精度高，但计算复杂，适合复杂形状。

四、优化策略：提升性能与准确性

1. 空间分区技术

• 四叉树（Quadtree）：将2D空间递归划分为四个象限，仅检测相邻区域的物体。
• 网格分区（Grid）：将空间划分为固定大小的网格，每个网格存储其中的物体。

优势：减少不必要的碰撞检测次数，提升性能。

2. 粗检测与细检测结合

• 粗检测：使用AABB或圆形检测快速排除不可能碰撞的物体。
• 细检测：对粗检测通过的物体进行高精度检测（如SAT或像素级检测）。

优势：平衡性能与精度。

3. 动态调整检测频率

• 对高速移动物体增加检测频率，避免“穿透”问题。
• 对静态或低速物体减少检测频率，节省性能。

五、实际应用场景与案例

1. 平台游戏中的角色跳跃

• 使用AABB检测角色与地面的碰撞，实现跳跃与落地逻辑。
• 结合圆形检测处理角色与敌人的攻击判定。

2. 射击游戏中的子弹命中

• 使用圆形检测子弹与敌人的碰撞，简化计算。
• 对复杂敌人模型使用多边形检测提升精度。

3. 物理引擎中的物体堆叠

• 使用SAT检测不规则物体的堆叠状态。
• 结合空间分区技术优化大量物体的检测性能。

六、总结与建议

1. 选择合适的检测方法

根据物体形状、运动速度和精度需求选择检测方法。例如：

• 规则形状优先使用AABB或圆形检测。
• 不规则形状使用SAT或像素级检测。

2. 优化性能是关键

• 使用空间分区技术减少检测次数。
• 结合粗检测与细检测提升效率。

3. 动态调整策略

• 根据游戏场景动态调整检测频率和精度。
• 对高速物体使用连续碰撞检测避免漏检。

4. 实践建议

• 从简单方法入手，逐步引入复杂技术。
• 使用现有物理引擎（如Box2D、Matter.js）加速开发。
• 通过性能分析工具（如Chrome DevTools）优化检测逻辑。

“等一下，我碰！”不仅是碰撞瞬间的趣味描述，更是开发者对技术细节的执着追求。通过系统掌握2D碰撞检测的方法与优化策略，开发者能够打造出更加流畅、真实的游戏体验。