Introduction to AppInventor 2

Presentation on theme: "Introduction to AppInventor 2"— Presentation transcript:

1 Introduction to AppInventor 2
102年度資訊軟體人才培育雲端計算與服務課程發展專案計畫－ 雲端運算與行動計算課程 雲端運算與行動計算 Introduction to AppInventor 2 編撰教師：修平科技大學資訊管理系 張志宏 修平科技大學資訊網路技術系 陳文敬

2 MIT AppInventor

3 AppInventor 開發程序

4 AppInventor 設計關鍵 畫面設計(Components Designer – WebPage)
Screen = Components + Properties + Assets Assets = MP3 + Image + Video…etc 流程設計(Blocks Editor – Java Application) 以Block組裝方式完成流程控制 採取Event-Response設計模式 內建Block分類 Definition blocks(Variables, Procedures) Math blocks、Text blocks、Color blocks Logic blocks、Control blocks

5 安裝aiStarter 路徑必須為C:\Program Files\AppInventor 或 C:\Program Files(x86)\AppInventor

6 連線測試 測試網址：

7 經過上一頁的測試後而產生的測試封包

8 AppInventor Classic 開發環境
Step.1 安裝JRE6 以上(JDK也ok!) 測試可以啟動 Java Web Start! Step.2 下載並安裝 AppInventor 必須先以Google帳號登入! Step.3 以瀏覽器開啟AppInventor開發首頁

9

10

11 AppInventor 2 開發環境 Step.1 安裝AppInventor 2 setup(aiStarter)
必須先以Google帳號登入 Step.2 啟動aiStarter Local Web Server 用來呼叫ADB.exe 來安裝測試程式到模擬器(手機) Step.3 以瀏覽器開啟AppInventor開發首頁

12

13

14 Eclipse Android xml

15

16 What’s New in App Inventor 2?
App = Designer + Blocks (Component Editor + Block Editor) No JRE need JavaScript -- Real-time switching (IE is not supported) New Format of download Projects : *.aia , not *.zip Some new features in the Blocks Dropdowns Mutators Global and Local variables Colors

17 Blocks - Dropdown 元件/變數名稱 or 屬性值 新版 舊版 單一選擇無法更換

18 Blocks - Mutators 模組參數、區域變數、運算法(加法、串接字串…)

19 Global & Local variables
可視範圍(Scope)、生命週期(Lifecycle)

20 Color AppInventor 2 提供13種顏色，可換為預設的70種顏色 尚可自行合成新顏色 – 外加透明度
也可以將顏色分解為 RGBA (回傳值為：List)

21 Control Blocks 條件判斷、迴圈控制 關閉App/Screen

22 Control Blocks – 開啟其他視窗(Screen)

23 Control Blocks – 關閉視窗、回傳資料

24 模組化設計 - 副程式 精簡程式碼、方便重複使用

25 有參照對象的模組(inputs) 範例：以傳送簡訊為例(須有 1.對象 2.訊息)

26 元件總覽

27 元件總覽

28 元件總覽

29 元件總覽

30 實作測試

31 Level 1 兩數之和

32 測試看看 以上題為例子，另外編寫出一個 算式為(A?B)?C=? [?為四則運算] 提示訊息答案須為正解 提示訊息文字部分更改為自己學號
提示訊息按鈕文字更改為教室編碼