Android開(kāi)發(fā)之布局








為了適應(yīng)各式各樣的界面風(fēng)格，Android系統(tǒng)提供了5種布局，這5種布局分別是：

LinearLayout(線性布局)

TableLayout(表格布局)

RelativeLayout(相對(duì)布局)

AbsoluteLayout(絕對(duì)布局)

FrameLayout(框架布局)

利用這五種布局，可以在屏幕上將控件隨心所欲的擺放，而且控件的大小和位置會(huì)隨著屏幕大小的變化作出相應(yīng)的調(diào)整。下面是這五個(gè)布局在View的繼承體系中的關(guān)系：
Android開(kāi)發(fā)之布局 


一，LinearLayout(線性布局)

    在一個(gè)方向上(垂直或水平)對(duì)齊所有子元素
一個(gè)垂直列表每行將只有一個(gè)子元素(無(wú)論它們有多寬)
一個(gè)水平列表只是一列的高度（最高子元素的高度來(lái)填充）

下面是一個(gè)簡(jiǎn)單的線性布局的例子：
Android開(kāi)發(fā)之布局

目前成都創(chuàng)新互聯(lián)已為成百上千家的企業(yè)提供了網(wǎng)站建設(shè)、域名、網(wǎng)頁(yè)空間、網(wǎng)站運(yùn)營(yíng)、企業(yè)網(wǎng)站設(shè)計(jì)、豐南網(wǎng)站維護(hù)等服務(wù)，公司將堅(jiān)持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長(zhǎng)，共同發(fā)展。

  1. 01 <?xml version="1.0" encoding="utf-8"?> 

  2. 02 <LinearLayout 

  3. 03 xmlns:android="http://schemas.android.com/apk/res/android" 

  4. 04 android:layout_width="match_parent" 

  5. 05 android:layout_height="match_parent" android:orientation="vertical"> 

  6. 06 <EditText android:text="EditText" 

  7. 07   

  8. 08 android:id="@+id/editText1" 

  9. 09   

  10. 10 android:layout_height="wrap_content" 

  11. 11   

  12. 12 android:layout_width="fill_parent"> 

  13. 13   

  14. 14 </EditText> 

  15. 15 <LinearLayout android:id="@+id/linearLayout1" 

  16. 16   

  17. 17 android:layout_height="fill_parent" 

  18. 18   

  19. 19 android:layout_width="fill_parent" 

  20. 20   

  21. 21 android:gravity="right"> 

  22. 22 <Button android:id="@+id/button2" 

  23. 23   

  24. 24 android:text="Button" 

  25. 25   

  26. 26 android:layout_width="wrap_content" 

  27. 27   

  28. 28 android:layout_height="wrap_content"></Button> 

  29. 29 <Button android:text="Button" 

  30. 30   

  31. 31 android:id="@+id/button1" 

  32. 32   

  33. 33 android:layout_width="wrap_content" 

  34. 34   

  35. 35 android:layout_height="wrap_content"></Button> 

  36. 36 </LinearLayout> 

  37. 37 </LinearLayout>

復(fù)制代碼

最外層布局為垂直線性布局，寬度為整個(gè)屏幕(fill_parent)，高度為剛好適合子控件(wrap_content)。然后依次添加一個(gè)EditText，一個(gè)水平布局的LinearLayout，在這個(gè)線性布局里面，擺放兩個(gè)Button，該線性布局的gravity屬性設(shè)置為”right”，所以里面的兩個(gè)Button靠右顯示。

二，TableLayout(表格布局)

把子元素放入到行與列中
不顯示行、列或是單元格邊界線
單元格不能橫跨行，如HTML中一樣
表格布局模型以行列的形式管理子控件，每一行為一個(gè)TableRow的對(duì)象，當(dāng)然也可以是一個(gè)View的對(duì)象。TableRow可以添加子控件，每添加一個(gè)為一列。

android:layout_colum官方解釋：The index of the column in which this child should be，也即是設(shè)置該控件在TableRow中所處的列。
android:layout_span官方解釋：Defines how many columns this child should span，也即是設(shè)置該控件所跨越的列數(shù)。

android:collapseColumns官方解釋：The 0 based index of the columns to collapse. The column indices must be separated by a comma: 1, 2, 5.也即是將TableLayout里面指定的列隱藏，若有多列需要隱藏，請(qǐng)用逗號(hào)將需要隱藏的列序號(hào)隔開(kāi)。

android:stretchColumns官方解釋：The 0 based index of the columns to stretch. The column indices must be separated by a comma: 1, 2, 5. You can stretch all columns by using the value “*” instead. Note that a column can be marked stretchable and shrinkable at the same time.也即是設(shè)置指定的列為可伸展的列，可伸展的列會(huì)盡量伸展以填滿所有可用的空間，若有多列需要設(shè)置為可伸展，請(qǐng)用逗號(hào)將需要伸展的列序號(hào)隔開(kāi)。

android:shrinkColumns官方解釋：The 0 based index of the columns to shrink. The column indices must be separated by a comma: 1, 2, 5. You can shrink all columns by using the value “*” instead. 設(shè)置指定的列為可收縮的列。當(dāng)可收縮的列太寬以至于讓其他列顯示不全時(shí)，會(huì)縱向延伸空間。當(dāng)需要設(shè)置多列為可收縮時(shí)，將列序號(hào)用逗號(hào)隔開(kāi)。

下面用一個(gè)例子簡(jiǎn)單說(shuō)明TableLayout的用法：
Android開(kāi)發(fā)之布局

  1. 01 <?xml version="1.0" encoding="utf-8"?> 

  2. 02 <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" 

  3. 03 android:layout_width="fill_parent" 

  4. 04 android:layout_height="fill_parent" 

  5. 05 android:stretchColumns="1"> 

  6. 06 <TableRow> 

  7. 07 <TextView 

  8. 08 android:layout_column="1" 

  9. 09 android:padding="3dip" android:text="Row1"/> 

  10. 10 <TextView 

  11. 11 android:text="1" 

  12. 12 android:gravity="right" 

  13. 13 android:padding="3dip" /> 

  14. 14 </TableRow> 

  15. 15 <View 

  16. 16 android:layout_height="2dip" 

  17. 17 android:background="#FF909090" /> 

  18. 18 <TableRow> 

  19. 19 <TextView 

  20. 20 android:text="*" 

  21. 21 android:padding="3dip" /> 

  22. 22 <TextView 

  23. 23 android:text="Row12" 

  24. 24 android:padding="3dip" /> 

  25. 25 <TextView 

  26. 26 android:text="2" 

  27. 27 android:gravity="right" 

  28. 28 android:padding="3dip" /> 

  29. 29 </TableRow> 

  30. 30 <View 

  31. 31 android:layout_height="2dip" 

  32. 32 android:background="#FF909090" /> 

  33. 33 <TableRow> 

  34. 34 <TextView 

  35. 35 android:layout_column="1" 

  36. 36 android:text="Row13" 

  37. 37 android:padding="3dip" /> 

  38. 38 </TableRow> 

  39. 39 </TableLayout>

復(fù)制代碼

三、RelativeLayout(相對(duì)布局)

相對(duì)布局的子控件會(huì)根據(jù)它們所設(shè)置的參照控件和參數(shù)進(jìn)行相對(duì)布局。參照控件可以是父控件，也可以是其它子控件，但是被參照的控件必須要在參照它的控件之前定義。下面是一個(gè)簡(jiǎn)單的例子：
Android開(kāi)發(fā)之布局

  1. 01 <?xml version="1.0" encoding="utf-8"?> 

  2. 02 <?xml version="1.0" encoding="utf-8"?> 

  3. 03 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 

  4. 04 android:layout_width="fill_parent" 

  5. 05 android:layout_height="fill_parent" 

  6. 06 > 

  7. 07 <AnalogClock 

  8. 08 android:id="@+id/aclock" 

  9. 09 android:layout_width="wrap_content" 

  10. 10 android:layout_height="wrap_content" 

  11. 11 android:layout_centerInParent="true" /> 

  12. 12 <DigitalClock 

  13. 13 android:id="@+id/dclock" 

  14. 14 android:layout_width="wrap_content" 

  15. 15 android:layout_height="wrap_content" 

  16. 16 android:layout_below="@id/aclock" 

  17. 17 android:layout_alignLeft="@id/aclock" 

  18. 18 android:layout_marginLeft="40px" /> 

  19. 19 <TextView 

  20. 20 android:layout_width="wrap_content" 

  21. 21 android:layout_height="wrap_content" 

  22. 22 android:text="當(dāng)前時(shí)間：" 

  23. 23 android:layout_toLeftOf="@id/dclock" 

  24. 24 android:layout_alignTop="@id/aclock"/> 

  25. 25 </RelativeLayout>

復(fù)制代碼

四、AbsoluteLayout(絕對(duì)布局)

絕對(duì)布局的子控件需要指定相對(duì)于此坐標(biāo)布局的橫縱坐標(biāo)值，否則將會(huì)像框架布局那樣被排在左上角。手機(jī)應(yīng)用需要適應(yīng)不同的屏幕大小，而這種布局模型不能自適應(yīng)屏幕尺寸大小，所以應(yīng)用的相對(duì)較少。下面以一個(gè)例子簡(jiǎn)單說(shuō)明絕對(duì)布局：
Android開(kāi)發(fā)之布局

  1. 01 <?xml version="1.0" encoding="utf-8"?> 

  2. 02 <AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android" 

  3. 03 android:layout_width="fill_parent" 

  4. 04 android:layout_height="fill_parent" 

  5. 05 > 

  6. 06 <TextView 

  7. 07 android:layout_width="wrap_content" 

  8. 08 android:layout_height="wrap_content" 

  9. 09 android:layout_x="10px" 

  10. 10 android:layout_y="10px" android:text="Textview"/> 

  11. 11 <TextView 

  12. 12 android:layout_width="wrap_content" 

  13. 13 android:layout_height="wrap_content" 

  14. 14 android:layout_x="30px" 

  15. 15 android:layout_y="30px" android:text="Textview"/> 

  16. 16 <TextView 

  17. 17 android:layout_width="wrap_content" 

  18. 18 android:layout_height="wrap_content" 

  19. 19 android:layout_x="50px" 

  20. 20 android:layout_y="50px" android:text="Textview"/> 

  21. 21 </AbsoluteLayout>

復(fù)制代碼

五、FrameLayout(框架布局)


框架布局是最簡(jiǎn)單的布局形式。所有添加到這個(gè)布局中的視圖都以層疊的方式顯示。第一個(gè)添加的控件被放在最底層，最后一個(gè)添加到框架布局中的視圖顯示在最頂層，上一層的控件會(huì)覆蓋下一層的控件。這種顯示方式有些類似于堆棧。下面舉一個(gè)簡(jiǎn)單的例子

Android開(kāi)發(fā)之布局

  1. 01 <?xml version="1.0" encoding="utf-8"?> 

  2. 02 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 

  3. 03 android:layout_width="fill_parent" android:layout_height="fill_parent"> 

  4. 04 <LinearLayout android:id="@+id/linearLayout1" 

  5. 05 android:layout_height="match_parent" 

  6. 06 android:layout_width="match_parent"> 

  7. 07 <Button android:text="Button" 

  8. 08 android:id="@+id/button1" 

  9. 09 android:layout_width="wrap_content" 

  10. 10 android:layout_height="wrap_content"></Button> 

  11. 11 </LinearLayout> 

  12. 12 <LinearLayout android:layout_width="match_parent" 

  13. 13 android:id="@+id/linearLayout3" 

  14. 14 android:layout_height="match_parent" 

  15. 15 android:gravity="bottom|right"> 

  16. 16 <Button android:text="Button" 

  17. 17 android:id="@+id/button3" 

  18. 18 android:layout_width="wrap_content" 

  19. 19 android:layout_height="wrap_content"></Button> 

  20. 20 </LinearLayout> 

  21. 21 <LinearLayout android:layout_height="match_parent" 

  22. 22 android:id="@+id/linearLayout2" 

  23. 23 android:layout_width="match_parent" 

  24. 24 android:gravity="right"> 

  25. 25 <Button android:text="Button" 

  26. 26 android:id="@+id/button2" 

  27. 27 android:layout_width="wrap_content" 

  28. 28 android:layout_height="wrap_content"></Button> 

  29. 29 </LinearLayout> 

  30. 30 <LinearLayout android:layout_width="match_parent" 

  31. 31 android:id="@+id/LinearLayout01" 

  32. 32 android:layout_height="match_parent" 

  33. 33 android:gravity="bottom|left"> 

  34. 34 <Button android:id="@+id/Button01" 

  35. 35 android:text="Button" 

  36. 36 android:layout_width="wrap_content" 

  37. 37 android:layout_height="wrap_content"></Button> 

  38. 38 </LinearLayout> 

  39. 39 </FrameLayout>

復(fù)制代碼

下面介紹一下RelativeLayout用到的一些重要的屬性：

第一類:屬性值為true或false
android:layout_centerHrizontal                                           水平居中
android:layout_centerVertical                                            垂直居中
android:layout_centerInparent                                           相對(duì)于父元素完全居中
android:layout_alignParentBottom                     貼緊父元素的下邊緣
android:layout_alignParentLeft                        貼緊父元素的左邊緣
android:layout_alignParentRight                       貼緊父元素的右邊緣
android:layout_alignParentTop                        貼緊父元素的上邊緣
android:layout_alignWithParentIfMissing               如果對(duì)應(yīng)的兄弟元素找不到的話就以父元素做參照物

第二類：屬性值必須為id的引用名“@id/id-name”
android:layout_below                          在某元素的下方
android:layout_above                          在某元素的的上方
android:layout_toLeftOf                       在某元素的左邊
android:layout_toRightOf                     在某元素的右邊

android:layout_alignTop                      本元素的上邊緣和某元素的的上邊緣對(duì)齊
android:layout_alignLeft                      本元素的左邊緣和某元素的的左邊緣對(duì)齊
android:layout_alignBottom                 本元素的下邊緣和某元素的的下邊緣對(duì)齊
android:layout_alignRight                    本元素的右邊緣和某元素的的右邊緣對(duì)齊

第三類：屬性值為具體的像素值，如30dip，40px
android:layout_marginBottom              離某元素底邊緣的距離
android:layout_marginLeft                   離某元素左邊緣的距離
android:layout_marginRight                 離某元素右邊緣的距離
android:layout_marginTop                   離某元素上邊緣的距離

當(dāng)前名稱：Android開(kāi)發(fā)之布局
網(wǎng)站網(wǎng)址：http://muchs.cn/article8/ppheop.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供定制網(wǎng)站、用戶體驗(yàn)、網(wǎng)站制作、面包屑導(dǎo)航、網(wǎng)站建設(shè)、做網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)

成都網(wǎng)站建設(shè)