銀髮樂活 　/　 職能治療 　/　 運動健身 　/　 程式教育 　/　 app客製化

課程大綱

1.  第二個app

課程內容

1.  我們用第二個app來練習更多元件和程式方塊的操作。
     第二個app要做的是一個考驗反應的小遊戲，就是「oplate樂齡遊戲」的第一個遊戲 -「反應速度」的簡單版本。
     進行方式是當遊戲開始後，會隨機亮起一個燈，燈被觸碰時會暗掉同時再隨機亮起一個燈，以此重複下去。
     做出來的成果請看以下影片。

2.  開一個新專案，名稱是「Lesson04」，App名稱為「反應遊戲」。

     開始步驟和Lesson03差不多。
     我們放進三個按鈕，一個方形兩個圓形，「字體大小」都是30。
     方形按鈕「寬度」是「填滿」，圓形按鈕「寬度」和「高度」都是100像素。
     顯示文字和元件名稱請參考圖中所示。

3.  接下來將兩個圓形按鈕變成左右並排。
     從左方「元件面板」中的「介面配置」裡將「水平配置」拉進中間手機畫面中，再將兩個圓形按鈕分別拉進「水平配置」中。
     將「水平配置1」的「水平對齊」改為「置中」、「背景顏色」改成「白色」、「寬度」改為「填滿」。

4.  從左邊「元件面板」中「感測器」裡將「計時器」拉入。
     因為「計時器」為「非可視元件」，所以不會出現在手機畫面裡。
     「計時器」的基本用法是，開始「啟用計時」，經過「計時間隔」的時間後執行某些動作。
     「計時間隔」的時間單位是毫秒(ms)(1000毫秒=1秒)。
     「計時器」的「元件屬性」中，如果想要自己決定何時開始「啟用計時」的話，就要先將「啟用計時」關掉，不然開啟程式時計時器就會自動開始計時。

5.  「畫面編排」的部份好了，接著進到「程式設計」畫面。

     第一步是當按鈕「開始」被點擊時要讓「計時器」開始啟動。
     我們將元件「計時器1」裡「設”計時器1” . “啟用計時”為」的程式方塊帶入，這是我們點擊「開始」後要執行的項目。

6.  要讓「計時器1」開始啟動就是「設”計時器1” . “啟用計時”為」「真」。
     這可以在左邊「內件方塊」的「邏輯」裡找到。

7.  「計時器」開始啟動後會開始計時，經過「計時間隔」的時間後可以執行某些動作。我們可以從元件「計時器1」裡找到這個程式方塊。
     「計時間隔」預設是1000ms，就是1秒，可以在計時器的「元件屬性」或是這裡用程式方塊設定。

8.  經過「計時間隔」的時間後要執行甚麼呢?
     我們要從兩個燈中隨機選取一個亮起。

     “從一堆數字裡隨機選取一個”的程式方塊可以在左邊「內件方塊」的「數學」裡找到。
     拉進來後可以發現沒辦法和「當”計時器1” . 計時 執行」組合在一起，因為形狀不合。

9.  我們需要加進一個變數來代表我們要選擇哪一個燈亮起。
     從左邊「內件方塊」的「變數」裡將「初始化全域變數”變數名”為」拉入。
     點擊”變數名”可輸入新的名稱，我們將名稱取為”亮燈號碼”。

10.  然後我們要給「初始化全域變數”亮燈號碼”為」一個初始值。
       這個初始值也同時代表了這個全域變數的性質，可以是數字、文字、列表或判斷值等，看我們對這個變數的需求。
       這裡我們要用這個變數來代表隨機選出來的燈，1代表1號燈、2代表2號燈，所以需要用數字。
       而這裡初始值選擇0就好。

11.  有了變數，我們再從左邊「內件方塊」的「變數」裡將「設置” ”為」拉入。
       這個程式方塊可以接在「當”計時器1” . 計時 執行」裡，但會有個X出現，選擇好變數名稱”亮燈號碼”後就會消失了。

12.  這時就可以將「隨機整數從”1”到”100”」的程式方塊接在「設置”亮燈號碼”為」的後面了。
       然後改成「隨機整數從”1”到”2”」，因為1到2間只有1和2兩個整數，剛好分別代表兩個燈，所以這段組合的意思是說將變數”亮燈號碼”隨機設成1和2其中一個數字。

13.  如果隨機選出來的號碼是1，代表第一個燈，接下來我們要做的是讓這個燈亮起，步驟跟前一個app一樣。
       但也有可能選出來的號碼是2，那就是要讓第二個燈亮起。
       所以會有兩種情況，這時我們就要加進一個「流程控制」裡的「如果 則」程式方塊。

14.  再從左邊「內件方塊」的「數學」裡拉進「=」程式方塊，放在「如果 則」的「如果」後面。

15.  然後從左邊「內件方塊」的「變數」裡拉進「取” “」程式方塊，我們要組合出「如果取”亮燈號碼”= “1”」。
       當變數”亮燈號碼”等於1時要執行的是讓一號燈亮起，將這段程式組合在「如果 則」的「則」裡面。(參考第一個app的步驟)

16.  接下來點擊「如果 則」左上角藍色標誌，會出現擴展程式方塊。
       再把「否則，如果」拉進原本的程式方塊中。
       如此就可以來製作當變數”亮燈號碼”等於2時的程式方塊。

17.  結果如圖所示。

18.  到目前的步驟呈現的效果為: 「開始」被點擊 → 「計時器1」開始啟動 → 一秒後 → 隨機亮起1或2號燈 → 一秒後 → 隨機亮起1或2號燈...
       因為「計時器1」是啟動著，所以每過1秒，就會重複執行一次動作。
       這不是我們要的效果。
       我們希望其中一個燈亮起時，要等我們觸碰並將燈關掉時，再開始下一次隨機亮燈的過程。
       所以這裡我們要在「計時間隔」到時先將計時器停止計時，避免不斷重複執行。

* 在製作的過程中，可以隨時匯出apk檔或是利用「AI Companion」實際操作一下是不是自己想要的效果。 *

19.  接下來製作”觸碰亮起的燈時，燈會暗掉”的效果。
       圖中的是”觸碰燈時(不管燈是不是亮著)，燈會暗掉”，我們要的是只有在燈亮起的時候，觸碰才會關燈。
       要怎麼做呢?

20.  作法如圖，要加進一個「流程控制」程式方塊。
       只有在亮燈號碼等於1的時候，一號燈被觸碰才會執行關燈的動作。
       二號燈的情況也是。

21.  如果只做到這樣，那在第一次亮燈被觸碰關燈後，程式就會停止了。
       如果希望遊戲可以持續進行，只要在關燈後啟動「計時器1」，就會開始下一循環。

22.  完整程式設計如圖。
       到此大功告成，趕快匯出試玩看看吧!