KZNK Week11 轉場

   Week11-1 SEAT

開啟processing，輸入以下程式碼

命名week11_01_random_seat

畫出座位

   Week11-2 ARRAY VALUE  

開啟processing，輸入以下程式碼

void setup(){
  size(600,500);
  for(int i=0;i<4;i++){ 
    for(int j=0;j<6;j++){
      value[i][j]=int(random(40));
    }
  }
}
int [][] value = new int[4][6];
void draw(){
  background(255);
  for(int i=0;i<4;i++){ //y
    for(int j=0;j<6;j++){ //x
      fill(#F5B4B4); rect(j*100,i*100,100,100);
      fill(0); text(value[i][j],j*100+25,i*100+50);
    }
  }
}

命名week11_02_random_array_value

加入random更新座位號碼

  Week11-3  SWAP

開啟processing，輸入以下程式碼

void setup(){
  size(600,500);
  for(int i=0;i<4;i++){ 
    for(int j=0;j<6;j++){
      value[i][j]=i*6 +j +10; //start 10 not same
    } 
  }
  for(int k=0;k<2;k++){
    int i=int(random(4)),j=int(random(6));
    int i2=int(random(4)),j2=int(random(6));
    int temp=value[i][j];
    value[i][j]=value[i2][j2];
    value[i2][j2]=temp;
  }
}
int [][] value = new int[4][6];
void draw(){
  background(255);
  for(int i=0;i<4;i++){ //y
    for(int j=0;j<6;j++){ //x
      fill(#F5B4B4); rect(j*100,i*100,100,100);
      fill(0); text(value[i][j],j*100+25,i*100+50);
    }
  }
}

命名week11_03_random_swap

從10開始不重複數字並且交換兩次位置

  Week11-4  STATES

開啟processing，輸入以下程式碼

int state=0; //0:white 1:red 2:blue
void setup(){
  size(400,400);
}
void draw(){
  if(state==0){ //第0關 白色
    background(255);
  }else if(state==1){ //第1關 紅色
    background(255,0,0);
  }else if(state==2){ //第2關 藍色
    background(0,0,255);
  }
}

命名week11_04_many_states

準備3個狀態來轉場

  Week11-5  MOUSE

開啟processing，輸入以下程式碼

int state=0; //0:white 1:red 2:blue
void setup(){
  size(400,400);
  textSize(50);
}
void draw(){
  if(state==0){ //第0關 白色
    background(255);
    fill(0); text("Click to Start",80,200);
  }else if(state==1){ //第1關 紅色
    background(255,0,0);
  }else if(state==2){ //第2關 藍色
    background(0,0,255);
  }
}
void mousePressed(){
  if(state==0) state=1;
}

命名week11_05_states_mouse

滑鼠按下按鈕進入紅色關卡(state 1)

 

Week11-6  KEYBORD

開啟processing，輸入以下程式碼

int state=0; //0:white 1:red 2:blue
void setup(){
  size(400,400);
  textSize(50);
}
int x=50,y=50;
void draw(){
  if(state==0){ //第0關 白色
    background(255);
    fill(0); text("Click to Start",80,200);
  }else if(state==1){ //第1關 紅色
    background(255,0,0);
    fill(255); rect(300,50,50,50);
    fill(128); rect(x,y,50,50);
  }else if(state==2){ //第2關 藍色
    background(0,0,255);
  }
}
void mousePressed(){
  if(state==0) state=1;
}
void keyPressed(){
  if(state==1 && keyCode==RIGHT){
    x+=10;
    if(x==300) state=2;
  }
}

命名week11_06_states_keybord

當按下鍵盤右鍵灰色方塊往右移動

重合的時候進入藍色關卡(state2)

 Week11-7  TIME

開啟processing，輸入以下程式碼

int state=0; //0:white 1:red 2:blue
void setup(){
  size(400,400);
  textSize(50);
}
int x=50,y=50,t=100;
void draw(){
  if(state==0){ //第0關 白色
    background(255);
    fill(0); text("Click to Start",80,200);
    x=50;
  }else if(state==1){ //第1關 紅色
    background(255,0,0);
    fill(255); rect(300,50,50,50);
    fill(128); rect(x,y,50,50);
    t=100;
  }else if(state==2){ //第2關 藍色(倒數10秒)
    background(0,0,255);
    fill(255,255,0); text("Wait "+t,80,200);
    t--;
    if(t==0) state=0;
  }
}
void mousePressed(){
  if(state==0) state=1;
}
void keyPressed(){
  if(state==1 && keyCode==RIGHT){
    x+=10;
    if(x==300) state=2;
  }
}

命名week11_07_states_mills_t60

進入藍色關卡(state2)後倒數十秒返回白色關卡(state0)

 Week11-8  BASKETBALL SHOOTCURVE1

開啟processing，輸入以下程式碼

PImage imgRack;
void setup(){
  size(600,600);
  imgRack=loadImage("rack.JPG");
}
void draw(){
  background(255);
  image(imgRack,0,0);
  if(mousePressed){
    fill(255); ellipse(posX,posY,20,20);
    line(posX,posY,mouseX,mouseY);
  }
  fill(#FFA652); ellipse(mouseX,mouseY,20,20);
}
float posX=-100,posY=-100;
void mousePressed(){
  posX=mouseX;
  posY=mouseY;
}

命名week11_08_basketball_shoot_curve1

籃球機圖片讀入與投球軌跡

 Week11-9  BASKETBALL SHOOTCURVE2

開啟processing，輸入以下程式碼

PImage imgRack;
void setup(){
  size(600,600);
  imgRack=loadImage("rack.JPG");
}
void draw(){
  background(255);
  image(imgRack,0,0);
  if(flying){
    fill(#FFA652); ellipse(x,y,20,20);
    x += vx;
    y += vy;
    vy+= 0.98;
  }else{
    x=mouseX;
    y=mouseY;
    if(mousePressed){
      fill(255); ellipse(posX,posY,20,20);
      line(posX,posY,x,y);
    }
  }
  fill(#FFA652); ellipse(x,y,20,20);
}
boolean flying=false;
float x,y,vx,vy;
float posX=-100,posY=-100;
void mousePressed(){
  x=posX=mouseX;
  y=posY=mouseY;
  flying=false;
}
void mouseReleased(){
  vx =posX-mouseX;
  vy =posY-mouseY;
  flying=true;
}

命名week11_09_basketball_shoot_curve2

可以把球彈出去 有拋物線軌跡

 Week11-10  BASKETBALL SHOOTCURVE3

開啟processing，輸入以下程式碼

命名week11_09_basketball_shoot_curve2

籃球可以停下來