Android基本布局

基本理論

1.LinearLayout 線性布局
2.FrameLayout 單幀布局,也有中文翻譯為幀布局、框架布局。
3.RelativeLayout 相對布局
4.AbsoluteLayout 絕對布局
5.TableLayout 表格布局
而在Android4.0之后又新增了一種GridLayout網(wǎng)格布局.在手機程序設計中,絕對布局基本上不用,用得相對較多的是線性布局和相對布局。


LinearLayout線性布局

線性布局是Android開發(fā)中最常見的一種布局方式,它是按照垂直或者水平方向來布局,通過“android:orientation”屬性可以設置線性布局的方向。屬性值有垂直(vertical)和水平(horizontal)兩種。線性布局的排列在某行或者某列并不會自動換行或換列,就是說如果采用水平布局,控件寬度超過屏幕顯示的話,后面的控件都將被隱藏,不會自動換行常用的屬性有:

android:orientation:可以設置布局的方向
android:id - 為控件指定相應的ID
android:text - 指定控件當中顯示的文字,需要注意的是,這里盡量使用string.xml
android:gravity - 指定控件的基本位置,比如說居中,居右等位置
android:textSize - 指定控件當中字體的大小
android:background - 指定控件所用的背景色,RGB命名法
android:layout_width - 指定控件的寬度
android:layout_height - 指定控件的高度
android:layout_weight - 指定控件的占用比例
android:padding - 指定控件的內(nèi)邊距,也就是說控件當中的內(nèi)容
android:sigleLine - 如果設置為真的話,則將控件的內(nèi)容顯示在一行當中
layout_weight屬性以控制各個控件在布局中的相對大小。layout_weight屬性是一個非負整數(shù)值;線性布局會根據(jù)該控件layout_weight值與其所處布局中所有控件layout_weight值之和的比值為該控件分配占用的區(qū)域。例如,在水平布局的LinearLayout中有兩個Button,這兩個Button的layout_weight屬性值都為1,那么這兩個按鈕都會被拉伸到整個屏幕寬度的一半。如果layout_weight指為0,控件會按原大小顯示,不會被拉伸;對于其余l(xiāng)ayout_weight屬性值大于0的控件,系統(tǒng)將會減去layout_weight屬性值為0的控件的寬度或者高度,再用剩余的寬度或高度按相應的比例來分配每一個控件顯示的寬度或高度。

線性水平布局代碼和示意圖如下:


image.png

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


image.png

布局也是可以嵌套的,代碼和示意圖如下:


image.png

FrameLayout單幀布局

FrameLayout是布局中最簡單的一個布局,在這個布局中,整個界面被當成一塊空白備用區(qū)域,所有的子元素都不能被指定放置的位置,它們統(tǒng)統(tǒng)放于這塊區(qū)域的左上角,并且后面的子元素直接覆蓋在前面的子元素之上,將前面的子元素部分和全部遮擋。

代碼及顯示效果圖如下:


image.png

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

深入了解:幀布局(FrameLayout)實現(xiàn)小鳥飛翔案例

RelativeLayout相對布局

RelativeLayout(相對布局)是除線性布局之外最常用的,它相對于線性布局來說比較靈活,在進行組件布局的時候用線性布局往往需要進行布局嵌套,而相對布局就不會那么麻煩,每個組件都可以指定與其它組件或父組件的位置,只是必須通過ID來進行指定。RelativeLayout按照各子元素之間的位置關(guān)系完成布局。在此布局中的子元素里與位置相關(guān)的屬性將生效。例如android:layout_below, android:layout_above等。子元素就通過這些屬性和各自的ID配合指定位置關(guān)系。注意在指定位置關(guān)系時,引用的ID必須在引用之前,先被定義,否則將出現(xiàn)異常。
代碼及演示示例如下:


image.png

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

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

而對于相對布局的屬性,這里也推薦一篇博文供大家參考學習:

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


AbsoluteLayout絕對布局

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

雖然實際開發(fā)總已經(jīng)不推薦使用該布局,不過我們還是了解一下他的使用方法(不做詳細介紹,感興趣的自行去查找文檔),代碼和示意圖如下:


image.png

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.png

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

1.shrinkColumns屬性:以0為序,當TableRow里面的控件布滿布局時,,指定列自動延伸以填充可用部分;當TableRow里面的控件還沒有布滿布局時,shrinkColumns不起作用。

我們在布局代碼中加入該屬性時會發(fā)現(xiàn)沒有發(fā)生變化,因為TableRow里面的控件還沒有布滿布局,修改代碼如下就可以看到效果:

image.png

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

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

4.layout_column屬性:以0行為序,設置組件顯示指定列
5.layout_span屬性:以第0行為序,設置組件顯示占用的列數(shù)。

這兩個屬性之所以放一起,因為有些事項需要說明,先看代碼和效果圖:


image.png

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


GridLayout網(wǎng)格布局

GridLayout網(wǎng)格布局是Android4.0之后新加入的布局方式,與TableLayout大同小異,不過也新增了一些內(nèi)容:

1.可以設置容器中組件的對其方式。

2.容器中的組件可以跨多行也可以跨多列

需要注意的是因為是Android4.0之后新增的,所以API Level14之前的SDK無法直接使用,還想使用的話就自己去百度方法,這里不再說,因為我覺得應該很少人再做4.0之前的程序了吧?

先看示例代碼吧,這個網(wǎng)格布局做計算器示例應該是最簡單的:


image.png

說明:rowCount和columnCount是定義了行和列,就是這個布局定義了6行4列。這里layout_columnSpan是指占用了幾列,在示例代碼中,“BackSpace”和”Clear“按鈕都占用了2列,其他按鈕默認都是占用1行1列。其中l(wèi)ayout_rowSpan是占用了幾行,這里不再寫示例,各位可以自行實驗,再通過將layout_gravity設置為fill就是填滿占用的行或列。


?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容