Xuan WEEK02

 week02

step01-1 

將左右晃動的資料放進陣列裡 畫一個正方形的房子

void setup()
{
  size(500,500);
}
void draw()
{
  background(#FFFFF2);
  rect(200,200,100,100);//正方形
  
}

draw加入HLE讓正方形做晃動

float [] HLE = {-1042, -3479.7, 1003.7, -1669, -1639.6, -14219, -3655.1, -4917, 9363.2, -4271.8, -24, 681};
int N=12;//HLE陣列中值的數量
void setup()
{
  size(500,500);
}
void draw()
{
  background(#FFFFF2);
  //             從無到有走了幾格 /100把HLE的值做縮小
  float dx = HLE[frameCount%N]/200;//有dx的移動量
  rect(200+dx,200,100,100);//正方形
}

再加上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;//HLE陣列中值的數量
void setup()
{
  size(500,500);
  frameRate(10);//放慢晃動的速度
}
void draw()
{
  background(#FFFFF2);
  //             從無到有走了幾格 /100把HLE的值做縮小
  float dx = HLE[frameCount%N]/100;//有dx的移動量
  float dy = HLN[frameCount%N]/100;//dy的移動量
  rect(200+dx,200+dy,100,100);//正方形
}

step02-1

將圖片秀在成功畫面上
但因為圖片和程式碼是在不同的目錄裡
所以圖片不會秀出來

解決辦法: 把下載的圖片檔 拉進程式碼中

PImage img = loadImage("chair.jpg");
size(300,300);
image(img, 0, 0);//在0,0 的位置把圖片秀出來

圖片可以更改大小

PImage img = loadImage("chair.jpg");
size(300,300);
//         圖片的 寬 , 高
image(img, 0, 0, 300, 300);//在0,0 的位置把圖片秀出來

用ctrl+k 開啟程式碼目錄

剛剛的chair.jpg會放在data資料夾裡面

ctrl+n 開欣的一個程式碼環境
結合第一個和第二個作業 做出互動感覺的椅子

//模仿第一個和第二個作業 作互動
PImage img;//宣告img的變數 要宣告在外面 setup和draw才會讀到
void setup()
{
  size(600,600);
  img = loadImage("chair.jpg");//要記得把圖片拉進來
}
void draw()
{
  image(img, mouseX, mouseY, 300, 300);//改用滑鼠變成互動
}

  
讓仙杜瑞拉走樓梯

PImage img, imgBox;
void setup()
{
  size(600,600);
  img = loadImage("princess.png");//仙杜瑞拉
  imgBox = loadImage("box.png");//雪地
}
void draw()
{
  imageMode(CENTER);
  if (mousePressed)
  {
    image(imgBox,mouseX, mouseY);
  }
  else
  {
    image(img, 300,300, 300,300);
  }
}

上傳到github