Question

我试图沿着画布的y轴和x轴依次绘制几个椭圆。点在随机y位置绘制。

我以前的椭圆沿着x轴顺序绘制随机高度。但是，沿y轴的所有椭圆都是一次绘制的。

 for (int x = 0; x < xStep; x++) {
    int mh = int(map(noise(offset+(x*0.05)), 0, 1, 0, h));


    for (int y = mh; y > mh - 3; y--) {
      ellipse(x*diam, y*diam, diam, diam);
    }
  }
  xStep++;
  if (xStep > w) {
    xStep = 0;
    offset = random(1000);
  }

然后，我继续添加另一个for循环，尝试沿y轴和x轴对椭圆进行排序。因此，在绘制下一列（x轴）之前，在y轴上一个接一个地绘制每个椭圆。然而，使用下面的代码我得到的是y和x轴'绘图'的顺序，但同时在视觉上它看起来不像一行在绘制下一列之前完成。

  //count rows and frames
  if (counter > 7) {
    counter = 0;
    rowCounter++;
  }

for (int j=0; j<7; j++) { //set values to match counter
        if (j == counter){

          for (int x = 0; x < xStep; x++) {
            int mh = int(map(noise(offset+(x*0.05)), 0, 1, 0, h));

            for (int y = mh; y > mh - 3; y--) {
              y=y-j;
              ellipse(x*diam, y*diam, diam, diam);

            }
          }
        }
      }
  xStep++;

  counter++;

  if (rowCounter > 7) {
    rowCounter = 0;
  }

  if (xStep > w) {
    xStep = 0;
    offset = random(1000);
  }

或者，如果我尝试使用xStep的条件，我只会得到一行椭圆。

  //count rows and frames
  if (counter > 7) {
    counter = 0;
    rowCounter++;
  }

  for (int j=0; j<7; j++) { //set values to match counter
    if ((j == counter) && (xStep != lastXstep)) {

      for (int x = 0; x < xStep; x++) {
        int mh = int(map(noise(offset+(x*0.05)), 0, 1, 0, h));

        for (int y = mh; y > mh - 3; y--) {
          y=y-j;
          ellipse(x*diam, y*diam, diam, diam);
          xStep=lastXstep;
        }
      }
    }
  }

  xStep++;

  counter++;

  if (rowCounter > 7) {
    rowCounter = 0;
  }

  if (xStep > w) {
    xStep = 0;
    offset = random(1000);
  }

任何人都可以帮我指出我在for loop构造中出错的方向吗？感谢。

Answer 1

请记住，每次调用draw()函数都会绘制一个帧。处理是双缓冲的，因此直到draw()函数的最后才更新屏幕。这就是为什么你只看到最终结果而不是中间步骤。

如果要渲染中间步骤，则必须将其拆分为多个帧。您可以通过在一组变量中跟踪程序的状态，随时间更改这些变量，并使用这些变量绘制每个帧来实现这一点。

无耻的自我推销：here是一个关于动画处理的教程，它更详细地描述了上述方法。

处理循环序列

1 个答案: