使用 Processing 逐行绘制嵌套的 For-Loop答案

【问题标题】：Drawing nested For-Loop line by line with Processing使用 Processing 逐行绘制嵌套的 For-Loop
【发布时间】：2021-08-17 06:52:10
【问题描述】：

我有一个关于使用处理的嵌套 For-Loop 动画的问题。假设我有一个形状网格……我想在一段时间内使用 frameCount 逐行绘制它们。用文字表示：第一行 X 轴，第二行 X 轴……等等……我想我可以通过使用正弦波并让它通过带有 waveOffset 的网格运行来实现这一点。但是数学让我很头疼……这是我到目前为止的想法：

void setup() {
size(600, 600);
}

void draw () {
  background(255);
  float tiles = 30;
  float tileSize = width/tiles;
  for (int x = 0; x < tiles; x++) {
    for (int y = 0; y < tiles; y++) {
      float waveOffset = map(y, 0, 600, 60, 0);      
      float sin = sin((frameCount*0.05 + waveOffset));
      float wave = map(sin, -1, 1, 0, tileSize);
      fill(0);
      noStroke();
      pushMatrix();
      translate(tileSize/2, tileSize/2);
      ellipse(x*tileSize, y*tileSize, wave, wave);
      popMatrix();
    }
  }
}

我如何将偏移量写成大腿，以便它通过第一行 X 轴，然后跳转到第二行，通过 X 轴等等……绘制整个网格后，它开始新的……

有没有比使用波函数更好的方法？感谢您的任何帮助！

一切顺利！

【问题讨论】：

标签： loops nested processing nested-loops

【解决方案1】：

我真的不知道“穿过第 n 行 x 轴”是什么意思，但一种想法是像这样制作外部 for 循环：

for (int x = 0; x < frameCount % tiles; x++) {

所以每一帧都会额外绘制一列形状。

【讨论】：

【解决方案2】：

完美！谢谢JSTL！我做了一些细微的改变——但这就是我努力实现的目标！

    void draw () {
  background(255);
  float tiles = 100;
  float tileSize = width/tiles;
for (int x = 0; x < tiles; x++) {
    for (int y = 0; y < frameCount*100/tiles % tiles; y++) {
      fill(0);
      noStroke();
      pushMatrix();
      translate(tileSize/2, tileSize/2);
      ellipse(x*tileSize, y*tileSize, tileSize, tileSize);
      popMatrix();
    }
  }
}

【讨论】：