使用处理的垂直条动画

Question

我基本上是在尝试在屏幕上制作垂直条的动画，它应该是等距的并一直持续到按下某个键等。在 processing.org 动画工具中。 我能够获得一种动画，但是具有硬编码值，并且不得不一次又一次地编写相同的代码来为整个帧/屏幕生成条形动画。我需要使其通用，以便更改屏幕宽度或条的大小不会使我更改整个代码，而只会更改控制参数的变量。下面是我的代码。我已经为三个垂直条编写了代码，但需要为整个屏幕完成..

int a;
int i;
int j;

void setup() {
  size(640, 360);
  a = width/2;
  i = 0;

}

void draw() {
  background(51);

  //need to avoid these repetitions each time for each bar

  rect(a , 0, 25, width);  
  a = a - 1;
  if (a < 0) { 
   a = width; 
  }

  rect(i= a+50, 0, 25, width);  
  i = i - 1;
  if (i < 0) { 
   i = width + a; 
  }


  rect(j = i + 50, 0, 25, width);  
  j = j - 1;
  if (a < 0) { 
   j = width + i; 
  }

}

Answer 1

听起来您正在寻找一个数组。

数组就像一个变量，只是它的索引中可以保存多个值。然后，您可以使用 for 循环 遍历数组并根据数组中的值执行操作。

这是一个使用数组来跟踪行位置的示例：

float[] linePositions = new float[10];
float lineWidth = 25;
float lineSpacing = 25;
float lineSpeed = 1;

void setup() {
  size(640, 360);

  for (int i = 0; i < linePositions.length; i++) {
    linePositions[i] = width/2 + (lineWidth+lineSpacing)*i;
  }
}

void draw() {
  background(51);

  //loop through the lines
  for (int i = 0; i < linePositions.length; i++) {

    //draw the line
    rect(linePositions[i], 0, lineWidth, width); 

    //move the line
    linePositions[i] -= lineSpeed;

    //wrap the line
    if ( linePositions[i] < 0) { 
      linePositions[i] = width;
    }
  }
}

关于数组的更多信息可以在the Processing reference找到。