week 17

今天老師給我們看了很多專題的小遊戲，並教我們這些簡單的小遊戲該如何寫出來!!

首先，先畫出兩個點點。



void setup(){
  size(300,300);
}
void draw()
{
    background(#002966);//上背景顏色
    fill(#b7efff);//上顏色
    noStroke();
    ellipse(100,150,13,13);
    ellipse(200,150,13,13);
}



void setup(){
  size(300,300);
}
void draw()
{
    background(#002966);
    stroke(#b7efff);
    line(100,150,200,150);//在中間加上一條線
 
    fill(#b7efff);
    noStroke();
    ellipse(100,150,13,13);
    ellipse(200,150,13,13);

}

有了點、線後，現在我們開始讓線可以移動。




void setup(){
  size(300,300);
}
float x=200,y=150;//要動就要用變數才可以!!
void draw()
{
    background(#002966);
    stroke(#b7efff);
    line(100,150,x,y);
 
    fill(#b7efff);
    noStroke();
    ellipse(100,150,13,13);
    ellipse(x,y,13,13);
}
void mouseDragged()
{
  x=mouseX;  y=mouseY;//如此，線便可以跟著滑鼠一起動




}

接著我們讓線可以拉了後放開彈回去!!




























就像上面這兩張圖片，放開後會變成第二張圖

void setup(){
  size(300,300);

}
float x=200,y=150;
void draw()
{
    background(#002966);
    stroke(#b7efff);
    line(100,150,x,y);
 
    fill(#b7efff);
    noStroke();
    ellipse(100,150,13,13);
    ellipse(x,y,13,13);
    if( !mousePressed){//沒有按下去
      float dx=x-100,dy=y-150;
      float len=sqrt(dx*dx+dy*dy);
      x-=dx*(len-100)/len*0.1;//假如乘上0.1，那線縮回去的速度會變得比較緩慢，也會看起來比較遊戲的感覺
      y-=dy*(len-100)/len*0.1;
    }
}
void mouseDragged()
{
  x=mouseX;  y=mouseY;
}

接著，我們讓這條線可以拉一次後就來回伸縮。



線縮最短的長度



線縮最短的長度



旋轉收縮也是可以的，只要滑鼠移動位置點擊就可以了!!

我們將速度加上去!!

void setup(){
  size(300,300);
}
float x=200,y=150;
float vx=0,vy=0;//拉動的時候不可以有速度
void draw()
{
    background(#002966);
    stroke(#b7efff);
    line(100,150,x,y);
 
    fill(#b7efff);
    noStroke();
    ellipse(100,150,13,13);
    ellipse(x,y,13,13);
    if( !mousePressed){
      float dx=x-100,dy=y-150;
      float len=sqrt(dx*dx+dy*dy);
      vx-=dx*(len-100)/len*0.001;//這裡的速度也要加上去
      vy-=dy*(len-100)/len*0.001;//越大越強，越小越弱
      x+=vx;
      y+=vy;
    }
}
void mouseDragged()
{
  x=mouseX;  y=mouseY;
}

接著開始另一個十分相像的小遊戲




這個程式呢，小白色的框框他會跟滑鼠的方向移動

void setup(){
  size(400,300);
}
float x=200,y=150;
void draw()
{
    background(#002966);
    stroke(#b7efff);
    fill(255);
    rect(x,y,80,20);
    float dx=x-mouseX,dy=y-mouseY;
    x-=dx*0.1;//加上這個數值後，會讓他有一點滑行的感覺
    y-=dy*0.1;
}

在最後一堂程式課，小葉老師教了很多小遊戲，也學到了各種小技巧!!
大一的程式設計也終於結束啦~!!