Question

我有一个项目，我需要制作flash电影作为互动游戏。因为，对于大多数浏览器来说，Flash已经（或很快将会）过时，我已经决定这个游戏必须基于HTML5 / JS。因为大部分图形和动画都是在这部Flash电影中完成的（我有它的来源），所以我使用Adobe Flash和CreateJS技术（HTML5 + Canvas + JS）进行开发。到目前为止，我非常喜欢这个解决方案，尽管我有一个我无法解决的问题。游戏是一个简单的拖放匹配游戏。我在问题标题中很快描述了我遇到的问题，我将在这里更详细地解释一下：

label.on('mousedown', function() {
    //this.image.bg.gotoAndStop(2);
});

label.on('pressmove', function(evt) {
        this.x = getStageX(evt.stageX);
        this.y = getStageY(evt.stageY);
        currentStage.setChildIndex(this, currentStage.getNumChildren() - 1);
        stage.update();
});

label.on('pressup', function(evt) {
    console.log('Hi! I'm mouseup event!')
    this.x = labelInitX;
    this.y = labelInitY;
    this.image.bg.gotoAndStop(0);
});

上面，您可以看到我使用的简化的3个事件处理程序。一切正常，直到我取消注释第二行 - //this.image.bg.gotoAndStop(2);。当我这样做时，pressup事件不会主要触发，这很奇怪，因为有时它会触发（10次中的2-3次），所以标签会粘在指针上直到我按下按钮再次。这是一些错误，或者我根本不了解CreateJS及其事件处理程序。我尝试了不同的组合。使用click代替pressup，将this.image.bg.gotoAndStop(2);放在pressmove处理程序中。用pressmove替换stage.on('stagepressmove', handler)处理程序。没有没用。 this.image.bg.gotoAndStop(2); - 这件事只是更新时间范围（更改标签的背景图像）。我可以以编程方式更改此图像（不播放时间帧），我几乎可以肯定问题会得到修复，但我想了解自己这里出了什么问题或者我在做什么错误的事件处理程序。

另一个不那么重要的事情，但知道为什么当pressmove事件正在运行时，CreateJS对象会停止接收有关rollover或mouseover的事件触发器的原因。在DOM中，默认情况下事件冒泡正在运行，直到您使用stopPropagation停止它。它如何与CreateJS一起使用？似乎默认情况下这里只是关闭了冒泡。我怎样才能打开它？

Answer 1

我想我可能会对我的想法有所了解。

正常的鼠标事件＆＃34;点击＆＃34;，＆＃34; mouseup＆＃34;，＆＃34; rollover＆＃34;，＆＃34; rollout＆＃34;等所有功能由舞台确定什么＆＃34;目标＆＃34;默认情况下，鼠标事件的目标是与之交互的最低级别事物。如果在鼠标停止时内容发生变化，则在发生mouseup时它将不会计为相同的目标。由于在不移动鼠标的情况下不会重新检查位置，因此mouseover，mouseout，rollover和rollout事件也可能会出现奇怪的功能。

相反，＆＃34; pressmove＆＃34;和＆＃34;加压＆＃34;一旦按下某些东西，事件就不关心鼠标下的内容。目标将始终是按下的内容，这允许您将鼠标移出对象（甚至删除它），并仍然从中接收事件。即使您在对象外部发布，这也可以确保您收到一个按下事件。

正如@RandyPrad所提到的，hitArea可能会解决您的问题。通过指定命中区域，您将覆盖剪辑的内容，因此您的目标应始终是容器（MovieClip）而不是其内容。这样，无论在影片剪辑中按什么内容，当你发布时它都是同一个目标。您还可以使用mouseChildren属性获得相同的效果。

movieClip.mouseChildren = false;

希望有所帮助！

Answer 2

请检查按钮的命中区域。

我认为你在btn中播放的图像是动画

请使用此链接http://www.createjs.com/tutorials/Mouse%20Interaction/hitArea.html

当mousedown / pressmove

2 个答案: