相信通過前面15期的學習，Android的開發環境已經基本掌握了，如果仍有問題，歡迎到Android零基礎入門技術討論微信群交流，從本期開始正式來一步一步踏入Android開發之路。

Android應用開發的一項內容就是用戶界面的開發。Android提供了非常豐富的用戶界面組件，借助於這些用戶界面組件，開發者可以非常方便地進行用戶界面開發，而且可以開發出非常優秀的用戶界面。

一、界面UI元素介紹

Android應用是運行於手機系統上的程序，這種程序給用戶的第一印象就是用戶界面。接下來從以下幾個方面來認識了解Android的界面UI元素。

1.1視圖組件View

在Android中View類是最基本的一個UI類，基本上所有的高級UI組件都是繼承View類實現的。Android應用的絕大部分UI組件都放在android.widget包及其子包、android.view包及其子包中，可以看到Android應用的所有UI組件都繼承了 View類。View類是Android系統平臺上用戶界面表示的基本單元，View的一些子類被統稱為Widgets （工具），提供了諸如文本輸入框和按鈕之類的UI對象的完整實現。

一個視圖（View）在屏幕上占據了一塊矩形區域，它負責渲染這塊矩形區域（如將這塊矩形區域變成其他顏色），也可以處理這塊矩形區域發生的事件（如用戶單擊事件），並且可以設置這塊區域是否可見、是否可以獲取焦點等。

1.2視圖容器組件ViewGroup

View類有一個非常重要的子類ViewGroup，其為View的一個擴展，可以容納多個 View，通過ViewGroup類可以創建有聯系的子View組成的復合控件。

下圖表示Android圖形用戶界面的組件層次。

從上圖可以看出，多個視圖組件（View）可以存放在一個視圖容器（ViewGroup）中，該容器可以與其他視圖組件共同存放在另一個容器中，但是一個界面文件中必須有且只有一個容器作為根結點。

Android的所有UI組件都是建立在View、ViewGroup基礎之上的，Android采用了 “組合器”設計模式來設計View和ViewGroup。對於一個Android應用的圖形用戶界面來說，ViewGroup作為容器來盛裝其他組件，而ViewGroup裏除了可以包含普通View組件之外，還可以再次包含ViewGroup組件。

1.3布局組件Layout

Android的界面組件比較多，為了更好的管理用戶界面裏的各組件，Android提供了布局組件來進行管理。通過使用布局組件，Android應用的圖形用戶界面具有良好的平臺無關性。

目前Android中主要有六種布局，分別如下：

? LinearLayout（線性布局）：

按照水平或垂直的順序將子元素（可以是控件或布局）依次按照順序排列，每一個元素都位於前面一個元素之後。

? RelativeLayout（相對布局）：

按照子元素之間的位置關系完成布局的，作為Android系統五大布局中最靈活也是最常用的一種布局方式，非常適合於一些比較復雜的界面設計。

? TableLayout（表格布局）：

以行和列的形式對控件進行管理，每一行為一個TableRow對象，或一個View控件。

? FrameLayout（幀布局）：

將所有的子元素放在整個界面的左上角，後面的子元素直接覆蓋前面的子元素。

? AbsoluteLayout（絕對布局）：

將所有的子元素通過設置android:layout_x 和 android:layout_y屬性，將子元素的坐標位置固定下來。

? GridLayout（網格布局）：

是Android 4.0新增的布局管理器，把整個容器劃分成為行*列個網格，每個網格可以放置一個組件，另外，也可以設置一個組件橫跨多個列和多個行。

以上幾種布局類圖如下圖 所示：

關於布局組件的內容，會在後續課程進行詳細學習，此處不做過多說明。

1.4布局參數LayoutParams

LayoutParams是用來設置視圖布局的基類，基本的LayoutParams類只是用來描述視圖的寬度和高度。

Android提供的布局類都是LayoutParams的子類，LayoutParams的子類主要有：

? AbsListView.LayoutParams

? AbsoluteLayout.LayoutParams

? FrameLayout.LayoutParams

? LinearLayout.LayoutParams

? RadioGroup.LayoutParams

? RelativeLayout.LayoutParams

? TableLayout.LayoutParams

? TableRow.LayoutParams

? ViewGroup.MarginLayoutParams

? WindowManager.LayoutParams

其中常用的是RelativeLayout.LayoutParams、LinearLayout.LayoutParams、ViewGroup.MarginLayoutParams。將會在後續內容中陸續學習，此處不在贅述。

二、UI界面通用屬性和方法

View類是所有UI組件的基類，其包含的XML屬性和方法是所有組件都可使用的，接下來一起先來整體學習，如下表所示。

ViewGroup繼承了 View類，當然也可以當成普通View來使用，但ViewGroup主要還是當成容器類使用。但由於ViewGroup是一個抽象類，因此實際使用中通常總是使用ViewGroup 的子類來作為容器，例如各種布局管理器。

ViewGroup容器控制其子組件的分布依賴於ViewGroup.LayoutParams、ViewGroup. MarginLayoutParams兩個內部類。這兩個內部類中都提供了一些XML屬性，ViewGroup容器中的子組件可以指定這些XML屬性。

其中ViewGroup.LayoutParams所支持的兩個XML屬性如下：

? android:layout_width：指定該組件的布局寬度。

? android:layout_height：指定該組件的布局高度。

關於上面這兩個屬性，其屬性值一般為如下3個屬性值其一。

? fill_parent：

指定子組件的高度、寬度與父容器組件的高度、寬度相同（實際上還要減去填充的空白距離）。

? match_parent：

該屬性值與fill_parent完全相同，而且從Android 2.2開始就推薦使用這個屬性值來代替fill_parent。

? wrap_content：

指定子組件的大小恰好能包裹它的內容即可。

除了以上這3個屬性值，還可以指定具體的寬高像素值，如80dp。其中dp為一個尺寸單位。

在正式學習Android組件之前，先來一起了解幾個基本概念。

? px：

像素（pixels），1px代表屏幕上一個物理的像素點。px單位不被建議使用，因為同樣100px的圖片，在不同手機上顯示的實際大小可能不同。偶爾用到px的情況，是需要畫1像素表格線或陰影線的時候，用其他單位如dp會顯得模糊。

? dp：

設備獨立像素（Density-independent pixel），一種基於屏幕密度的抽象單位。在每英寸160點的顯示器上，1dp=1px，但隨著屏幕密度的改變，dp與px的換算會發生改變，換算公式為dips=(pixs*160)/densityDpi。

? dip：

設備獨立像素，與dp完全相同，只是名字不同而已。在早期的Android版本裏多使用dip，後來為了與sp統一就建議使用dp。

? sp：

比例像素（scale-independent pixel），主要處理字體的大小，可以根據用戶的字體大小首選項進行縮放。當文字尺寸是“正常”時1sp=1dp=0.00625英寸，而當文字尺寸是“大”或“超大”時1sp1dp=0.00625英寸。

? in：

英寸，標準長度單位，1英寸=2.54厘米（約）。

? mm：

毫米，標準長度單位。

? pt：

磅（point），標準長度單位，1pt=1/72英寸=0.035厘米。

? ppi：

每英寸像素數（pixel per inch），該值越高，則屏幕越細膩。

? dpi：

每英寸多少點（dot per inch），該值越高，則圖片越細膩。

安卓端屏幕大小各不相同，根據其像素密度，主要分為幾種規格，如下表所示。

ViewGroup.MarginLayoutParams用於控制子組件周圍的頁邊距（Margin，也就是組件四周的空白），它支持的XML屬性如下表所示。

三、創建UI界面

在前面的內容指出過，Android推薦使用XML布局文件來定義用戶界面，而不是使用Java代碼來開發用戶界面，所有組件都提供了兩種方式來控制組件的行為。

? 在XML布局文件中通過XML屬性進行控制。

? 在Java程序代碼中通過調用方法進行控制。

實際上不管使用哪種方式，它們控制Android用戶界面行為的本質是完全一樣的。大部分時候，控制UI組件的XML屬性還有對應的方法。UI界面的創建主要分為如下三種情況。

3.1使用XML布局文件

實際上在創建HelloWorld應用程序的時候就是使用該方法，這種方法是Android推薦使用的，不僅簡單、明了，而且可以將應用的視圖控制邏輯從Java代碼中分離出來，放入XML文件中控制，從而更好地體現MVC原則。

當我們在Android應用的app/src/main/res/layout目錄下定義一個XML布局文件之後（R.java會自動收錄該布局資源），Java代碼可通過如下方法在Activity中顯示該視圖：

setContentView (R.layout.資源文件名字);

當在布局文件中添加多個UI組件時，都可以為該UI組件指定android:id屬性，該屬性的屬性值代表該組件的唯一標識。接下來如果希望在Java代碼中訪問指定UI組件，則可通過如下代碼來訪問它：

findViewByld (R.id.android.id 屬性值);

一旦在Java程序中獲得指定UI組件之後，接下來就可以通過代碼來控制各UI組件的外觀行為了，包括為UI組件綁定事件監聽器等。

3.2使用Java代碼

雖然Android推薦使用XML布局文件來控制UI界面，但如果開發者願意，Android允許開發者完全在Java代碼中控制UI界面。 如果希望在代碼中控制UI界面，那麽所有的UI組件都將通過new關鍵字創建出來，然後以合適的方式添加到UI界面即可。

為了更好的學習這一塊內容內容，在HelloWorld工程中將app/src/main/java/MainActivity.java文件的代碼修改一下，具體控制代碼如下：

public class MainActivity extends AppCompatActivity {  
  
 @Override  
 protected void onCreate(Bundle savedInstanceState) {  
   super.onCreate(savedInstanceState);  
   //setContentView(R.layout.activity_main);  
  
  
   // 創建一個線性布局  
   LinearLayout layout = new LinearLayout(this);  
   layout.setOrientation(LinearLayout.VERTICAL);  
  
   // 創建一個顯示Hello World!的TextView  
   TextView show = new TextView(this);  
   show.setText(Hello World!);  
  
   // 向layout容器添加一個TextView  
   layout.addView(show);  
  
   // 設置該Activity顯示layout  
   setContentView(layout);  
 }  
}  

從上面程序的字代碼可以看出，該程序中所用到的UI組件都是通過new關鍵字創建出來的，然後程序使用LinearLayout容器來容納這些UI組件，這樣就組成了圖形用戶界面。

從上面的程序代碼中可以看出，創建UI組件時需要傳入一個this參數，這是由於Context代表訪問Android應用環境的全局信息的 API。讓UI組件持有一個Context參數，可以讓這些UI組件通過該Context參數來獲取Android 應用環境的全局信息。Context本身是一個抽象類，Android應用的 Activity、Service 都繼承了 Context，因此Activity、Service都可直接作為Context使用。關於這一塊的內容現在可能會看不太懂，不過沒關系，經過後續的學習就明白了。

通過XML布局和通過Java代碼都可以實現同樣的功能，但是發現通過Java代碼實現程序非常臃腫，而用XML布局代碼要簡單得多，因此在開發中不推薦使用這種方式。

3.3混合使用XML布局文件和Java代碼

前面己經提到，完全使用Java代碼來控制UI界面不僅煩瑣，而且不利於解耦；而完全利用XML布局文件來控制UI界面雖然方便、便捷，但難免有失靈活。因此有些時候，可能需要混合使用XML布局文件和代碼來控制UI界面。

當混合使用XML布局文件和代碼來控制UI界面時，習慣上把變化小、行為比較固定的組件放在XML布局文件中管理，而那些變化較多、行為控制比較復雜的組件則交給Java代碼來管理。

此處不做過多介紹，在後續課程中會陸續接觸到這種混合使用的方式來控制UI界面。

今天就先到這裏，下一期開始UI組件的學習。如果有問題歡迎留言一起探討，也歡迎加入Android零基礎入門技術討論微信群，共同成長！

往期總結分享：

Android零基礎入門第1節：Android的前世今生

Android零基礎入門第2節：Android 系統架構和應用組件那些事

Android零基礎入門第3節：帶你一起來聊一聊Android開發環境

Android零基礎入門第4節：正確安裝和配置JDK, 高富帥養成第一招

Android零基礎入門第5節：善用ADT Bundle, 輕松邂逅女神

Android零基礎入門第6節：配置優化SDK Manager, 正式約會女神

Android零基礎入門第7節：搞定Android模擬器，開啟甜蜜之旅

Android零基礎入門第8節：HelloWorld，我的第一趟旅程出發點

Android零基礎入門第9節：Android應用實戰，不懂代碼也可以開發

Android零基礎入門第10節：開發IDE大升級，終於迎來了Android Studio

Android零基礎入門第11節：簡單幾步帶你飛，運行Android Studio工程

Android零基礎入門第12節：熟悉Android Studio界面，開始裝逼賣萌

Android零基礎入門第13節：Android Studio配置優化，打造開發利器

Android零基礎入門第14節：使用高速Genymotion，跨入火箭時代

Android零基礎入門第15節：掌握Android Studio項目結構，揚帆起航

此文章版權為微信公眾號分享達人秀（ShareExpert）——鑫鱻所有，若轉載請備註出處，特此聲明！

Android零基礎入門第16節：Android用戶界面開發概述