原文地址:http://www.jianshu.com/p/4fac6304d872
目錄
Android五大布局介紹&屬性設置.jpg
一、佈局介紹
在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"
相應視圖的寬和高就會被設定成所需的最小尺寸以適應視圖中的內容android:layout_width="wrap_content"
視圖的寬和高延伸至充滿整個父佈局android:layout_width="match_parent"
2. layout_margin+方位/padding+方位
- 作用:設置放入Layout中的View與Layout的邊界或者其他View之間能夠相距一段距離
- 設置:
layout_marginLeft //paddingLeft layout_marginTop //paddingTop layout_marginRight //paddingRight layout_marginBottom //paddingBottom layout_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區別:
- gravity屬性:是對該view 內容的位置的設置。
比如一個button 上面的text. 你可以設置該text 在view的靠左,靠右等位置.- 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"
/>