第7章設計界面布局本章我們將講解如何在Android中進行界面布局。通過本章的學習，讀者將掌握如何使用Android提供的一些布局類，LinearLayout、TableLayout、FrameLayout、RelativeLayout以及AbsoluteLayout。并且我們將學習一些功能與布局類類似的容器視圖。.7.1創立界面在Android應用中創立界面通常有兩種方法，一種是使用xml創立布局，這在之前的范例程序中經常被使用，也許讀者朋友們對其已經比較熟悉了。第二種那么是在Java代碼中實現，與使用xml文件相比，它更加靈活，更加“動態〞，缺點那么是會使代碼比較混亂，不如使用xml文件那樣結構清晰。.7.1.1使用xml資源創立布局使用xml資源文件創立界面時，文件位于/res/layout文件夾下。該方法是創立界面最方便也是最常用的方法，在創立時你需要為它賦予一些屬性，當然在之后的程序代碼中你還可以對其進行修改。.7.1.2使用代碼創立布局如果你不愿意使用xml來創立布局，或者某些時候，使用xml創立布局反而不方便，這個時候你可以選擇在Java代碼中完成布局的創立工作。事實上，運行后效果如以下圖所示：.7.2使用布局類AndroidSDK為我們提供了5個布局類，他們是：線性布局〔LinearLayotu〕、絕對布局〔AbsoluteLayout〕、表格布局〔TableLayout〕、關系布局〔RelativeLayout〕、框架布局〔FrameLayout〕。本節將逐一講解這些類的使用方法和技巧。.7.2.1使用絕對布局絕對布局〔AbsoluteLayout〕視圖是指為該布局內的所有子視圖指定一個絕對的坐標。言歸正傳，我們來觀察具體的絕對布局的使用方法。1.通過xml資源創立絕對視圖運行后，界面顯示到效果如下圖：.2.通過代碼創立絕對布局在代碼中實現動態進行布局會比較麻煩一些，要使用代碼實現絕對布局需要以下5個步驟：〔1〕創立需要顯示的組件對象；〔2〕創立布局參數對象；〔3〕創立絕對布局對象；〔4〕將組件對象添加到布局對象中，并賦予其相應的布局參數；〔5〕使用setContentView()方法將布局顯示；

.運行代碼后在模擬器中我們可以得到如圖1所示界面，而在真機測試時得到的界面卻如圖2所示：圖1圖2.7.2.2使用線性布局線性布局是開發人員在開發中使用最多的一類布局，甚至在Android新建工程時默認的布局都是LinearLayout。線性布局的作用是將所有的子視圖按照橫向或者縱向有序地排列。這里不得不提到線性布局特有的一個屬性android:orientation，該屬性的作用是指定本線性布局下的子視圖排列方向：如果設置為“horizontal〞那么表示水平，方向為從左向右；假設設置為“vertical〞那么表示垂直，方向為從上向下。將多個線性布局嵌套可以完成大局部希望實現的效果。.1.使用xml編寫線性布局在一個整體的垂直線性布局中有四個子視圖，他們從上到下依次為TextView、LinearLayout、TextView、LinearLayout，接著在子視圖的第一個LinearLayout中，從左向右排列了一排ImageView，第二個LinearLayout中，從上到下排列了一列ImageView。如果你愿意，你還可以繼續向下層嵌套，當然最好不要嵌套太深的層數，因為這會大大地降低顯示效率。其框架結構如下圖：.理解了本段代碼的框架結構后我們再運行代碼，看看效果是不是和我們希望的一樣，效果如下圖：.2.使用代碼編寫線性布局使用Java代碼編寫線性布局會比較麻煩，而且他們的層級結構會不顯得沒有xml代碼那么清晰，后期修改代碼時，包括改變參數時都會需要更多的工作量。運行代碼，效果如下圖：.7.2.3使用框架布局框架布局非常簡單而搞笑，如果使用層級視圖工具〔HierarchyViewertool〕你會發現所有的布局都是在一個總體的框架布局中。事實上，我們的主界面〔Home界面〕就是使用的框架視圖，每個小應用都是一個子視圖。1.使用xml文件創立框架視圖首先我們準備一張圖片，如下圖：.將其指定為在父視圖的底部，與此同時他們都通過：android:gravity="center"將文字定位在了本視圖的中間。將程序運行，我們會看到如以下圖所示的效果：.2.在Java代碼中編寫框架視圖在Java中編寫框架布局的代碼與編寫線性布局類似，需要使用一些LayoutParams來設置屬性，運行以上代碼段，最后展示的效果與xml資源文件的布局方法是完全一樣的。.7.2.4使用表格布局表格視圖有些類似于我們平時使用的Excel表格，它將包含的子視圖放在一個個單元格內，我們可以控制布局的行數以及列數。使用TableLayout可以很方便地構建計算器、撥號器等使用界面。.1.使用xml文件創立表格布局TableLayout與LinearLayout相似，添加到表格布局中的每個TableRow中的按照添加的先后順序從上到下一次排列，然后添加到每個TableRow中的子視圖按照添加順序從左至右排列。運行后，顯示效果如以下圖所示：.2.使用Java代碼編寫表格視圖使用Java代碼編寫表格視圖時，需要使用兩列參數設置分別是TableLayout.LayoutParams和TableRow.LayoutParams使用時需要注意。.7.2.5使用關系布局關系布局可以通過指定視圖與其他視圖的關系來確定其自身的位置，如位于某視圖的上方、下方、左方、右方等，還可以指定它位于父布局的中間，右對齊、左對齊等等。這樣可以防止使用多重布局，有效地提高了效率。.接下來，我們一起來完成一個有趣的實例，通過關系布局完成一個經典的太極八卦圖，首先我們要準備一些圖片，分別表示八卦的各個方位，如組圖所示：.接下來讓我們通過關系布局將這些雜亂的圖片們組裝起來吧！1.使用xml代碼創立關系布局通過閱讀程序中的注釋相信大家應該可以獨立完成閱讀和理解工作，接下來我們就一起來看看運行之后的效果圖吧！.接下來讓我們總結一下關系布局中需要使用的屬性，如表所示：屬性描述值android:layout_centerInParent在父視圖中正中心true/falseandroid:layout_centerHorizontal在父視圖的水平中心線true/falseandroid:layout_centerVertical在父視圖的垂直中心線true/falseandroid:layout_alignParentTop緊貼父視圖頂部true/falseandroid:layout_alignParentBottom緊貼父視圖底部true/falseandroid:layout_alignParentLeft緊貼父視圖左部true/falseandroid:layout_alignParentRight緊貼父視圖右部true/falseandroid:layout_alignTop與指定視圖頂部對齊視圖ID，如“@id/***”android:layout_alignBottom與指定視圖底部對齊視圖ID，如“@id/***”android:layout_alignLeft與指定視圖左部對齊視圖ID，如“@id/***”android:layout_alignRight與指定視圖右部對齊視圖ID，如“@id/***”android:layout_above在指定視圖上方視圖ID，如“@id/***”android:layout_below在指定視圖下方視圖ID，如“@id/***”android:layout_toLeft在指定視圖左方視圖ID，如“@id/***”android:layout_toRight在指定視圖右方視圖ID，如“@id/***”.2.使用Java代碼創立關系布局完成了八卦圖之后，讓我們嘗試使用Java代碼直接編寫界面，并完成一張四神獸圖。首先依然準備4張絢麗的圖片，如下圖：

.接下來讓我們一起把這四個神獸按照它們應該守護的方向〔東——青龍，西——白虎，南——朱雀，北——玄武〕組織起來。運行代碼，我們會看到如喜愛圖所示效果：.7.3使用其他布局容器我們還可以使用一些特殊的布局容器來進行屏幕的設計和布局，如使用ListActivity、TabActivity等，本節將講解如何使用這些特殊的布局容器。.7.3.1使用TabActivity擁有Android使用經驗的讀者對于以下圖肯定不陌生，這是聯系人列表的顯示方式，也許很多讀者都很向往能夠寫出同樣這么“酷〞的布局來，本小節就講解Android中標簽頁的使用。.使用TabActivity入門非常簡單，但要使用好它卻需要大家多花一些時間的。標簽頁中的每一個標簽都是一個非常高效的視圖容器，它可以由XML預先定義也可以由TabFactory產生。接下來我開始學習使用TabActivity進行界面設計。使用TabActivity需要如下幾個步驟：〔1〕繼承TabActivity；〔2〕獲得TabHost對象；〔3〕實例化布局對象；〔4〕創立并設置TabSpec對象；〔5〕向TabHost中添加TabSpec完成標簽頁的使用；.運行程序后顯示如下圖：.7.3.2自定義TabHost

在自定義TabHost時需要注意，在創立TabHost時需要以下3個步驟：〔1〕在xml資源文件中創立TabHost節點，并將id設置為tabhost；〔2〕創立TabWidget子節點，并設置id為tabs；〔3〕創立FrameLayout子節點，用作顯示內容，其id為tabcontent；.在代碼中使用TabHost與TabActivyt比較相似，不同的只有開始的兩個步驟，其具體步驟如下：〔1〕使用setContentView()方法顯示界面〔2〕獲得TabHost對象并設置〔3〕創立并設置TabSpec對象〔4〕向TabHost中添加TabSpec完成標簽頁的使用.運行程序后，效果顯示如下圖：.7.3.3使用對話框對話框的功能非常強大，你可以通過對話框的按鈕來判斷用戶的操作，也可以在對話框中添加布局和Widget，以便實現更多的功能。Dialog是所有對話框的基類，在平時我們真正使用的對話框有兩種：AlertDialog以及ProgressDialog。.1.AlertDialog與Activity一樣，Dialog也是有生命周期的，我們可以主動調用的兩個函數分別是：showDialog〔intid〕：使Dialog對話框出現dismissDialog(intid)：使Dialog對話框消失.在新建AlertDialog時，我們一般需要設置以下幾個重要局部：〔1〕setTitle〔Stringname〕：設置標題，顯示在對話框的title位置。〔2〕setMessage〔Stringmessage〕：設置消息，這個是顯示在對話框中的信息。〔3〕setIcon〔intresId〕：設置圖片，參數是資源的ID。〔4〕setPositiveButton〔Stringname，OnClickListenerlistener〕：設置確定按鈕。〔5〕setNegativeButton(Stringname，OnClickListenerlistener)：設置取消按鈕。〔6〕setNeutralButton〔Stringname，OnClickListenerlistener〕：設置忽略按鈕。.運行代碼后，我們會看到如下圖效果：.在listener中你可以完成所有你希望進行的工作，這里就簡單設置為null。運行后效果如下圖：.如果你希望提供用戶多個選擇時，可以將AlertDialog.Builder.setSingleChoiceItems(CharSequence[]items,intcheckedItem,OnClickListenerlistener)改為：AlertDialog.Builder.setMultiChoiceItems(CharSequence[]items,boolean[]checkedItems,OnMultiChoiceClickListenerlistener)將之運行后得到如下圖的多項選擇框效果：.如果你有自己的數據源需要顯示，這個時候我們可以通過自己定義的ListView來顯示，并且自己的ListView我們可以更好地進行界面的設計和響應，通過setView()方法我們可以將自定義的視圖顯示到Dialog上，運行代碼后我們可以得到如下圖效果：.你同樣可以自定義多項選擇框，運行后顯示效果如下圖：.2.使用ProgressDialog除了AlertDialog外，我們還經常使用ProgressDialog來為用戶提供更好地操作體驗，比方我們在使用地圖效勞時搜索地點一般需要很長的時間，而這個時候我們就可以使用進度對話框來提示用戶“正在搜索，請稍后〞等信息了。運行后效果如下圖：.7.3.4使用滑動抽屜在使用Android時，我們經常會操作滑動抽屜，實際上滑動抽屜是一種特殊的Widget，不使用時它是隱藏的，需要時可以將之拖出進行操作。使用滑動抽屜時需要如下幾個步驟：1.xml局部〔1〕在xml中使用<SlidingDrawer>節點，并設置屬性。〔2〕設置handle局部，即為手柄，可以理解為抽屜的把手〔3〕設置content局部，這是抽屜的內容，也就是將抽屜拉開時我們看到的界面局部。.2.Java局部在Java局部，你可以不寫任何代碼，但這樣SlidingDrawer的成效