Week19 期末作品

作品名稱：桌上曲棍球

Week13 - 旋鈕

                      ２０１７互動技術

https://brainy-bits.com/blogs/tutorials/stepper-motor-rotary-encoder-p1
往右旋轉：數值越來越大         往左旋轉：數值越來越小

Week12-搖桿

２０１７互動技術

*Test (確定是否有成功運作)

      數值要一致：9600baud -> 115200baud

0：有按下去      1：沒有按

*按下去可以變色

Week10

組員：溫淳安 04163031
          黃文郁 04160125

網址：https://youtu.be/P6QpNCCXBRo

Week03

一.憤怒鳥小遊戲

1.將圖片輸入至程式中

p.s 若圖片太大  可以在image函式後 加入(100,100);

2.加上mouseReleased和mouseDragged 結合牛頓第二運動定律彈出的狀態

3.調整圖片中心

4.加上AX與AY讓鳥能夠受到重力掉下來

5.讓鳥撞到豬 豬會消失

6.增加摩擦力 與 撞到牆壁反彈

二.小朋友下樓梯

Week6

一.簡易爆爆王:

程式碼:
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];
 int []waterS=new int[100];
 int []waterT=new int[100];
 void draw(){
   background(#92AD28);
   noStroke();
   for(int x=0;x<17;x++){
     for(int y=0;y<10;y++){
       if((x-y)%2 ==0) fill(#7E9819);
       else fill(#92AD28);
       rect(x*50,y*50,50,50);
     }
   }
   fill(255,0,0);ellipse(userJ*50+25 , userI*50+25, 50,50);
   for(int i=0; i<waterN; i++){
    if(waterT[i]>0){
     fill(#93E1F7); ellipse(waterJ[i]*50+25, waterI[i]*50+25, 30,30);
     waterT[i]--;
     if(waterT[i]==0) waterT[i]=-60;
   }
   if(waterT[i]<0){
     for(int k=-waterS[i];k<=waterS[i];k++){
       fill(255); rect(   (waterJ[i]+k)*50, (waterI[i])*50, 50,50);
       fill(255); rect(   (waterJ[i])*50, (waterI[i]+k)*50, 50,50);
     }
     waterT[i]++;
   }
 }
 }
 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;
     waterS[waterN]=5; waterT[waterN]=120; waterN++;
   }
 }

Week05

一.寫出會跟著滑鼠移動的眼睛

void setup(){
  size(400,400);
}
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]);

  now++;

}

Week02

一.點擊滑鼠變換顏色與粗細:

     mousePressed()    滑鼠點擊
     mouseDragged()  滑鼠滑動


void setup(){
  size(800,600);
  colorMode(HSB, 100);
}
void draw(){
  line(mouseX, mouseY, pmouseX, pmouseY);
}
void mouseDragged(){
  if(mouseX<100){   //當滑鼠X座標小於100時,點擊滑鼠改變粗細
    strokeWeight(mouseY/50);
  }
  if(mouseX>700){   //當滑鼠X座標大於700時,點擊滑鼠改變顏色
    stroke(mouseY/6.0 , 100,100);
  }
}

void setup(){
  size(800,600);
  rect(width-100,0, width,height);//畫兩個長方形用來當作粗細與顏色的選擇區塊
  rect(0,0, 100, height);//同上
  colorMode(HSB, 100);//色相 飽和度 亮度
}
void draw(){
  if(mousePressed) line(mouseX, mouseY, pmouseX, pmouseY);//當滑鼠點擊開始畫圖
}
void mouseDragged(){
  if(mouseX<100){
    strokeWeight(mouseY/50);
  }
  if(mouseX>width-100){
    stroke(mouseY/6.0 , 100,100);
  }
}

二.試跑範例

https://www.openprocessing.org/browse#

void setup(){

  size(720,720,P2D);

}

void draw(){

}

void mouseDragged(){

  ellipse(mouseX, mouseY, 100,100);//畫圓

}

void setup(){

  size(720,720,P2D);

}

float pX=-100, pY=-100, r=100;

void draw(){

  ellipse(pX, pY, r, r);

  if(r>3){

    r -= 10;

    pX +=13;

  }

}

void mousePressed(){

  pX=mouseX; pY=mouseY; r=100;

}

三.匯入圖檔


下載圖片

size(500,500);

background(0,235,220);

PImage img=loadImage("dora.png");//檔名要注意

image(img, 0,0, 500,500);

///記得把下載的圖片拖曳到程式中

PImage img1, img2;
void setup(){
  size(500,500);
  img1=loadImage("bird.png");
  img2=loadImage("dora.png");
}
void draw(){
  background(0,255,255);
//PImage img=loadImage("dora.png");
  image(img1, mouseX,mouseY, 100,100);//鳥會跟著滑鼠移動
  image(img2, 200,200, 100,100);
}

Week01

作業一

1.使用processing
line(float,float,float,float);劃出一條線

2.P語言教學網頁

3.畫矩形 rect(float,float,float,float);

   調整視窗大小 size(float,float);

   操控滑鼠 mouseX和pmouseX;

4.更換筆觸顏色與筆觸粗細度並結合鍵盤

https://www.openprocessing.org/