四叉树与碰撞检测 ！Cocos Creator !

四叉树与引擎内置碰撞检测的结合运用。完整项目见文末。

效果预览

绿色为参加检测的对象(当前四叉树节点)，红色为碰撞对象。

如何使用

引入脚本 QuadtreeCollision.ts ， 新建一个 QuadtreeCollision ，并初始化为世界坐标系下的对齐轴向的包围盒（AABB）。

// 这边是挂载在canvas下的脚本，用canvas的rect初始化创建。
this._quadCollision = new QuadtreeCollision(this.node.getBoundingBoxToWorld())

传入待检测的碰撞数组 cc.Collider[] 和测试对象的 cc.Collider。

返回准备测试的 cc.Collider[] 和发生碰撞的 cc.Collider[]。

// check(colliders: cc.Collider[], testCollider: cc.Collider)
const { retrieve, contacts } = this._quadCollision.check(this._all_collider, this.collider_role);
// retrieve 准备测试的对象(预览图中的绿色)   cc.Collider[]
// contacts 碰撞对象(预览图中的红色)   cc.Collider[]

实现原理

四叉树是什么?

白玉无冰是这样理解的，四叉树本身是树结构的一种，如果物体过多的话，先根据物体所处位置划分成四块，如果每个块中的物体数量还是很多的话，继续划分成四块。如下图红线所示。

检测的时候，就是根据待测试对象的位置，去找属于哪个块，再把这个块中的物体告诉你。如下图中的绿色物体。