Android軟體開發之盤點介面五大布局（十六）

Android軟體開發之盤點介面五大布局

雨松MOMO原創文章如轉載，請註明：轉載至我的獨立網域名稱部落格雨松MOMO程式研究院，原文地址:http://www.xuanyusong.com/archives/133

1.線性布局(LinearLayout)

        線性布局的形式可以分為兩種，第一種橫向線性布局 第二種縱向線性布局，總而言之都是以線性形式 一個個排列出來的，純線性布局的缺點是很不方便修改控制項的顯示位置，所以開發中經常會 以 線性布局與相對布局嵌套的形式設定布局。

使用了線性布局的水平方向與垂直方向，可以清晰的看出來所有控制項都是按照線性相片順序顯示出來的，這就是線性布局的特點。

設定線性布局為水平方向
android:orientation="horizontal"
設定線性布局為垂直方向
android:orientation="vertical"
設定正比例分配控制項範圍
android:layout_weight="1"
設定控制項顯示位置，這裡為水平置中
android:gravity="center_horizontal"

在xml中我使用了LinearLayout 嵌套的方式 配置了2個線性布局 一個水平顯示 一個垂直顯示。

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent" android:layout_height="fill_parent"android:orientation="vertical"><LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent"android:orientation="horizontal"android:gravity="center_horizontal"android:layout_weight="2"><ImageViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:src="@drawable/jay"/><TextViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:text="雨松MOMO"android:background="#FF0000"android:textColor="#000000"          android:textSize="18dip"  /><EditTextandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:text="水平方向"/></LinearLayout><LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent"android:orientation="vertical"android:layout_weight="1"><TextViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:text="雨松MOMO"android:background="#FF0000"android:textColor="#000000"          android:textSize="18dip"  /><EditTextandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:text="垂直方向"/><Buttonandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:text="雨松MOMO"/><ImageViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:src="@drawable/image"/></LinearLayout></LinearLayout>

2.相對布局(RelativeLayout)

        相對布局是android布局中最為強大的，首先它可以設定的屬性是最多了，其次它可以做的事情也是最多的。android手機螢幕的解析度五花八門所以為了考慮螢幕自適應的情況所以在開發中建議大家都去使用相對布局 它的座標取值範圍都是相對的所以使用它來做自適應螢幕是正確的。

設定距父元素靠右對齊
android:layout_alignParentRight="true"
設定該控制項在id為re_edit_0控制項的下方
android:layout_below="@id/re_edit_0"
設定該控制項在id為re_image_0控制項的左邊
android:layout_toLeftOf="@id/re_iamge_0"
設定當前控制項與id為name控制項的上方對齊
android:layout_alignTop="@id/name"
設定位移的像素值
android:layout_marginRight="30dip"

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent" android:layout_height="fill_parent"><EditTextandroid:id="@+id/re_edit_0"android:layout_width="wrap_content" android:layout_height="wrap_content"android:text="雨松MOMO"android:layout_alignParentRight="true"/><ImageViewandroid:id="@+id/re_iamge_0"android:layout_width="wrap_content" android:layout_height="wrap_content"android:src="@drawable/jay"android:layout_below="@id/re_edit_0"android:layout_alignParentRight="true"/><TextViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:background="#FF0000"android:text="努力學習"android:textColor="#000000"          android:textSize="18dip"  android:layout_toLeftOf="@id/re_iamge_0"/><EditTextandroid:id="@+id/re_edit_1"android:layout_width="wrap_content" android:layout_height="wrap_content"android:text="雨松MOMO"android:layout_alignParentBottom="true"/><ImageViewandroid:id="@+id/re_iamge_1"android:layout_width="wrap_content" android:layout_height="wrap_content"android:src="@drawable/image"android:layout_above="@id/re_edit_1"/><TextViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:background="#FF0000"android:text="努力工作"android:textColor="#000000"          android:textSize="18dip"  android:layout_toRightOf="@id/re_iamge_1"android:layout_above="@id/re_edit_1"/></RelativeLayout>

3.幀布局(FrameLayout)

        原理是在控制項中繪製任何一個控制項都可以被後繪製的控制項覆蓋，最後繪製的控制項會蓋住之前的控制項。介面中先繪製的ImageView 然後在繪製的TextView和EditView 所以後者就覆蓋在了前者上面。

<?xml version="1.0" encoding="utf-8"?><FrameLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"><ImageViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:src="@drawable/g"/><TextViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:text="雨松MOMO"android:background="#FF0000"android:textColor="#000000"          android:textSize="18dip"  /><ImageViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:src="@drawable/image"android:layout_gravity="bottom"/><EditTextandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:text="快樂生活每一天喔"        android:layout_gravity="bottom"/></FrameLayout>

4.絕對布局(AbsoluteLayout)

       使用絕對布局可以設定任意控制項的 在螢幕中 X Y 座標點，和幀布局一樣後繪製的控制項會覆蓋住之前繪製的控制項，筆者不建議大家使用絕對布局還是那句話因為android的手機解析度五花八門所以使用絕對布局的話在其它解析度的手機上就無法正常的顯示了。

設定控制項的顯示座標點

      android:layout_x="50dip"        android:layout_y="30dip"

<?xml version="1.0" encoding="utf-8"?><AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent" android:layout_height="fill_parent"><ImageViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:src="@drawable/f"android:layout_x="100dip"        android:layout_y="50dip"/><TextViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:text="當前座標點 x = 100dip y = 50 dip"android:background="#FFFFFF"android:textColor="#FF0000"          android:textSize="18dip"        android:layout_x="50dip"        android:layout_y="30dip"/><ImageViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:src="@drawable/h"android:layout_x="50dip"        android:layout_y="300dip"/><TextViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:text="當前座標點 x = 50dip y = 300 dip"android:background="#FFFFFF"android:textColor="#FF0000"          android:textSize="18dip"       android:layout_x="30dip"        android:layout_y="280dip"/></AbsoluteLayout>

5.表格版面配置(TableLayout)
      
       在表格版面配置中可以設定TableRow 可以設定 表格中每一行顯示的內容 以及位置 ，可以設定顯示的縮排，對齊的方式。

<?xml version="1.0" encoding="utf-8"?><TableLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    ><ImageViewandroid:layout_width="wrap_content" android:layout_height="wrap_content"android:src="@drawable/g"android:layout_gravity="center"/>    <TableRow        android:layout_width="wrap_content"        android:layout_height="fill_parent"        android:padding="10dip">        <TextView            android:text="姓名"             android:gravity="left"            />        <TextView            android:text="電話"            android:gravity="right"/>    </TableRow>       <View        android:layout_height="2dip"        android:background="#FFFFFF" />       <TableRow    android:layout_width="wrap_content"        android:layout_height="fill_parent"        android:padding="10dip">        <TextView            android:text="雨松"             android:gravity="left"            />        <TextView            android:text="15810463139"            android:gravity="right"/>    </TableRow>        <TableRow    android:layout_width="wrap_content"        android:layout_height="fill_parent"        android:padding="10dip">        <TextView            android:text="小可愛"             android:gravity="left"            />        <TextView            android:text="15810463139"            android:gravity="right"/>    </TableRow>    <TableRow    android:layout_width="wrap_content"        android:layout_height="fill_parent"        android:padding="10dip">        <TextView            android:text="好夥伴"             android:gravity="left"            />        <TextView            android:text="15810463139"            android:gravity="right"/>    </TableRow>    <TableRow        android:layout_width="wrap_content"        android:layout_height="fill_parent"        android:padding="10dip"        >        <TextView            android:text="姓名"             android:gravity="left"            />        <TextView            android:text="性別"            android:gravity="right"/>    </TableRow>       <View        android:layout_height="2dip"        android:background="#FFFFFF" />       <TableRow    android:layout_width="wrap_content"        android:layout_height="fill_parent"        android:padding="10dip"        >        <TextView            android:text="雨松MOMO"             android:gravity="left"            />        <TextView            android:text="男"            android:gravity="right"/>    </TableRow>        <TableRow    android:layout_width="wrap_content"        android:layout_height="fill_parent"        android:padding="10dip">        <TextView            android:text="小可愛"             android:gravity="left"            />        <TextView            android:text="女"            android:gravity="right"/>    </TableRow>    <TableRow    android:layout_width="wrap_content"        android:layout_height="fill_parent"        android:padding="10dip">        <TextView            android:text="好夥伴"             android:gravity="left"            />        <TextView            android:text="男"            android:gravity="right"/>    </TableRow></TableLayout>

        Android五大布局的基本使用方法已經介紹完，最後筆者在這裡強調一下在開發與學習中建議大家使用相對布局，首先它的方法屬性是最強大的其次它基本可以實現其它4大布局的效果，當然這裡說的不是全部 有時候還是須要使用其他布局， 所以筆者建議大家開發中以實際情況定奪，以上五種布局可以使用布局嵌套的方式可以做出更好看的更美觀的布局。

最後如果你還是覺得我寫的不夠詳細 看的不夠爽 不要緊我把原始碼的貼出來 歡迎大家一起討論學習雨松MOMO希望可以和大家一起進步。

：http://www.xuanyusong.com/archives/133