Webduino模擬器「瘋」神榜：用 LED 點矩陣學陣列應用、玩賓果(進階版：可記錄與顯示已抽取號碼、Blockly 程式註解)

image
在前一篇「Webduino模擬器「瘋」神榜：用LED 點矩陣學亂數、玩賓果(簡易版與標準版)」文章中，我們已經學會如何使用 Blockly 的亂數積木、陣列列表，現在要再來改良這個賓果遊戲，讓更具「真實性」：
  1. 加上「按下按鈕後，隨機顯示數字動畫」
  2. 將已抽取的數字儲存到另一個陣列中，方便遊戲過程中進行查詢
  3. 加上 Blockly 程式碼的註解
第一個是用來增加遊戲時的「視覺效果」，按一下號碼就顯示出來有點不夠剌激，讓數字隨機跑動一下，馬上就有期待的心情！
第二個要改良的，有玩過賓果遊戲的人，相信都有可能會遇到這個情形：這個號碼有抽過了嗎？剛才前面一個或兩個是哪個號碼，我忘記了！尤其數字範圍較大時，難免會有人忘記，在這個進階版中，程式積木的重點就在於如何將已經取出的數字，儲存到新的陣列列表中，並可以透過指定按鈕，將取出的數字顯示出來！
最後，當 Blockly 程式積木愈來愈多，也愈來愈複雜時，可以適時加入程式碼的註解，除了在設計當下有所助益外，對於日後檢查積木或是協同合作時，更是必備的撰寫程式良好習慣喔！

image

※ Webduino 官方網站：https://webduino.io/

※ Webduino 的Arduino 模擬器網址：http://simulator.webduino.io/

※ 用LED 點矩陣學亂數、玩賓果「進階版」 Demo  網址 ：

※ 用LED 點矩陣學亂數、玩賓果「標準版」 Demo  網址 ：

註：目前線上模擬器只能在 Windows / MAC 電腦上使用，無法在平板與手機上使用喔！
在 Webduino 線上模擬器中，沒有電壓、連接腳位可連接裝置的限制，所以要玩一些原本因硬體限制，而需要使用麵包板才能完成的應用，都是沒有問題的！

一、模擬器「硬體」連接與硬體積木程式

  • 加入一個 LED 點矩陣，VCC 接 5V，腳位為 DIN：10、CS：9、CLK：8
image_thumb2
image_thumb5
二、網頁互動測試使用「遙控器」

「遙控器」除了有較多按鈕外，在「遙控器」上方還有一個螢幕可以用來「顯示」相關的訊息喔！

image_thumb6

三、程式積木請開啟「賓果(標準版)」來做修改：

※ 用LED 點矩陣學亂數、玩賓果「標準版」 Demo  網址 ：http://simulator.webduino.io/#-KpzaPZjm8HnB6XUYrKY

※建立列表的方式，使用 Webduino 官方「大樂透自動選」教學範例會更方便喔！

使用「指定列表內容」列表積木



 
開啟賓果標準備程式積木後，只要再依下面的方式，加入一些積木，就能改造成功囉！
1.加入空的陣列列表變數「k_award」，待會兒儲存已抽出的號碼。
image

2.加入按下按鈕時，在 LED 點矩陣與遙控器螢幕上隨機顯示 10 次數字跳動動畫，增加遊戲氣氛。
image

3.將抽出的號碼加入陣列列表「k_award」中。
image

4.「遙控器」左上角紅色「按鈕 o」重新再玩，除原有的積木外，也要在重設時，一併將儲存已抽出號碼的陣列列表「k_award」清空。
image

5.加入「遙控器」上的「按鈕 2」與「按鈕 3」用來顯示最近已抽出號碼的第 1~5 個與第 6~10 個。
image

四、加入 Blockly 程式積木註解

如果程式比較複雜或是多人協同時，可以在積木上按右鍵 / 加入註解
image
選按積木前面的「？」，跳出註解區塊後，就能開始將程式碼的說明加入其中，方便日後檢視。
image

五、進階版賓果遊戲模擬器實測：

賓果進階實測


※ 延伸閱讀：

留言

張貼留言