Android應用的圖形化使用者介面的構建使用的是View 和  物件的層次巢狀。 View 物件通常是UI部件，例如 buttons 或者 text fields ，而  是用來定義它的子佈局如何排布的容器，它通常是不可見的，例如一個網格或者一個垂直的列表。

Android提供XML詞彙與View或者ViewGroup的子類的對應，這樣的話你就可以通過XML元素的層級巢狀來定義你的UI。

另一種佈局

使用XML宣告UI比在執行時程式碼中宣告更有用處可以在很多地方看出來，尤其是當你為不同的螢幕建立不同的佈局時。例如你建立了兩個佈局，然後告訴系統，其中一個是用於小尺寸的螢幕，另一個是用於大尺寸的螢幕。有關跟多的資訊，請檢視

圖 1. 插圖所示的是ViewGroup物件是如何分支佈局並且包含其他的View物件

在這片課程中，你將會使用XML來建立一個包含text field和一個button的佈局。在接下來的課程中你就會學習如何響應button的點選事件，當按下button時將text field中的文字傳送給另一個Activity。

建立一個線性佈局

開啟 在 res/layout 目錄下 fragment_main.xml 檔案。

提示: 在Eclipse中，當你開啟一個layout（佈局）檔案時，首先顯示的是佈局的圖形編輯器。這是一個使用WYSIWYG工具來幫助你編輯介面的編輯器。在本次課程中，你將要學習如何直接使用XML來工作，所以點選介面底部的 fragment_main.xml

在你建立專案是選擇的 BlankActivity 模板中包含了 fragment_main.xml 檔案，檔案的內容有 根佈局和一個  子佈局。

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="horizontal"
 
></LinearLayout>

由於 是根佈局，需要通過將其高度設定為"match_parent"來讓它在整個螢幕範圍內可見。這個值聲明瞭此佈局將會延展它的寬度或者高度來適應它的父佈局。

有關更多的資訊，請檢視 Layout 嚮導。

新增一個Text Field

要建立一個使用者可編輯的text field，需要在 標籤內新增<Edit Text>元素。

就像所有View 物件那樣，你必須定義某些XML屬性來指定 物件的屬性。下面向你展示如何在 元素中來定義它：

<EditTextandroid:id="@+id/edit_message"android:layout_width="wrap_content"android:layout_height="wrap_content"android:hint="@string/edit_message"/>

關於資源物件

一個資源物件是與應用資源相關聯的簡單的唯一的integer型別的名字，例如一個bitmap，layout,string。

每一個資源都會在gen/R.java 檔案中有相應的資源物件與其對應。你使用R類的那些物件名稱來引用你的資源，例如當你需要為android:hint 屬性指定一個字串型別的值時。你還可以使用android:id 屬性隨意建立資源ID，這樣你就可以在其他的程式碼中引用這個view。

SDK工具在你每次編譯應用時都會生成R.java檔案。你一定不要手動修改此檔案的內容。

關於這些屬性：

它為此view提供了一個唯一的標識，你可以在應用的程式碼中直接引用它，例如讀取和操作這個物件（你將會在下篇課程中學到）。

當你要參照XML檔案中其他的物件時，你需要使用(@) 。它的後面跟著資源的型別（本例中是id），一個斜槓，然後資源的名稱。

+這個符號只有在你第一次定義一個資源的ID時才需要加上。當你編譯你的應用的時候，SDK工具會通過這個ID名稱在gen/R.java檔案中建立相應的資源ID來與EditText元素對應。一旦資源ID通過這種方式被定義好，其他引用這個ID不需要使用+號。檢視右側的文字瞭解更多資源物件。

使用"wrap_content"指定view的大小會根據內容來適應， 用來代替直接指定view的大小。如果你希望使用"match_parent"，那麼 元素將會佔滿整個螢幕，應為它會根據父佈局來適應大小。跟多資訊，請檢視Layouts 嚮導。

這個屬性用於指定當text field為空時顯示的內容。最好使用"@string/edit_message" 這種引用方式來為其賦值，而不要直接在程式碼中賦值。

提示: 這個字元型別和元素ID有相同的名稱。然而他們的型別不同，因此同樣的名稱不會衝突。

新增一個String資源

當你需要在UI中顯示文字的時候，你一定要為每個字串設定為資源。字串資源讓你把所有的UI上的文字都集中在一個地方管理，讓更新文字更簡單。這種方式在你為不同語言提供字串定義時可以為不同的語言實現本地化（國際化）。

在預設情況下，你的專案包含一個字串資原始檔，在res/values/strings.xml下。新增一個字串，名字為"edit_message" ，同時將其值設為"Enter a message" 。(你可以刪掉"hello_world" 了)

在這個檔案中為你即將要新增的button新增一個“Send”的字串。

strings.xml 應將像下面這樣:

<?xml version="1.0" encoding="utf-8"?><resources><stringname="app_name">My First App</string><stringname="edit_message">Enter a message</string><stringname="button_send">Send</string><stringname="action_settings">Settings</string><stringname="title_activity_main">MainActivity</string></resources>

新增一個Button

<Buttonandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="@string/button_send"/>

將它的高度設定為"wrap_content" 這樣它就只會顯示它比要的高度來包裹按鈕中的文字。它不需要android:id 屬性，因為它不會再其他地方被引用到。

讓輸入框佔滿整個螢幕寬度

如圖2所示，現在佈局中的兩個部件 和  都只有必要的大小來適應它們的內容。

圖 2.  和  部件的屬性設定為"wrap_content"。

這樣對於button能夠很好的展示，但是對text field就不一樣了，因為使用者可能會輸入一些更長的文字。因此，讓text field佔滿螢幕的空餘部分效果會更好。在LinearLayout中，你可以使用android:layout_weight 屬性來指定。

Weight是一個用來指定每個view應該佔用的空間的值，相對與同級別的其他的佈局。 這工作有點像成分的飲料配方量：“2份伏特加，1份咖啡力嬌酒”是指三分之二的飲料是伏特加。例如，如果給一個view的權重為2另一個view的權重為1，則總和是3，那麼第一個view填充剩餘空間的2/3，第二view填充的其餘部分。如果添加了第三個view，並給它一個權重為1，那麼第一個佈局（權重2）現在佔一半的剩餘空間，而剩下的兩個各得四分之一。

所有view預設的權重是0，因此如果你僅指定一個view的權重大於0，那麼它會佔滿所有其它view剩餘的空間。所以，要讓EditText填充剩餘空間，就只需將它的權重設為1，然後button不設定權重值。

<EditTextandroid:layout_weight="1"
        ... />

當你指定權重值是，為了提高佈局的效率，你應該將EditText的寬度改為0dp。設定寬度為0dp的原因是，它會根據其他的view計算寬度後填充剩餘空間，而此時通過寬度為"wrap_content"來通過系統計算寬度是沒有用處的。

<EditTextandroid:layout_weight="1"android:layout_width="0dp"
        ... />

圖 3 展示給EditText設定權重的效果。

下面是完整的程式碼：

<?xml version="1.0" encoding="utf-8"?><LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="horizontal"><EditTextandroid:id="@+id/edit_message"android:layout_weight="1"android:layout_width="0dp"android:layout_height="wrap_content"android:hint="@string/edit_message"/><Buttonandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="@string/button_send"/></LinearLayout>

這個佈局在你建立專案時被SDK工具生成的Activity所引用，所以你可以執行這個應用看看結果：

• 在Eclipse中，在工具欄上點選  。
• 或者在命令列中，改變目錄到專案根目錄然後執行:

  ant debug
  adb install bin/MyFirstApp-debug.apk