如何使用createjs创建一个透明的按钮 优才学院

Posted 2023-04-04

参考技术A 教程参考Colin Garven提出的实现圆形进度按钮的思路。我们将使用Jake Archibald讲过的SVG素描动画技术来实现圆形进度过程，然后提供一个成功或失败的状态来显示完成后的最终状态。 今天给大家展示如何实现一个漂亮的进度按钮的思路本回答被提问者和网友采纳

createjs相关笔记

参考技术A hitTest

元件.hitTest(x, y)用来检测元件和某个点是否发生碰撞。非常方便的是如果是png透明图，透明部分是不会检测到碰撞的。这个方法的参数x,y是相对坐标（相对于元件中心0，0的位置）。

globalToLocal

这也是一个有用的方法，虽然需求中我没用到。用法是元件.globalToLocal(x, y)，表示将一个全局坐标转化为现对于元件位置的坐标。

localTolocal

好了，这个是最有用的。将一个元件的绝对坐标（相对于画布左上角）转化为相对元件的坐标（相对于元件的中心点x,y）。
用法是 元件1.localTolocal(x, y, 元件2)。返回的是元件1相对于元件2中心点的坐标，参数x,y表示元件1的有效碰撞点，这里只能是一个点去碰一个图形，至于如何解决图形间的边缘碰撞，我目前是在碰撞源上设置多个碰撞点，去做多次检测。待深入研究。