Android中的五大布局

標籤：stroke   tle   定位   簡單   height   tor   --   enter   位置   

一、布局介紹

在Android中，共有五種布局方式，分別是：

• FrameLayout(架構布局)
• LinearLayout(線性布局)
• AbsoluteLayout(絕對布局)
• RelativeLayout(相對布局)
• TableLayout(表格版面配置)

1. FrameLayout架構布局

• 布局特點：放入其中的所有元素都被放置在最左上的地區，而且無法為這些元素指定一個確切的位置,下一個子項目會重疊覆蓋上一個子項目
• 應用情境：適合瀏覽單張圖片。

2. LinearLayout線性布局

• 布局特點：放主要提供控制項水平或者垂直排列的模型，每個子組件
  都是以垂直或水平的方式來線性排布.(預設是垂直)
• 應用情境：最常用的布局方式

  linearLayout中有一個重要的屬性 android:layout_weight="1"，這個weight在垂直布局時，代表行距；水平的時候代表列寬；weight值越大就越大。

3. AbsoluteLayout絕對位置布局

• 布局特點：採用座標軸的方式定位組件，左上方是（0，0）點，往右x軸遞增，往下Y軸遞增,組件定位屬性為android:layout_x和 android:layout_y來確定座標。
• 應用情境：準確定位空間位置

  由於Android手機的螢幕尺寸、解析度存在較大差異，使用AbsoluteLayout無法兼顧適配問題，所以該布局已經過時

4. RelativeLayout相對布局

• 布局特點：為某一個組件為參照物，來定位下一個組件的位置的布局方式。
• 應用情境：控制項之間存在相應關係（適配神器，推薦使用）

5. TableLayout表格版面配置

• 布局特點：類似Html裡的Table.使用TableRow來布局，其中TableRow代表一行，TableRow的每一個視圖組件代表一個儲存格。
• 應用情境：控制項之間存在相應關係。

這五個布局元素可以相互嵌套應用，做出美觀的介面。

二、布局屬性配置

Android布局裡XML的屬性配置

1. 五種Layout中Item的基礎屬性：

• layout_width & layout_height
• layout_margin+方位 & padding+方位
• layout_gravity & gravity

Android五種布局都具備上述幾個基礎屬性

1. layout_width & layout_height

• 作用：設定Layout中組件的寬度和高度
• 取值：
  a. 固定的像素值

  android:layout_width="66px"

  b. "wrap_content"
  相應視圖的寬和高就會被設定成所需的最小尺寸以適應視圖中的內容

  android:layout_width="wrap_content"

   

  c. “match_parent"(在Android API 8之前叫作"fill_parent")
  視圖的寬和高延伸至充滿整個父布局

  android:layout_width="match_parent"

   

2. layout_margin+方位/padding+方位

• 作用：設定放入Layout中的View與Layout的邊界或者其他View之間能夠相距一段距離
• 設定：

  layout_marginLeft          //paddingLeftlayout_marginTop         //paddingToplayout_marginRight      //paddingRightlayout_marginBottom   //paddingBottomlayout_margin             //padding

   

• 取值：固定值

  android:layout_marginLeft="66px"  //android:paddingLeft=”66px“

   

paddingLeft與android:layout_marginLeft的區別：

• padding和margin都是邊距的含義，但二者邊距的定義不同：
  padding是控制項的內容相對控制項的邊緣的邊距；
  layout_margin是控制項邊緣相對父控制項的邊距。具體如：

padding屬性與margin屬性的區別

3. layout_gravity / gravity

• 作用：用來確定View在Layout中的固定位置

android gravity和layout_gravity區別：

1. gravity屬性：是對該view 內容的位置的設定。
   比如一個button 上面的text. 你可以設定該text 在view的靠左，靠右等位置．
2. layout_gravity屬性：是用來設定該view相對與父view 的位置。
   比如一個button 在Linearlayout裡，你可以通過設定該屬性把該button放在父布局Linearlayout靠左靠右等位置。

2. 各種Layout的特有屬性2.1 FrameLayout

作為最簡單的Layout，只具備基礎屬性：

• layout_width & layout_height
• layout_margin+方位 & padding+方位
• layout_gravity & gravity

2.2 AbsoluteLayout

除了基礎屬性外，AbsoluteLayout還具備：

• layout_x：指定控制項的x座標
• layout_y：指定控制項的x座標

上述屬性的取值均為固定值。

2.3 TableLayout

除了基礎屬性外，由於TableLayout的行TableRow是一個橫向的（horizontal）的LinearLayout，所以具備LinearLayout的屬性

2.4 LinearLayout

除了基礎屬性，還會有：

• orientation
  1.作用：設定布局內控制項的相片順序
  2.取值：vertical（垂直排列-預設值）、horizontal（水平排列）

  android:orientation="vertical";  //android:orientation="horizontal";

   

• layout_weight
  1.定義：是線性布局（Linelayout）的一個獨特比例分配屬性
  2.作用：使用此屬性設定權重，然後按照比例對介面進行空間的分配，公式計算是：控制項寬度=控制項設定寬度+剩餘空間所佔百分比寬幅

  具體可以參考這篇文章，講解得非常詳細

2.5 RelativeLayout

RelativeLayout的屬性算是最多的了，除了基本屬性外，還有：
a. 相對於父空間

XML屬性	說明
layout_alignParentBottom	當前控制項底端與父控制項的底端對齊
layout_alignParentLeft	當前控制項左端與父控制項的左端對齊
layout_alignParentRight	當前控制項右端與父控制項的右端對齊
layout_alignParentTop	當前控制項上端與父控制項的上端對齊
layout_centerHorizontal	當前控制項位於父控制項的橫向中間位置（水平方向上的中間）
layout_centerVertical	當前控制項位於父控制項的縱向中間位置（平面上的正中間）
layout_centerInParent	當前控制項位於父控制項的縱橫向中間位置（垂直方向上的中間）

上述所有屬性的取值皆為boolean屬性：true、false。

b. 相對於給定控制項

XML屬性	說明
layout_above	使當前控制項位於給出id控制項的上方
layout_below	使當前控制項位於給出id控制項的下方
layout_toLeftOf	使當前控制項位於給出id控制項的左側
layout_toRightOf	使當前控制項位於給出id控制項的右側
layout_alignBottom	使當前控制項與給出id控制項的底部部重合
layout_alignLeft	使當前控制項與給出id控制項的左邊重合
layout_alignRight	使當前控制項與給出id控制項的右邊重合
layout_alignTop	使當前控制項與給出id控制項的頂部重合
layout_alignBaseline	使當前控制項的BaseLine與給出id控制項t的BaseLine重合

上述所有屬性的取值皆為給定控制項的id名，如下例子

//文本控制項@+id/tab_textview在控制項@+id/tab_imageview的下方<TextView    android:id="@+id/tab_textview"    android:layout_below="@+id/tab_imageview"    android:layout_width="wrap_content"    android:layout_height="wrap_content"      />

 

3. 選取器selector.xml的屬性

3.1 作用
通過設定selector.xml可使得控制項在不同操作下（預設、點擊、焦點等）的顯示不同樣式

3.2 屬性

XML屬性	說明
android:drawable	放一個drawable資源
android:state_pressed	按下狀態，如一個按鈕觸摸或者點擊。
android:state_focused	取得焦點狀態，比如使用者選擇了一個文字框。
android:state_hovered	游標懸停狀態，通常與focused state相同，它是4.0的新特性
android:state_selected	選中狀態
android:state_enabled	能夠接受觸摸或者點擊事件
android:state_checked	被checked了，如：一個RadioButton可以被check了。
android:state_enabled	能夠接受觸摸或者點擊事件

上述所有屬性的取值皆為boolean屬性：true、false。

3.3 執行個體說明
在drawable添加selector.xml資源檔。

button_selector.xml:

<?xml version="1.0" encoding="UTF-8"?>< selector xmlns:android="http://schemas.android.com/apk/res/android"> < !-- 指定按鈕按下時的圖片 --> <item android:state_pressed="true"         android:drawable="@drawable/start_down" /> < !-- 指定按鈕鬆開時的圖片 -->  <item android:state_pressed="false"       android:drawable="@drawable/start" />< /selector>

 

在布局檔案main.xml中控制項的屬性設定:

<Button  android:id="@+id/startButton"  android:layout_width="wrap_content"  android:layout_height="wrap_content"  android:background="@drawable/button_selector" />

 

4. 布局形狀shape.xml的屬性

<shape xmlns:android="http://schemas.android.com/apk/res/android">//預設顏色<solid android:color="#876543"/>//哪個方向有邊框線  <padding        android:bottom="0dp"        android:left="1dp"        android:right="1dp"        android:top="1dp" />     //邊框線顏色、大小    <stroke        android:width="1dp"        android:color="#000000" />

 

在布局檔案main.xml中控制項的屬性設定:

<Button  android:id="@+id/startButton"  android:layout_width="wrap_content"  android:layout_height="wrap_content"  android:background="@drawable/layout_shape" />

 

Android中的五大布局