Adob​​e Animate CC Canvas鼠标在舞台上的动作是laggy和间歇的

Question

在Adobe Animate CC HTML5 Canvas（createJS）中，我试图做一些非常简单的事情，以便在整个广告阶段触发动画翻转moused over ，并在鼠标离开舞台时触发动画展示。它应该很简单，但事实并非如此。在stage上使用mouseenter和mouseleave是滞后的，只能间歇性地工作。这与mouseover和mouseout一样。

下面是是laggy和间歇性的代码：

stage.addEventListener("mouseenter", fl_MouseOverHandler.bind(this)); 
stage.addEventListener("mouseleave", fl_MouseOutHandler.bind(this)); 

function fl_MouseOverHandler(){ 
    this.btnOverAnim.gotoAndPlay("on"); 
} 

function fl_MouseOutHandler(){ 
    this.btnOverAnim.gotoAndPlay("off"); 
} 

我也上的按钮尝试mouseover和mouseout舞台的整体大小和我有同样的问题。 （也是这样做的，从框架内部完全不起作用，并且广告在框架内被投放）。我把var frequency的方法提高到90看看这是否有助于滞后，但事实并非如此。

这是简单的mouseover/mouseout代码我想：

var frequency = 90; 
stage.enableMouseOver(frequency); 

this.bgCta.addEventListener("mouseover", fl_MouseOverHandler.bind(this)); 
this.bgCta.addEventListener("mouseout", fl_MouseOutHandler.bind(this)); 

在createJS website它说：“你可以监控是否指针在画布上用stage.mouseInBounds和mouseleave/mouseenter事件。”所以我想知道如果使用stage.mouseInBounds会有所帮助（但我无法找到如何使用它的任何地方）。但我其实并不认为这会有所帮助，因为我认为整个问题都是关于createJS不能在鼠标速度够快的情况下读取的。

有谁知道如何解决这个lagginess和间歇性射击？解决办法？为什么createJS不仅仅像纯js一样监视mouse events？

而且mouseenter和mouseleave在createJS阶段不上平板电脑或移动工作，这是一个问题，所以这将是更好的一个按钮，mouseover和mouseout做这个舞台的整体尺寸。我曾尝试使用mouseover和mouseout，并且在按钮边缘和广告横幅边缘之间的按钮周围有3像素的空间，这有所帮助，但它仍在间歇性地发射。

你的想法和想法请。

Answer 1

鼠标悬停检查是昂贵的。画布基本上只是一个位图，所以EaselJS不能在浏览器中使用鼠标事件（您只需在整个画布上使用鼠标事件）。相反，在EaselJS中的mouseover需要将每个元素绘制到1x1像素的画布上，然后检查填充。这样可以实现像素完美的检测，但是如果您要检查大量内容或检查频繁，则成本很高。

减少您的频率： 看起来你已经设置了frequency至90。这是非常高（检查之间的11毫秒，这基本上是努力实现90 fps）的速度。默认值是10，比一个好的帧速率慢，但速度足够快以感受响应。你可以把它降到20左右，以便在不必要的高昂的情况下给你一张好看的支票。

修改交互性：你可以做的另一件事是过滤出确切的检查。默认情况下，所有的显示对象得到遏制 - 但你可以在任何你不关心（从检查忽略它们）打开关闭mouseEnabled，并要处理的容器打开关闭mouseChildren减少这种作为一个单独的对象（所以像复杂的按钮一样被绘制一次，而不是单独绘制所有的内容）。

// Example 
myBackground.mouseEnabled = false; 
myButton.mouseChildren = false; 

希望有所帮助！