Createjs应用线性渐变笔画

Question

使用Createjs而不是Kinetics编写Web应用程序。我对createjs SVG感兴趣。无论如何，我不知道我是否在浪费时间转换。我只是试图添加一个笔触到线性渐变按钮。动力学很容易，createjs，并非如此。

我不明白他们为什么包括许多不同的类为同一件事（矩形，graphics.rect，形状）。干得好。我试图锁定电话。

var bttn = new c.Shape(); 
     bttn.graphics.beginLinearGradientFill(["blue", "white"], [.2, .9], 0, 0,0,50).drawRoundRect(100, 10, 80, 35,5).setStrokeStyle(13).beginLinearGradientStroke(["black", "blue"], [.2, .9], 0, 0,0,50); 

但是，当我运行它，我得到的梯度，但没有中风的矩形。查看文档，他们发布属性beginLinearGradientStroke的格式并将其应用于新的矩形，并且该矩形没有填充。这绘制了笔画，但它不附加到原始对象。

bttn.graphics.setStrokeStyle(13).beginLinearGradientStroke(["black", "blue"], [.2, .9], 0, 0,0,50).drawRect(20, 20, 120, 120); 

我在这里错过了什么？

谢谢。

Answer 1

EaselJS使用一个模型来定义您的笔画和填充，然后使用这些样式进行绘制。所以，你只需要调整你的代码来定义笔触绘制矩形前：

var bttn = new c.Shape(); 
     bttn.graphics.beginLinearGradientFill(["blue", "white"], [.2, .9], 0, 0,0,50).setStrokeStyle(13).beginLinearGradientStroke(["black", "blue"], [.2, .9], 0, 0,0,50).drawRoundRect(100, 10, 80, 35,5); 

，并解决您的其他问题，矩形CreateJS为几何长方形 - 这是用于存储数据代表一个矩形类，和方法来操纵矩形，它不会绘制任何东西。