范姜紹瑋_Week9_筆記

Bump Mapping凹凸貼圖
1.先到https://www.openprocessing.org/sketch/249457看程式範例

2.接著到moodle下載processing，載完後開啟processing，並將剛剛網站上的程式碼複製過來，在random裡面加入數字255，就可以執行了

--------------------------------------------------------------------------------------------------------------------------
用processing展示下載的圖片
1.先開啟新的文件，並加入以下程式碼(記得還要把要顯示的圖片拉到到程式碼裡)

PImage img=loadImage("CAR.jpg");  ///Processing image load it!

size(600,600); ///600*600的框框

image(img,0,0,600,600); ///在(0,0)的地方show the image img(600*600)

2.以上，就可以顯示囉

--------------------------------------------------------------------------------------------------------------------------
在滑鼠的位置顯示圖片
1.加入以下程式碼

PImage img;

void setup() {

  size(1280, 900);

}

void draw() {

  img=loadImage("CAR.jpg");

  image(img,mouseX,mouseY); ///從滑鼠位置顯示圖片

}

如此一來就會有疊影的效果

--------------------------------------------------------------------------------------------------------------------------
製作簡易馬力歐
1.將mario.png(找transparent的圖)跟brick.png的圖拉進去
PImage imgMario,imgBrick;
void setup() {
  size(800, 600);
  imgMario=loadImage("mario.png");
  imgBrick=loadImage("brick.png");
}
float marioX=200,marioY=300,marioVY=0;
void draw() {
  background(255);
  for(int x=0;x<18;x++) image(imgBrick,x*50,500,50,50);
  image(imgMario,marioX,marioY,100,100);
  marioY+=marioVY;
  marioVY+=0.98;
  if(marioY>=500-100) {marioY=500-100; marioVY=0;}
}

2.左右移動以及跳
PImage imgMario,imgBrick;
void setup() {
  size(800, 600);
  imgMario=loadImage("mario.png");
  imgBrick=loadImage("brick.png");
}
float marioX=200,marioY=300,marioVX=0,marioVY=0;
boolean marioOnFloor=false;  ///讓馬力歐只有在地上才能跳
void draw() {
  background(255);
  for(int x=0;x<18;x++) image(imgBrick,x*50,500,50,50);
  image(imgMario,marioX,marioY,100,100);
  marioY+=marioVY; marioX+=marioVX;
  marioVY+=0.98;
  if(marioY>=500-100) {marioY=500-100; marioVY=0; marioOnFloor=true;}
}
void keyPressed(){
 if(keyCode==UP && marioOnFloor){marioVY=-15;marioOnFloor=false;} ;
 if(keyCode==RIGHT) marioVX=5;
 if(keyCode==LEFT) marioVX=-5;
}
void keyReleased(){
 if(keyCode==RIGHT||keyCode==LEFT)marioVX=0; 
}

3.秀出完整地圖的馬力歐
在多把brick2.png圖拉進去(問號磚塊)
int [][]map={{0,0,0,0,0,0,0,0,0,0,0,0,0,0},
             {0,0,0,0,0,0,0,0,0,0,0,0,0,0},
             {0,0,0,0,0,0,0,0,0,0,0,0,0,0},
             {0,0,0,0,0,0,0,0,0,0,0,0,0,0},
             {0,0,0,0,0,0,0,0,0,0,0,0,0,0},
             {0,0,0,0,0,0,0,0,0,0,0,0,0,0},
             {0,0,1,1,2,1,1,0,0,0,0,0,0,0},
             {0,0,0,0,0,0,0,0,0,0,0,0,0,0},
             {0,0,0,0,0,0,0,0,0,0,0,0,0,0},
             {0,0,0,0,0,0,0,0,0,0,0,0,0,0},
             {1,1,1,1,1,1,1,1,1,1,1,1,1,1}};

PImage imgMario,imgBrick,imgBrick2;
void setup() {
  size(800, 600);
  imgMario=loadImage("mario.png");
  imgBrick=loadImage("brick.png");
  imgBrick2=loadImage("brick2.png");
  
}
float marioX=200,marioY=300,marioVX=0,marioVY=0;
boolean marioOnFloor=false;
void draw() {
  background(255);
  //for(int x=0;x<18;x++) image(imgBrick,x*50,500,50,50);
  for(int x=0;x<14;x++){
    for(int y=0;y<11;y++){
      if(map[y][x]==1)  image(imgBrick,x*50,y*50,50,50);
      if(map[y][x]==2)  image(imgBrick2,x*50,y*50,50,50);
    }
  }
  image(imgMario,marioX,marioY,50,50);
  marioY+=marioVY; marioX+=marioVX;
  marioVY+=0.98;
  if(marioY>=500-50) {marioY=500-50; marioVY=0; marioOnFloor=true;}
}
void keyPressed(){
 if(keyCode==UP && marioOnFloor){marioVY=-15;marioOnFloor=false;} ;
 if(keyCode==RIGHT) marioVX=5;
 if(keyCode==LEFT) marioVX=-5;
}
void keyReleased(){
 if(keyCode==RIGHT||keyCode==LEFT)marioVX=0; 

}