Android界面布局
对于很多刚刚接触Android的人来说,界面布局应该是件比较头痛的事吧,xml下进行的布局确实有那么点繁琐,适应花了一段时间,最近写了个View的Layout,500多行,真是吐血,不过写完之后对Android界面布局有了蛮深刻的认识~~~
我用到的主要有三种布局方式:
1.Linearlayout:这个很常见,线性布局.大多数情况下将它的空间宽度或高度设置成fill_parent和wrap_content比较合适.最简单的情况,两个TextView,前面一个宽度未知,系统将根据前面TextView的实际宽度在其之后添加另一个TextView.
还有一点,这种布局下两个控件中间要想间隔一定距离的话,中间可以加上一个没有内容,只有宽度的TextView.
2.AbsoluteLayout:前一种情况下,两个控件之间需要一个TextView间隔,很多情况下不太方便,可能需要大量的TextView,就可以考虑使用AbsoluteLayout取而代之了,这种布局需要你给出确定的x,y,都是相对于parent的左上顶点坐标的,一般来说,用这种布局最好给出控件的确定宽度和高度.
3.FrameLayout:这个用的不是那么多,需要知道的就是这种布局下只能显示一个View控件,Layout好像是可以重叠显示的,并且总是在parent的左上角添加.
这三种布局最为常见,其余的看到的不多,RelativeLayout没有用过,也就不好多说,发下图吧,还有代码,不过代码确实比较复杂:
代码
1 <? xml version="1.0" encoding="utf-8" ?>
2
3 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
4 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
5 android:background ="@drawable/shop_back" >
6
7 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
8 android:layout_width ="fill_parent" android:layout_height ="260px"
9 android:orientation ="horizontal" >
10
11 < FrameLayout
12 android:layout_width ="400px" android:layout_height ="fill_parent"
13 android:background ="@drawable/frame_border" >
14
15 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
16 android:id ="@+id/layout1"
17 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
18 android:orientation ="vertical"
19 android:background ="@drawable/shopinfo_back" >
20
21 < TextView
22 android:layout_width ="fill_parent" android:layout_height ="20px" >
23 </ TextView >
24
25 < AbsoluteLayout xmlns:android ="http://schemas.android.com/apk/res/android"
26 android:layout_width ="fill_parent" android:layout_height ="fill_parent" >
27
28 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
29 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
30 android:layout_x ="125px" android:layout_y ="10px"
31 android:orientation ="horizontal" >
32
33 < TextView
34 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
35 android:textSize ="20sp"
36 android:text ="欢迎光临: " >
37 </ TextView >
38
39 < TextView
40 android:id ="@+id/shopinfo_shopname"
41 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
42 android:textSize ="20sp" >
43 </ TextView >
44
45 </ LinearLayout >
46
47 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
48 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
49 android:layout_x ="125px" android:layout_y ="40px"
50 android:orientation ="horizontal" >
51
52 < TextView
53 android:layout_width ="250px" android:layout_height ="wrap_content"
54 android:textSize ="14sp"
55 android:text ="本店公告: 全场一律七折，机不可失，失不再来" >
56 </ TextView >
57
58 </ LinearLayout >
59
60 < ScrollView
61 android:layout_width ="332px" android:layout_height ="90px"
62 android:layout_x ="25px" android:layout_y ="125px"
63 android:scrollbars ="vertical"
64 android:fadingEdge ="vertical" >
65
66 < TextView
67 android:id ="@+id/shopinfo_content"
68 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
69 android:textSize ="12sp" >
70 </ TextView >
71 </ ScrollView >
72
73 </ AbsoluteLayout >
74
75 </ LinearLayout >
76
77
78
79
80 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
81 android:id ="@+id/layout2"
82 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
83 android:orientation ="horizontal" >
84
85 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
86 android:id ="@+id/listview_layout"
87 android:layout_width ="160px" android:layout_height ="250px"
88 android:orientation ="vertical" >
89
90 < TextView
91 android:layout_width ="fill_parent" android:layout_height ="20px" >
92 </ TextView >
93
94 < ImageView
95 android:id ="@+id/list_title_image"
96 android:layout_width ="fill_parent" android:layout_height ="40px"
97 android:background ="@drawable/list_title" >
98 </ ImageView >
99
100 < AbsoluteLayout xmlns:android ="http://schemas.android.com/apk/res/android"
101 android:id ="@+id/name_price_title"
102 android:layout_width ="fill_parent" android:layout_height ="210px" >
103
104 < TextView
105 android:layout_width ="wrap_content" android:layout_height ="30px"
106 android:layout_x ="20px" android:layout_y ="0px"
107 android:textSize ="14sp"
108 android:text ="商品名称" >
109 </ TextView >
110
111 < TextView
112 android:layout_width ="wrap_content" android:layout_height ="30px"
113 android:layout_x ="110px" android:layout_y ="0px"
114 android:textSize ="14sp"
115 android:text ="价格" >
116 </ TextView >
117
118 < ListView
119 android:id ="@+id/product_list"
120 android:layout_width ="140px" android:layout_height ="150px"
121 android:layout_x ="10px" android:layout_y ="30px" >
122 </ ListView >
123
124 </ AbsoluteLayout >
125
126 </ LinearLayout >
127
128 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
129 android:id ="@+id/product_layout"
130 android:layout_width ="240px" android:layout_height ="250px"
131 android:orientation ="vertical" >
132
133 < AbsoluteLayout xmlns:android ="http://schemas.android.com/apk/res/android"
134 android:id ="@+id/brief_layout"
135 android:layout_width ="fill_parent" android:layout_height ="110px" >
136
137 < Button
138 android:id ="@+id/page_later"
139 android:layout_width ="20px" android:layout_height ="100px"
140 android:layout_x ="0px" android:layout_y ="10px"
141 android:background ="@drawable/later_image" >
142 </ Button >
143
144 < AbsoluteLayout xmlns:android ="http://schemas.android.com/apk/res/android"
145 android:layout_width ="100px" android:layout_height ="76px"
146 android:layout_x ="20px" android:layout_y ="22px"
147 android:background ="@drawable/image_border" >
148
149 < ImageView
150 android:id ="@+id/image"
151 android:layout_width ="96px" android:layout_height ="72px"
152 android:layout_x ="2px" android:layout_y ="2px" >
153 </ ImageView >
154
155 </ AbsoluteLayout >
156
157 < Button
158 android:id ="@+id/page_next"
159 android:layout_width ="20px" android:layout_height ="100px"
160 android:layout_x ="120px" android:layout_y ="10px"
161 android:background ="@drawable/next_image" >
162 </ Button >
163
164 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
165 android:id ="@+id/title_layout"
166 android:layout_width ="95px" android:layout_height ="100px"
167 android:layout_x ="140px" android:layout_y ="10px"
168 android:orientation ="vertical" >
169
170 < TextView
171 android:layout_width ="fill_parent" android:layout_height ="10px"
172 android:textSize ="12sp" >
173 </ TextView >
174
175 < TextView
176 android:id ="@+id/product_name_info"
177 android:layout_width ="fill_parent" android:layout_height ="30px"
178 android:textSize ="12sp" >
179 </ TextView >
180
181 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
182 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
183 android:orientation ="horizontal" >
184
185 < TextView
186 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
187 android:textSize ="10sp"
188 android:text ="价格:" >
189 </ TextView >
190
191 < TextView
192 android:id ="@+id/product_price_info"
193 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
194 android:textSize ="10sp" >
195 </ TextView >
196
197 </ LinearLayout >
198
199 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
200 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
201 android:orientation ="horizontal" >
202
203 < TextView
204 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
205 android:textSize ="10sp"
206 android:text ="类型：" >
207 </ TextView >
208
209 < TextView
210 android:id ="@+id/product_type_info"
211 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
212 android:textSize ="10sp" >
213 </ TextView >
214
215 </ LinearLayout >
216
217 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
218 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
219 android:orientation ="horizontal" >
220
221 < TextView
222 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
223 android:textSize ="10sp"
224 android:text ="特点:" >
225 </ TextView >
226
227 < TextView
228 android:id ="@+id/product_feature_info"
229 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
230 android:textSize ="10sp"
231 android:text ="时尚简约,功能齐全" >
232 </ TextView >
233
234 </ LinearLayout >
235
236 </ LinearLayout >
237
238 </ AbsoluteLayout >
239
240 < AbsoluteLayout xmlns:android ="http://schemas.android.com/apk/res/android"
241 android:id ="@+id/button_layout"
242 android:layout_width ="fill_parent" android:layout_height ="140px" >
243
244 < TextView
245 android:layout_width ="fill_parent" android:layout_height ="20px"
246 android:layout_x ="20px" android:layout_y ="0px"
247 android:textSize ="12sp"
248 android:text ="详细信息:" >
249 </ TextView >
250
251 < ScrollView
252 android:layout_width ="200px" android:layout_height ="80px"
253 android:layout_x ="20px" android:layout_y ="20px"
254 android:scrollbars ="vertical"
255 android:fadingEdge ="vertical" >
256
257 < TextView
258 android:id ="@+id/productContent"
259 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
260 android:textSize ="12sp" >
261 </ TextView >
262 </ ScrollView >
263
264 < LinearLayout
265 android:layout_width ="90px" android:layout_height ="30px"
266 android:layout_x ="20px" android:layout_y ="110px"
267 android:orientation ="horizontal" >
268
269 < TextView
270 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
271 android:textSize ="13sp"
272 android:text ="我要买: " >
273 </ TextView >
274
275 < EditText
276 android:id ="@+id/buy_number"
277 android:layout_width ="30px" android:layout_height ="30px"
278 android:textSize ="9sp"
279 android:text ="1" >
280 </ EditText >
281
282 < TextView
283 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
284 android:textSize ="13sp"
285 android:text ="件" >
286 </ TextView >
287
288 </ LinearLayout >
289
290 < Button
291 android:id ="@+id/button_addshoppingcart"
292 android:layout_width ="80px" android:layout_height ="20px"
293 android:layout_x ="130px" android:layout_y ="112px"
294 android:background ="@drawable/button_addshoppingcart" >
295 </ Button >
296
297 </ AbsoluteLayout >
298
299 </ LinearLayout >
300
301 </ LinearLayout >
302
303
304
305
306 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
307 android:id ="@+id/layout3"
308 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
309 android:orientation ="horizontal" >
310
311 < TextView
312 android:layout_width ="30px" android:layout_height ="fill_parent" >
313 </ TextView >
314
315 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
316 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
317 android:orientation ="vertical" >
318
319 < TextView
320 android:layout_width ="fill_parent" android:layout_height ="30px" >
321 </ TextView >
322
323 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
324 android:layout_width ="fill_parent" android:layout_height ="30px"
325 android:orientation ="horizontal" >
326
327 < TextView
328 android:layout_height ="wrap_content" android:layout_width ="5px" >
329 </ TextView >
330
331 < TextView
332 android:layout_height ="wrap_content" android:layout_width ="95px"
333 android:textSize ="16sp"
334 android:text ="商品名称" >
335 </ TextView >
336
337 < TextView
338 android:layout_height ="wrap_content" android:layout_width ="60px"
339 android:textSize ="16sp"
340 android:text ="单价" >
341 </ TextView >
342
343 < TextView
344 android:layout_height ="wrap_content" android:layout_width ="60px"
345 android:textSize ="16sp"
346 android:text ="数量" >
347 </ TextView >
348
349 < TextView
350 android:layout_height ="wrap_content" android:layout_width ="60px"
351 android:textSize ="16sp"
352 android:text ="合计" >
353 </ TextView >
354
355 </ LinearLayout >
356
357 < ListView
358 android:id ="@+id/shoppingcart_list"
359 android:layout_width ="340px" android:layout_height ="150px" >
360 </ ListView >
361
362 < TextView
363 android:layout_height ="10px" android:layout_width ="fill_parent" >
364 </ TextView >
365
366 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
367 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
368 android:orientation ="horizontal" >
369
370 < TextView
371 android:layout_width ="140px" android:layout_height ="fill_parent" >
372 </ TextView >
373
374 < Button
375 android:id ="@+id/button_buy"
376 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
377 android:background ="@drawable/button_buyproduct" >
378 </ Button >
379
380 </ LinearLayout >
381
382 </ LinearLayout >
383
384 </ LinearLayout >
385
386
387
388 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
389 android:id ="@+id/layout4"
390 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
391 android:orientation ="horizontal" >
392
393 < TextView
394 android:layout_width ="30px" android:layout_height ="fill_parent" >
395 </ TextView >
396
397 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
398 android:layout_width ="fill_parent" android:layout_height ="fill_parent"
399 android:orientation ="vertical" >
400
401 < TextView
402 android:layout_width ="fill_parent" android:layout_height ="30px" >
403 </ TextView >
404
405 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
406 android:layout_width ="fill_parent" android:layout_height ="50px"
407 android:orientation ="horizontal" >
408
409 < TextView
410 android:layout_width ="wrap_content" android:layout_height ="fill_parent"
411 android:textSize ="16sp"
412 android:text ="此次交易总额:" >
413 </ TextView >
414
415 < TextView
416 android:id ="@+id/totalpay"
417 android:layout_width ="wrap_content" android:layout_height ="fill_parent"
418 android:textSize ="16sp" >
419 </ TextView >
420
421 < TextView
422 android:layout_width ="wrap_content" android:layout_height ="fill_parent"
423 android:textSize ="16sp"
424 android:text =" ,请填写您的订单." >
425 </ TextView >
426
427 </ LinearLayout >
428
429 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
430 android:layout_width ="fill_parent" android:layout_height ="40px"
431 android:orientation ="horizontal" >
432
433 < TextView
434 android:layout_width ="100px" android:layout_height ="fill_parent"
435 android:textSize ="16sp"
436 android:text ="详细地址:" >
437 </ TextView >
438
439 < EditText
440 android:id ="@+id/user_address"
441 android:layout_width ="220px" android:layout_height ="32px"
442 android:textSize ="10sp" >
443 </ EditText >
444
445 </ LinearLayout >
446
447 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
448 android:layout_width ="fill_parent" android:layout_height ="40px"
449 android:orientation ="horizontal" >
450
451 < TextView
452 android:layout_width ="100px" android:layout_height ="fill_parent"
453 android:textSize ="16sp"
454 android:text ="邮政编码:" >
455 </ TextView >
456
457 < EditText
458 android:id ="@+id/user_zipcode"
459 android:layout_width ="220px" android:layout_height ="32px"
460 android:textSize ="10sp" >
461 </ EditText >
462
463 </ LinearLayout >
464
465 < LinearLayout xmlns:android ="http://schemas.android.com/apk/res/android"
466 android:layout_width ="fill_parent" android:layout_height ="40px"
467 android:orientation ="horizontal" >
468
469 < TextView
470 android:layout_width ="100px" android:layout_height ="fill_parent"
471 android:textSize ="16sp"
472 android:text ="联系号码:" >
473 </ TextView >
474
475 < EditText
476 android:id ="@+id/user_phone"
477 android:layout_width ="220px" android:layout_height ="32px"
478 android:textSize ="10sp" >
479 </ EditText >
480
481 </ LinearLayout >
482
483 < AbsoluteLayout
484 android:layout_width ="fill_parent" android:layout_height ="50px" >
485
486 < Button
487 android:id ="@+id/button_pay"
488 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
489 android:layout_x ="60px" android:layout_y ="10px"
490 android:background ="@drawable/button_pay" >
491 </ Button >
492
493 < Button
494 android:id ="@+id/button_cancelbuy"
495 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
496 android:layout_x ="210px" android:layout_y ="10px"
497 android:background ="@drawable/button_cancelbuy" >
498 </ Button >
499
500 </ AbsoluteLayout >
501
502 </ LinearLayout >
503
504 </ LinearLayout >
505
506
507
508 </ FrameLayout >
509
510 < AbsoluteLayout
511 android:layout_width ="wrap_content" android:layout_height ="fill_parent" >
512
513 < Button
514 android:id ="@+id/button_shopinfo"
515 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
516 android:layout_x ="0px" android:layout_y ="30px"
517 android:background ="@drawable/button_shopinfo" >
518 </ Button >
519
520 < Button
521 android:id ="@+id/button_productlist"
522 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
523 android:layout_x ="0px" android:layout_y ="80px"
524 android:background ="@drawable/button_productlist" >
525 </ Button >
526
527 < Button
528 android:id ="@+id/button_shoppingcart"
529 android:layout_width ="wrap_content" android:layout_height ="wrap_content"
530 android:layout_x ="0px" android:layout_y ="130px"
531 android:background ="@drawable/button_shoppingcart" >
532 </ Button >
533
534 </ AbsoluteLayout >
535
536 </ LinearLayout ></ LinearLayout >