通过本节课可以学习到的内容：
- RelativeLayout以及它的相关属性
- TableLayout以及它的特有属性
实例代码:
运行效果参见本课程示例App：安卓猴Demos
github地址：https://github.com/git0pen/MonkeyAndroid
RelativeLayout
顾名思义，RelativeLayout就是相对布局，置于其中的控件在摆放的时候需要相对于布局中的其它控件来摆放。
RelativeLayout相关属性
这些属性十分“众多”，因此大致了解即可，关键是在敲代码的过程中熟练运用。
| — |
属性 |
作用 |
| 第1组属性 |
相对属性 |
— |
| — |
android:layout_below |
将目标控件置于引用控件的下方 |
| — |
android:layout_above |
将目标控件置于引用控件的上方 |
| — |
android:layout_toLeftOf |
将目标控件置于引用控件的左方 |
| — |
android:layout_toRightOf |
将目标控件置于引用控件的右方 |
| 第2组属性 |
对齐属性 |
— |
| — |
android:layout_alignTop |
目标控件和引用控件的上边缘对齐 |
| — |
android:layout_alignBottom |
目标控件和引用控件的下边缘对齐 |
| — |
android:layout_alignLeft |
目标控件与引用控件的左边缘对齐 |
| — |
android:layout_alignRight |
目标控件与引用控件的右边缘对齐 |
| — |
android:layout_alignBaseLine |
基于基准线对其，基准线就是我们写英文字母那4行线的第三条 |
| 第3组属性 |
这组属性的值是 true 或者 false |
— |
| — |
layout_alignParentRight |
是否与父控件的右边缘对齐 |
| — |
layout_alignParentLeft |
是否与父控件的左边缘对齐 |
| — |
layout_alignParentTop |
是否与父控件的上边缘对齐 |
| — |
layout_alignParentBottom |
是否与父控件的下边缘对齐 |
| 第4组属性 |
中间属性 |
— |
| — |
layout_centerInParent |
与父控件在水平方向和垂直方向都对齐 |
| — |
layout_centerVertical |
与父控件在垂直方向都对齐 |
| — |
layout_centerHorizontal |
与父控件在水平方向都对齐 |
| 第5组属性 |
引用属性 |
— |
| — |
layout_alignStart |
引用其他控件，表示与控件的开始位置对齐 |
| — |
layout_alignStop |
引用其他控件，表示与控件的结束位置对齐 |
| — |
layout_alignParentStart |
取值为true、false，表示与父控件的开始位置对齐 |
| — |
layout_alignParentStop |
取值为true、false，表示与父控件的结束位置对齐 |
TableLayout
顾名思义，TableLayout布局就是表格布局。其实现的效果就如同上面的属性表格一样。
TableLayout的特有属性
android:stretchColumns="1"设置所用行的第二列为扩展列,如果有三列的话，剩余空间由第二列补齐。
android:shrinkColumns="1"设置所用行第二列为收缩列。
android:layout_column="0"表示当前控件在表格中的第0列，视觉效果上是第1列。
android:layout_span="2" 表示当前控件跨了两列。
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
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
| <?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"
>
<TextView
android:id="@+id/text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:background="#41c2fa"
android:text="我右边是Button"
android:textColor="#fc0000"
android:textSize="22sp"
/>
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_gravity="center_horizontal"
android:layout_toEndOf="@+id/text_view"
android:layout_toRightOf="@+id/text_view"
android:text="我下边是ImageView"
/>
<ImageView
android:id="@+id/image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@+id/button"
android:layout_alignStart="@+id/button"
android:layout_below="@+id/button"
android:src="@mipmap/ic_launcher"
/>
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/image_view"
android:stretchColumns="1"
>
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<TextView
android:id="@+id/text_view_uname"
android:layout_column="0"
android:text="用户名："
android:textSize="16sp"
/>
<EditText
android:id="@+id/edit_text_uname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
/>
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<TextView
android:id="@+id/text_view_pwd"
android:layout_column="0"
android:text="密码："
android:textSize="16sp"
/>
<EditText
android:id="@+id/editText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:ems="10"
android:inputType="textPassword"
/>
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent"
>
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_column="0"
android:layout_gravity="right"
android:layout_span="2"
android:orientation="horizontal"
>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="登陆"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="注册"
/>
</LinearLayout>
</TableRow>
</TableLayout>
</RelativeLayout>
|
下课
这一节课，我们学习了RelativeLayout和TableLayout的用法，其中前者是必须重点掌握的布局，后者是需要了解的布局；熟练灵活地使用RelativeLayout布局，可以让你在今后的项目开发中对UI的把控更加游刃有余。
