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

您在的正确轨道上frameCount % 20。（或者，您可以使用millis（））

主要问题是颜色选择与矩形图紧密相关。用简单的英语来说，当前您只能选择随机颜色并同时进行渲染，而不能单独选择颜色并进行渲染（例如，在不同时间）

一种选择是使用数组存储每个矩形的颜色，您可以使用两次：

1. 将值写入：选择随机颜色
2. 读取以下值：渲染矩形时

这是草图的修改后的版本，它说明了上面的想法：

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);
    }
  }
 }

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

1. 更改float size = 20;为int size = 20;假设您希望网格单元降落在整个像素上。这样就无需进行铸造（例如，宽度/（int）尺寸）
2. 缓存/存储经常重复使用的数据（例如网格行和列）
3. 封装将颜色随机化和将矩形渲染为独立函数的循环。甚至像不返回任何值且不接受任何参数的函数之类的简单操作（例如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();
  
 }