Cocos Creator:碰撞检测系统

碰撞系统

Cocos Creator 的碰撞系统,目前支持圆形、矩形以及多边形相互间的碰撞检测。

使用流程

  • 添加碰撞体
    点击添加组件->添加碰撞体->添加需要的碰撞体
  • 碰撞体编辑器中的属性
  1. 矩形碰撞体
    在这里插入图片描述
    Tag:标签。当一个节点上有多个碰撞组件时,在发生碰撞后,可以使用此标签来判断是节点上的哪个碰撞组件被碰撞了。
    offset:组件相对于节点的偏移量。
    size:组件的长宽。
    效果如图,绿色区域表示碰撞体区域,蓝色区域表示节点大小范围
    在这里插入图片描述
  2. 圆形碰撞体
    在这里插入图片描述
    Tag:标签。当一个节点上有多个碰撞组件时,在发生碰撞后,可以使用此标签来判断是节点上的哪个碰撞组件被碰撞了。
    offset:组件相对于节点的偏移量。
    radius:组件的半径。
    在这里插入图片描述
  3. 多边形碰撞体
    在这里插入图片描述
    Tag:标签。当一个节点上有多个碰撞组件时,在发生碰撞后,可以使用此标签来判断是节点上的哪个碰撞组件被碰撞了。
    offset:组件相对于节点的偏移量。
    points :组件的顶点数组。
    在这里插入图片描述
    图中淡蓝色区域表示碰撞体范围
  • 代码中接收碰撞事件
  1. 当碰撞第一次发生时:
onCollisionEnter: function (other, self) {
   console.log('on collision enter');
}
  1. 碰撞发生后,碰撞结束前
/**
 * 当碰撞产生后,碰撞结束前的情况下,每次计算碰撞结果后调用
 * @param  {Collider} other 产生碰撞的另一个碰撞组件
 * @param  {Collider} self  产生碰撞的自身的碰撞组件
 */
onCollisionStay: function (other, self) {
    console.log('on collision stay');
},

  1. 碰撞结束后调用
/**
 * 当碰撞结束后调用
 * @param  {Collider} other 产生碰撞的另一个碰撞组件
 * @param  {Collider} self  产生碰撞的自身的碰撞组件
 */
onCollisionExit: function (other, self) {
    console.log('on collision exit');
}

获取碰撞检测系统

var manager = cc.director.getCollisionManager();

默认碰撞检测系统是禁用的,如果需要使用则需要以下方法开启碰撞检测系统

manager.enabled = true;

默认碰撞检测系统的 debug 绘制是禁用的,如果需要使用则需要以下方法开启 debug 绘制:

manager.enabledDebugDraw = true;

碰撞体分组

分组管理,需要打开 项目设置 面板进行设置,位置为 菜单栏 => 项目 => 项目设置。
在这里插入图片描述
这张表里面的行与列分别列出了 分组列表 里面的项,分组列表 里的修改将会实时映射到这张表里。
你可以在这张表里面配置哪一个分组可以对其他的分组进行碰撞检测,假设 a行 b列 被勾选上,那么表示 a行 上的分组将会与 b列 上的分组进行碰撞检测。

在这里插入图片描述
在Node节点下Group里设置分组

推广一下自己做的简单的小游戏
在这里插入图片描述
在这里插入图片描述
创建了一个小游戏交流群,如果过期或者满了或者有问题交流 可以加我微信 备注“微信小游戏”
在这里插入图片描述
在这里插入图片描述

  • 1
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值