通过本节课可以学习到的内容：
- FrameLayout的用法
- GridLayout的用法
实例代码:
运行效果参见本课程示例App：安卓猴Demos
github地址：https://github.com/git0pen/MonkeyAndroid
FrameLayout
帧布局，在这种布局下，每个添加的子控件都被放在布局的左上角，并覆盖在前一个子控件的上层；此外，FrameLayout中的子控件的位置不能被指定。
GridLayout
自Android4.0版本（API level 14）后，新增的网格布局。
注意：
如果要达到网格的效果，推荐使用LinearLayout来实现，因为使用GridLayout会产生如下问题：
- 不能同时在(x,y)轴方向上进行控件的对齐；
- 当多层布局嵌套的时候会出现性能问题；
- 不能稳定地支持一些支持自由编辑布局的工具。
计算器界面
用GridLayout和Button模仿了一个计算器的按键界面。
布局源码
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
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
| <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
>
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="北京"
android:textColor="#898989"
android:textSize="18sp"
/>
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="上海"
android:textColor="#108939"
android:textSize="22sp"
/>
<TextView
android:id="@+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="广州"
android:textColor="#103339"
android:textSize="26sp"
/>
<TextView
android:id="@+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="南京"
android:textColor="#efec1c"
android:textSize="26sp"
/>
<TextView
android:id="@+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="东莞"
android:textColor="#ff5e00"
android:textSize="30sp"
/>
<TextView
android:id="@+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="深圳"
android:textColor="#ae00ff"
android:textSize="36sp"
/>
</FrameLayout>
<GridLayout
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="2"
android:columnCount="4"
android:rowCount="6"
>
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="0"
android:text="C"
/>
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="0"
android:text="DEL"
/>
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_row="0"
android:text="/"
/>
<Button
android:id="@+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="1"
android:text="7"
/>
<Button
android:id="@+id/button6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="1"
android:text="8"
/>
<Button
android:id="@+id/button7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_row="1"
android:text="9"
/>
<Button
android:id="@+id/button12"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_row="1"
android:text="-"
/>
<Button
android:id="@+id/button8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="2"
android:text="4"
/>
<Button
android:id="@+id/button9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="2"
android:text="5"
/>
<Button
android:id="@+id/button10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_row="2"
android:text="6"
/>
<Button
android:id="@+id/button11"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_row="0"
android:text="*"
/>
<Button
android:id="@+id/button13"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_row="2"
android:text="+"
/>
<Button
android:id="@+id/button15"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_row="3"
android:text="1"
/>
<Button
android:id="@+id/button16"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_row="3"
android:text="2"
/>
<Button
android:id="@+id/button17"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_row="3"
android:text="3"
/>
<Button
android:id="@+id/button14"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="3"
android:layout_gravity="fill_vertical"
android:layout_row="3"
android:layout_rowSpan="2"
android:text="="
/>
<Button
android:id="@+id/button18"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnSpan="2"
android:layout_gravity="fill_horizontal"
android:layout_row="4"
android:text="0"
/>
<Button
android:id="@+id/button19"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="2"
android:layout_row="4"
android:text="."
/>
<TextView
android:id="@+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnSpan="4"
android:layout_gravity="fill_horizontal"
android:layout_row="5"
android:gravity="center"
android:text="计算器"
android:textColor="#000000"
android:textSize="38sp"
/>
</GridLayout>
</LinearLayout>
|
下课
这一节课，我们学习了FrameLayout和GridLayout，它们的使用也需要很多技巧。此外，我们要在平时练习的时候多多敲代码，这样才能熟能生巧。
到这里，所有布局的知识都学习完毕了。接下来，我们就要一起学习各种缤纷的控件了！
关于我
- 微信公众号：Android奇想录（android_amazing）
