App Inventor

亞洲大學資訊多媒體應用學系

林致宇助理教授

簡介

• App Inventor for Android 是Google實驗室的其中一個功能

• 讓使用者可於瀏覽器內輕鬆地建立一個• 讓使用者可於瀏覽器內輕鬆地建立一個Android應用程式–設計外觀–像拼圖一樣地定義程式的行為–於模擬器或手機上執行測試

資料來源：http://appinventor.googlelabs.com/about/

圖片來源： http://appinventor.googlelabs.com/learn/whatis/index.html

設定

• 開發所使用的電腦的設定–系統需求– Java環境測試–安裝『App Inventor Setup』–安裝『App Inventor Setup』

• 手機或模擬器的設定–手機上的設定–建立App於手機上–建立App於模擬器上

設定

• 開發所使用的電腦的設定–系統需求– Java環境測試–安裝『App Inventor Setup』–安裝『App Inventor Setup』

• 手機或模擬器的設定–手機上的設定–建立App於手機上–建立App於模擬器上

電腦的設定

• 系統需求– Macintosh (with Intel processor): Mac OS X 10.5, 10.6– Windows: Windows XP, Windows Vista, Windows 7– GNU/Linux: Ubuntu 8+, Debian 5+

• 瀏覽器– Mozilla Firefox 3.6 or higher – Apple Safari 5.0 or higher – Google Chrome 4.0 or higher – Microsoft Internet Explorer7 or higher

Java環境測試

• Java Test Page– http://www.java.com/en/download/testjava.jsp

Java 6 (also known as Java 1.6)

Java環境測試

• AppInventor Java Test– http://appinventor.googlelabs.com/ode/JWSTest/A

ppInvJWSTest.html

安裝『App Inventor Setup』

• 模擬器/手機驅動程式(部份常見手機而已)

• Instructions for Windows (Mac OS X, Linux)

設定

• 開發所使用的電腦的設定–系統需求– Java環境測試–安裝『App Inventor Setup』–安裝『App Inventor Setup』

• 手機或模擬器的設定–手機上的設定–建立App於手機上–建立App於模擬器上

手機上的設定

• 『設定』�『應用程式』�『開發』

建立App於模擬器上

• Hello Purr–三個工具

• Designer (設計)

• Blocks Editor (行為)• Blocks Editor (行為)

• Emulator (模擬器)

–檔案下載• kitty picture

• meow sound

開始

• http://appinventor.googlelabs.com

Designer

Blocks Editor

Emulator

(Blocks Editor)

(Designer)

參考資料

• About – App Inventor for Android, http://appinventor.googlelabs.com/about/

• Learn – App Inventor for Android,http://appinventor.googlelabs.com/learn/http://appinventor.googlelabs.com/learn/

Second Example

• 設計一個按鈕–按鈕文字的初始值為『Hello World』

–按下按鈕後，按鈕文字改為『Hello Kitty』

–再按下按鈕後，按鈕文字恢復為『Hello World』–再按下按鈕後，按鈕文字恢復為『Hello World』

Designer

Blocks EditorVersion 1

Blocks EditorVersion 2

Emulator

課堂練習

• HelloPurr–おかえりなさいませ！ご主人様！

• ButtonText–改成圖片按鈕–改成圖片按鈕