0

我是处理新手。为什么我没有看到绘制的第一个矩阵？我似乎只看到延迟之后的矩阵，而不是之前的矩阵。我的最终目标是观察矩阵如何随时间步长变化。

// Number of columns and rows in the grid 
int[][] myArray = {  {0, 1, 2, 3},
                     {3, 2, 1, 0},
                     {3, 5, 6, 1},
                     {3, 8, 3, 4}  };

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

void draw() {   
  background(204);   
  for (int i = 0; i < 4; i++) {
    for (int j = 0; j < 4; j++) { 
      rect(20+30*j,30+30*i,3,3);
    }   
  }

  delay(2500);
  background(204);

  for (int i = 0; i < 4; i++) {
    for (int j = 0; j < 4; j++) { 
      rect(40+30*j,50+30*i,7,7);
    }   
  }
}
4

1 回答 1

1

您的myArray变量具有误导性，它似乎没有在任何地方使用。基本上你想在值之间进行动画/插值。您的代码在绘图循环中执行此操作：

clear the background
draw 16 squares
wait 2500 ms
clear the background
draw 16 squares

你会在 2500 毫秒后变成小方块，然后就是更大的方块，就是这样。

想要做的事情可以通过多种方式实现，从简单到复杂。幸运的是，Processing 提供了许多方便的功能。

您想将属性（如框的 x 位置）存储在一个变量中，您将随着时间的推移对其进行更新，并使用更新后的值在屏幕上重绘：

int x = 20;
int y = 30;
int w = 3;
int h = 3;

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

void draw() {   
  //update
  if(x <= 40) x++;
  if(y <= 50) y++;
  if(w <= 7) w++;
  if(h <= 7) h++;
  //draw
  background(204);
  for (int i = 0; i < 4 ; i++) {
    for (int j = 0; j < 4; j++) { 
      rect(x+30*j,y+30*i,w,h);
    }   
  }
}

您还可以将您的值映射（）到随时间变化的变量：

int x,y,s;
int xmin = 20,xmax = 40;
int ymin = 30,ymax = 50;
int smin =  3,smax =  7;

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

void draw() {   
  //update
  x = (int)map(mouseX,0,width,xmin,xmax);
  y = (int)map(mouseX,0,width,ymin,ymax);
  s = (int)map(mouseX,0,width,smin,smax);
  //draw
  background(204);
  for (int i = 0; i < 4 ; i++) {
    for (int j = 0; j < 4; j++) { 
      rect(x+30*j,y+30*i,s,s);
    }   
  }
}

或者使用线性插值（已经实现为lerp()）：

int xmin = 20,xmax = 40;
int ymin = 30,ymax = 50;
int smin =  3,smax =  7;

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

void draw() {   
  //update
  float t = (float)mouseX/width;
  //draw
  background(204);
  for (int i = 0; i < 4 ; i++) {
    for (int j = 0; j < 4; j++) { 
      rect(lerp(xmin,xmax,t)+30*j,
           lerp(ymin,ymax,t)+30*i,
           lerp(smin,smax,t)     ,
           lerp(smin,smax,t)     );
    }   
  }
}

您可以根据您喜欢的任何变量更改插值量：

int xmin = 20,xmax = 40;
int ymin = 30,ymax = 50;
int smin =  3,smax =  7;

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

void draw() {   
  //update
  float t = abs(sin(frameCount * .01));
  //draw
  background(204);
  for (int i = 0; i < 4 ; i++) {
    for (int j = 0; j < 4; j++) { 
      rect(lerp(xmin,xmax,t)+30*j,
           lerp(ymin,ymax,t)+30*i,
           lerp(smin,smax,t)     , 
           lerp(smin,smax,t)     );
    }   
  }
}

高温高压

于 2012-08-10T19:58:47.157 回答