Android RelativeLayout 佈局
RelativeLayout 又稱為相對佈局，與 LinearLayout 的不同就像它的名字一樣。它相對其他元件或者它本身的父元件來控制佈局。也是最靈活最常用的一種佈局。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
| <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="@+id/text1"
android:background="#FF0"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_centerInParent="true"
android:text="Center"
android:textAlignment="center"
android:gravity="center">
<TextView
android:id="@+id/img2"
android:background="#0F0"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_toLeftOf="@id/text1"
android:layout_centerVertical="true"
android:text="Left"
android:textAlignment="center"
android:gravity="center"/>
<TextView
android:id="@+id/img3"
android:background="#0FF"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_toRightOf="@id/text1"
android:layout_centerVertical="true"
android:text="Right"
android:textAlignment="center"
android:gravity="center"/>
<TextView
android:id="@+id/img4"
android:background="#0AA"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_above="@id/text1"
android:layout_centerHorizontal="true"
android:text="Top"
android:textAlignment="center"
android:gravity="center"/>
<TextView
android:id="@+id/img5"
android:background="#F0F"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_below="@id/text1"
android:layout_centerHorizontal="true"
android:text="Bottom"
android:textAlignment="center"
android:gravity="center"/>
</RelativeLayout>
|
常用屬性
第一類 - 根據父元件定位
參考上述範例的 Center TextView
android:layout_centerHrizontal : 水平置中android:layout_centerVertical : 垂直置中android:layout_centerInparent : 父元件的中心位置android:layout_alignParentBottom : 對齊父元件底部android:layout_alignParentLeft : 對齊父元件左側android:layout_alignParentRight : 對齊父元件的右側android:layout_alignParentTop : 對齊父元件頂部android:layout_alignWithParentIfMissing : 如果相對應的其他元件找不到的話就以父元件做參考元件
第二類 - 根據同層元件定位
根據上述範例一樣，其他同層元件根據 Center TextView 去當作參考元件，根據 元件id 決定需要的參考元件。
android:layout_toLeftOf : 參考元件的左側android:layout_toRightOf : 參考元件的右側android:layout_above : 參考元件的上方android:layout_below : 參考元件的下方android:layout_alignTop : 對齊參考元件的上邊界android:layout_alignBottom : 對齊參考元件的下邊界android:layout_alignLeft : 對齊參考元件的左邊界android:layout_alignRight : 對齊參考元件的右邊界
margin 與 padding 的差異
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
| <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="@+id/btn1"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Button"/>
<Button
android:paddingLeft="100dp"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Button"
android:layout_toRightOf="@id/btn1"/>
<Button
android:id="@+id/btn2"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Button"
android:layout_alignParentBottom="true"/>
<Button
android:layout_marginLeft="100dp"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Button"
android:layout_toRightOf="@id/btn2"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
|
margin 代表的是偏移，例如 marginleft="10dp" 代表元件離左側偏移 10dp 。而 padding 代表的是填充，而填充的對象針對的是元件中的元素，比如 TextView 中的文字。 margin 針對的是容器中的元件，而 padding 針對的是元件中的元素。
margin 可設定為負數