碰撞组件

CocosCreator

直接在属性检查器中添加碰撞组件,碰撞发生后会自动调用回调函数,需要注意的是回调函数必须写在 碰撞组件依附的节点下的脚本中

// 获取碰撞检测系统
var manager = cc.director.getCollisionManager();

// 默认碰撞检测系统是禁用的，如果需要使用则需要以下方法开启碰撞检测系统
manager.enabled = true;

// 默认碰撞检测系统的 debug 绘制是禁用的，如果需要使用则需要以下方法开启 debug 绘制
manager.enabledDebugDraw = true;

// 如果还希望显示碰撞组件的包围盒，那么可以通过以下接口来进行设置
manager.enabledDrawBoundingBox = true;

当碰撞系统检测到有碰撞产生时，将会以回调的方式通知使用者，如果产生碰撞的碰撞组件依附的节点下挂的脚本中有实现以下函数，则会自动调用以下函数，并传入相关的参数。

/**
 * 当碰撞产生的时候调用
 * @param  {Collider} other 产生碰撞的另一个碰撞组件
 * @param  {Collider} self  产生碰撞的自身的碰撞组件
 */
onCollisionEnter: function (other, self) {
    console.log('on collision enter');

    // 碰撞系统会计算出碰撞组件在世界坐标系下的相关的值，并放到 world 这个属性里面
    var world = self.world;

    // 碰撞组件的 aabb 碰撞框
    var aabb = world.aabb;

    // 上一次计算的碰撞组件的 aabb 碰撞框
    var preAabb = world.preAabb;

    // 碰撞框的世界矩阵
    var t = world.transform;

    // 以下属性为圆形碰撞组件特有属性
    var r = world.radius;
    var p = world.position;

    // 以下属性为 矩形 和 多边形 碰撞组件特有属性
    var ps = world.points;
},
/**
 * 当碰撞产生后，碰撞结束前的情况下，每次计算碰撞结果后调用
 * @param  {Collider} other 产生碰撞的另一个碰撞组件
 * @param  {Collider} self  产生碰撞的自身的碰撞组件
 */
onCollisionStay: function (other, self) {
    console.log('on collision stay');
},
/**
 * 当碰撞结束后调用
 * @param  {Collider} other 产生碰撞的另一个碰撞组件
 * @param  {Collider} self  产生碰撞的自身的碰撞组件
 */
onCollisionExit: function (other, self) {
    console.log('on collision exit');
}

可以用碰撞分组管理对组件进行分组管理,如果在分组管理中勾选上自己与自己碰撞是无效的.
在添加完碰撞组件后,需要在Node组件Group属性选择对应的分组.

可以在代码中通过 this.node.group = “” ,对节点设置分组.在特定的情况下改变节点的分组,达到不同的效果

判断物体发生碰撞时的向量

  // 碰撞组件前一帧的碰撞框
  var preAabb = world.preAabb;

  // 碰撞组件的 aabb 碰撞框
  var aabb = world.aabb;

  // 通过计算出两个点之间的差值,判断物体发生碰撞的向量
  var offsetX = aabb.x - preAabb.x
  var offsetY = aabb.y - preAabb.y
  if (offsetX != 0) offsetX = offsetX/Math.abs(offsetX) * 2
  if (offsetY != 0) offsetY = offsetY/Math.abs(offsetY) * 2