矩形与碰撞点关系
一定碰撞,碰撞点在矩形内
const cube2: egret.Shape = new egret.Shape();
cube2.graphics.beginFill(0x000000);
cube2.graphics.drawRect(0, 0, 31, 41);
cube2.graphics.endFill();
this.addChild(cube2);
console.log('方矩形与碰撞点:', cube2.hitTestPoint(30, 40, true)); // true
console.log('包围盒与碰撞点:', cube2.hitTestPoint(30, 40)); // true
一定不碰撞,碰撞点在矩形外
const cube3: egret.Shape = new egret.Shape();
cube3.graphics.beginFill(0x000000);
cube3.graphics.drawRect(0, 0, 29, 39);
cube3.graphics.endFill();
this.addChild(cube3);
console.log('方矩形与碰撞点:', cube3.hitTestPoint(30, 40, true)); // false
console.log('包围盒与碰撞点:', cube3.hitTestPoint(30, 40)); // false
临界点,包围盒碰撞,矩形本身不碰撞
const cube1: egret.Shape = new egret.Shape();
cube1.graphics.beginFill(0x000000);
cube1.graphics.drawRect(0, 0, 300, 400);
cube1.graphics.endFill();
this.addChild(cube1);
console.log('方矩形与碰撞点:', cube1.hitTestPoint(300, 400, true)); // false
console.log('包围盒与碰撞点:', cube1.hitTestPoint(300, 400)); // true
圆与碰撞点关系
一定碰撞,碰撞点在圆内,临界值
- 碰撞点在圆内
const circle3: egret.Shape = new egret.Shape();
circle3.graphics.beginFill(0x000000);
circle3.graphics.drawCircle(0, 0, 51);
circle3.graphics.endFill();
this.addChild(circle3);
console.log('正圆形与碰撞点:', circle3.hitTestPoint(30, 40, true)); // true
console.log('包围盒与碰撞点:', circle3.hitTestPoint(30, 40)); // true
- 临界值
const circle1: egret.Shape = new egret.Shape();
circle1.graphics.beginFill(0x000000);
circle1.graphics.drawCircle(0, 0, 50);
circle1.graphics.endFill();
this.addChild(circle1);
console.log('正圆形与碰撞点:', circle1.hitTestPoint(30, 40, true)); // true
console.log('包围盒与碰撞点:', circle1.hitTestPoint(30, 40)); // true
包围盒碰撞,圆本身与碰撞点不碰撞
const circle2: egret.Shape = new egret.Shape();
circle2.graphics.beginFill(0x000000);
circle2.graphics.drawCircle(0, 0, 49);
circle2.graphics.endFill();
this.addChild(circle2);
console.log('正圆形与碰撞点:', circle2.hitTestPoint(30, 40, true)); // false
console.log('包围盒与碰撞点:', circle2.hitTestPoint(30, 40)); // true
矩形碰撞与圆形碰撞检测区别
矩形碰撞检测,是判断显示对象的包围盒是否与一点相交;
像素碰撞检测,是判断显示对象的图案(非透明区域)是否与一点相交。
注意
- 大量使用像素碰撞检测,会消耗更多的性能