week19 03160801期末展示

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

03160801 week14

期末作品討論與製作

week13 03160801

旋轉編碼器
http://yehnan.blogspot.tw/2014/02/arduino.html

程式碼

#define SERIAL_BAUDRATE 115200

#define CLK_PIN 2 // 定義連接腳位

#define DT_PIN 3

#define SW_PIN 4

#define interruptA 0 // UNO腳位2是interrupt 0，其他板子請見官方網頁

volatile long count = 0;

unsigned long t = 0;

void setup() {

  Serial.begin(SERIAL_BAUDRATE);

  // 當狀態下降時，代表旋轉編碼器被轉動了

  attachInterrupt(interruptA, rotaryEncoderChanged, FALLING);

  pinMode(CLK_PIN, INPUT_PULLUP); // 輸入模式並啟用內建上拉電阻

  pinMode(DT_PIN, INPUT_PULLUP); 

  pinMode(SW_PIN, INPUT_PULLUP); 

}

void loop() {

  if(digitalRead(SW_PIN) == LOW){ // 按下開關，歸零

     count = 0;  

     Serial.println("count reset to 0");

     delay(300);

  }

}

void rotaryEncoderChanged(){ // when CLK_PIN is FALLING

  unsigned long temp = millis();

  if(temp - t < 200) // 去彈跳

    return;

  t = temp;

  

  // DT_PIN的狀態代表正轉或逆轉

  count += digitalRead(DT_PIN) == HIGH ? 1 : -1;

  Serial.println(count);

}

Processing

程式碼

import processing.serial.*;

Serial myPort;

void setup(){

   size(500,500);

   myPort = new Serial(this,"COM8",115200);

}

int x=0;

int lf=10;//new line , line feed

void draw(){

   background(0);

   if(myPort.available() >0){

      String now = myPort.readStringUntil(lf);

      x = int (now);

      println(now + " " + x);

   }

   ellipse(width/2 + x*20, height/2, 100, 100);

   

}

03160801 week12

先安裝驅動程式

配合搖桿 連接

接線

程式碼

// 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);

}

移動搖桿會有不同數值

利用搖桿換顏色

程式碼

Processing

import processing.serial.*;

Serial myPort;

void setup(){

   size(400,400);

   myPort = new Serial(this, "COM6", 115200);

}

void draw(){

 if(myPort.available()>0){

    //String now= myPort.readString();

   // println(now);

  int pin2=myPort.read();

  println(pin2);

  if(pin2==1)background(255,0,0);

  else background(0,255,0);

 }  

}

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(115200);

}

void loop() {

  Serial.write(digitalRead(2));

  delay(50);

}

week11 03160801

Arduino和processing的應用
 利用開關按鈕控制顏色改變

week10

展示期中作品

主題:跑跑薑餅人

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


DEMO影片:

week08 03160801

期中作品

跑跑薑餅人

程式碼:
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 03160801

一:  皮卡丘打排球
程式碼
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(ballY,ballY,60,60);
  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;
}

程式碼

球落地遊戲結束

void setup(){

  size(800,600);

}

float ballX=200,ballY=200,ballVX=0,ballVY=3;

float pika1X=200,pika1Y=420,pika1VX=0,pika1VY=0;

float pika2X=600,pika2Y=420,pika2VX=0,pika2VY=0;

boolean bGameOver=false;

void draw(){

  background(#66B9EA);

  noStroke(); fill(#FAC105); rect(0,500,800,100);

  fill(255,0,0); ellipse(ballX,ballY,60,60);

  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;

  ballVY += 0.98;

  pika1X+=pika1VX; pika1Y += pika1VY; pika1VY+=0.98;

  if(ballY>=500-30) bGameOver=true;

  if(pika1Y>=500-50) {pika1VY=0; pika1Y=500-50;}

  if(dist(pika1X,pika1Y,ballX,ballY)<=80) ballVY=-ballVY;

}

void keyPressed(){

  if(key=='a') pika1VX=-3;

  if(key=='s') pika1VY=0;

  if(key=='d') pika1VX=3;

  if(key=='w') pika1VY=-20;

}

void keyReleased(){

  if(key=='a') pika1VX=0;

  if(key=='s') pika1VY=0;

  if(key=='d') pika1VX=0;

  if(key=='w') pika1VY=0;

}

week06 03160801

一: 爆爆王簡單的示範
放水球

程式碼
void setup(){
  size(850,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<10;i++){
    for(int j=0;j<17;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 <mouseX && mouseX <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 <mouseX && mouseX <110+i*30+30 &&
     300 < mouseY && mouseY <300+30){
     fill(0);rect(110+i*30,300,30,30);
     }
  }
}

點到牙齒會消失

死掉螢幕會變紅色

三: 射擊遊戲

程式碼
void setup(){
  size(600,400);
}
float userX=300,userY=200;
void draw(){
  background(#44B220);
  stroke(#53C9E5);noFill();
  for(int i=0;i<16;i++){
    for(int j=0;j<24;j++){
      rect(j*25,i*25,25,25);
    }
  }
  stroke(0);fill(#F775E8);
  float angle=atan2(mouseY-userY,mouseX-userX);
  triangle(userX+40*cos(angle), userY+40*sin(angle),
           userX+15*cos(angle+PI/2), userY+15*sin(angle+PI/2),
           userX+15*cos(angle-PI/2), userY+15*sin(angle-PI/2));
  ellipse(userX,userY,30,30);
}


箭頭移動可以調整方向

程式碼
a s d w可以往左上 左下 右上 又下移動

void setup(){
  size(600,400);
}
float userX=300,userY=200;
float mapX=0, mapY=0;
void draw(){
  background(#44B220);
  stroke(#53C9E5);noFill();
  for(int i=0;i<16;i++){
    for(int j=0;j<24;j++){
      rect(mapX+j*25,mapY+i*25,25,25);
    }
  }
  stroke(0);fill(#F775E8);
  float angle=atan2(mouseY-userY,mouseX-userX);
  triangle(userX+40*cos(angle), userY+40*sin(angle),
           userX+15*cos(angle+PI/2), userY+15*sin(angle+PI/2),
           userX+15*cos(angle-PI/2), userY+15*sin(angle-PI/2));
  ellipse(userX,userY,30,30);
  mapX-=dirX;
  mapY-=dirY;
}
int dirX=0,dirY=0;
void ketPressed(){
  if(key=='a' || key=='A') dirX=-1;
  if(key=='s' || key=='S') dirY=1;
  if(key=='d' || key=='D') dirX=1;
  if(key=='w' || key=='W') dirY=-1;
}
void ketReleased(){
  if(key=='a' || key=='A') dirX=0;
  if(key=='s' || key=='S') dirY=0;
  if(key=='d' || key=='D') dirX=0;
  if(key=='w' || key=='W') dirY=0;
  
}

week05 03160801

一: 會動的眼睛

眼珠會隨著箭頭移動
程式碼
void setup(){
  size(800,800);
}
void draw(){
  background(128);
  strokeWeight(20);
  ellipse(100,200,180,360);
  ellipse(300,200,180,360);

  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);
}

二: 砲塔射擊遊戲
滑鼠發射砲彈，限制10個

程式碼
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(#F20C0C);ellipse(200,600,100,100);
  for(int i=0;i<10;i++){
    fill(#F2740C);  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]);
  now++;
}

week04 03160801

第四周目標:1.讓憤怒鳥和小朋友下樓梯變得更完整
                     2.了解processing得更多功能，方便完成其中作品

一:  讓鳥碰到豬，豬會消失

PImage imgBird, imgPig;

float birdX = 400, birdY = 300;

float birdVX = 0, birdVY = 0;

float birdAX =0, birdAY = 0;

float [][]pigx=new float[5][4];//宣告豬X,Y位置陣列

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;

}

上面的程式碼產生步驟
void setup(){
  size(800,600);
}

void draw(){
  for(int i=0;i<5;i++){
    for(int j=0;j<4;j++){
      ellipse(700-i*100,100+j*100,100,100);
    }
  }
}













加入顏色
void setup(){
  size(800,600);
}

void draw(){
  for(int i=0;i<5;i++){
    for(int j=0;j<4;j++){
      ellipse(700-i*100,100+j*100,100,100);
    }
  }
  fill(#F70C0C);ellipse(400,300,100,100);
}














用陣列來做事
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++){
      //llipse(700-i*100,100+j*100,100,100);
      fill(#07DE0F);ellipse(pigx[i][j],pigy[i][j],100,100);
    }
  }
  fill(#F70C0C);ellipse(400,300,100,100);
}

讓鳥的座標也用變數來做

float birdX = 100, birdY = 400;
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++){
      //llipse(700-i*100,100+j*100,100,100);
      fill(#07DE0F);ellipse(pigx[i][j],pigy[i][j],100,100);
    }
  }
  //fill(#F70C0C);ellipse(400,300,100,100);
  fill(#F70C0C);ellipse(birdX, birdY,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;
      //llipse(700-i*100,100+j*100,100,100);
      if(pigAlive[i][j]){fill(#07DE0F);ellipse(pigx[i][j],pigy[i][j],100,100);}
    }
  }
  //fill(#F70C0C);ellipse(400,300,100,100);
  fill(#F70C0C);ellipse(birdX, birdY,100,100);
  birdX += birdVX;birdY += birdVY;
  birdVX += birdAX;birdVY += birdAY;
}
void mouseDragged(){
  birdX=mouseX; 
  birdY=mouseY;
}











接下來做出直線跟拋物線
void mouseDragged(){
  birdX=mouseX; 
  birdY=mouseY;
  birdAY = 0; //清除加速度才不會造成自由落體
}
void mouseReleased(){
  birdVX = (100-mouseX)/5.0;
  birdVY = (400-mouseY)/5.0;
  birdAY = 0.98;
}

二:  加入音樂檔

音樂程式碼

import processing.sound.*;

SoundFile sound;

void setup(){

  size(800,600);

  sound=new SoundFile(this,"dora.mp3");

  sound.play();

  sound.loop();

}

改用minim播放

程式碼
import ddf.minim.*;

Minim minim;
AudioPlayer player;

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

}

week03 03160801

一  憤怒鳥

憤怒鳥

加入程式碼
boolean pigAlive=true;

void draw(){
  background(255);
  if(pigAlive) image(imgPig, pigX, pigY, 100, 100);
  image(imgBird,birdX,birdY,100,100);
  if(dist(pigX, pigY, birdX, birdY)<100){
    pigAlive=false;
  }

加入程式碼
if(birdX<50){birdX=50;birdVX=-birdVX;}
  if(birdX>width-50){birdX=width-50; birdVX=-birdVX;}
  if(birdX<50){birdY=50;birdVY=-birdVY;}
  if(birdY>height-50){birdY=height-50; birdVY=-birdVY;}
  birdVX += birdAX; //給小鳥加速度
  birdVY += birdAY;
  birdVX *=0.997;
  birdVY *=0.997;

二  小朋友下樓梯

程式碼
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 03160801

一: 第一節課:小畫家作出來

打出程式碼

colorMode(HSB,100); //彩色的色彩

mousePressed() //按下滑鼠

if(mouseX<100){

    strokeWeight(mouseY/50);

} //在視窗左邊點右鍵調整粗細(越往下越粗)

if(mouseX>700){

    stroke(mouseY/6.0,100,100)

} //在視窗右邊點右鍵調整顏色

點右鍵才會畫出來

二: 跑出顏色視窗

彩色視窗

漸層視窗

三: 互動小遊戲

滑鼠點會跟你互動

程式:

void setup(){

  size(720,720,P2D);

}

void draw(){

}

void mouseDragged(){

  ellipse(mouseX,mouseY,100,100);

}

　

四: 秀出圖片

要將找到的圖片拉到裡面

background(0,0,255); //可更改背景顏色

跟滑鼠互動