slide in / slide out
@author
int RECT_NUM = 5;
float RECT_WIDTH = 35;
float RECT_GAP = 80;
int LOOP = 120;
void setup(){
size(500, 500);
rectMode(CENTER);
noStroke();
fill(255);
}
void draw(){
background(150);
translate(width / 2.0, height / 2.0);
float time = calcQuad(map(frameCount % LOOP, 0, LOOP - 1, 0, 1));
for(int x = 0; x < RECT_NUM; x++){
for(int y = 0; y < RECT_NUM; y++){
if(x == 0 && y == 0){
float w = (x - (RECT_NUM - 1) / 2.0) * RECT_GAP;
float h = map(time, 0, 1, -width / 2.0 - RECT_WIDTH / 2.0, (y - (RECT_NUM - 1) / 2.0) * RECT_GAP);
rect(w, h, RECT_WIDTH, RECT_WIDTH);
w = map(time, 0, 1, (x - (RECT_NUM - 1) / 2.0) * RECT_GAP, ((x + 1) - (RECT_NUM - 1) / 2.0) * RECT_GAP);
h = (y - (RECT_NUM - 1) / 2.0) * RECT_GAP;
rect(w, h, RECT_WIDTH, RECT_WIDTH);
} else if(x == RECT_NUM - 1 && y == RECT_NUM - 1){
float w = (x - (RECT_NUM - 1) / 2.0) * RECT_GAP;
float h = map(time, 0, 1, (y - (RECT_NUM - 1) / 2.0) * RECT_GAP, width / 2.0 + RECT_WIDTH / 2.0);
rect(w, h, RECT_WIDTH, RECT_WIDTH);
} else if((x == RECT_NUM - 1 && y % 2 == 0) || (x == 0 && y % 2 == 1)){
float w = (x - (RECT_NUM - 1) / 2.0) * RECT_GAP;
float h = map(time, 0, 1, (y - (RECT_NUM - 1) / 2.0) * RECT_GAP, ((y + 1) - (RECT_NUM - 1) / 2.0) * RECT_GAP);
rect(w, h, RECT_WIDTH, RECT_WIDTH);
} else if(y % 2 == 0){
float w = map(time, 0, 1, (x - (RECT_NUM - 1) / 2.0) * RECT_GAP, ((x + 1) - (RECT_NUM - 1) / 2.0) * RECT_GAP);
float h = (y - (RECT_NUM - 1) / 2.0) * RECT_GAP;
rect(w, h, RECT_WIDTH, RECT_WIDTH);
} else if(y % 2 == 1){
float w = map(time, 0, 1, (x - (RECT_NUM - 1) / 2.0) * RECT_GAP, ((x - 1) - (RECT_NUM - 1) / 2.0) * RECT_GAP);
float h = (y - (RECT_NUM - 1) / 2.0) * RECT_GAP;
rect(w, h, RECT_WIDTH, RECT_WIDTH);
}
}
}
}
float calcQuad(float v){
if(v < 0.5){
return 2.0 * v * v;
} else {
return -2.0 * (v - 1.0) * (v - 1.0) + 1.0;
}
}