week19 03160801期末展示

我們這組做的是跑跑薑餅人，點盒子上的薑餅人，可以讓薑餅人跳起來吃金幣，吃越多就可以得到越多分數，掉到白色洞裡就會死掉，最後結束會顯示得到的分數

week19

期末展示

跑跑薑餅人

接線的示意圖

裝在盒子裡

可以按按鈕

影片網址
https://www.youtube.com/watch?v=MXZXGCWav-0

影片展示

week14

確認期末作品

以及開始期末作品討論與製作

week13

利用旋轉編碼器（rotary encoder）接電路板來控制

參考網址

http://yehnan.blogspot.tw/2014/02/arduino.html

轉動選轉編碼器 
監控器可以看到有數字在跑

week12

開始使用arduino

電路板接類比遙感使用

測試結果



// Arduino pin numbers const int SW_pin = 2; // digital pin connected to switch output const int X_pin = 0; // analog pin connected to X output const int Y_pin = 1; // analog pin connected to Y output void setup() { pinMode(SW_pin, INPUT); digitalWrite(SW_pin, HIGH); Serial.begin(9600); } void loop() { Serial.print("Switch: "); Serial.print(digitalRead(SW_pin)); Serial.print("\n"); Serial.print("X-axis: "); Serial.print(analogRead(X_pin)); Serial.print("\n"); Serial.print("Y-axis: "); Serial.println(analogRead(Y_pin)); Serial.print("\n\n"); delay(500); }

馬達連接電路板

week11

教學做arduino和process的應用步驟

week10

展示期中作品

主題:跑跑薑餅人

網址:https://www.youtube.com/watch?v=TS-FVzcYJ7I&feature=youtu.be


DEMO影片:

week08

這週開始製作我們這組的期中作品

我們這組做的是跑跑薑餅人

程式碼如下:

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,0,0,0,0},

             {1,1,1,1,1,1,1,1,1,1,1,1,1,1,1},

             {0,0,0,0,0,0,0,0,0,0,0,0,0,0,0}};

int []coinEat={0,0,0,0,0,0,0,0,0,0,0,};

int bgShift=0;

PImage imgBrick ,imgMan;

void setup(){

  size(600,400);

  imgBrick=loadImage("floor.png");

  imgMan=loadImage("man.png");

}

boolean manJumping=false;

int manX=100,manY=200;

float manVX=0,manVY=0;

void draw(){

  background(#91EEF7);

  for(int i=0;i<8;i++){

    for(int j=0;j<15;j++){

      if(map[i][j]==1) image(imgBrick, j*40,i*40,40,40);

      

    }

  }

  for(int i=0;i<10;i++){

    if(coinEat[i]==0){

      fill(255,255,0);ellipse(i*50+300-bgShift,100,50,50);

    }

    if(dist(manX,manY,i*50+300-bgShift,100)<50)coinEat[i]=1;

  }

  ellipse(manX,manY,0,0);

  bgShift++;

  

  image(imgMan, manX, manY,40,40);

  manX+=manVX;manY+=manVY;

  if(manJumping) manVY+=0.98;

  testManOnFloor();

}

void testManOnFloor(){

  int i=int(manY/40),j=int(manX/40);

  if(i>=8 || j>=15)return;

  if( map[i+1][j]!=0){manJumping=false;manY=i*40; manVY=0;}

}

void keyPressed(){

  if(keyCode==UP) {manVY=-10;manJumping=true;}

   if(keyCode==DOWN){ }

}

目前成果如圖

有一個薑餅人的主角

可以往上跳

而金幣會一直往左移動讓薑餅人有往前的效果

而金幣碰觸到薑餅人則會被吃掉(消失掉)

week07

皮卡丘打排球

程式碼

void setup(){
  size(800,600);
}
float ballX=200,ballY=200,ballVX=0,ballVY=3;
float pika1X=200,pika1Y=420;
float pika2X=650,pika2Y=420;
boolean bGameOver=false;
void draw(){
  background(#66B9EA);
  noStroke();fill(#FAC105);rect(0,500,800,100);
  fill(255,0,0);ellipse(pika1X,pika1Y,60,100);
  rect(400,340,10,260);
 
  fill(#F5FA05);ellipse(pika1X,pika1Y,60,100);
  fill(#F5FA05);ellipse(pika2X,pika2Y,60,100);
 
  if(bGameOver) return;
 
  ballX+=ballVX;
  ballY+=ballVY;
  if(ballY>500-30) bGameOver=true;
  if(dist(pika1X,pika1Y,ballX,ballY)<=80)bGameOver=true;
}

week06

製作爆爆王遊戲

void setup(){
  size(500,500);
}
int userJ=9,userI=5;
float userX ,userY;
int waterN=0;
int []waterJ=new int [100];
int []waterI=new int [100];
void draw(){
  background(#92AD28);
  noStroke();
  for(int i=0;i<17;i++){
    for(int j=0;j<10;j++){
      if( (j-i)%2 ==0) fill(#7E9819);
      else fill(#92AD28);
      rect(j*50,i*50,50,50);
    }
  }
  fill(255,0,0);ellipse(userJ*50+25,userI*50+25,50,50);
  for(int i=0;i<waterN;i++){
    fill(#93E1F7); ellipse(waterJ[i]*50+25,waterI[i]*50+25,30,30);
  }
}
void keyPressed(){
  if(keyCode==LEFT) userJ--;
  if(keyCode==RIGHT) userJ++;
  if(keyCode==UP) userI--;
  if(keyCode==DOWN) userI++;
  if(key==' '){
    waterI[waterN]=userI;waterJ[waterN]=userJ;waterN++;
  }
}




第二個遊戲是
鱷魚咬咬
void setup(){
  size(500,500);
}
void draw(){
  background(255);
  fill(0,155,0);ellipse(250,250,300,300);
  for(int i=0;i<9;i++){
    fill(255); rect(110+i*30,200,30,30);
    if(110+i*30<mouseY && mouseY < 110+i*30+30 &&
      200 < mouseY && mouseY <200+30){
        fill(0);rect(110+i*30,200,30,30);
      }
    }
    for(int i=0;i<9;i++){
      fill(255);rect(110+i*30,300,30,30);
      if(110+i*30<mouseY && mouseY <100+i*30+30 &&
        300 < mouseY && mouseY <300+30){
        fill(0);rect(110+i*30,300,30,30);
      }
    }
  }

week05

眼睛會跟著滑鼠指標走

可以讓眼睛跟滑鼠連著一條線

void setup(){

  size(800,800);

}

void draw(){

  background(128);

  strokeWeight(20);

  ellipse(100,200,180,360);

  ellipse(300,200,180,360);

  

  ellipse(100,200,10,10);

  ellipse(300,200,10,10);

  line(mouseX,mouseY,100,200);

  line(mouseX,mouseY,300,200);

}

void setup(){

  size(800,800);

}

void draw(){

  background(128);

  strokeWeight(20);

  ellipse(100,200,180,360);

  ellipse(300,200,180,360);

  

  //ellipse(100,200,10,10);

  //ellipse(300,200,10,10);

  //line(mouseX,mouseY,100,200);

  //line(mouseX,mouseY,300,200);

  float angle1 = atan2((mouseY-200)/2 , mouseX-300);

  float newX1=300+100*cos(angle1)/2;

  float newY1=200+200*sin(angle1)/2;

  ellipse(newX1,newY1,10,10);

  float angle2 = atan2((mouseY-200)/2,mouseX-100);

  float newX2=100+100*cos(angle2)/2;

  float newY2=200+200*sin(angle2)/2;

  ellipse(newX2,newY2,10,10);

}


第二個遊戲
製作射砲砲遊戲



先做出一個砲彈



橘色是身體的本體
線會跟著滑鼠方向連出一條線

void setup(){
  size(400,800);
}
float ballX=200, ballY=600;
float ballVX=0, ballVY=0;
float angle=0;
void draw(){
  background(0,128,0);
  fill(#FA9703); ellipse(200,600,100,100);
 line(mouseX,mouseY,200,600);
 fill(#F9FA03); ellipse(ballX,ballY,30,30);
 angle = atan2(mouseY-600,mouseX-200);

 ballX+=ballVX;
 ballY+=ballVY;
}
void mouseMoved(){
  ballX=200+50*cos(angle);
  ballY=600+50*sin(angle);
}
void mousePressed(){
  ballVX=cos(angle);
  ballVY=sin(angle);
}




黃色的泡泡會射出去
void setup(){
  size(400,800);
}
float [] ballX=new float[10];
float [] ballY=new float[10];
float [] ballVX=new float[10];
float [] ballVY=new float[10];
float [] angle=new float[10];
int now=0;
void draw(){
  background(0,128,0);
  fill(#FA9703); ellipse(200,600,100,100);
  for(int i=0;i<10;i++){
    fill(#F9FA03); ellipse(ballX[i],ballY[i],30,30);
    ballX[i]+=ballVX[i]; ballY[i]+=ballVY[i];
  }
  angle[now] = atan2(mouseY-600,mouseX-200);
}
void mouseMoved(){
  ballX[now]=200+50*cos(angle[now]);
  ballY[now]=600+50*sin(angle[now]);
}
void mousePressed(){
  ballVX[now]=cos(angle[now]);
  ballVY[now]=sin(angle[now]);
}

week04

PImage imgBird, imgPig;
float birdX = 400, birdY = 300;
float birdVX = 0, birdVY = 0;
float birdAX = 0, birdAY = 0;
float [][]pigx=new float[5][4];
float [][]pigy=new float[5][4];
boolean [][]pigAlive=new boolean[5][4];
void setup(){
  size(800,600);
  imgBird=loadImage("bird.png");
  imgPig=loadImage("pig.png");
  imageMode(CENTER);
  for(int i=0;i<5;i++){
    for(int j=0;j<4;j++){
      pigx[i][j]=700-i*100; pigy[i][j]=100+j*100; pigAlive[i][j]=true;
    }
  }
}
void draw(){
  background(255);
  for(int i=0;i<5;i++){
    for(int j=0;j<4;j++){
      if(dist(pigx[i][j],pigy[i][j],birdX,birdY)<100){
        pigAlive[i][j]=false;
      }
      if(pigAlive[i][j]) image(imgPig, pigx[i][j], pigy[i][j], 100, 100);
    }
  }

  image(imgBird, birdX, birdY, 100, 100);

  line(birdX, birdY, 400,300);
  birdX += birdVX;
  birdY += birdVY;

  if(birdX<50){birdX=50; birdVX = -birdVX;}
  if(birdX>width-50){birdX=width-50; birdVX= -birdVX;}
  if(birdY<50){birdY=50; birdVY = -birdVY;}
  if(birdY>height-50){birdY=height-50; birdVY= -birdVY;}


  birdVX += birdAX;
  birdVY += birdAY;
  birdVX *= 0.995;
  birdVY *= 0.995;
}
void mouseDragged(){
  birdX=mouseX;
  birdY=mouseY;
  birdVX=birdVY=birdAX=birdAY=0;

}
void mouseReleased(){
  birdVX = (400-mouseX)/10.0;
  birdVY = (300-mouseY)/10.0;
  birdAY = 0.98;
}

可以攻擊很多隻豬
然後碰到鳥的豬會消失






小葉重作示範
float [][]pigx=new float[5][4];
float [][]pigy=new float[5][4];
boolean [][]pigAlive=new boolean[5][4];
void setup(){
  size(800,600);
   for(int i=0;i<5;i++){
    for(int j=0;j<4;j++){
      pigx[i][j]=700-i*100;pigy[i][j]=100+j*100;pigAlive[i][j]=true;
    }
  }
}
void draw(){
  for(int i=0;i<5;i++){
    for(int j=0;j<4;j++){
      fill(#07DE0F); ellipse(pigx[i][j], pigy[i][j], 100, 100);
   }
  }
  fill(#DE0719); ellipse(400, 300, 100, 100);
}

會出現紅球與綠球
























float birdX = 100, birdY = 400;
float birdVX = 0, birdVY = 0;
float birdAX = 0, birdAY = 0;
float [][]pigx=new float[5][4];
float [][]pigy=new float[5][4];
boolean [][]pigAlive=new boolean[5][4];
void setup(){
  size(800,600);
   for(int i=0;i<5;i++){
    for(int j=0;j<4;j++){
      pigx[i][j]=700-i*100;pigy[i][j]=100+j*100;pigAlive[i][j]=true;
    }
  }
}
void draw(){
  background(255);
  for(int i=0;i<5;i++){
    for(int j=0;j<4;j++){
      if (dist(birdX, birdY,pigx[i][j], pigy[i][j])<100)
        pigAlive[i][j]=false;
      if(pigAlive[i][j]){fill(#07DE0F); ellipse(pigx[i][j], pigy[i][j], 100, 100);}
  }
}
  //fill(#DE0719); ellipse(400, 300, 100, 100);
  fill(#DE0719); ellipse(birdX,birdY, 100, 100);
  birdX += birdVX;
  birdY += birdVY;
  birdVX += birdAX;
  birdVY += birdAY;
}
void mouseDragged(){
  birdX=mouseX;
  birdY=mouseY;
}
紅球碰到綠球 綠球可以消失



float birdX = 100, birdY = 400;
float birdVX = 0, birdVY = 0;
float birdAX = 0, birdAY = 0;
float [][]pigx=new float[5][4];
float [][]pigy=new float[5][4];
boolean [][]pigAlive=new boolean[5][4];
void setup(){
  size(800,600);
   for(int i=0;i<5;i++){
    for(int j=0;j<4;j++){
      pigx[i][j]=700-i*100;pigy[i][j]=100+j*100;pigAlive[i][j]=true;
    }
  }
}
void draw(){
  background(255);
  for(int i=0;i<5;i++){
    for(int j=0;j<4;j++){
      if (dist(birdX, birdY,pigx[i][j], pigy[i][j])<100)
        pigAlive[i][j]=false;
      if(pigAlive[i][j]){fill(#07DE0F); ellipse(pigx[i][j], pigy[i][j], 100, 100);}
  }
}
  //fill(#DE0719); ellipse(400, 300, 100, 100);
  fill(#DE0719); ellipse(birdX,birdY, 100, 100);
  birdX += birdVX;
  birdY += birdVY;
  birdVX += birdAX;
  birdVY += birdAY;
}
void mouseDragged(){
  birdX=mouseX;
  birdY=mouseY;
  birdVX=0;birdVY=0;
  birdAY=0;
}
void mouseReleased(){
  birdVX=(100-mouseX)/5.0; birdVY=(400-mouseY)/5.0;birdAY=0.98;
}

紅球可以拋物線移動



import ddf.minim.*;

Minim minim;
AudioPlayer player;

void setup(){
 
 
  size(800,600);
  minim = new Minim(this);
  player = minim.loadFile("dora.mp3",2048);
  player.play();
  player.loop();
}
void draw(){

}
可以加入音樂檔
點擊開始就可以撥放

week03

自製憤怒鳥

這段程式碼可以做出拉弓的線



加上圖片跟著滑鼠拖曳
























加上慣性可以讓憤怒鳥受引力往下掉



加上目標物圖片
就可以攻擊它了
加上background(255);
就不會有殘影了




加上
if(birdX<50){birdX=50;birdVX=-birdVX;}
  if(birdX>width-50){birdX=width-50;birdVX=-birdVX;}
  if(birdY<50){birdY=50;birdVY=-birdVY;}
  if(birdY>height-50){birdY=height-50;birdVY=-birdVY;}
  birdVX+=birdAX;
  birdVY+=birdAY;
  birdVX*=0.98;
  birdVY*=0.98;

就可以讓憤怒鳥碰到牆壁的時候反彈





簡易的小朋友下樓梯

void setup(){
  size(600,500);
}
int boardX=227, boardY=400;
int kidX=300,kidY=250;
void draw(){
background(0);
rect(boardX,boardY,200,50);
rect(kidX,kidY,50,50);

if(kidX>boardX-50 && kidX<boardX+200 && kidY>boardY-50)
  {
   
  }else kidY++;
  kidX=mouseX;
}

week02

1.在視窗的左邊點擊滑鼠左鍵可以調整粗細
   在視窗的右邊點擊滑鼠左鍵可以調整顏色

























2.一樣在視窗的左邊點擊滑鼠左鍵可以調整粗細
   而在視窗的右邊點擊滑鼠左鍵可以調整顏色
   但滑鼠的著色不會連續不斷
   要按下去才會進行著色




3.
或產生一個彩虹色彩的視窗





4.點擊滑鼠後會有圓圈的東西在視窗內部斷擴散




5.點擊後圓圈會固定往右邊延伸出去




6.可以把預設的圖片放到視窗上




7.多加了一張圖片
可以跟著滑鼠移動

week01

第一天上課
練習processing

line(0,0, 100,100);
可以畫出一條線
























rect(10,10,50,50);
可以畫出正方形






















size(500,600);
可以決定視窗的大小

























加上line(mouseX,mouseY,pmouseX,pmouseY);
就可以用滑鼠話線了






加上if(key=='1')   if(key=='2')
設定案下 1跟2 可以改變話線的顏色

加上strokeWeight(10)
可以設定比畫粗細度10

加上stroke(#FB24FF);
可以設定筆畫的顏色