如何在处理中减慢随机颜色生成器的速度？

Question

大家好——我想用 array.I 制作一个带有随机填充颜色的矩形网格图案可以按照我想要的方式完成它——但是随机选择太快了。我试图用 frameRate() 减慢一切； – 但这会减慢整个动画的速度。（例如，如果我想添加其他内容）。然后我尝试用 if(frameCount%20 == 0) {…} 减慢它的速度，但这不会保留绘制的网格 - 只让它在一帧中每隔 XXX 帧出现一次 - 有人知道我如何减慢我们称之为“颜色噪声”的速度吗“？ – 感谢您提供任何帮助！

float size = 20;
color cbw = color(0, 0, 0);      //defines BLACK
color cg = color(0, 255, 0);     //defines GREEN
color cb = color(0, 0, 255);     //defines BLUE
color cw = color(255, 255, 255); //defines WHITE
color[] colors = {             //random selects one of above colors
cbw, cg, cb, cw
}; 

void setup() {
  size(1080, 1080);

}

void draw() {
  background(255);

  for (int x = 0; x < width/size; x++) {
    for (int y = 0; y < height/size; y++) {
      color c1 = (colors[int(random(0, 4))]);  //assigns a random color from above to c1-4
      fill(c1);
      noStroke();
      rect(size*x, size*y, size, size);
    }
  }
  }

Answer 1

您 frameCount % 20 的方向是正确的。（或者你可以 use millis()）

主要问题是颜色 selection 是 tightly coupled 矩形图。用简单的英语来说，目前你只能 select 随机颜色和同时渲染，但不能 select 颜色和独立渲染（例如在不同时间）

一个选项是使用一个数组来存储每个可以使用两次的矩形的颜色：

将值写入：选择随机颜色
从以下位置读取值：渲染矩形时

这是您的草图的修改版本，说明了上述想法：

float size = 20;
color cbw = color(0, 0, 0);      //defines BLACK
color cg = color(0, 255, 0);     //defines GREEN
color cb = color(0, 0, 255);     //defines BLUE
color cw = color(255, 255, 255); //defines WHITE
color[] colors = {             //random selects one of above colors
cbw, cg, cb, cw
}; 
// all colors for each rect
color[][] rectColors;

void setup() {
  size(1080, 1080);
  // allocate invidual rect colours
  rectColors = new color[width/(int)size][height/(int)size];
}

void draw() {
  background(255);
  
  if(frameCount%20 == 0){
    // randomize colours
    int numColors = colors.length;
    for (int x = 0; x < width/size; x++) {
      for (int y = 0; y < height/size; y++) {
        rectColors[x][y] = colors[int(random(0, numColors))];
      }
    }
  }

  for (int x = 0; x < width/size; x++) {
    for (int y = 0; y < height/size; y++) {
      color c1 = rectColors[x][y];  //assigns a random color from above to c1-4
      fill(c1);
      noStroke();
      rect(size*x, size*y, size, size);
    }
  }
 }

就个人而言，我会做一些额外的事情来使其更易于阅读并有可能在其他草图中重复使用：

将 float size = 20; 更改为 int size = 20; 假设您希望网格单元落在整个像素上。这消除了投射的需要 (例如 width/(int)size)
cache/store 经常重复使用的数据（例如网格行和列）
将随机化颜色和渲染矩形的循环封装到单独的函数中。即使像 return 没有值也不带参数的函数一样简单（例如，很像 void setup()）

这可能是这样的：

int size = 20;
color cbw = color(0, 0, 0);      //defines BLACK
color cg = color(0, 255, 0);     //defines GREEN
color cb = color(0, 0, 255);     //defines BLUE
color cw = color(255, 255, 255); //defines WHITE
color[] colors = {             //random selects one of above colors
cbw, cg, cb, cw
}; 
// all colours for each rect
color[][] rectColors;

// grid dimensions
int cols;
int rows;

void setup() {
  size(1080, 1080);
  // compute grid dimensions
  cols = width / size;
  rows = height / size;
  // allocate invidual rect colours
  rectColors = new color[cols][rows];
  // call randomize colours function
  randomizeColors();
}
// declare randomize colours function
void randomizeColors(){
  // read array length, avoding the previosuly hardcoded value (4)
  int numColors = colors.length;
  for (int x = 0; x < cols; x++) {
    for (int y = 0; y < rows; y++) {
      rectColors[x][y] = colors[int(random(0, numColors))];
    }
  }
}

void drawRectangles(){
  for (int x = 0; x < cols; x++) {
    for (int y = 0; y < rows; y++) {
      color c1 = rectColors[x][y];  //read a random color
      fill(c1);
      noStroke();
      rect(size * x, size * y, size, size);
    }
  }
}

void draw() {
  background(255);
  
  if(frameCount % 20 == 0){
    randomizeColors();
  }
  
  drawRectangles();
  
 }

如何在处理中减慢随机颜色生成器的速度？

How to slow down random color generator in Processing?

random

processing

animation

colors