For循环将无法在Adobe Animate中创建多个矩形CC

Question

我正在使用Adobe Animate CC（以前称为Flash Professional CC），并且正在尝试调整以下代码片段，以便它创建多个矩形。

var shape = new createjs.Shape(new createjs.Graphics().beginFill("#ff0000").drawRect(5,5,100,100)); 
this.addChild(shape); 

我已经调整了这个，并把它放在一个for循环中，我认为它可以在复制对象中工作。下面的代码只创建一个矩形？

for (i = 0; i < 10; i++) { 
    var i = new createjs.Shape(new createjs.Graphics().beginFill("#ff0000").drawRect(5,5,30,30)); 
    this.addChild(i); 

    // Move object so that they don't lie on top of each other 
    this.x += 50; 
} 

Answer 1

您的代码有几个问题。

我假设你正在扩展Container，所以你可以添加孩子。这就是为什么你使用this.addChild()而不是像stage.addChild()这样的东西，对吧？

1. 您将要覆盖迭代变量i当你创建你的形状。我推荐一个不同的名称，如square或child。

2. 您正在增加x的位置this，因此它会将所有方块添加到同一位置，然后将容器移动50px。所有的孩子仍然会彼此重叠。您应该将其更改为child.x。

3. 一旦你这样做了，它仍然不起作用，因为你将每一个形状从0递增到50 - 因此它们将仍然在彼此之上。将其更改为child.x = i * 50之类的内容。

这是一段代码片段。

for (i = 0; i < 10; i++) { 
    var child = new createjs.Shape(new createjs.Graphics().beginFill("#ff0000").drawRect(5,5,30,30)); 
    this.addChild(child); 

    // Move object so that they don't lie on top of each other 
    child.x = i * 50; 
} 

这里是一个快速小提琴：http://jsfiddle.net/lannymcnie/vphj9qL0/

干杯。