Android Programing 1 Emulator Debug Tools App BMI

人機介面 Android Programing 1

進一步介紹開發環境 Emulator Debug Tools 建立第一個App – BMI Demo Code Plan & Design Coding- UI描述 與設計 程式流程解讀 與使用者對話- Dialog Activities & Intent Data Storage 多媒體-圖片與聲音 後續延伸-Web Service

Emulator 為什麼需要模擬器? – 方便開發 – 特定情況下, 可透過模擬器模擬(EX: 兩支手機) 啟動與使用 Android 模擬器 更改模擬器的設定-外觀, 方向切換 練習: Emulator's Communication Reference: http: //developer. android. com/guide/developing/tools/emulator. html

關於BUG Bug Developers 5

Android 提供的Debug 環境 Debug View 設定/觀察中斷點 留Log : Logcat – Logcat with Console monitor Trace. View 6

開發 具簡介- DDMS 透過DDMS 模擬手機的各種狀況 – try: 傳簡訊 – try: 打電話 Reference : http: //code. google. com/intl/zh. TW/android/reference/ddms. html 7

REFERENCE: Debug Tasks – android/docs/guide/developing/debug-tasks. html Logcat – http: //developer. android. com/intl/zh. TW/guide/developing/tools/adb. html#logcat • Filtering Log Output • Controlling Log Output Format 輔助開發 具-Open. Intents : – http: //code. google. com/p/openintents/wiki/Sensor. Simulator 使用 Android 虛擬機器 – http: //code. google. com/p/androidbmi/wiki/Play. Emulator ADB 指令: – http: //developer. android. com/intl/zh. TW/guide/developing/tools/adb. html 8

進一步介紹開發環境 Emulator Debug Tools 建立第一個App – BMI Plan & Design Pratice 01 - UI Lay. Out Pratice 02 -完成程式邏輯 Pratice 03 -進行重構 Pratice 04 -Menu, Dialog Pratice 05 -Activities & Intent Pratice 06 -Data Storage Pratice 07 -圖片與動畫

怎麼做一個 App? Reference : http: //whoswho. openfoundry. org/workshop/details/61 -kalug--android-. html

今日目標完成一個簡單的應用程式 – Weight / BMI 計算器 – 參考來源: • http: //sites. google. com/site/gasodroid/Home/andr oidentry 3 11

針對目標, 我們要做的事: 需求分析 – 輸入 • 體重 • 身高 – 輸出 • BMI結果 • 建議 Lay. Out- 介面設計, UI 決定, 操作方式決定 – 各種可用介面元件列表 • http: //developer. android. com/guide/tutorials/views/index. html – Edit Text • http: //developer. android. com/intl/zh. TW/reference/android/widget/Edit. Text. html – Get/set. Text method – Edit. Text Attributes » android: numeric – Text. View – Button 15

針對目標, 我們要做的事: 需求分析 – 輸入 • 體重(Edit. Text) • 身高(Edit. Text) – 輸出 • BMI結果((Text. View) • 建議(Text. View) Lay. Out- 介面設計, UI 決定, 操作方式決定 – 各種可用介面元件列表 • http: //developer. android. com/guide/tutorials/views/index. html – Edit Text • http: //developer. android. com/intl/zh. TW/reference/android/widget/Edit. Text. html – Get/set. Text method – Edit. Text Attributes » android: numeric – Text. View – Button 16

進一步介紹開發環境 Emulator Debug Tools 建立第一個App – BMI Plan & Design Pratice 01 - UI Lay. Out Pratice 02 -完成程式邏輯 Pratice 03 -進行重構 Pratice 04 -Menu, Dialog Pratice 05 -Activities & Intent Pratice 06 -Data Storage Pratice 07 -圖片與動畫

Lay. Out Editbox : 輸入身高 Editbox: 輸入體重 Button: 開始計算 Text. View: 顯示結果 Text. View: 顯示建議 20

進一步介紹開發環境 Emulator Debug Tools 建立第一個App – BMI Plan & Design Pratice 01 - UI Lay. Out Pratice 02 -完成程式邏輯 Pratice 03 -進行重構 Pratice 04 -Menu, Dialog Pratice 05 -Activities & Intent Pratice 06 -Data Storage Pratice 07 -圖片與動畫

範例(Project_Workshop) Study 02 : 完成程式邏輯部分, Study 03 : 進行重構, Study 04 : 加入選單, 並且透過選單, 建立Dialog. Study 05 : 建立Activity , 並透過Intent呼叫, 以及 activity之間的資料傳遞 Study 06 : – 1. Preference – 2. Daily widget Record ->SQLite Study 07 : Frame Animation機制介紹 23

開發期間可以參考的文件 官方Reference文件 – http: //developer. android. com/intl/zh. TW/reference/packages. html 官方的開發基礎教學文件 • http: //developer. android. com/intl/zh-TW/guide/index. html 有哪些Views (Lay. Out 和UI)可以使用 – http: //developer. android. com/intl/zh-TW/guide/tutorials/views/index. html <Android. SDK目錄>docs 也可以 – EX: C: Androiddocs 底下有相同的文件, 不用上網查 25

Lay. Out-將描述字串抽離到 String. xml "請輸入身高" 改到 Strings. xml 裡的 msg_Height "170" 改到String. xml裡的 value_Height. . . 26

Lay. Out-使Edit. Text只能輸入數字 Edit. Text->Property-> Numeric, 選擇 Integer 27

Code-入口 28

Code- UI 類別的宣告 宣告一個Button Instance 29

Button 事件處理的方式 Listener 31

Result 33

進一步介紹開發環境 Emulator Debug Tools 建立第一個App – BMI Plan & Design Pratice 01 - UI Lay. Out Pratice 02 -完成程式邏輯 Pratice 03 -進行重構 Pratice 04 -Menu, Dialog Pratice 05 -Activities & Intent Pratice 06 -Data Storage Pratice 07 -圖片與動畫

建立Alert Dialog http: //developer. android. com/intl/zh. TW/reference/android/app/Dialog. html http: //developer. android. com/intl/zh. TW/guide/topics/ui/dialogs. html 36

建立Alert Dialog 37

39

40

41

Result 42

Result 43

進一步介紹開發環境 Emulator Debug Tools 建立第一個App – BMI Plan & Design Pratice 01 - UI Lay. Out Pratice 02 -完成程式邏輯 Pratice 03 -進行重構 Pratice 04 -Menu, Dialog Pratice 05 -Activities & Intent Pratice 06 -Data Storage Pratice 07 -圖片與動畫

目標: 改良顯示的方式 - 我們想將結果獨立顯示在 新的頁面 將會使用到: – another Activity – Intent Reference : http: //code. google. com/p/androidbmi/wiki/Life. Cycle

先來複習Activity的生命週期 獨立Activity / 相依Activity 的差異, 以及使 用時機 – EX: 2 Activity • 1. Main. Activity • 2. Report 46

– Main. Activity: on. Create -> on. Start -> on. Resume • 呼叫Report: on. Pause(1) > on. Create(2) -> on. Start(2) -> on. Resume(2) -> on. Stop(1) • 回到 Main. Activity : on. Pause(2) -> on. Restart(1) -> on. Start(1) > on. Resume(1) -> on. Stop(2) -> on. Destroy(2) 47

開始- 預備建立新的Activity 5. 1 建立新的Activity class 5. 2 建立新的Lay. Out xml file 48

Intent的使用呼叫新的Activity, 資料的傳遞 Android. Manifest. xml – 註冊Activity, service, receiver, provider – uses-permission : 存取SMS、能否存取聯絡簿、相機功 能, … Reference – Android manifest • http: //developer. android. com/reference/android/R. styleable. html#Android. Manifest – Intent Action • http: //developer. android. com/reference/android/co ntent/Intent. html 50

Result 51

進一步介紹開發環境 Emulator Debug Tools 建立第一個App – BMI Plan & Design Pratice 01 - UI Lay. Out Pratice 02 -完成程式邏輯 Pratice 03 -進行重構 Pratice 04 -Menu, Dialog Pratice 05 -Activities & Intent Pratice 06 -Data Storage Pratice 07 -圖片與動畫

Preference-取得/記錄偏好設定 Step 01 Step 02 54

[Optional]Database Reference: Hand. Out_Day 2 : 6 -4~6 -8 記錄每天的體重- SQL Lite on Android 日期的選擇 - Date. Picker UI 的使用 55

進一步介紹開發環境 Emulator Debug Tools 建立第一個App – BMI Plan & Design Pratice 01 - UI Lay. Out Pratice 02 -完成程式邏輯 Pratice 03 -進行重構 Pratice 04 -Menu, Dialog Pratice 05 -Activities & Intent Pratice 06 -Data Storage Pratice 07 -圖片與動畫

變胖或變瘦的動畫顯示 Image. View Animation Script 58

Step: 將圖形匯入resource/drawable 建立Frame Animation XML 在report. xml 中加入Image. View 在程式中建立實體 – Image. View – Animation. Drawable 設定動畫播放的xml, 指定 On. Touch Event中觸發動畫事件 59

使用location. Manager 實作Location. Linster – void on. Location. Changed(Location) – voidon. Provider. Disabled(String) – void on. Provider. Enabled(String) – void on. Status. Changed(String, int, Bundle) 63

Example 實作Location. Linster public class Map. Activity extends Activity implements Location. Listener { public void on. Create(Bundle saved. Instance. State) { super. on. Create(saved. Instance. State); set. Content. View(R. layout. main); } @Override public void on. Location. Changed(Location location) {. . . } 64

Example 使用Location. Manager // // // this); private Location. Manager mgr; 使用現在最好的定位方式 mgr = (Location. Manager) get. System. Service(LOCATION_SERVICE); Criteria criteria = new Criteria(); best = mgr. get. Best. Provider(criteria, true); mgr. request. Location. Updates(best, update. Time, 10, this); 僅使用GPS定位 mgr. request. Location. Updates(Location. Manager. GPS_PROVIDER, update. Time, 10, this); 僅使用Network(wifi或是cell tower)定位 mgr. request. Location. Updates(Location. Manager. NETWORK_PROVIDER, update. Time, 10, 65

Example 實作on. Location. Changed @Override public void on. Location. Changed(Location location) { lat. View. set. Text(get. String(R. string. lat) + location. get. Latitude()); long. View. set. Text(get. String(R. string. longt) + location. get. Longitude ()); pro. View. set. Text(get. String(R. string. provider) + location. get. Provider()); } 66

Example - Result 67

記得設定權限 修改Android. Manifest. xml <uses-permission android: name="android. permission. ACCESS_COARSE_LOCATION"/> <uses-permission android: name="android. permission. INTERNET"/> <!－—如果要使用GPS定位--> <uses-permission android: name="android. permission. ACCESS_FINE_LOCATION"/>

使用Google Map API 取得Google Map 授權金鑰 在程式中使用Map. View 69

取得Google Map API 金鑰 Window → Preference → Android → Build → Default debug keystore 1 st • Execute DOS and get MD 5 • keytool –list –keystore “keystore path” 2 nd • http: //code. google. com/android/maps-api-signup. html • Enter MD 5 3 rd • Use the Maps API key in your Map. Activity or Map. View 70

Find Map. View map = (Map. View) find. View. By. Id(R. id. my. Map. View); Map. Controller mc = map. get. Controller(); 71

設定Google Library與權限 修改Android. Manifest. xml <manifest> <application > <uses-library android: name="com. google. android. maps" /> </application> <uses-permission android: name="android. permission. INTERNET” > </manifest>

Google Map API Result 73