Android開發自學筆記(Android Studio)—4.1佈局組件

1、引言

Android的界面是有佈局和組件協同完成的,佈局比如是建築裏的框架,而組件則至關於建築裏的磚瓦。組件按照佈局的要求依次排列,就組成了用戶所看見的界面。在Android4.0以前,咱們一般說Android開發五大布局和四大組件,這五大布局就是:html

    1. LinearLayout 線性佈局
    2. FrameLayout 單幀佈局,也有中文翻譯爲幀佈局、框架佈局。
    3. RelativeLayout 相對佈局
    4. AbsoluteLayout 絕對佈局
    5. TableLayout 表格佈局

而在Android4.0以後又新增了一種GridLayout網格佈局。
android

2、LinearLayout線性佈局

線性佈局是Android開發中最多見的一種佈局方式,它是按照垂直或者水平方向來佈局,經過「android:orientation」屬性能夠設置線性佈局的方向。屬性值有垂直(vertical)和水平(horizontal)兩種。線性佈局的排列在某行或者某列並不會自動換行或換列,就是說若是採用水平佈局,控件寬度超過屏幕顯示的話,後面的控件都將被隱藏,不會自動換行。框架

經常使用的屬性有:佈局

  1. android:orientation:能夠設置佈局的方向
  2. android:id - 爲控件指定相應的ID
  3. android:text - 指定控件當中顯示的文字,須要注意的是,這裏儘可能使用string.xml
  4. android:gravity - 指定控件的基本位置,好比說居中,居右等位置
  5. android:textSize - 指定控件當中字體的大小
  6. android:background - 指定控件所用的背景色,RGB命名法
  7. android:layout_width - 指定控件的寬度
  8. android:layout_height - 指定控件的高度
  9. android:layout_weight - 指定控件的佔用比例
  10. android:padding - 指定控件的內邊距,也就是說控件當中的內容
  11. android:sigleLine - 若是設置爲真的話,則將控件的內容顯示在一行當中

layout_weight屬性以控制各個控件在佈局中的相對大小。layout_weight屬性是一個非負整數值;線性佈局會根據該控件layout_weight值與其所處佈局中全部控件layout_weight值之和的比值爲該控件分配佔用的區域。例如,在水平佈局的LinearLayout中有兩個Button,這兩個Button的layout_weight屬性值都爲1,那麼這兩個按鈕都會被拉伸到整個屏幕寬度的一半。若是layout_weight指爲0,控件會按原大小顯示,不會被拉伸;對於其他layout_weight屬性值大於0的控件,系統將會減去layout_weight屬性值爲0的控件的寬度或者高度,再用剩餘的寬度或高度按相應的比例來分配每個控件顯示的寬度或高度。學習

線性水平佈局代碼和示意圖以下:字體

image

線性垂直佈局代碼和示意圖以下(android:orientation經過修改該屬性值控制水平或者垂直):ui

image

佈局也是能夠嵌套的,代碼和示意圖以下:spa

image

3、FrameLayout單幀佈局

FrameLayout是佈局中最簡單的一個佈局,在這個佈局中,整個界面被當成一塊空白備用區域,全部的子元素都不能被指定放置的位置,它們通通放於這塊區域的左上角,而且後面的子元素直接覆蓋在前面的子元素之上,將前面的子元素部分和所有遮擋。.net

代碼及顯示效果圖以下:翻譯

image

能夠看到3個按鈕組件都有重疊的部分,單幀佈局不會像線性佈局那樣每一個組件之間自動對齊。

對於單幀佈局的使用場景我仍是有所疑惑的,不知道這種佈局方式會用在什麼場景下,不過我看了這一篇文章卻是略有感觸,分享一下,或許也能給你們些啓發:

示例:幀佈局(FrameLayout)實現小鳥飛翔案例

4、RelativeLayout相對佈局

RelativeLayout(相對佈局)是除線性佈局以外最經常使用的,它相對於線性佈局來講比較靈活,在進行組件佈局的時候用線性佈局每每須要進行佈局嵌套,而相對佈局就不會那麼麻煩,每一個組件均可以指定與其它組件或父組件的位置,只是必須經過ID來進行指定。RelativeLayout按照各子元素之間的位置關係完成佈局。在此佈局中的子元素裏與位置相關的屬性將生效。例如android:layout_below, android:layout_above等。子元素就經過這些屬性和各自的ID配合指定位置關係。注意在指定位置關係時,引用的ID必須在引用以前,先被定義,不然將出現異常。

代碼及演示示例以下:

image

補充一下用到的屬性的說明:

表1.組件之間的位置關係屬性  
屬性名稱 做用說明
android:layout_above 將組件放在指定ID組件的上方
android:layout_below 將組件放在指定ID組件的下方
android:layout_toLeftOf 將組件放在指定ID組件的左方
android:layout_toRightOf 將組件放在指定ID組件的右方
表2.組件對齊關係屬性  
android:layout_alignBaseline 將該組件放在指定ID組件進行中心線對齊
android:layout_alignTop 將該組件放在指定ID組件進行頂部對齊
android:layout_alignBottom 將該組件放在指定ID組件進行底部對齊
android:layout_alignLeft 將該組件放在指定ID組件進行左邊緣對齊
android:layout_alignRight 將該組件放在指定ID組件進行右邊緣對齊
表3.當前組件與父組件對齊關係屬性  
android:layout_centerHorizontal 將該組件放置在水平方向中央的位置
android:layout_centerVertical 將該組件放置在垂直方向的中央的位置
anroid:layout_centerInParent 將該組件放置在父組件的水平及垂直中央

而對於相對佈局的屬性,這裏也推薦一篇博文供你們參考學習:

RelativeLayout佈局用到的一些重要屬性參考

5、AbsoluteLayout絕對佈局

AbsoluteLayout(絕對佈局)佈局用法如其名,組件的位置能夠準確的指定其在屏幕的x/y座標位置。雖然能夠精確的去規定座標,可是因爲代碼的書寫過於剛硬,使得在不一樣的設備,不一樣分辨率的手機移動設備上不能很好的顯示應有的效果,因此此佈局不怎麼被推薦使用。在此佈局中的子元素的android:layout_x和android:layout_y屬性將生效,用於描述該子元素的座標位置。屏幕左上角爲座標原點(0,0),第一個0表明橫座標,向右移動此值增大,第二個0表明縱座標,向下移動,此值增大。在此佈局中的子元素能夠相互重疊。在實際開發中,一般不採用此佈局格式。

雖然實際開發總已經不推薦使用該佈局,不過咱們仍是瞭解一下他的使用方法(不作詳細介紹,感興趣的自行去查找文檔),代碼和示意圖以下:

image

6、TableLayout表格佈局

TableLayout顧名思義,此佈局爲表格佈局,適用於N行N列的佈局格式。一個TableLayout由許多TableRow組成,一個TableRow就表明TableLayout中的一行。

TableRow是LinearLayout的子類,它的android:orientation屬性值恆爲horizontal,而且它的android:layout_width和android:layout_height屬性值恆爲MATCH_PARENT和WRAP_CONTENT。因此它的子元素都是橫向排列,而且寬高一致的。這樣的設計使得每一個TableRow裏的子元素都至關於表格中的單元格同樣。在TableRow中,單元格能夠爲空,可是不能跨列。

下面咱們使用表格佈局編寫示例代碼作一個三行三列的佈局:

image

TableLayout不復雜,使用也就是這麼簡單,下面補充幾個經常使用屬性的做用:

1.shrinkColumns屬性:以0爲序,當TableRow裏面的控件佈滿佈局時,,指定列自動延伸以填充可用部分;當TableRow裏面的控件尚未佈滿佈局時,shrinkColumns不起做用。

咱們在佈局代碼中加入該屬性時會發現沒有發生變化,由於TableRow裏面的控件尚未佈滿佈局,修改代碼以下就能夠看到效果:

image

2.strechColumns屬性,以第0行爲序,指定列對空白部分進行填充。代碼及效果以下:

image

3.collapseColumns屬性:以0行爲序,隱藏指定的列。這個比較容易理解,代碼及效果以下:

image

4.layout_column屬性:以0行爲序,設置組件顯示指定列
5.layout_span屬性:以第0行爲序,設置組件顯示佔用的列數。

這兩個屬性之因此放一塊兒,由於有些事項須要說明,先看代碼和效果圖:

image

注意:從示意圖可知:Button1被設置了佔用了2列,Button4被設置顯示在地2列,但代碼指定Button5顯示在第1列,但沒有按照設定顯示,這樣可知TableRow在表格佈局中,一行裏的組件都會自動放在前一組件的右側,依次排列,只要肯定了所在列,其後面的組件就沒法再進行位置的設置。

7、GridLayout網格佈局

GridLayout網格佈局是Android4.0以後新加入的佈局方式,與TableLayout大同小異,不過也新增了一些內容:

1.能夠設置容器中組件的對其方式。

2.容器中的組件能夠跨多行也能夠跨多列

須要注意的是由於是Android4.0以後新增的,因此API Level14以前的SDK沒法直接使用,還想使用的話就本身去百度方法,這裏再也不說,由於我以爲應該不多人再作4.0以前的程序了吧?

先看示例代碼吧,這個網格佈局作計算器示例應該是最簡單的:

image

說明:rowCount和columnCount是定義了行和列,就是這個佈局定義了6行4列。這裏layout_columnSpan是指佔用了幾列,在示例代碼中,「BackSpace」和」Clear「按鈕都佔用了2列,其餘按鈕默認都是佔用1行1列。其中layout_rowSpan是佔用了幾行,這裏再也不寫示例,各位能夠自行實驗,再經過將layout_gravity設置爲fill就是填滿佔用的行或列。

其它擴展的內容各位能夠查找對應的API說明文檔進行學習。

8、參考文章

1.網格佈局-GridLayout

2.五大布局方式詳解

3.淺談Android開發五大布局

4.Android佈局管理(五大布局使用)

相關文章
相關標籤/搜索