Java講義

Android 講義 2012.07.10 目錄 第一章安裝環境...2 第一節 jdk...2 第二節 eclipse...11 第三節安裝 android sdk...18 第四節建立 AVD 模擬環境...33 第五節 eclipse 環境設定...38 第六節建立第一個 android 專案...42 第七節擷取 android 裝置的畫面...51 第二章程式範例...54 第一節猜數字比大小...54 第一項建立專案...54 第二項建立介面佈面檔...54 第三項主程式...55 第二節影像圖庫...57 第一項介面佈局檔...57 第二項建立一個新的 class ImageAdapter...58 第三項主程式...60 第三節 Android 使用 WebView 建立程式...63 第一項修改 AndroidManifest.xml 檔案...63 第二項修改 main.xml...65 第三項建立 mainwebview.xml...66 第四項建立 Activity 主程式...67 第五項建立 golink01 程式...69 第六項建立 golink02...70 1

第一章 安裝環境 android 的開發環境 建議使用 jdk eclipse android sdk 的整合開發環境 以下 就分別 來安裝這三個環境 開始 android 的程式設計 第一節 jdk 1. 在 Google 搜尋 jdk 第一個連結就是 點按進入官方網站 2

2. 由以下畫面可以看到 製作講義時是 Java SE 7u2 的版本 因此這裡是以這個版本為例 之 後 的 操 作 請 依 你 當 時 下 載 的 版 本 為 主 動 作 都 差 不 多 請 按 JDK 下 方 的 Download 3

3. 請選擇 Accept License Agreement 才能下載檔案 4

4. 由於我是使用 Windows 7 64 位元的系統為例 因此我下載 Windows x64 的檔案 如 果系統是 32 位元的 就下載 Windows x86 的檔案 若是使用 Fedora Redhat 系列 的 Linux 系統 可以下載對應的 rpm 檔案直接安裝 若是使用 ubuntu debian 系列的 Linux 系統 請下載 tar.gz 的壓縮檔 解開壓縮檔再進行安裝 這部份的詳細動作 可以 參閱官方的線上文件 或由 google 搜尋看看 5

5. 這是下載的檔案 雙按檔案進行安裝的動作 以下 jdk 的安裝動作可能會比較長一些 請耐心等候 6. 按 Next 繼續 6

7. 按 Continue 繼續 8. 開 啟 檔 案 總 管 點 選 到 安 裝 資 料 夾 底 下 的 bin 目 錄 以 這 個 例 子 來 說 點 選 到 C:\Program Files\Java\jdk1.7.0_02\bin 這裡 由於我安裝的是 Java SE 7u2 的版本 因此路徑是在 Java 底下的 jdk1.7.0_02 如果你安裝是 Java SE 7u3 或 7u4 可能就會 變成 jdk1.7.0_03 或 jdk1.7.0_04 不一定 總之 開啟檔案總管 一層一層的點選資料 夾 找到 Java 的資料夾 再找到 jdk 資料夾的位置 就對了 7

9. 在檔案總管上方的位置列點一下 可以按 右鍵 複製 複製 jdk 底下的 bin 資料夾的 位置 10. 在左方的目錄樹的 電腦 右鍵 內容 11. 點按系統對話框左方的 進階系統設定 會開啟系統內容對話框 選擇第三個 進 階 頁籤 再點按下方的 環境變數 會再開啟一個環境變數對話框 在下方的系統 變數裡找到 Path 項目 按 編輯 鈕 8

12. 在下方的變數值欄位的最後面 先輸入一個 ; 符號 再按 右鍵 貼上 將之前複 製的 C:\Program Files\Java\jdk1.7.0_02\bin 路徑貼上來 按 確定 將所有對話框 關閉 13. 前項動作完成後 可以測試看看 按左下方的視窗鍵 輸入 cmd 再點按上方篩選 出來的 cmd.exe 程式 9

14. 分別輸入 java -version 和 javac -version 只要能看到顯示程式的版本號 就表 示 jdk 安裝完成 也能正常使用了 10

第二節 eclipse 15. 在 google 搜尋 eclipse 第一個就是官方網站 請點按進入官網 11

16. 在官方網站右方 就會看到 Download Eclipse 的連結 點按進入 12

17. 網頁應該會自動因應你的作業系統而顯示正確的環境 目前畫面顯示的就是 Windows 環 境下的 eclipse 檔案 如果不正確 可以由右上方的下拉選單選擇 這裡有很多 Eclipse 的相關程式可以下載 以我們目前而言 建議選擇 Eclipse IDE for Java EE Developers 這個版本 比較恰當一些 我做測試開始的作業系統 是 Windows 7 的 64 位 元 環 境 因 此 我 就 選 擇 Eclipse IDE for Java EE Developers 項目右方的 Windows 64 Bit 選按連結下載 如果你的系統是 32 位元 就請下載 32 位元的檔案 13

18. 按下載的符號就開始下載的動作 儲存檔案時 建議直接存到 C:\底下即可 19. 我將 eclipse 下載的檔案存放於 C:\底下 在這裡按 右鍵 7-zip Extract Here 會 將 eclipse 檔案解壓縮在 C:\根目錄下 14

20. 解壓縮完成後 請點按進入 C:\eclipse 資料夾裡 其中有一個 eclipse.exe 檔案 雙按就 可以執行 eclipse 的整合開發環境 就像網路上看到的綠色軟體一樣 不用安裝 直接執 行就可以了 因此 之後若要啟動 eclipse 的開發環境 執行 C:\eclipse\eclipse.exe 即可 21. 第一次執行 會顯示以下的對話框 詢問工作目錄要放在什麼位置 建議將它指定在比 較方便管理的位置 例如我設定為 D:\eclipseWorkspace 同時 我會勾選 Use this as the default and do not ask again 項 目 將 它 設 定 為 預 設 值 之 後 再 執 行 eclipse 時 就不會再詢問這個問題 15

22. 這是 eclipse 的使用介面 將左上方 Welcome 直接按 x 關閉即可 23. 下圖的介面 大概是我們最常使用的操作環境 正中央的就是輸入程式碼的編輯區 在 右方還有 Outline Task List 二個頁籤 我習慣將它拉到下方和其它頁籤並列 提供程式 碼編輯區最大的空間 16

24. 直接將 Outline Task List 二個頁籤拖曳下來即可 操作介面會變成以下的樣子 eclipse 還可以做一些設定 我們稍侯再處理 17

第三節 安裝 android sdk 25. 在 google 搜尋 android sdk 第一個就是官方網站 點按進入官方網站的連結 26. Windows 的環境有二個項目可以選擇下載 我個人建議使用 zip 的檔案格式 因為可以 通用於 Windows 與 Linux 的環境 下載的檔案直接存放於 C:\即可 18

27. 在下載的 android sdk 檔案上按 右鍵 7-Zip Extract Here 28. 解壓縮為 C:\android-sdk-windows 的資料夾 這個位置等會要用到 19

29. 由於 android sdk 更新頻繁 不過 大致上依官方網頁的動作進行都可以順利完成 因此 我們搭配網頁上的關鍵動作一併說明 畫面稍微往下捲動 底下有個 Installing the SDK 的連結 請點選看看說明內容 20

30. 其中 Step 1 Step 2 的我們都設定好了 直接看 Step 3 這裡主要是跟我們說明如何在 eclipse 裡安裝 ADT(Android Development Tools) Plugin 這個動作我們還沒進行 因此 請點按其中的 Installing the ADT Plugin 連結 31. 再往下一些 會看到網頁 Downloading the ADT Plugin 的說明 接下來就依指示操作 21

32. 選按工具列上方的 Help / Install New Software... 33. 再按右方的 Add... 鈕 22

34. 在對話框的 Name 欄位裡輸入 ADT Plugin 這裡其實只要輸入自己能辦別的名稱即 可 在 Location 欄位輸入 https://dl-ssl.google.com/android/eclipse/ 這個連結直 接由網頁複製過來貼上即可 最後按 OK 35. eclipse 會由 Location 欄位所取得的位置 下載更新相關的套作資訊 稍等一下 會看到 底下顯示 Developer Tools 請勾選它 另外 展開的話會看到其中包含四個項目 按 Next 鈕繼續 23

36. 顯示安裝的動作會包含這四個項目 請按 Next 繼續 37. 選擇 I accept the terms of the license agreements 再按 Finish 開始安裝 24

38. 下載中 也需要一些時間 39. 會看到顯示以下的對話框 直接按 OK 繼續即可 40. 看到這個對話框表示完成一半 請按 Restart Now 會重新啟動 eclipse 25

41. 重新啟動 eclipse 之後 再稍等一下就會顯示以下對話框 前面安裝的是 android 開發的 工具 這裡要安裝的則是符合 android 各版本所需要使用的 Android APIs 請維持預設的 Install new SDK 再勾選二個項目 上方的項目表示安裝最新版 本的 Android API 撰寫講義的這個時間 最新版本是 4.0.3 下方的項目表示要安 裝 2.1 版本的 大約有 97%的裝置支援 2.1 的版本 如果使用 2.1 的 Android API 來 開發程式 可以提供最多裝置使用 另外 在 Target Location 欄位 請按右方的 Browse...鈕選擇正確的資料夾 就 是 之前 我們 從 android sdk 官方 網站 下載 的檔 案 以這 裡的 例子 來看 應 該是 C:\android-sdk-windows 都設定完成後 按 Next 繼續 26

42. 詢問我們是否需要將相關統計資訊回傳 提供統計和改善的訊息 請自行選擇 按 Finish 繼續 43. 下載取得一些資訊 這裡應該不會等太久 27

44. 這裡列出相關的套件 目前看到有四個 按 Accept All 再按 Install 開始安裝 45. 相關套件下載安裝 這裡就需要一些時間了 28

46. 前項動作安裝完成後 我們可以點按 Window / Android SDK Manager 47. 這裡會顯示我們安裝的套件有那些 在右方 Status 欄位顯示 Installed 的表示己經安裝到 系統 你可以考慮勾選 4.0.3 和 2.1 的所有項目 按右下方的 Install xx packages... 鈕進行安裝 29

48. 同樣的 也是選 Accept All 再按 Install 開始安裝 49. 由底下的狀態可以知道目前的進度 這也會需要一些時間 如果不想等待 可以按右下 方的紅色按鈕停止 30

50. 下載安裝完成後 對話框還在 也不會顯示彈跳視窗 從下方的狀態列顯示 Done loading packages 知道己經完成套件安裝的動作 不過 右下方的按鈕還是會顯示 Install xx packages... 的文字 不用理會 如果再按下去 又會重新再進行下載安裝 的動作 只要看到狀態列顯示 Done loading packages 的訊息 直接將對話框關掉就 可以了 31

51. 在網頁上 還有個說明 我們可以更新環境變數的 Path 將 android sdk 裡的二個目錄 加進來 方便後續使用 52. 大致的動作和前項說明相同 分別將 C:\android-sdk-windows\tools C:\androidsdk-windows\platform-tools 這二個路徑加到系統環境變數的 Path 項目裡 32

第四節 建立 AVD 模擬環境 53. android 程式設計的初期 還不需要實際的裝置 我們可以使用模擬環境來測試 執行 Window / AVD Manager 54. 在這個對話框的標題 就知道 AVD 表示 Android Virtual Device 按右方的 New... 33

55. 對話框裡請輸入以下內容 Name 欄位請輸入 AVD2.1 這裡可以自行修正 主要能知道它的版本即可 Target 欄位請選擇 Android 2.1 API Level 7 由於我們前面只安裝 4.0.3 與 2.1 版本的 API 因此這裡應該也只會有這二種類型 如果要使用 4.0.3 版本所提供的 API 這裡就必須選擇相對應的項目 這裡還會看到有 google API 這在後面的例子 會用到 有需要時再建立新的 AVD 即可 SD Card 欄位我設定 256 MB 即可 Skin 欄位請選擇 Built-in 的 HVGA 這個解析度暫時就夠了 其它幾個的解 析度比較高 暫時還不需要 各欄位都設定好之後 按 Create AVD 建立 34

56. 只要能在這裡看到我們剛才所建立的 AVD2.1 基本上就表示己經建立完成 我們可以來 測試看看 請點選我們剛才建立的 AVD2.1 再按 Start... 57. 按 Launch 繼續 35

58. 啟動 AVD 需要一些時間 看到這個視窗 表示我們有一個模擬的 android 裝置可以使用 使用滑鼠按住 AVD 裡的桌面 左右拖曳就可以切換不同的視景 59. 操作上就和真的很類似 用滑鼠將底下的頁籤拉上來 就可以看到各個應用程式 36

60. 如果要將 AVD 轉成橫向 可以按 Ctrl + F11 切換 再按一次又可以切換為直向 37

第五節 eclipse 環境設定 在正式開發之前 我們先做幾個簡單的環境設定 61. 執行 Window / Preferences 38

62. 展開 General / Editors / Text Editors 勾選右方的 Show line numbers 可以使 程式碼編輯器顯示行號 39

63. 選擇 General / Workspace 在 Text file encoding 這裡 選擇 Other 的 UTF8 可以將 eclipse 裡的程式碼 預設為 utf-8 編碼 將來程式碼移植到不同的系統 可 以正常顯示而不會變成亂碼 40

64. 另外 如果將來撰寫程式碼 覺得文字太小 可以在 General / Appearance / Colors and Fonts 這裡設定字型和字型大小 41

第六節 建立第一個 android 專案 65. 在 eclipse 裡的程式 大多以專案的型式處理 因此 我們要先建立一個專案 才能在專 案裡再建立程式 請先點選 File / New / Project 66. 選擇 Android / Android Project 按 Next 42

67. 在上方的 Project Name 欄位輸入 android001 這是專案名稱 你可以自己設定 專 案名稱的制定有一些共通的規定 建議使用英文 由於我們在練習過程 因此我可能會 再加個流水號 按 Next 繼續 43

68. 選擇 Android 2.1 再按 Next 繼續 這裡必須配合 AVD 的環境 因此暫時先使用 Android 2.1 做為開發環境 44

69. 這裡的各個欄位 請分別填入資料如下 Application Name 欄位應該會預設顯示 Android001 這是我們剛才輸入的專案 名稱 Package Name 欄 位 可 以 自 行 輸 入 這 裡 的 例 子 是 輸 入 為 tw.idv.kingbig.android.test001 這是依建議將網域名稱倒過來輸入 這種方式 很像網域名稱的管理方式 主要的目的是希望全世界 android 開發人員所建立的套 件是唯一的 不會和其他人建立的套件重覆 如果沒有的話 就自行虛擬一個也可 以 勾 選 的 Create Activity 欄 位 就 用 預 設 值 即 可 這 裡 是 用 [Application Name] + Activity 的方式產生的 如果要自行修改也可以 Min SDK Versin 欄位也使用預設值即可 這裡選擇的 7 表示最基本的執行需 求是 Android 2.1 的版本 各欄位設定完成 按 Finish 即可 45

70. 新增專案之後 在左方會顯示剛才所新增的專案資料夾 雙按可以將它展開 71. 在專案資料夾底下的 src 資料夾 會有一個 Package Name 欄位所輸入的資料夾 再展 開後 就會看到主程式 在 android 裡的程式 我們稱為 Activity 它還是和 java 一樣 是一個純文字檔案 按 Ctrl + F11 可以執行程式 讓我們試試看 執行第一個專案 46

72. 每一個專案 第一次執行時都會顯示以下視窗 以 android 專案來說 選最上方的 Android Application 再按 OK 鈕繼續 73. 啟動 AVD 需要一些時間 顯示以下視窗的話 將有鎖的圖案拖曳到右方 就可以看到 android 桌面 47

74. 顯示第一個專案的執行結果 它在跟我們 say hello 48

75. 在 eclipse 的左方 是一個 Package Explorer 以下的視窗內容 我將幾個比較重要 常 用的資料夾展開 分別說明如下 src 資料夾 在這個資料夾底下還會有一個 Package Name 的 資 料 夾 在 Package Name 資料夾之下 就是原始程式 也就是 android 的 Activity 目前只有一個 Activity 隨著我們所撰寫的程式功能增加 Activity 的 數量也會越來越多 bin 資料夾 當我們按 Ctrl + F11 執行程式 eclipse 會將程式編譯為可以在 android 執行 的 apk 檔案 也就是說 只要我們將這個 apk 檔案存放到 android 狀置 就可以執行囉 res 資料夾 這是資源存放的資料夾 可以當 作專案裡所有 Activity 可以調用資源的資源池 這裡又可以細分為幾個 以下分別獨立說明 res / values 資料夾 就是一個定義 宣告字 串變數的檔案 我們可以將程式裡會使用到 的字串 全部放在這裡宣告 這種做法有個 好處 像是多國語系 或是我們要修改語句 表達的內容 只要來這裡修改就可以 將來 程式的維護更新的工作會方便很多 res / layout 資料夾 這是專問負責版面排版 控制的功能 每個 Activity 都有需要在 android 裝置上顯示文字框 訊息框 按鈕...等 都需要控制這些元件擺放的位置 就需要在這裡透過一個 xml 檔案負責各個元件位置的管理 res / drawable 資料夾 這裡是存放圖像檔案的 實際上會看到這裡細分為三個資料 夾 分別表示高解析度 中等解析度 低解析度的圖像檔案資源池 如果有圖檔 影像需要跟著程式一起打包的 就放在這裡 AndroidManifest.xml 檔案 這不是資料夾 是一個 xml 檔案 這個檔案很重要 前 面說明過 src 資料夾裡是存放 Activity 檔案 但是在這裡專案裡 有那些 Activity 是 可 以 執 行 的 必 須 在 AndroidManifest.xml 檔 案 裡 宣 告 過 的 才 算 數 沒 有 在 AndroidManifest.xml 裡宣告的 Activity 是無法執行的 另外 我們使用 Android 程 式 可能都會先說明會需要使用到裝置的網路 GPS 記憶卡...等 也都必須在這 裡先宣告過 Android 裝置才會允許 Activity 存取裝置上的功能 以上的說明很重要 可以讓我們對整個 android 專案結構有個概念上的認識 如果 可以 請再重頭閱讀一篇 相信後續開發 android 程式時 會變的簡單許多 49

76. 前項簡單的說明了在 eclipse 環境 所看到各個資料夾的作用 應該還記得 我們將 eclipse 的工作目錄設定在 D:\eclipseWorkspace 資料夾 在這裡 我們和檔案總管 裡的 D:\eclipseWorkspace 實際資料夾的結構互相對照 會發現大部份的架構是相同 的 只有 Package Name 在檔案總管理 會建立為多層的資料夾結構 這也是為了將來 開發多個專案後 能夠有條理 而且方便管理的方式 瞭解 eclipse 與 Windows 檔案總 管的資料夾對照的關係 要存放資源檔案 也可以從這裡著手囉 50

第七節 擷取 android 裝置的畫面 不論是實際的 android 裝置 或是 AVD 的虛擬裝置 如果我們需要擷取影像 都可以依照以 下的方式處理 77. 連 結 android 裝 置 或 是 啟 動 AVD 可 以 執 行 Window / Open Perspective / DDMS 切換 eclipse 的操作視景 如 果 在 Window / Open Perspective 沒 有 直 接 看 到 DDMS 視 景 的 話 請 按 Window / Open Perspective / Other 再由對話框選擇 DDMS 視景即可 51

78. 在左方的 Devices 頁籤 會看到一個照相機的 icon 點按一下 79. 系統會顯示 Device Screen Capture 對話框 按 Refresh 鈕可以將 android 裝置上的畫面 重新擷取更新過來 按 Save 就可以將擷取的畫面存檔 52

80. 我在 AVD 上按退出鈕 退出了應用程式回到 android 的桌面 我又按了 Refresh 鈕 重 新擷取 AVD 桌面的圖案 如果擷取畫面的動作完成 可以按 Done 關閉對話框 81. 要 從 DDMS 的 視 景 回 到 android 開 發 環 境 的 視 景 也 就 是 java 的 視 景 請 執 行 Window / Open Perspective / Java 82. 也可以直接按最右上方的 DDMS 與 Java 直接切換不同的視景 53

第二章 程式範例 第一節 猜數字比大小 這個程式是個簡單的遊戲 目要是由電腦亂數產生一個 1~99 之間的數字 由我們來猜猜這 個數字是多少 我們猜數字時 電腦會回應我們 要再大一些 或者是再小一些 藉此提示 我們猜到最後的那個數字 第一項 建立專案 請依前面介紹的動作 建立一個新的 Android 專案 專案名稱就隨便設定為 a01 第二項 建立介面佈面檔 我們使用最基本的介面就可以 建立以下幾個元件 1. 一個輸入文字框(EditText) 提供使用者可以輸入數字 2. 一個按鈕(Button) 在前一個 EditText 欄位輸入數字之後 按下按鈕 由系統判斷數 是否正確 或者是顯示提示文字 3. 三個文字顯示框(TextView) 輔助使用者測猜數字使用 一個要顯示使用者猜測數字 區間的最小值 另一個是顯示最大值 另一個顯示是否猜中數字 參考如下 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_horizontal" android:orientation="vertical" > <EditText android:id="@+id/et01" android:layout_width="match_parent" android:layout_height="wrap_content" android:inputtype="number" android:text="50" android:textsize="20sp" /> <Button android:id="@+id/bt01" 54

android:layout_width="match_parent" android:layout_height="wrap_content" android:text="比大小" /> <TextView android:id="@+id/tv01" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="最小值" android:textsize="20sp" /> <TextView android:id="@+id/tv02" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="最大值" android:textsize="20sp" /> <TextView android:id="@+id/tv03" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="繼續加油" android:textsize="20sp" /> </LinearLayout> 第三項 主程式 參考如下 package tw.a01; import android.app.activity; import android.os.bundle; import android.view.view; import android.widget.button; import android.widget.edittext; import android.widget.textview; public class A01GuessNumber extends Activity { EditText et01; 55

Button bt01; TextView tv01; TextView tv02; TextView tv03; Integer pcnum; Integer a02=0; //計算猜了幾次 @Override public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.mainguessnumber); setupviewcomponent(); } private void setupviewcomponent() { // TODO Auto-generated method stub et01 = (EditText) findviewbyid(r.id.et01); bt01 = (Button) findviewbyid(r.id.bt01); tv01 = (TextView) findviewbyid(r.id.tv01); tv02 = (TextView) findviewbyid(r.id.tv02); tv03 = (TextView) findviewbyid(r.id.tv03); pcnum=(int) (Math.random()*99+1); // tv03.settext(tv03.gettext() + pcnum.tostring()); tv01.settext("0"); tv02.settext("100"); bt01.setonclicklistener(bt01click); } Button.OnClickListener bt01click = new Button.OnClickListener() { public void onclick(view v) { // TODO Auto-generated method stub int a01; String s01=""; a02=a02+1; 56

a01=integer.parseint(et01.gettext().tostring()); if (a01>pcnum) { s01="再小一些"; tv02.settext(et01.gettext().tostring()); } else if (a01<pcnum) { s01="再大一些"; tv01.settext(et01.gettext().tostring()); } else if (a01==pcnum) { s01="恭禧你猜到了~~ 總共猜了 " + a02 + " 次! 再重玩一次!!"; a02=0; setupviewcomponent(); } tv03.settext(s01); } }; } 第二節 影像圖庫 建立一個新的 Android 專案 這裡是以 a06 專案為例 第一項 介面佈局檔 這個專案的介面佈局檔也很簡單 如下 1. 一個是 Gallery 是要給縮圖使用的 2. 一個是 ImageSwitcher 一般我們要顯示圖片 可能會使用基本的 ImageView 元件 在這裡我們使用 ImageSwitcher 的目的 是為了要讓圖片可以有淡入淡出的效果 佈局檔內容如下 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <Gallery 57

android:id="@+id/gal" android:layout_width="match_parent" android:layout_height="wrap_content" android:spacing="10sp" /> <ImageSwitcher android:id="@+id/imgswi" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margintop="20sp" /> </LinearLayout> 第二項 建立一個新的 class ImageAdapter 這個類別是要給主程式呼叫使用的 這裡會產生縮圖的陣列 package tw.a06; import android.content.context; import android.view.view; import android.view.viewgroup; import android.widget.baseadapter; import android.widget.gallery; import android.widget.gallery.layoutparams; import android.widget.imageview; public class ImageAdapter extends BaseAdapter { /** * 宣告二個全域變數, * Context 類別的 cont 變數, 是要儲存物件的執行環境. * Integer[] 類別的 imgarr 變數, 是儲存縮圖的陣列 */ Context cont; Integer[] imgarr; public ImageAdapter(Context c) { /** * 這裡會將圖片物件的環境傳送到 cont 物件. */ 58

cont = c; } public void setimagearray(integer[] imgarr) { /** * 將傳送來的 imgarr 物件(這個是第 28 行宣告的 imgarr), * 轉送到這個 class 的全域變數 imgarr (這是 19 行宣告的 imgarr). */ this.imgarr = imgarr; } public int getcount() { // TODO Auto-generated method stub /** * 取得縮圖陣列的長度 */ return imgarr.length; } public Object getitem(int position) { // TODO Auto-generated method stub /** * 取得圖片的位置 */ return position; } public long getitemid(int position) { // TODO Auto-generated method stub return position; } public View getview(int position, View convertview, ViewGroup parent) { // TODO Auto-generated method stub /** * 這裡的動作, 是取得縮圖的資訊, 並且取得縮圖, * 最後再將它傳送回去給呼叫的程式. */ ImageView v = new ImageView(cont); v.setimageresource(imgarr[position]); v.setadjustviewbounds(true); v.setlayoutparams(new Gallery.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT)); 59

return v; } } 第三項 主程式 package tw.a06; import android.app.activity; import android.content.pm.activityinfo; import android.os.bundle; import android.view.view; import android.view.animation.animation; import android.view.animation.animationutils; import android.widget.adapterview; import android.widget.gallery; import android.widget.gallery.layoutparams; import android.widget.imageswitcher; import android.widget.imageview; import android.widget.viewswitcher.viewfactory; public class A06Activity extends Activity implements ViewFactory { /** Called when the activity is first created. */ ImageSwitcher imgswi; Gallery gal; Integer[] imgarr = { R.drawable.img001, R.drawable.img002, R.drawable.img003, R.drawable.img004, R.drawable.img005, R.drawable.img006, R.drawable.img007, R.drawable.img008, R.drawable.img009, R.drawable.img010, R.drawable.img011, R.drawable.img012, R.drawable.img013, R.drawable.img014, R.drawable.img015, R.drawable.img016, R.drawable.img017, R.drawable.img018, R.drawable.img019, R.drawable.img020, R.drawable.img021, R.drawable.img022, R.drawable.img023 }; Integer[] thumbimgarr = { R.drawable.img001s, R.drawable.img002s, R.drawable.img003s, R.drawable.img004s, R.drawable.img005s, R.drawable.img006s, 60

R.drawable.img007s, R.drawable.img008s, R.drawable.img009s, R.drawable.img010s, R.drawable.img011s, R.drawable.img012s, R.drawable.img013s, R.drawable.img014s, R.drawable.img015s, R.drawable.img016s, R.drawable.img017s, R.drawable.img018s, R.drawable.img019s, R.drawable.img020s, R.drawable.img021s, R.drawable.img022s, R.drawable.img023s }; @Override public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); setupviewcomponent(); } private void setupviewcomponent() { // TODO Auto-generated method stub /** * 由資源裡抓出對應的元件. */ imgswi = (ImageSwitcher) findviewbyid(r.id.imgswi); gal = (Gallery) findviewbyid(r.id.gal); /** * 這個動作會產生 public class A06Activity extends Activity implements ViewFactory * 同時再產生 public View makeview() { } 的方法 */ imgswi.setfactory(this); /** * 設定 ImageSwitcher 在切換圖片是, 是用 淡入淡出 的方式處理 */ imgswi.setinanimation(animationutils.loadanimation(this, android.r.anim.fade_in)); imgswi.setoutanimation(animationutils.loadanimation(this, android.r.anim.fade_out)); /** * 這裡使用的 ImageAdapter 物件, 就是我們自行建立的 ImageAdapter 的 class. * 接下來所使用的方法, 就和 ImageAdapter 裡所建立的方法有關係. * 在這裡所產生的 imgadap 物件, 會同時將 圖片縮圖 傳給它, * 因此, 在 imgadap 物件裡, 會取得所有的圖片縮圖. */ 61

ImageAdapter imgadap = new ImageAdapter(this); imgadap.setimagearray(thumbimgarr); /** * gal 是 main.xml 上方的 gallery 元件, 主要是顯示很多的圖片縮圖. * 在這裡, 我們將 ImageAdapter 類別所產生的 imgadap 物件, 傳送給 gal 物件. * 所以, 底下這二行的動作, * 1.主要是由 imgadap(取得所有圖片縮圖)將圖片顯示出來. * 2.設定捲動時, 要隨時取得目前所選擇的圖片是那一個. */ gal.setadapter(imgadap); gal.setonitemselectedlistener(adaviewitemsellis); } public View makeview() { // TODO Auto-generated method stub /** * 這個是由於 第 16 行的 implements ViewFactory 所產生的 unimplement 方法. * 主要是設定 gallery 的圖片要能等比例縮放, 以及設定置中對齊. */ ImageView v = new ImageView(this); v.setbackgroundcolor(0xff000000); v.setscaletype(imageview.scaletype.fit_center); v.setlayoutparams(new ImageSwitcher.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT)); return v; } AdapterView.OnItemSelectedListener adaviewitemsellis = new AdapterView.OnItemSelectedListener() { public void onitemselected(adapterview<?> arg0, View arg1, int arg2, long arg3) { // TODO Auto-generated method stub /** * 這裡會隨時取得目前縮圖陣列裡, 是取得那一個圖片, * 必須將它取出傳送給 ImageSwitcher 類別所產生的 imgswi 物件, * imgswi 物件就會做圖片淡入淡出的動態效果. */ imgswi.setimageresource(imgarr[arg2]); 62

} public void onnothingselected(adapterview<?> arg0) { // TODO Auto-generated method stub } }; } 第三節 Android 使用 WebView 建立程式 請先安裝好 Android 的開發環境 建立一個專案 接下來看看我們使用簡單的 WebView 就 能建立一個很實用的程式哦 第一項 修改 AndroidManifest.xml 檔案 <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="tw.idv.kingbig.browserintent" android:versioncode="1" android:versionname="1.0" > <uses-sdk android:minsdkversion="7" /> <uses-permission android:name="android.permission.internet" /> <application android:icon="@drawable/ic_launcher" android:label="@string/app_name" > <activity android:label="@string/app_name" 63

android:name=".browserintentactivity" > <intent-filter > <action android:name="android.intent.action.main" /> <category android:name="android.intent.category.launcher" /> </intent-filter> </activity> <activity android:name=".golink01" android:label="@string/app_name_link01"> </activity> <activity android:name=".golink02" android:label="@string/app_name_link02"> </activity> </application> </manifest> 64

第二項 修改 main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <Button android:id="@+id/golink01_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="文字 1" /> <Button android:id="@+id/golink02_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="文字 2" /> </LinearLayout> </LinearLayout> 65

建立 mainwebview.xml 第三項 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal" > <WebView android:id="@+id/web_view" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1.0" /> </LinearLayout> 66

第四項 建立 Activity 主程式 package tw.idv.kingbig.browserintent; import android.app.activity; import android.content.intent; import android.os.bundle; import android.view.view; import android.widget.button; public class BrowserIntentActivity android.view.view.onclicklistener { extends Activity implements /** Called when the activity is first created. */ private Button golink01button; private Button golink02button; @Override public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); findviews(); } private void findviews() { // TODO Auto-generated method stub golink01button = (Button)findViewById(R.id.golink01_button); golink01button.setonclicklistener(this); golink02button = (Button)findViewById(R.id.golink02_button); golink02button.setonclicklistener(this); 67

}; public void onclick(view v) { switch (v.getid()) { case R.id.golink01_button: Intent igolink01 = new Intent(this, golink01.class); startactivity(igolink01); break; case R.id.golink02_button: Intent igolink02 = new Intent(this, golink02.class); startactivity(igolink02); break; } } } 68

第五項 建立 golink01 程式 package tw.idv.kingbig.browserintent; import android.app.activity; import android.os.bundle; import android.view.view; import android.webkit.webview; public class golink01 extends Activity implements android.view.view.onclicklistener { /** Called when the activity is first created. */ private WebView webview; @Override public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.mainwebview); findviews(); } private void findviews() { // TODO Auto-generated method stub webview=(webview) findviewbyid(r.id.web_view); openbrowser(); }; private void openbrowser() { String s01=new Act=2300&MP=24"); String("http://www.kingbig.idv.tw/indexAndroid.php? 69

webview.getsettings().setjavascriptenabled(true); webview.loadurl(s01); } @Override public void onclick(view v) { // TODO Auto-generated method stub } } 第六項 建立 golink02 package tw.idv.kingbig.browserintent; import android.app.activity; import android.os.bundle; import android.view.view; import android.webkit.webview; public class golink02 extends Activity implements android.view.view.onclicklistener { /** Called when the activity is first created. */ private WebView webview; @Override public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.mainwebview); findviews(); } private void findviews() { 70

webview=(webview) findviewbyid(r.id.web_view); openbrowser(); }; private void openbrowser() { String s01=new Act=3100&MP=40"); String("http://www.kingbig.idv.tw/indexAndroid.php? webview.getsettings().setjavascriptenabled(true); webview.loadurl(s01); } @Override public void onclick(view v) { // TODO Auto-generated method stub } } 71