chotwo week02

 Week02 模擬地震晃動、公主下樓梯

    Step01-0

▼ 到中央氣象署網站，可以找到地震資料

將擷取的資料宣告成陣列

    Step01-1: week02_1_earthquake_hle_hln_hlz

▼畫方框模擬地震的房子(1秒10幀)

▼房子座標(200,200)大小(100,100)

▼ 房子X位移

▼ 房子Y位移

float[]HLE = {-1042, -3479.7, 1003.7, -1669, -1639.6, -14219, -3655.1, -4917, 9363.2, -4271.8, -24, 681};
float[]HLN = {-17090, -13711, -22888, -19631, -23818, -18573, -19636, -15648, -18256, -15721, -17776, -15581};
int N = 12;
void setup(){
  size(500,500);
  frameRate(10); // 1秒10幀
}
void draw(){
  background(#FFFFF2);
  float dx = HLE[frameCount%N]/100; //幀數1-->HLE[0]
  float dy = HLN[frameCount%N]/100;
  rect(200+dx,300+dy, 100,100);
}

 

    Step01-2: week02_2_PImage_loadImage_chair

▼ PImage讀入圖檔(要先丟進專案)

PImage img = loadImage("chair.jpg");
size(300,300);
image(img, 0,0, 300, 300); //大小改300*300

 

    Step01-3: week02_3_void_setup_void_draw_image_mouseX_mouseY

▼ 在外面宣告img，圖片座標跟著滑鼠移動

因為沒有清背景所以會有殘影

PImage img; //變數要在外面宣告 
void setup(){
  img = loadImage("chair.jpg");
  size(600,600);
}
void draw(){
  image(img, mouseX,mouseY, 300, 300);
}

    Step01-4: week02_4_imageMode_mousePressed_CENTER

▼讀入一張底圖和一張去背公主，圖片置中顯示

滑鼠按下時，底圖跟著滑鼠走；滑鼠放開，秀公主在視窗中央

PImage img, imgBox;
void setup(){
  img = loadImage("cinderella.png");
  imgBox = loadImage("box.png");
  size(1000,1000);
}
void draw(){
  imageMode(CENTER);
  if(mousePressed){
    image(imgBox, mouseX,mouseY);
  }
  else{
    image(img, 500,500);
  }
}