練習(1)-Hello My cat

 專案目的:

-          於畫面顯示一隻貓的照片，按下後便發出貓叫聲。

 

學習目標:

1.      Button(按鈕)元件的使用。

2.      多媒體(Media)內聲音(sound)元件的使用。

3.      如何撰寫程式。

 

預先準備的文件: (可於網上搜尋下載)

1.      貓的圖片。

2.      貓叫的聲音檔(mp3格式)

 

[開始實作]

1.      開新專案(project)。選擇Project>Start New Project，輸出檔案名稱。

2.      於User Interface(使用者介面)內選擇Button(按鈕)元件，拖拉至中間的工作區。

3.      拖拉後會看到工作區多了一個按鈕元件，Components內的Screen1下也多了一個名叫Button1的元件。

4.      於Media內找出Sound元件，如下:

5.      拖拉至工作品。但留意，Sound元件屬不可見的(Non-visible components)，因此祇會出現於下方的Non-visible components內，而不會出現於模擬螢幕上。

6.      先上載相關的貓圖片及貓叫聲文件，於Components下方的Media區選擇Upload File(上載檔案)，上載貯放於電腦內的檔案。

7.      上載以上兩個檔案後，Media區內應顯示有2個檔案，如下:

8.      如想把Button1按鈕的圖片轉換成貓圖片，可選擇button1屬性內的image。

9.      於Image方框內可選擇已上載的多媒體文件的，選擇貓圖片的檔案，選好後，工作區的按鈕便會換成該圖片。

10.  聲音的元件也進行類似的做法，選擇屬性內的Source(來源)，選擇適當的文件，如下圖。留意，即使選好後，畫面不會播出該聲音檔。

11.  開始撰寫程式。按右上角的Blocks。

12.  會出現以下畫面，左方是磚塊程式區，各類預設的磚塊程式(Blocky Codes)皆位於這裡。

有些是內置的(Built-in)，是一些相對基本的程式，適用於所有元件。但不同元件各有獨立的磚塊程式，例如以下Button1及Sound1。

 

13.  先選擇Button1，會看到出現一些預先設置好的磚塊程式。由於現在我們想按下button1後會做一些動作，因此把when “Button1”.Click 的磚塊程式拖至程式工作區。由於這些磚塊程式屬於button1的，因此預設的物件的名稱便是button1。

when button1.click 的意思是當點擊(click)按鈕button1時，便會做以下的動作。

14.  播放聲音的程式位於Sound1元件內，選擇call “Sound1”.Play。

同樣，以下程式屬於sound1元件，因此預設的物件名稱便是sound1。

15.  程式應如下放置，已完成程式編寫。

程式的意思是當按鈕button1被點擊(click)時，便會呼叫(call)名稱是sound1的物件進行播放(play)。

16.  回至設計區(designer)。留意，按下Viewer的圖片，並不會執行程式的，必須把這方案送至模擬器或手機才能真正執行。

17.  跟第一個方案(Project)一樣，選擇Connect>AI Companion，把程式匯至手機瀏覽。

18.  完成。正常來說，按下手機的貓咪圖片，便會發出貓叫聲。

 

[進階作業:]

1.      如何放置多幅圖片?

2.      如何把9張圖片排成九宮格的狀況?

 

 

[練習]

1.      按下圖片(例如自己的圖片)便播放介紹的聲音文件。可於畫面上放置多個按鈕，多張圖片。

2.      設計一個鋼琴程式，按下不同琴鍵後會發出相關的聲音(例如DO, RE, ME等)