Question

我试图为我的游戏创建加载栏。我创建基本的矩形，并根据文件的数量添加到舞台和caluclated大小，所以我得到固定的宽度。一切正常，但是对于每个步骤（帧）它创建另一个矩形，我如何只获得一个对象？

这是我的代码：

功能测试（文件）{

r_width = 500;
r_height = 20;
ratio = r_width / manifest.length;

if (file == 1) {

    new_r_width = 0

    // Draw
    r = new createjs.Shape();
    r_x = (width / 2) - (r_width / 2);
    r_y = (height / 2) - (r_height / 2);

    new_r_width += ratio;

    r.graphics.beginFill("#222").drawRect(r_x, r_y, new_r_width, r_height);
    stage.addChild(r);
} else {

    stage.clear();
    new_r_width += ratio;
    r.graphics.beginFill("#" + file * 100).drawRect(r_x, r_y + file * 20, new_r_width, r_height);
    stage.addChild(r);
}
stage.update();

}

https://space-clicker-c9-zoranf.c9.io/loading/

Answer 1

如果要重绘矩形，则必须先清除图形，然后确保更新阶段。在您的代码中，您似乎正在清除阶段，除非您手动关闭stage.update()，否则updateOnTick会自动处理该阶段。

还有其他一些方法。如果您只使用矩形，则可以设置形状的scaleX。以您想要的大小100％绘制矩形，然后根据进度（0-1）对其进行缩放。

r.scaleX = 0.5; // 50%

支持的新方式（仅在EaselJS的NEXT版本中，比GitHub中的0.7.1更新），您可以保存drawRect命令并进行修改。

var r = new createjs.Shape();
r.graphics.beginFill("red");
var rectCommand = r.graphics.drawRect(0,0,100,10).command; // returns the command

// Later
rectCommand.w = 50; // Modify the width of the rectangle

希望有所帮助！

如何使用createjs逐步将矩形设置为固定宽度？

1 个答案: