Week09 施柏豪上課筆記

本日課程綱要：

1. LeapMotion 
2. 檔案讀取、寫檔
3. 排名
4. ArrayList 與資料結構

今天上課主題是要做一個能在LeapMotion環境中，以手勢接虛擬金幣，並能有記分板效果的程式。

老師談到API Reference的使用方式，

Reference就像是字典，寫程式有需要的時候再查，字典不是用來背的，而是用來查的!

舉例：寫程式時要處理字串的儲存與讀寫，

我們可以到Processing官方網站的reference查詢loadStrings()函式的意義，如下圖：

https://processing.org/reference/loadStrings_.html

看懂函式的意思，然後想辦法更改其中可以自己改的地方。

再來如果我們要做記分板。就要知道分數怎麼做讀寫存檔，存檔可能跟字串相關，

以saveStrings()這個函式示範，模仿Examples中的寫法，去改出寫入多個字串到文字檔的方式 (即原本我所想要看到的結果)，如下圖：

再來是存完了要學會如何讀取本機端的文字檔案，如下圖：

甚至可以去分析網頁檔內容，如下圖：

接續上面的範例，接下來要了解如何作出紀錄滑鼠畫線軌跡存檔的功能，，如下圖：

改變存檔的方式，使每次存檔的檔名不同，避免被重複覆蓋，如下圖：

開始進入接金幣的程式實作，這部分上周已有類似程式實作內容，如下圖：

吃到金幣後，撰寫增加生命值的程式邏輯判斷，很簡單的用if判斷就可以達到，如下圖：

當吃金幣時會增加分數，但是金幣如果沒有吃到，掉到地上則會損失生命，

這之中牽涉到的是狀態(State)的轉換，如果有狀態機的概念會比較好理解，

比如以下情況，Life結束時，把狀態變成 State=1，畫面填滿灰色，如下圖：

顯示黃色的記分板的狀態，則是State=2，如下圖：

我的上課練習程式碼：

import de.voidplus.leapmotion.*;

LeapMotion leap;


PVector [] coins=new PVector[10];

float handX=0, handY=0;


void setup() {

  size(500, 500);

  leap = new LeapMotion(this);

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

    coins[i]=new PVector(random(500), -random(100));

}


int score=0, life=10, speed=2;

int state=0;//state 0:playing, 1:gameOver, 2:showScoreBoard

String [] allScore;


void draw() {

  for (Hand hand : leap.getHands()) {

    handX=hand.getPosition().x;

    handY=hand.getPosition().y;

  }

  if (state==2) {

    background(255, 255, 0);

    for (int i=0; i<allScore.length; i++) {

      fill(255, 0, 0);

      textSize(30);

      text(allScore[i], 100, 200+i*50);

    }

    return ;

  } else if (state==1) {

    background(128);

    speed=0;

    allScore = loadStrings("allScores.txt");

    if (mousePressed) state=2;

  } else background(255);

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

    fill(255, 255, 0);

    ellipse(coins[i].x, coins[i].y, 30, 30);

    coins[i].y+=speed;


    if (coins[i].y>530) {

      coins[i].y=-random(100);

      life--;

      if (life<=0) state=1;

    }

    if (dist(mouseX, mouseY, coins[i].x, coins[i].y)<30) {

      score+=100;

      coins[i].y=-random(100);

    }

    if (dist(handX,handY, coins[i].x, coins[i].y)<30) {

      score+=100;

      coins[i].y=-random(100);

    }

  }

  fill(255); ellipse(handX,handY, 30,30);

  fill(255, 0, 0);

  textSize(30);

  text("Score:"+score+" Life:"+life, 200, 200);

}

課程心得：

今天的課程是接續上週LeapMotion的內容，進一步延伸讀寫與存檔，

非常認同老師的教學方式，

先引導我們查詢Processing 程式語言官方網站的reference ，再以實例進行操作，

因為我常在看Unity的API，我非常同意精熟這一步，

是寫程式朝向獨立思考與解決問題的關鍵，

也許這樣的模式可以重複幾次類似的範例解說，讓學生了解分析、拆解與轉化問題的模式，

曾看過有句話的意思是這麼說的[ 不需要自己造輪子 ]，
了解原理，然後善用工具，這樣的邏輯思維會比較好。

這樣寫程式、玩程式的方式技術上很精實，是一堂收穫良多的好課。