2025年3月6日 星期四

生命之歌 week03

 //week03-01-P3D-translaterotateY-radians-box

void setup(){
  size(400,400,P3D);//open 3D 模式
}
void draw(){
  background(128); //gray background
  translate(mouseX,mouseY);
  rotateY(radians(frameCount));//對y旋轉
  box(200);//大小200的 box 盒子
}
//week03-02-2D-point-line-rect-ellipse
size(400,400);//2d 座標系統
stroke(255,0,0);//red
strokeWeight(8);//筆觸的權重大小
point(200,200);//預設的點,只有1 pixel
line(200,0,400,100);//draw line
rect(50,50,100,100);//rectangle x,y,w,h

fill(255,255,0);//fill yellow
ellipse(300,200,50,80);//橢圓 x,y,w,h
//week03-3-rect-corners
size(400,400);
rect(50,50,100,100);
rect(50,200,100,100,20);//20為弧度
rect(200,50,100,100,10,20,30,40);//10,20,30,40為不同角的弧度

//week03-04-mousePressed-stroke-line
void setup(){
  size(500,500);
}
void draw(){
 // background(255);
  fill(255,0,0);//red
  rect(0,0,50,50);
  fill(255,255,0);//yellow
  rect(0,50,50,50);
  fill(0,255,0);//green
  rect(0,100,50,50);
  fill(0,0,255);//blue
  rect(0,150,50,50);
  if (mousePressed)line(mouseX,mouseY,pmouseX,pmouseY);
}
void mousePressed(){
  if(mouseX<50){
    if(mouseY<50) stroke(255,0,0);
    else if(mouseY<100) stroke(255,255,0);
    else if(mouseY<150) stroke(0,255,0);
    else if(mouseY<200) stroke(0,0,255);
 }
}




因為在點顏色時,框線顏色也跟著變,所以要修改一下

//week03-04b-mousePressed-stroke-line
void setup(){
  size(500,500);
}
void draw(){
 // background(255);
  stroke(0); 
  fill(255,0,0);//red
  rect(0,0,50,50);
  fill(255,255,0);//yellow
  rect(0,50,50,50);
  fill(0,255,0);//green
  rect(0,100,50,50);
  fill(0,0,255);//blue
  rect(0,150,50,50);
  stroke(myStroke);
  if (mousePressed)line(mouseX,mouseY,pmouseX,pmouseY);
}
color myStroke;
void mousePressed(){
  if(mouseX<50){
    if(mouseY<50) myStroke=color(255,0,0);
    else if(mouseY<100) myStroke=color(255,255,0);
    else if(mouseY<150) myStroke=color(0,255,0);
    else if(mouseY<200) myStroke=color(0,0,255);
 }
}


//week03-05-mouse-cat-x-y
void setup(){
  size(400,400);
}
float x,y;//cat location
void draw(){
  background(255);
  ellipse(x,y,40,40);
  ellipse(mouseX,mouseY,40,20);
  x = (x*4+mouseX)/5;
  y = (y*4+mouseY)/5;//計算兩者間的距離,斜率
}//新座標,就座標*14,目標*1


//week03-6-lerp-frameCount
void setup(){
  size(400,400);
}
float startX = 0, startY = 0;
float stopX =400, stopY = 400;
void draw(){
  ellipse(startX,startY,10,10);
  ellipse(stopX,stopY,10,10);
  float midX = lerp(startX, stopX,frameCount/200.0);
  float midY = lerp(startY, stopY,frameCount/200.0);
  //frameCount 是第幾個frame 1hour=60min 1min=60sec 1sec=60frame
  ellipse(midX,midY,10,10);
}


貝茲曲線:3d
//week03-07-bezier-curve
size(400,400);
int x1 =340, x2 = 40, x3 = 360, x4 = 60;
int y1 = 80, y2 = 40, y3 = 360, y4 = 320;
line(x1,y1,x2,y2);
line(x3,y3,x4,y4);
bezier(x1,y1,x2,y2,x3,y3,x4,y4);


//week03-08-bezier-equation
void setup(){
  size(400,400);
}
int x1 =340, x2 = 40, x3 = 360, x4 = 60;
int y1 = 80, y2 = 40, y3 = 360, y4 = 320;
void draw(){
  background(255);
  line(x1,y1,x2,y2);
  line(x3,y3,x4,y4);
  bezier(x1,y1,x2,y2,x3,y3,x4,y4);//貝式曲線
  float t = frameCount / 200.0 % 1;
  float t2 = 1-t;
  float x = x1*t2*t2*t2 + 3*x2*t*t2*t2 + 3*x3*t*t*t2 +x4*t*t*t;
  float y = y1*t2*t2*t2 + 3*y2*t*t2*t2 + 3*y3*t*t*t2 +y4*t*t*t;
  ellipse(x,y,10,10);
}
只改座標
//week03-08b-bezier-equation
void setup(){
  size(400,400);
}
int x1 =120, x2 = 320, x3 = 320, x4 = 120;
int y1 = 80, y2 = 20, y3 = 300, y4 = 300;
void draw(){
  background(255);
  line(x1,y1,x2,y2);
  line(x3,y3,x4,y4);
  bezier(x1,y1,x2,y2,x3,y3,x4,y4);//貝式曲線
  float t = frameCount / 200.0 % 1;
  float t2 = 1-t;
  float x = x1*t2*t2*t2 + 3*x2*t*t2*t2 + 3*x3*t*t*t2 +x4*t*t*t;
  float y = y1*t2*t2*t2 + 3*y2*t*t2*t2 + 3*y3*t*t*t2 +y4*t*t*t;
  ellipse(x,y,10,10);
}





// week03-09-3d-random-random-point
float[] x= new float[1000]; 
float[] y= new float[1000];
void setup(){
  size(400,400,P3D);//open 3D 模式
  for(int i=0; i<1000;i++){
    x[i] = random(400);
    y[i] = random(400);
  }
}
void draw(){
  background(0); //black background
  stroke(255);
  for(int i=0; i<1000; i++){
    point(x[i],y[i]);
  }
}
// week03-10-3d-random-random-point-translate
float[] x= new float[5000]; 
float[] y= new float[5000];
float[] z= new float[5000];
void setup(){
  size(400,400,P3D);//open 3D 模式
  for(int i=0; i<5000;i++){
    x[i] = random(400);
    y[i] = random(400);
    z[i] = random(-400,400);
  }
}
void draw(){
  background(0); //black background
  stroke(255);
  translate(0,0,mouseY);
  for(int i=0; i<5000; i++){
    point(x[i],y[i],z[i]);//現在是3d的點
  }
}


//week03-11-3d-sphere-translate-rotateY
void setup(){
  size(400,400,P3D);
}
void draw(){
  background(128);
  translate(mouseX,mouseY);
  rotateY(radians(frameCount));
  sphere(200);
}
加上打光增加陰影,讓立體感更明顯
//week03-12-3d-sphere-translate-rotateY-light
void setup(){
  size(400,400,P3D);
}
void draw(){
  background(128);
  lights();//打光
  translate(mouseX,mouseY);
  rotateY(radians(frameCount));
  sphere(200);
}

//week03-13-3d-pushMatrix-translate-sphere-popMatrix
void setup(){
  size(600,400,P3D);
}
void draw(){
  background(128);
  lights();//打光
  pushMatrix();//備份矩陣
    translate(300,100);//習慣上,要往右再縮
    sphere(100);
  popMatrix();//還原矩陣
  pushMatrix();
    translate(100,100);
    sphere(100);
  popMatrix();
}




沒有留言:

張貼留言