在 Processing 中来回循环运行

Question

目前我正在尝试在 Processing 草图中获得一个循环“运行来回”。例如，我可以用 mouseY 来做到这一点——但我想自动拥有它：rect(); 应该逐行水平显示……比如 1、1+next、1+next+next 和 15 行之后撤销！ 15、14、13、12、11、10、9…… 有了 frameCount;，我可以让他们运行随心所欲……但还没有回来。所以我读到了布尔语句……并试图用语法来理解它……语法似乎没问题……但我无法真正获得正确的逻辑来使其工作。有人知道如何以正确的方式真正编写它吗？到目前为止，这是我的代码：

int a;
int i;
int step = 60;
void setup() {
  size(1080, 1080);
}
void draw() {
  background(0);
for (a = 0; a < 15; a++) {
for (i = 0; i < 5; i++) {
  fill(255, 255, 255);
  rect(216*i,60*a,216,60);
}
 
  }
}

这会创建模式 – 一次完成 – 我知道 for (a = 0; a < mouseY; a++) 或 for (a = 0; a < frameCount; a++) 可以让它工作，但我想自动让它出现，这需要出现在某个地方 – 但如何？

a+=step;
if ( a > 15 || a < 0 ){
step = -step;
}

感谢您的帮助

Answer 1

如果您不尝试更改递增步骤的方式，而是更改为每个步骤生成的矩形数量，则可能会更容易。为了更清楚地考虑这个代码：

MAX_RECTANGLES = 15;
let frameCount = 0;

while (frameCount < 100) {
  frameCount++;

  step = frameCount % (MAX_RECTANGLES * 2);
  nbRect = MAX_RECTANGLES - Math.abs(MAX_RECTANGLES - step);

  console.log(step, nbRect);
}

frameCount变量和while循环只是重新创建p5js循环，这里有趣的是step和nbRect变量：

MAX_RECTANGLES是全部显示时要显示的矩形个数。在我们的示例中，我们要显示 15 个矩形。
step 将在 0 和 MAX_RECTANGLES * 2 之间变化，在我们的示例中这将在 0 和 30 之间变化。
我们将根据以下规则在 0 和 15 之间改变 nbRect：
- 如果0 <= step <= 15那么0 <= nbRect <= 15
- 如果16 <= step <= 30那么15 >= nbRect >= 0

运行代码可能更容易理解。使用此机制，您可以将不断增加的值 (frameCount) 转换为介于 0 和 15.

之间的值

你可以看看这个p5js codepen，它可以用我刚才描述的方法做你想做的事。

Answer 2

谢谢 statox！所以我把它写进了 Processing 中：

int MAX_RECT = 18;
int step = 60;

void setup() {
  size(1080, 1080);
  frameRate(30);
}
void draw() {
  background(0);
  int step = (frameCount/2 % MAX_RECT) *2;
  int nbRectangles = MAX_RECT - Math.abs(MAX_RECT - step);

  for (int a = 0; a < nbRectangles; a++) {
    for (int i = 0; i < 5; i++) {
      fill(255, 255, 255);
      rect(216 * i, 60 * a, 216, 60);
    }
  }
}

有没有办法不重画第一行矩形？我必须检查 Math.abs();功能——我还不熟悉这个……:-(

在 Processing 中来回循环运行

Letting a loop run back and forth in Processing

processing

for-loop

boolean

在 Processing 中来回循环 运行

Letting a loop run back and forth in Processing

processing

for-loop

boolean

在 Processing 中来回循环运行