EaselJS - 检测碰撞的最佳方法

我正在尝试为我的 easelJS 小应用程序找到一种碰撞检测的好方法。

我刚刚使用 createjs.Shape 创建了 2 个矩形

但是创建一个矩形形状后，API 不让我知道矩形的宽度和高度（我不知道为什么）。

EaselJS Shape 有一个名为“hitTest”的方法，但它只能在您想要测试形状和对象的碰撞时使用。point.

//Here's the code http://jsfiddle.net/ZbZjL/16/.

//Create a stage by getting a reference to the canvas
stage = new createjs.Stage("demoCanvas");
//Create a Shape DisplayObject.
redRect = new createjs.Shape();
redRect.graphics.beginFill("red").drawRect(0, 0, 60, 40);
redRect.regX = 30;
redRect.regY = 20;
redRect.x = 200;
redRect.y = 100;

blueRect = new createjs.Shape();
blueRect.graphics.beginFill("blue").drawRect(0, 0, 60, 40);
blueRect.regX = 30;
blueRect.regY = 20;
blueRect.x = 0;
blueRect.y = 100;
//Add Shape instance to stage display list.
stage.addChild(redRect);
stage.addChild(blueRect);
//Update stage will render next frame
stage.update();

document.addEventListener("mousemove", onMouseMove);
function onMouseMove(event) {
    blueRect.x = event.offsetX;
    stage.update();
}

EaselJS 不让您知道文本和形状的宽度和高度是正确的。 这是 EaselJS 的限制，但您实际上可以自己设置这些属性：

blueRect.setBounds(x,y,width,height);

来自文档： setBounds 允许您手动指定对象的边界，该对象要么无法计算自己的边界（例如形状和文本）以供将来参考，要么因此该对象可以包含在容器边界中。手动设置的边界将始终覆盖计算的边界。

然后您可以通过请求 blueRect.getBounds(); 来请求宽度和高度；

要检查两个矩形之间的碰撞，您可以使用此代码，该代码接受两个矩形，如果它们相交则返回 true （我在 stackoverflow 上的某个地方找到了此代码）

this.checkIntersection = function(rect1,rect2) {
    if ( rect1.x >= rect2.x + rect2.width || rect1.x + rect1.width <= rect2.x || rect1.y >= rect2.y + rect2.height || rect1.y + rect1.height <= rect2.y ) return false;
    return true;
}