Chapter 1: Introduction

Size: px

Start display at page:

Download "Chapter 1: Introduction"

懋招龙
5 years ago
Views:

目錄目錄 IX Part 1 擁抱 Android 單元 01 Android 造時勢或是時勢造 Android... 2 Android 從何而來... 3 Android 的功能應用和商機... 5 先睹為快 - Android 手機和平板電腦模擬器... 7 單元 02 安裝 Android 程式開發工具... 10 不同作業系統的開發工具版本.

1 目錄目錄 IX Part 1 擁抱 Android 單元 01 Android 造時勢或是時勢造 Android... 2 Android 從何而來... 3 Android 的功能應用和商機... 5 先睹為快 - Android 手機和平板電腦模擬器... 7 單元 02 安裝 Android 程式開發工具不同作業系統的開發工具版本...10 安裝 Android 程式開發工具的步驟...12 Android 程式開發工具的維護和更新...22 單元 03 建立 Android 應用程式專案修改程式的介面...29 範例 : 第一個 Android 應用程式專案單元 04 Eclipse 程式專案管理技巧根據已經寫好的程式檔來建立專案...32 根據 Android SDK 中的程式範例來建立專案...33 把建立好的 Android 程式專案載入 Eclipse...34 程式專案的管理和維護...35 Part 2 開發 Android 應用程式的流程單元 05 瞭解 Android 程式專案的架構和查詢 SDK 說明文件單元 06 使用 TextView EditText 和 Button 介面元件 TextView 介面元件...46 EditText 介面元件...48 Button 介面元件...49

2 XVIII Android 4.X 手機 / 平板電腦程式設計入門應用到精通範例 : 通訊錄程式單元 57 使用檔案儲存資料將資料寫入檔案的方法從檔案讀取資料的方法範例程式範例 : 讀寫檔案程式 Part 11 程式專案的整備工作和發佈單元 58 支援多語系和螢幕模式讓程式支援多語系的方法讓程式支援多種螢幕模式範例程式範例 : 同時支援多語系和螢幕模式的程式單元 59 開發不同 Android 版本程式的考量利用 Fragment 控制分頁或單頁顯示範例 : 使用 Fragment 開發同時適用手機和平板電腦的程式單元 60 取得螢幕的寬度高度和解析度取得螢幕的寬高和解析度取得程式畫面的寬和高利用 AndroidManifest.xml 檔設定程式執行的螢幕條件範例 : 利用程式碼取得螢幕的寬高和解析度單元 61 將程式安裝到實體裝置或在網路上發佈利用 Export Wizard 幫程式加上數位簽名和完成 zipalign 將程式上傳到 Google 的 Android Market 網站 Part 12 2D 和 3D 繪圖單元 62 使用 Drawable 物件從 res/drawable 資料夾的影像檔建立 Drawable 物件...544

3 目錄 XIX 在 res/drawable 資料夾中建立 xml 檔案格式的 Drawable 物件定義檔..545 在程式中建立 Drawable 型態的物件範例程式範例 : 使用 Drawable 物件的繪圖程式單元 63 使用 Canvas 繪圖範例 : 使用 Canvas 的繪圖程式單元 64 使用 View 在 Canvas 上繪製動畫程式繪製動畫的原理範例程式範例 : 繪製橢圓形動畫單元 65 使用 SurfaceView 進行高速繪圖使用 SurfaceView 的步驟範例程式範例 : 繪製橢圓形動畫單元 66 3D 繪圖 D 繪圖的基本觀念 D 繪圖程式範例 : 旋轉立體三角錐 Part 13 Google 地圖程式單元 67 使用 Google 地圖開發 Google 地圖應用程式的準備工作建立 Google 地圖應用程式的步驟範例程式範例 : 基本 Google 地圖程式單元 68 Google 地圖的進階用法地圖的縮放和拖曳功能加上鍵盤控制功能...592

4 59 程式的考量單元單元 59 開發不同 Android 版本程式的考量 513 開發不同 Android 版本 Android 版本 1.X 2.X 3.X 4.X 適用性 Google 剛開始發表 Android 平台的時候是以智慧型手機為目標, 後來當平板電腦出現之後, 便順應趨勢加入支援平板電腦的相關技術但是以現階段而言, Android 系統已經不再限制只能用在手機和平板電腦, 在 2011 年 5 月舉辦的 Google IO Conference 中,Google 對外公開表示, 未來 Android 的目標是成為所有智慧型裝置的核心, 例如現在正在推廣中的網路電視, 以及智慧家電像是洗衣機電冰箱空調系統等當然以目前來說, 這些智慧型家電或許還有些遙遠, Google TV 也尚未普及, 當前最熱門的 IT 產品還是手機和平板電腦, 而且這二者的特性和用途也最接近當程式設計人員在開發 Android 應用程式的時候, 最常見的困擾是如何讓程式能夠同時適用於手機和平板電腦這個問題牽涉到不同 Android 版本的功能支援, 還有就是如何讓程式的操作介面能夠同時適用不同螢幕尺寸的設備平板電腦螢幕的大小通常是手機螢幕的二倍以上, 因此有些時候我們必須針對平板電腦程式採用不同的操作介面編排方式前一個單元介紹的 res 資料夾命名技術可以用來區分手機和平板電腦的介面描述檔, 對於一些程式而言這個方法已經可以滿足它們的需要, 但是有些情況可能還要更複雜一些舉例來說, 如果手機程式因為螢幕太小必須將操作介面分成二頁來顯示, 像是我們前面的電腦猜拳遊戲範例, 必須將遊戲畫面和局數統計資料分開顯示如果換成在平板電腦上執行, 就可以讓遊戲畫面和局數統計資料同時顯示, 這種情況就不是單純使用 res 資料夾命名技術就能夠解決, 因為它還牽涉到程式碼運作流程的改變, 在手機上必須切換畫面, 但是在平板電腦執行時就不用根據以上的討論, 讀者應該能夠體會要開發同時適用多種 Android 平台版本和不同螢幕尺寸的程式並不是一個單純的問題對於操作介面比較簡單的程式來說也許很容易, 可是如果程式的操作介面比較複雜, 那麼就需要使用一些程式設計的技巧為了讓讀者有基本的法則可以遵循, 筆者特別整理出一個樹狀的決策流程如圖 59-1 首先第一個要考量的問題就是程式有沒有需要在不同的 Android 平台上執行, 如果只是一個學校的程式作業, 或是單純自己用來研究實驗的程式, 就不需要

5 514 Part 11 程式專案的整備工作和發佈考量不同 Android 平台的適用問題, 只要依照自己的需求選定一個 Android 平台, 然後在上面開發程式即可但是如果要將開發的程式公佈在網路上讓世界各地的人下載, 就必須謹慎考慮如何處理多種不同 Android 平台和螢幕尺寸的問題我們可以利用前一個單元介紹的資源資料夾命名技術, 或是本單元隨後介紹的 Fragment 技巧, 讓程式的操作介面能夠適應不同裝置的螢幕大小另外也可以藉由限制程式可以安裝的 Android 平台版本和裝置螢幕尺寸, 這一個部分留待下一個單元再作介紹圖 59-1 開發同時適用多種 Android 平台版本和不同螢幕尺寸程式的決策流程圖

6 單元 59 開發不同 Android 版本程式的考量利用 Fragment 控制分頁或單頁顯示有關 Fragment 的用法我們已經在單元二十五到二十八中介紹過, 包括最基本的靜態 Fragment 和利用程式碼動態顯示和隱藏 Fragment 如果程式的操作畫面包含比較多的元件, 那麼有可能在手機螢幕上必須將操作畫面分成二頁顯示, 但是如果換成在平板電腦上執行就可以用單頁顯示, 這個問題可以利用動態 Fragment 的技巧解決, 也就是單元二十八的範例程式中的 Fragment 控制技術以及 callback 函式, 但是程式的架構不需要像該範例那麼複雜, 或者可以說是單元二十八範例程式的簡化版讀者可以回頭參考單元二十八的範例程式, 它在執行的過程中, 使用者可以隨意控制局數統計畫面的顯示和隱藏, 而且為了示範完整的動態 Fragment 控制技巧, 我們還特別實作了二種局數統計畫面, 並且加上 Back Stack 的功能如果只是要利用 Fragment 讓程式能夠依照螢幕尺寸, 控制操作畫面的單頁或分頁顯示, 並不需要用到單元二十八範例程式這麼複雜的技巧, 只要在程式啟動時檢查螢幕大小, 然後決定要顯示的 Fragment 數目即可, 接著在程式執行的過程中, 再依照使用者的操作適當地變換 Fragment 以下我們以單元二十八的電腦猜拳遊戲為例, 將它修改成能夠依照螢幕尺寸自動調整 Fragment 的顯示個數, 請讀者依照以下步驟操作 : 執行檔案總管, 複製單元二十八的電腦猜拳遊戲範例程式的專案資料夾, 複製後可以重新命名利用 Eclipse 主選單的 File > Import 功能載入上一個步驟複製的程式專案在 Eclipse 左邊的專案檢視視窗中展開 res/layout 資料夾, 開啟其中的介面佈局檔 main.xml 原來的程式介面是直接建立一個 fragment 元件用來顯示遊戲畫面, 再利用一個 FrameLayout 元件用來動態載入局數統計畫面的 fragment 現在我們要將其中的 fragment 元件也改成使用 FrameLayout, 也就是說程式畫面中有二個 FrameLayout 元件, 這樣我們就可以利用程式碼控制每一個 FrameLayout 中顯示的 Fragment 當程式在平板電腦上執行時, 會同時顯示這二個 FrameLayout 元件, 並將遊

7 516 Part 11 程式專案的整備工作和發佈戲程式的 Fragment 放在第一個 FrameLayout, 局數統計畫面的 fragment 則顯示在第二個 FrameLayout 如果程式是在手機上執行, 同樣會將遊戲程式的 Fragment 放在第一個 FrameLayout, 局數統計畫面的 fragment 顯示在第二個 FrameLayout, 但剛開始只會顯示第一個 FrameLayout, 並將第二個 FrameLayout 隱藏等到使用者按下顯示結果按鈕時, 再將第一個 FrameLayout 隱藏, 換成顯示第二個 FrameLayout, 以下是修改後的介面佈局檔 : <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingleft="30dp" android:paddingright="30dp" android:paddingtop="10dp" > <FrameLayout android:id="@+id/frame1" android:layout_weight="1" android:layout_width="0px" android:layout_height="wrap_content" /> <FrameLayout android:id="@+id/frame2" android:layout_weight="1" android:layout_width="0px" android:layout_height="wrap_content" android:background="?android:attr/detailselementbackground" /> </LinearLayout> 在 Eclipse 左邊的專案檢視視窗中展開 src/( 套件路徑名稱 ) 資料夾, 開啟其中的主程式檔 Main.java 原來的程式是利用 GameFragment 類別中定義的 CallbackInterface 介面讓遊戲程式 ( 也就是 GameFragment) 能夠通知更新後的局數統計資料, 這裡我們還是繼續採用這種作法當主程式開始執行時, 我們呼叫 getresources() 方法取得 Resource 物件, 再呼叫 Resou rce 物件的 getconfiguration() 方法取得 Configuration 物件, 然後利用位元 mask 的運算檢查 screenlayout 屬性, 以取得螢幕大小的分

8 單元 59 開發不同 Android 版本程式的考量 517 類如果螢幕是屬於 xlarge 類別 ( 也就是平板電腦的螢幕 ), 就將 UITypeFlag 設定為 TWO_FRAMES 讓後續的程式同時顯示二個 fragment, 如果螢幕是屬於 small normal 或 large 類別 ( 也就是手機螢幕 ), 則將 UITypeFlag 設定為 ONE_FRAME 讓後續的程式只顯示一個 fragment 在 onresume() 方法中 ( 當程式畫面即將顯示時執行 ) 我們先將遊戲程式的 fragment 和局數統計畫面的 fragment 分別放到二個 FrameLayout 中, 然後判斷程式畫面是否已經設定好, 如果不是就依照 UITypeFlag 中的值決定是要同時顯示二個 FrameLayout 或是只顯示第一個 FrameLayout, 另外我們也不再需要 enablegameresult() 這個方法, 修改後的程式碼如下 : package... import... public class Main extends Activity implements GameFragment. CallbackInterface { private GameFragment fraggame; private GameResultFragment fraggameresult; private boolean buisettedok = false; enum UIType { ONE_FRAME, TWO_FRAMES; public UIType UITypeFlag; /** Called when the activity is first created. public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); // 取得裝置螢幕的大小的分類 switch (getresources().getconfiguration().screenlayout & Configuration.SCREENLAYOUT_SIZE_MASK)

9 518 Part 11 程式專案的整備工作和發佈 { case Configuration.SCREENLAYOUT_SIZE_SMALL: UITypeFlag = UIType.ONE_FRAME; break; case Configuration.SCREENLAYOUT_SIZE_NORMAL: UITypeFlag = UIType.ONE_FRAME; break; case Configuration.SCREENLAYOUT_SIZE_LARGE: UITypeFlag = UIType.ONE_FRAME; break; case Configuration.SCREENLAYOUT_SIZE_XLARGE: UITypeFlag = UIType.TWO_FRAMES; break; fraggame = new GameFragment(); fraggameresult = new protected void onresume() { // TODO Auto-generated method stub FragmentTransaction fragtran = getfragmentmanager(). begintransaction(); fragtran.replace(r.id.frame1, fraggame, "Game"); fragtran.replace(r.id.frame2, fraggameresult, "Game Result"); fragtran.commit(); if (buisettedok == false) { buisettedok = true; switch (UITypeFlag) { case ONE_FRAME: findviewbyid(r.id.frame1).setvisibility (View.VISIBLE); findviewbyid(r.id.frame2).setvisibility (View.GONE); break; case TWO_FRAMES: findviewbyid(r.id.frame1).setvisibility (View.VISIBLE); findviewbyid(r.id.frame2).setvisibility

10 單元 59 開發不同 Android 版本程式的考量 519 (View.VISIBLE); break; public void updategameresult(int icountset, int icountplayerwin, int icountcomwin, int icountdraw) { // TODO Auto-generated method stub if (findviewbyid(r.id.frame2).isshown()) { fraggameresult.updategameresult(icountset, icountplayerwin, icountcomwin, icountdraw); 開啟遊戲程式檔 GameFragment.java 並依照下列項目修改 : 1. 刪除介面 CallbackInterface 中的 enablegameresult() 方法, 因為我們不再讓使用者直接控制局數統計資料的顯示和隱藏另外也只提供一種局數統計資料畫面, 因此刪除 GameResultType 的定義 2. 程式中使用的 Button 數目也會隨著操作的簡化而減少 ( 參考下一個步驟的介面佈局檔的內容 ) 3. 介面佈局檔中的顯示結果按鈕必須隨著 FrameLayout 顯示的數目而改變, 當二個 FrameLayout 都顯示時, 顯示結果按鈕就要隱藏, 因為局數統計畫面已經顯示在螢幕上 ( 在平板電腦上執行時 ), 如果只有顯示一個 FrameLayout, 顯示結果按鈕就要啟動( 在手機上執行時 ) 4. 當在手機上執行時, 如果使用者按下顯示結果按鈕, 程式必須切換二個 FrameLayout 的顯示狀態, 也就是隱藏遊戲程式換成顯示局數統計畫面

11 520 Part 11 程式專案的整備工作和發佈以下列出相關的程式碼 : package... import... public class GameFragment extends Fragment { // 所屬的 Activity 必須實作以下介面中的 Callback 方法 public interface CallbackInterface { public void updategameresult(int icountset, int icountplayerwin, int icountcomwin, int icountdraw); ; private CallbackInterface mcallback; private Button mbtnscissors, mbtnstone, mbtnnet, mbtnshowresult; private TextView mtxtcomplay, mtxtresult; private int micountset = 0, micountplayerwin = 0, micountcomwin = 0, micountdraw = public View oncreateview(layoutinflater inflater, ViewGroup container, Bundle savedinstancestate) { // TODO Auto-generated method stub return inflater.inflate(r.layout.game, container, public void onactivitycreated(bundle savedinstancestate) { // TODO Auto-generated method stub super.onactivitycreated(savedinstancestate);

12 單元 59 開發不同 Android 版本程式的考量 521 public void onattach(activity activity) { // TODO Auto-generated method stub super.onattach(activity); try { mcallback = (CallbackInterface) activity; catch (ClassCastException e) { throw new ClassCastException(activity.toString() + "must implement GameFragment.CallbackInterface."); private void setupviewcomponent() { mtxtcomplay = (TextView)getView().findViewById(R.id.txtComPlay); mtxtresult = (TextView)getView().findViewById(R.id.txtResult); mbtnscissors = (Button)getView().findViewById(R.id.btnScissors); mbtnstone = (Button)getView().findViewById(R.id.btnStone); mbtnnet = (Button)getView().findViewById(R.id.btnNet); mbtnshowresult = (Button)getView().findViewById(R.id.btnShowResult); mbtnscissors.setonclicklistener(btnscissorslin); mbtnstone.setonclicklistener(btnstonelin); mbtnnet.setonclicklistener(btnnetlin); mbtnshowresult.setonclicklistener(btnshowresultlin); if (((Main)getActivity()).UITypeFlag == Main.UIType. TWO_FRAMES) { mbtnshowresult.setvisibility(view.gone); else { mbtnshowresult.setvisibility(view.visible); private Button.OnClickListener btnshowresultlin = new Button. OnClickListener() { public void onclick(view v) { getactivity().findviewbyid(r.id.frame1).setvisibility (View.GONE);

13 522 Part 11 程式專案的整備工作和發佈 getactivity().findviewbyid(r.id.frame2).setvisibility (View.VISIBLE); ; mcallback.updategameresult(micountset, micountplayerwin, micountcomwin, micountdraw); private Button.OnClickListener btnscissorslin = new Button. OnClickListener() { public void onclick(view v) { ( 和原來專案的程式碼相同 ) ; private Button.OnClickListener btnstonelin = new Button. OnClickListener() { public void onclick(view v) { ( 和原來專案的程式碼相同 ) ; private Button.OnClickListener btnnetlin = new Button. OnClickListener() { public void onclick(view v) { ( 和原來專案的程式碼相同 ) ; 開啟遊戲程式的介面佈局檔 game.xml 並修改按鈕如下 : <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android=" android:layout_width="400dp" android:layout_height="match_parent" android:layout_gravity="center_horizontal" > ( 和原來專案的程式碼相同 ) <TextView android:id="@+id/txtresult" android:layout_width="wrap_content"

14 單元 59 開發不同 Android 版本程式的考量 523 android:layout_height="wrap_content" android:textsize="20sp" android:textcolor="#0fffff" android:layout_margintop="20dp" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerhorizontal="true" android:textsize="20sp" android:layout_margintop="10dp" /> </RelativeLayout> 開啟局數統計畫面的介面佈局檔 game_result.xml, 在最後新增一個回到遊戲的按鈕當程式只顯示單一 FrameLayout 時使用者可以按下這個按鈕回到遊戲畫面 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" > ( 和原來專案的程式碼相同 ) <Button android:id="@+id/btnbacktogame" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:text="@string/btnbacktogame" android:textsize="20sp" /> </LinearLayout>

15 524 Part 11 程式專案的整備工作和發佈開啟局數統計畫面的程式檔 GameResultFragment.java, 在程式碼中加入對回到遊戲按鈕的控制如下, 這個按鈕的控制方式和前面步驟討論過的顯示結果按鈕類似 : package... import... public class GameResultFragment extends Fragment { private TextView medtcountset, medtcountplayerwin, medtcountcomwin, medtcountdraw; private Button public View oncreateview(layoutinflater inflater, ViewGroup container, Bundle savedinstancestate) { // TODO Auto-generated method stub return inflater.inflate(r.layout.game_result, container, public void onresume() { // TODO Auto-generated method stub super.onresume(); medtcountset = (EditText)getActivity().findViewById (R.id.edtCountSet); medtcountplayerwin = (EditText)getActivity().findViewById (R.id.edtCountPlayerWin); medtcountcomwin = (EditText)getActivity().findViewById (R.id.edtCountComWin); medtcountdraw = (EditText)getActivity().findViewById (R.id.edtCountDraw); mbtnbacktogame = (Button)getActivity().findViewById (R.id.btnBackToGame); mbtnbacktogame.setonclicklistener(btnbacktogamelin);

16 單元 59 開發不同 Android 版本程式的考量 525 if (((Main)getActivity()).UITypeFlag == Main.UIType. TWO_FRAMES) { mbtnbacktogame.setvisibility(view.gone); else { mbtnbacktogame.setvisibility(view.visible); private Button.OnClickListener btnbacktogamelin = new Button. OnClickListener() { public void onclick(view v) { getactivity().findviewbyid(r.id.frame1). setvisibility(view.visible); getactivity().findviewbyid(r.id.frame2). setvisibility(view.gone); ; public void updategameresult(int icountset, int icountplayerwin, int icountcomwin, int icountdraw) { medtcountset.settext(new Integer(iCountSet).toString()); medtcountdraw.settext(new Integer(iCountDraw).toString()); medtcountcomwin.settext(new Integer(iCountComWin).toString()); medtcountplayerwin.settext(new Integer(iCountPlayerWin). tostring()); 完成以上修改之後可以分別在平板電腦模擬器和手機模擬器上執行程式, 當在平板電腦執行時, 程式會同時顯示遊戲畫面和局數統計畫面如圖 59-2, 當在手機上執行時程式剛開始只會顯示遊戲畫面, 使用者必須按下顯示結果按鈕才會切換到局數統計畫面如圖 59-3

17 526 Part 11 程式專案的整備工作和發佈圖 59-2 程式在平板電腦執行時會同時顯示遊戲畫面和局數統計畫面圖 59-3 程式在手機上執行時只會顯示遊戲畫面, 使用者必須利用畫面下方的按鈕進行切換在這個範例中我們用到偵測螢幕大小分類的程式碼, 在開發能夠同時適用不同 Android 裝置的程式時, 螢幕的尺寸和解析度是很重要的考量, 因為它會影響程式介面的編排, 下一個單元我們將繼續介紹如何在程式中偵測螢幕的實際寬度高度和解析度

多媒體應用 13 新增專案並完成版面配置 <ExMusic01> <activity_main.xml> ImageView ID imgplay ImageView ID imgstop ImageView ID imgfront TextView ID txtsong TextView ID t

多媒體應用 13 新增專案並完成版面配置 <ExMusic01> <activity_main.xml> ImageView ID imgplay ImageView ID imgstop ImageView ID imgfront TextView ID txtsong TextView ID t 設定存取 SD 卡的權限 SD SD 13.1.4