哈瞜你好嗎 衷心感謝 week03

WEEK03

Step01

打開processing

點、線、面的程式

//File-Preferencegk設中文,大字形
//1. 點、線、面
void setup(){
  size(500,500);
}
float x=250,y=250;
float dx=1,dy=1;
void draw(){
ellipse(x,y,5,5);
x+=dx;
y+=dy;
}

點一直往右下位移

一個點在畫面亂彈的程式碼

//File-Preferencegk設中文,大字形
//1. 點、線、面
void setup(){
  size(500,500);
  dx=random(-1,+1);
  dy=random(-1,+1);
}
float x=250,y=250;
float dx=1,dy=1;
void draw(){
  background(0);
ellipse(x,y,5,5);
x+=dx;
y+=dy;
if(x<0||x>500)dx=-dx;
if(y<0||y>500)dy=-dy;
}

很多點在畫面上亂彈

//File-Preferencegk設中文,大字形
//1. 點、線、面
void setup(){
  size(500,500);
  for(int i=0;i<20;i++){
  x[i]=random(500);
  y[i]=random(500);
  dx[i]=random(-1,+1);
  dy[i]=random(-1,+1);
  }
}
float [] x = new float[20];
float [] y = new float[20];
float [] dx =new float[20];
float [] dy =new float[20];

void draw(){
  background(0);
  for(int i=0;i<20;i++)
  {
ellipse(x[i],y[i],5,5);
x[i]+=dx[i];
y[i]+=dy[i];
if(x[i]<0||x[i]>500)dx[i]=-dx[i];
if(y[i]<0||y[i]>500)dy[i]=-dy[i];
}
}

把那些點用紅線連起來

//File-Preferencegk設中文,大字形
//1. 點、線、面
void setup(){
  size(500,500);
  for(int i=0;i<20;i++){
  x[i]=random(500);
  y[i]=random(500);
  dx[i]=random(-1,+1);
  dy[i]=random(-1,+1);
  }
}
float [] x = new float[20];
float [] y = new float[20];
float [] dx =new float[20];
float [] dy =new float[20];

void draw(){
  background(0);
  for(int i=0;i<20;i++)
  {
ellipse(x[i],y[i],5,5);
for(int k=0;k<20;k++){
  stroke(255,0,0);
  if(dist(x[i],y[i],x[k],y[k])<100)
  line(x[i],y[i],x[k],y[k]);
}
x[i]+=dx[i];
y[i]+=dy[i];
if(x[i]<0||x[i]>500)dx[i]=-dx[i];
if(y[i]<0||y[i]>500)dy[i]=-dy[i];
}
}

Step02

使用更多的點(把點的數量更改為變數)

//File-Preferencegk設中文,大字形
//1. 點、線、面
void setup(){
  size(500,500);
  for(int i=0;i<N;i++){
  x[i]=random(500);
  y[i]=random(500);
  dx[i]=random(-1,+1);
  dy[i]=random(-1,+1);
  }
}
int N=40;
float [] x = new float[N];
float [] y = new float[N];
float [] dx =new float[N];
float [] dy =new float[N];

void draw(){
  background(0);
  for(int i=0;i<N;i++)
  {
ellipse(x[i],y[i],5,5);
for(int k=0;k<N;k++){
  float d = dist(x[i],y[i],x[k],y[k]);
  stroke(2.55*(100-d));
  
  if(d<100)
  line(x[i],y[i],x[k],y[k]);
}
x[i]+=dx[i];
y[i]+=dy[i];
if(x[i]<0||x[i]>500)dx[i]=-dx[i];
if(y[i]<0||y[i]>500)dy[i]=-dy[i];
}
}

讓點彼此有互相吸引

void setup(){
  size(500,500);
  for(int i=0; i<N; i++){
    x[i] = random(500);
    y[i] = random(500);
    dx[i] = random(-1,+1);
    dy[i] = random(-1,+1);//亂數決定往哪裡跑
  }
}
int N = 40;///讓點變多
float [] x = new float[N];
float [] y = new float[N];
float [] dx = new float[N];
float [] dy = new float[N];
void draw(){
  background(0);
  for(int i=0; i<N; i++){
     ellipse( x[i], y[i], 5, 5);
     for(int k=0; k<N; k++){
       float d= dist(x[i],y[i],x[k],y[k]);
       stroke(2.55*(100-d));//stroke色彩//2.55*100最亮//2.55*0最暗
       if(d<100)//dist距離
         line(x[i],y[i], x[k],y[k]);
         dx[i] += (x[k]-x[i])*0.00001;
         dx[i] += (y[k]-y[i])*0.00001;
     }
     x[i] += dx[i];
     y[i] += dy[i];
     if(x[i]<0 || x[i]>500)dx[i] = -dx[i];
     if(y[i]<0 || y[i]>500)dy[i] = -dy[i];
   }
}

Step03

顏色選擇器

把背景變成RGB

void setup(){
   size(500,500);
   colorMode(HSB,360,100,100);
}

void draw(){
  background(frameCount%360,83,95);
}

直接把背景變彩色的

size(400,400);
colorMode(HSB,400);
for(int i=0;i<400;i++){
  for(int j=0;j<400;j++){
    stroke(i,400,400);
    point(i,j);
  }
}

創造出很多圓形的顏色(並且可以用滑鼠按一下改變)

void setup(){
  size(300,300);
  colorMode(HSB,360,100,100);
  chooseColor();
}
void mousePressed(){
chooseColor();
}
float h,s,b;
void chooseColor(){
  h= random(360);
  s= random(50,100);
  b= random(50,100);
}
void draw(){
  background(203,63,65);
  for(int i=0;i<5;i++){
    for(int j=0;j<5;j++){
      fill(h,s,b);
      ellipse(30+j*60,30+i*60,60,60);
    }
  }
}

讓其中一個圓形的顏色跟其他不一樣

void setup(){
  size(300,300);
  colorMode(HSB,360,100,100);
  chooseColor();
}
void mousePressed(){
chooseColor();
}
int I,J;
float h,s,b,dh,ds,db;
void chooseColor(){
  h= random(360);
  s= random(50,100);
  b= random(50,100);
  I= int(random(5));
  J= int(random(5));
  dh =random(-10,-10);
  ds =random(-10,-10);
  db =random(-10,-10);
}
void draw(){
  background(203,63,65);
  for(int i=0;i<5;i++){
    for(int j=0;j<5;j++){
      if(i==I && j==J) fill(h+dh,s-ds,b+db);
      else fill(h,s,b);
      ellipse(30+j*60,30+i*60,60,60);
    }
  }
}

上傳GITHUB