javascript - EaselJS 对移动位图的 hitTest

Question

我正在尝试实现一个有移动对象(位图)的游戏，并且我需要检测碰撞。我使用以下代码使对象移动(变换)并用鼠标悬停检查 hitTest 。

但是，Alpha 不会随着正确的鼠标位置而改变，而是检测 Canvas 的左上角。

rock = new createjs.Bitmap(loader.getResult("rock"));
rock.setTransform(800, 270, 0.5, 0.5);
stage.addChild(rock);
// ..... 

createjs.Ticker.timingMode = createjs.Ticker.RAF;
createjs.Ticker.addEventListener("tick", tick);
// .....

function tick(event) {
    rock.alpha = 0.7;
    if (rock.hitTest(stage.mouseX, stage.mouseY)) {//if hit, change alpha
        rock.alpha = 1;
    }
    var deltaS = event.delta / 1000;
    rock.x = (rock.x - deltaS * groundSpeed);//to gradually shift the rock
    if (rock.x + rock.image.width * rock.scaleX <= 0) {//to re-position the rock
        rock.x = w + Math.random() * 1000;
    }
    stage.update(event);
}

Answer 1

我在阅读this question的答案时找到了答案.

与直接获取 stage.mouseX 或 stage.mouseY 不同，可以使用 globalToLocal 获取正确的位置，如this .

  var p = rock.globalToLocal(stage.mouseX, stage.mouseY);
  if (rock.hitTest(p.x, p.y)) {
      rock.alpha = 1;
  }