Android 第七課——UI佈局

Android佈局分爲：線性佈局、相對佈局、表格佈局、幀佈局、網格佈局五種

佈局中的距離單位：dp、px、sp。

佈局繼承關係圖：

1）熟悉幾個經常使用屬性

<Button android:id="@+id/loginName"          android:layout_width="wrap_content"          android:layout_height="wrap_content"          android:text="@string/login"/>

1）android:id="@+id/loginName"  爲組件自定義一個ID，便於在程序中經過映射R文件查找：R.id.loginName ； 2）android:layout_width 與 android:layout_height 設置組件的寬與高，只有三個值，分別是： match_parent：充滿父容器，新版本中使用，推薦使用這個屬性值 fill_parent：充滿父容器，老版本中使用 wrap_content：包裹文字，根據文字的大小來設定組件的大小 3）android:text="@string/login" 從常量中獲取對應的引用值

2）LinearLayout 線性佈局

線性佈局即LinearLayout 佈局，是Android屏幕中經常使用的佈局方式，是一個ViewGroup以線性方向顯示它的子視圖（View）元素，即垂直或水平。關於組件，大部分都是View的子類，因此不少狀況下能夠把組件稱之爲視圖。

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

1）android:orientation 肯定佈局爲垂直仍是水平 horizontal ： 水平 vertical：垂直 2）layout_weight(權重) 指定該元素在LinearLayout(父容器)中所佔的權重, 這個屬性簡單理解就是自身的權重除以全部組件權重之和的值就是在父組件中所佔的比例（寬或者高）。固然，實際狀況還有不少種狀況，不能一律而論。 3）android:layout_gravity（對齊方式）指定該元素在LinearLayout(父容器)的對齊方式, 也就是該組件自己的對齊方式。 4）android:gravity ：指的是該組件中子組件的對齊方式，與上面那個屬性比起來，上面那個是控制自身在父容器中佈局，而這個是控制子組件在自身容器中佈局。

3）RelativeLayout

相對佈局時指一個ViewGroup以相對位置顯示它的子視圖（View）元素，一個視圖能夠指定相對於他的兄弟或父親視圖位置（例如在給定視圖的左邊或者下面）或相對於RelativeLayout的特定區域的位置（例如底部對齊或者靠右）；

相對佈局時設計用戶界面的有力工具，由於他消除了嵌套視圖組。若是用戶發現使用了多個嵌套的LinearLayout視圖組，能夠考慮使用一個relativeLayout視圖組了。

相對佈局應該是應用程序中使用最多的佈局方式，由於它最靈活。另外，咱們在使用相對佈局時其實內心應該保持着像CSS那樣的盒子模型，不過Android中，貌似沒有邊框的屬性設置，可是能夠設置內邊框與外邊框。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  android:layout_width="fill_parent"  android:layout_height="fill_parent"> ------------- </LinearLayout>

1）第一類 :  屬性值爲true或false 2）第二類：屬性值必須爲id的引用名「@id/id-name」 3）第三類：屬性值爲具體的像素值，如30dip，40px 或者分爲 1）相對於父元素 2）相對於某組件 3）約束自身的子組件

第一類:屬性值爲true或false

• android:layout_centerHrizontal 水平居中

• android:layout_centerVertical 垂直居中

• android:layout_centerInparent 相對於父元素徹底居中

• android:layout_alignParentBottom 貼緊父元素的下邊緣

• android:layout_alignParentLeft 貼緊父元素的左邊緣

• android:layout_alignParentRight 貼緊父元素的右邊緣

• android:layout_alignParentTop 貼緊父元素的上邊緣

• android:layout_alignWithParentIfMissing 若是對應的兄弟元素找不到的話就以父元素作參照物

第二類：屬性值必須爲id的引用名「@id/id-name」

• android:layout_below 在某元素的下方

• android:layout_above 在某元素的的上方

• android:layout_toLeftOf 在某元素的左邊

• android:layout_toRightOf 在某元素的右邊

• android:layout_alignTop 本元素的上邊緣和某元素的的上邊緣對齊

• android:layout_alignLeft 本元素的左邊緣和某元素的的左邊緣對齊

• android:layout_alignBottom 本元素的下邊緣和某元素的的下邊緣對齊

• android:layout_alignRight 本元素的右邊緣和某元素的的右邊緣對齊

第三類：屬性值爲具體的像素值，如XXdip，XXpx

• android:layout_margin 離某元素外邊緣的距離（包括上右下左）

• android:layout_marginBottom 離某元素底邊緣的距離

• android:layout_marginLeft 離某元素左邊緣的距離

• android:layout_marginRight 離某元素右邊緣的距離

• android:layout_marginTop 離某元素上邊緣的距離

• android:layout_padding 內邊緣的距離（包括上右下左）

• android:layout_paddingBottom 內底邊緣的距離

• android:layout_paddingLeft 內左邊緣的距離

• android:layout_paddingRight 內右邊緣的距離

• android:layout_paddingTop 內上邊緣的距離

4）TableLayout

表格佈局有TableLayout所表明，TableLayout繼承了LinearLayout。TableLayout並不須要明確地聲明包含多少行，多少列，而是經過添加TableRow、其餘組件來控制表格的行數與列數。佈局TableLayout只有TableRow，每在TableLayout中添加一個TableRow就表示新增一行，其實在TableLayout隨意寫一個組件也會默認佔用一行，可是TableRow其實又是一個容器，在這個容器中的每個組件佔了一列。在表格佈局中，列的寬度由該列中最寬的那個單元格決定，整個表格的寬度取決於父容器的寬度（默認是佔滿父容器）。

<TableLayout 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"
    android:stretchColumns="2"
    android:collapseColumns="0"
    android:shrinkColumns="1"
    >
    <TableRow>
        <TextView android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:text="@string/cell1"/>
        <TextView android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="@string/cell2"/>
       <TextView android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="@string/cell3"/>
    </TableRow>
    <TextView android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="@string/cell4"/>
</TableLayout>

1）首先咱們在對TableLayout屬性設置時只能對列作控制，並且列的控制是從0開始計算的。

2）android:collapseColumns:將TableLayout裏面指定的列隱藏，如有多列須要隱藏，請用逗號將須要隱藏的列序號隔開。

3）android:stretchColumns:設置指定的列爲可伸展的列，以填滿父容器中剩下的多餘空白空間，如有多列須要設置爲可伸展，請用逗號將須要伸展的列序號隔開。

4）android:shrinkColumns:設置指定的列爲可收縮的列。當可收縮的列太寬(內容過多)不會被擠出屏幕。這個屬性與android:stretchColumns屬性剛好組成一對。當須要設置多列爲可收縮時，將列序號用逗號隔開。