Android開發入門之學習筆記（三）：程序窗口的佈局

Android應用程序的用戶界面能夠看做是由View和View Group組成的，從字面意思上就能夠看出，View Group是能夠包含多個View的。借用官方教程的圖能夠更容易理解：

說到這裏，咱們尚未解釋，何爲View？其實就是咱們所看到的按鈕、文本編輯框之類的。換句話說，View是一些用戶能夠看得見的窗口小部件，而ViewGroup則是用戶看不見的，它的做用是更好的組織和佈局View。

因爲咱們是初學者，因此能夠簡單的來概括一下：

Android應用程序經過 res/layout目錄下的一個XML文件（activity_main.xml）來配置和管理程序窗口的佈局。固然，一個Android應用程序可能有多個程序窗口，每一個程序窗口都會有一個XML文件來管理它的界面佈局。每一個XML文件的名稱可能不同。咱們這裏討論的是最簡單的Android程序，它是由ADT自動生成的只有一個程序窗口的程序，因此它的佈局文件也只有一個：activity_main.xml。

若是使用ADT工程，自動產生一個最簡單的Android應用程序工程，其默認佈局的內容大體以下：

<RelativeLayout xmlns: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"
    tools:context=".MainActivity" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="@string/hello_world" />

</RelativeLayout>

咱們精簡一下這個XML文件可能看起來會更容易一些：

<RelativeLayout>

    <TextView
              />

</RelativeLayout>

這個XML文件有兩個元素，分別是RelativeLayout和TextView，其中RelativeLayout就是一個ViewGroup，而TextView就是一個View。這個TextView包含在RelativeLayout之中。咱們結合着程序在手機上的實際運行效果看：

除了程序上方的標題欄以外，整個程序窗口一片空白，只有中間有一行文字信息：Hello world!。

這種效果就是TextView居中顯示在整個屏幕的中央。須要注意的是，TextView是包裹在RelativeLayout之中的。因此，確切的說，應該是這個程序窗口中有一個RelativeLayout，它佔據了所有的屏幕，而它裏面又包含了一個TextView，這個TextView位於RelativeLayout的中央（即屏幕的中央）。因此最終，咱們只看到了一個TextView（它沒有邊框）。

咱們回過頭來，再看看activity_main.xml文件。

首先，咱們僅看RelativeLayout的屬性：

<RelativeLayout xmlns: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"
    tools:context=".MainActivity" >

這五個屬性中，咱們只看其中最簡單的兩個（誰讓咱是初學者呢，更多的咱也看不懂）：android.layout_width和android.layout_height。它們分別指定了RelativeLayout的寬度和高度。它們都使用的是match_parent這個值。查金山詞霸能夠得知，match_parent的意思是「適應父親」。其實，就是讓RelativeLayout伸展到包含它的上級View的大小。而這個上級View就是這個程序的窗口了（由於RelativeLayout已是根元素了）。這樣，RelativeLayout就佔據了當前這個程序屏幕的所有。

再來看看RelativeLayout中包含的那一個TextView，它也有五個屬性：

<TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="@string/hello_world" />

屬性中的android:layout_width和android:layout_height咱們已經知道，分別表示的是寬度和高度了。可是，這裏使用的值不同，是wrap_content。仍是金山詞霸，wrap是包裹、纏繞、盤繞的意思，content是（書的）內容的意思，咱們意譯就是包裹文字內容，以文字內容爲大小，換句話說，TextView裏的文本信息佔據多大的空間，TextView就多大。

這裏咱們能夠試着把wrap_content換成match_parent，如下是實際效果：

 

初一看，難於理解，爲何Hello world!會出如今左上角？個人分析是，由於咱們讓TextView擴充到了RelativeLayout的所有大小，這樣，其中的文字就只是一部份內容了，那麼按照慣例，文字就是居左上對齊的。

android:layout_centerHorizontal和android:layout_centerVertical這兩個屬性，從字面意思上就能夠理解了，一個是水平居中，一個是垂直居中。值的選擇，要麼是true，要麼是false。

這裏我作了個試驗，不論寬度和高度設置爲match_parent仍是wrap_content，居中不居中，效果都與上圖是同樣的，Hello world!居左上角顯示。原理稍稍想一想就明白了，這裏就再也不羅嗦了。

最後，講一個比較重要的屬性，這個一次還講不完，之後還會補充。

TextView有一個屬性是android:text="@string/hello_world"。注意，這裏是hello_world，兩個單詞之間是有一個下劃線的，不是最終手機屏幕上面顯示的那個Hello world!。簡單的講，這裏是將TextView要顯示的內容定義成了一個字符串，它的名字是hello_world，而TextView真正要顯示的是這個字符串的值。那麼這個字符串的值又在何處呢？

在res/values目錄下有一個strings.xml文件，答案就在這裏。

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">My Temp App</string>
    <string name="hello_world">Hello world!</string>
    <string name="menu_settings">Settings</string>

</resources>

分析這個文件，在<resources>元素中包含有三個<string>元素，它們都有一個名字，還有一個值。相信你們一看就明白了。咱們程序中顯示的字符串信息都在這裏定義了，包括程序的名字，屏幕上顯示的字符串，還有菜單鍵裏顯示的菜單名。

既然咱們找到了hello_world，那麼咱們能夠簡單試驗一下，只要修改Hello world!爲別的信息就能夠了：

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">My Temp App</string>
    <string name="hello_world">這是個人第一個Android程序！</string>
    <string name="menu_settings">Settings</string>

</resources>

實際效果以下圖所示：

 

OK，這一次筆記就到此吧，這篇博文夠長了^0^