20190323屏東大學

屏東大學第二屆數位課程與教學

理論與實務學術研討會

註：上圖中我與俊青的主題寫反了

活動時間:3月23日(六)

工作坊的時間：13:30至16:00

活動地點:國立屏東大學屏商校區 圖資大樓905教室

講師介紹：黃文玉老師

• 高雄市新上國小電腦老師

• 高雄市SCRATCH推廣教師

• 教育部中小學教師運算思維增能研習種子教師

• Facebook S4A社團管理員之一

• 致力Scratch、Arduino、Micro:bit等創客教育的推廣(分享一系列的文章)

題目：micro:bit 利用5X5屏幕創作小遊戲

說明：

• micro:bit雖然只有小小一個，但內含二個按鈕、5 x 5 LED點矩陣、及一些感測器，麻雀雖小，但五臟俱全！

• 本次課程聚焦於5 x 5 LED點矩陣的作為上，這5X5LED屏幕除了可以顯示文字、數字、圖案外，還可以做遊戲創作，

• 這次我們會利用MakeCode視覺化積木軟體來設計簡單的遊戲【猴子接香蕉】及【貪吃蛇遊戲】或【井字遊戲】等進階版遊戲。

一、【燈光類】積木的不便

• 利用燈光類的積木，完成下面題目：按A鍵控制一顆LED燈亮燈向左移動，按B鍵控制一顆LED燈亮燈向右移動，程式如下：

• 由上可知，要製作一顆LED燈亮燈移動的程式，要先將原本位置的燈關閉，再點亮下一個位置的燈，如果要設計複雜的遊戲，此種燈光類積木可能負荷不了，因此創建了【遊戲積木】。

二、【遊戲類】積木的產生

• 補足燈光類木的不便與不足

• 將角色物件化(或圖層化)，跳脫LED的視野。(把角色看成是浮在LED上的一個物件，利用亮暗或閃爍LED燈來呈現，每個角色可控制各自的亮暗燈)

三、先利用【猴子接香蕉】的遊戲來熱身一下

• 一次只有一根香蕉掉下

• MakeCode視覺化積木程式編輯器 https://makecode.microbit.org/

• 作品說明：【猴子接香蕉】是猴子在最下方左右移動，上方有香蕉會從天而降，猴子要左右移動去接住香蕉

• 內容說明：

  • 角色：一共只有兩個角色(猴子、香蕉)

    • 猴子：猴子的起始位置在(2,4)，猴子只在最下方一排（Y＝4），利用按A、B鍵來控制左右移動

    • 香蕉：香蕉的起始位置在(0,0)，一開始會隨機出現在上方不同的位置，然後往下移動

  • 猴子接到香蕉得1分

  • 猴子如果沒接到香蕉死1次，死5次就GAME OVER

• 完整程式，請觀看講義

四、接下來做我最引以為傲的遊戲【貪吃蛇遊戲】

• 作品說明：

  • 一開始【蛇頭】出現在(2,2)，然後會往右移動，一格一格移動，移動速度會隨著分數增加而變快

  • 按A鍵蛇頭會右轉90度，按B鍵蛇頭會左轉90度

  • 另外，在舞台上會隨機出現一顆【水果】(設定一直閃爍，好方便辨識)

  • 控制【蛇頭】去吃【水果】，每吃一顆水果，得1分

  • 每得1分(或2分、3分)則蛇的長度增加一節 (可自行設定要得幾分，便會增加1節)

  • 如果蛇頭碰壁或碰到自己的身體則GAME OVER

  • 先嘗試做只有蛇頭的貪吃蛇遊戲(基本款如下)

• 認識【陣列】

  • 在電腦科學中，陣列資料結構（array data structure），簡稱陣列（Array），是由相同類型的元素（element）的集合所組成的資料結構，可以是數字、布林數(booleans)或字串的列表。其長度是它們所包含的項目數。陣列是靈活的，可以在陣列中的任何位置添加或刪除項目來增加或縮小長度(項目數)。

  • 當資料物件儲存在陣列中時，個別物件通常藉由非負整數的索引數字(索引位置)來選取。MakeCode陣列為一維陣列，其第一個元素的索引數字為0，可用如下的方式來創建一個陣列

• • • • 相當於：成績(0)=95、成績(1)=85、成績(2)=90、成績(3)=100 (0、1、2、3為索引數字)

• • 想想如何利用陣列來儲存蛇頭的X坐標及Y坐標，並判斷是否碰壁(將蛇頭移動的程式修改如下)

• 增加蛇身後的蛇之移動

  • 貪吃蛇移動後的坐標變化如下圖所示：

• • 由上可知

    • 進行坐標轉換時，要從最後一節蛇身開始取前一節的坐標，

    • 看有幾節蛇身就要轉換幾次

    • 各節坐標改到新的坐標後，讓各節的角色跟著移動到新坐標上

    • 最後蛇X陣列(0)、蛇X陣列(0)再取目前蛇頭所在的X、Y坐標值

    • 以下為此部份蛇身移動的程式

• • 除了上面碰到邊緣會死掉外，這遊戲蛇頭碰到其他身體也會GAME OVER

• • 另外，如果要讓蛇移動的速度會隨著分數增加而加快，要調整最下面的暫停時間

• 完整程式，如附件