flash cc createjs hittest可以正常运行 [英] flash cc createjs hittest works without hit

问题描述

一旦圆碰到rect，rect应该为alpha = 0.1。但是如果声明不起作用。变成0.1透明度，而不会命中

the rect should be alpha=0.1 once the circle touches the rect . but if statement not working . it becomes 0.1 opacity without hitting

/* js

var circle = new lib.mycircle();
stage.addChild(circle);

var rect = new lib.myrect();
stage.addChild(rect);
rect.x=200;
rect.y=300;

circle.addEventListener('mousedown', downF);
function downF(e) {
stage.addEventListener('stagemousemove', moveF);
stage.addEventListener('stagemouseup', upF);
};
function upF(e) {

stage.removeAllEventListeners();
}
function moveF(e) {
circle.x = stage.mouseX;
circle.y = stage.mouseY;
}

if(circle.hitTest(rect))
{
  rect.alpha = 0.1;

}
stage.update();
*/

推荐答案

使用方式hitTest不正确。 hitTest 方法不检查对象间的关系。它使用x和y坐标，并确定其自身坐标系中的点 是否具有填充像素。

The way you have used hitTest is incorrect. The hitTest method does not check object to object. It takes an x and y coordinate, and determines if that point in its own coordinate system has a filled pixel.

我将示例修改为使其更正确，尽管它实际上并没有达到您的期望：

I modified your example to make it more correct, though it doesn't actually do what you are expecting:

circle.addEventListener('pressmove', moveF);
function moveF(e) {
    circle.x = stage.mouseX;
    circle.y = stage.mouseY;
    if (rect.hitTest(circle.x, circle.y)) {
        rect.alpha = 0.1;
    } else {
        rect.alpha = 1;
    }
    stage.update();
}

要点：

• 重新引入了压机。


• 将圈子更新移到了hitTest上方 。否则，您要检查的是上次


• 将阶段更新移动到了最后一个位置。这应该是您最后更新的内容。但是请注意，您可以完全删除它，因为HTML文件中的舞台上有一个Ticker侦听器，该监听器会不断更新该舞台。


• 添加了 else 语句，如果hitTest失败，则将alpha改回1。

• Reintroduced the pressmove. It works fine.
• Moved the circle update above the hitTest check. Otherwise you are checking where it was last time
• Moved the stage update to last. It should be the last thing you update. Note however that you can remove it completely, because you have a Ticker listener on the stage in your HTML file, which constantly updates the stage.
• Added the else statement to turn the alpha back to 1 if the hitTest fails.

然后，最重要的一点是我改为将hitTest改为在矩形上。这实际上是说：矩形内提供的x和y位置内是否有填充像素？由于矩形边界为 -49.4，-37.9、99、76 ，因此当圆的坐标在这些范围内时（即当其位于顶部时），将为真画布的左侧。如果将代码替换为我的代码，您会看到这种行为。

Then, the most important point is that I changed the hitTest to be on the rectangle instead. This essentially says: "Is there a filled pixel at the supplied x and y position inside the rectangle?" Since the rectangle bounds are -49.4, -37.9, 99, 76, this will be true when the circle's coordinates are within those ranges - which is just when it is at the top left of the canvas. If you replace your code with mine, you can see this behaviour.

因此，要使其更按需工作，您可以做一些事情。

So, to get it working more like you want, you can do a few things.

1. 转换坐标。使用localToGlobal，或者只是作弊并使用 localToLocal 。这将圆中的 [0,0] 转换为矩形的坐标空间。

1. Transform your coordinates. Use localToGlobal, or just cheat and use localToLocal. This takes [0,0] in the circle, and converts that coordinate to the rectangle's coordinate space.

示例：

var p = rect.localToLocal(0, 0, circle);
if (rect.hitTest(p.x, p.y)) {
    rect.alpha = 0.1;
} else {
    rect.alpha = 1;
}

1. 请勿使用hitTest。使用 getObjectsUnderPoint ，传递圆的x / y坐标，并检查矩形是否在返回的列表中。

1. Don't use hitTest. Use getObjectsUnderPoint, pass the circle's x/y coordinate, and check if the rectangle is in the returned list.

希望有帮助。正如我在上面的评论中提到的那样，您不能进行完全形状的碰撞，而只能进行点碰撞（对象上的单个点）。

Hope that helps. As I mentioned in a comment above, you can not do full shape collision, just point collision (a single point on an object).

这篇关于flash cc createjs hittest可以正常运行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！