Canvas 如何减少EaselJS动画中矩形的宽度

我想减少动画中每个刻度的矩形宽度

在init（）方法中，我首先使用以下命令创建矩形：

var graphics = new createjs.Graphics().beginFill("green").drawRect(650, 90, 280, 8);
var shape = new createjs.Shape(graphics);
stage.addChild(shape);

---

如何访问tick（）中矩形的宽度？

简单回答：您不能直接这样做

有两种方法可以做到这一点：

1）通过scaleX和Tween

var tween = createjs.Tween.get(shape).to({scaleX:0.5 }, 1000);

2）通过重新绘制每一帧

用初始宽度保存一个附加变量，然后在每个刻度上从该宽度中减去某个值，并用新宽度重新绘制矩形

---

虽然方法1）可能更简单，但缩放可能会导致边缘模糊，您必须在您的案例中进行测试。

简单回答：您不能直接执行此操作

有两种方法可以做到这一点：

1）通过scaleX和Tween

var tween = createjs.Tween.get(shape).to({scaleX:0.5 }, 1000);

2）通过重新绘制每一帧

用初始宽度保存一个附加变量，然后在每个刻度上从该宽度中减去某个值，并用新宽度重新绘制矩形

---

虽然方法1）可能更简单，但缩放可能会导致边缘模糊，您必须在您的案例中进行测试。

谢谢您的回答！我想确保在进入tween之前知道如何重新绘制每一帧。我试着在勾号中的每一帧重新绘制矩形，这是可行的，但是如何在每个勾号的开始处清除现有的矩形呢？我尝试了stage.removeChild（shape），但没有成功。只需使用

shape.graphics.clear（）

清除现有矩形，然后使用现有形状绘制新矩形：

shape.graphics.beginll（“绿色”）。dr。。。ect

（）对于任何一个在这方面遇到困难的人来说，有一种比完全重画更简单的方法：命令。谢谢你的回答！我想确保在进入tween之前知道如何重新绘制每一帧。我试着在勾号中的每一帧重新绘制矩形，这是可行的，但是如何在每个勾号的开始处清除现有的矩形呢？我尝试了stage.removeChild（shape），但没有成功。只需使用

shape.graphics.clear（）

清除现有矩形，然后使用现有形状绘制新矩形：

shape.graphics.beginll（“绿色”）。dr。。。ect

（）对于任何一个在这方面遇到困难的人来说，有一种比完全重画更简单的方法：命令。