Android精通:TableLayout布局,GridLayout網格布局,FrameLayout幀布局,AbsoluteLayout絕對布局,RelativeLayout相對布局


標題圖

在Android中提供了幾個常用布局:

  1. LinearLayout線性布局
  2. RelativeLayout相對布局
  3. FrameLayout幀布局
  4. AbsoluteLayout絕對布局
  5. TableLayout表格布局
  6. GridLayout網格布局

TableLayout表格布局

TableLayout表格布局.png

TableLayout的介紹

TableLayout是將子類向分別排列成行和列的布局視圖容器,TableLayout是由許多TableRow對象組成的,表格布局以行列的形式管理子控件,每一個單元是一個TableRow或者View對象。

TableLayout中可以通過setConlumnShrinkable()setConlumnStretchable()方法來指定某些列為可以縮小或可伸縮,列是從0開始計數的,第一列為0。

屬性

常用的幾種屬性:

stretchColumns設置運行被拉伸的列的序號,如android:stretchColumns="2,3"表示在第三列的和第四列的一起填補空白,如果要所有列一起填補空白,則用“*”符號,列號都是從0開始算的。

shrinkColumns設置被收縮的列的序號,收縮是用於在一行中列太多或者某列的內容文本過長,會導致某列的內容會被擠出屏幕,這個屬性是可以幫助某列的內容進行收縮,用於防止被擠出的。

android:collapseColumns設置需要被隱藏的列的序號,使用該屬性可以隱藏某列。

android:layout_column為該子類控件顯示在第幾列android:layout_column="2"表示跳過第二個,直接顯示在第三個單元格內。

android:layout_span為該子類控件占據第幾列android:layout_span="3"表示合並3個單元格,就是這個組件將占據3個單元格。

collapseColumns隱藏列

效果如圖:

tablelayout

android:collapseColumns = "0,2",用於隱藏第一列和第三列,代碼如下:

<TableLayout
  android:id="@+id/TableLayout"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:collapseColumns="0,2" >
 <TableRow>

  <Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="one" />

  <Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="two" />

  <Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="three" />

  <Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="four" />

  <Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="five" />
  </TableRow>
</TableLayout>

stretchColumns拉伸列

android:stretchColumns = “1”,設置為第二列為可拉伸列的列,讓該列填滿這一行所有的剩余空間,也就是在整個父寬度的情況在,放幾個按鈕,剩下的空間寬度將用第二列填滿,代碼如下:

tablelayout

<TableLayout
  android:id="@+id/TableLayout"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:stretchColumns="1" >

  <TableRow>

  <Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="one" />

  <Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="two" />

  <Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="three" />

  </TableRow>
</TableLayout>

shrinkColumns收縮列

android:shrinkColumns="1"表示將第二列的內容進行收縮,如果屏幕的額寬度包容不下的話,就會拿第二列進行收縮,就是壓扁,拉長。如同上代碼進行修改即可,多加些內容,讓其文本內容超出屏幕吧!

GridLayout網格布局

GridLayout網格布局是在Android 4.0以后引入的一種新的布局模式,和表格布局是有點類似的,但比表格布局的好,功能也是很強大的,它可以設置布局有多少行和有多少列,也可以設置布局中的組件的排列方式,也可以設置組件的位置,橫跨多少行,多少列。

屬性的那點東西

android:orientation用於設置vertical豎直或horizontal水平。

android:layout_gravity設置對齊方式,可以設置center,right,left等。

android:rowCount可以設置行數,要多少行設置多少行,如android:rowCount="2"為設置網格布局有2行。

android:columnCount可以設置列數,要多少列設置多少列,如android:columnCount="2"為設置網格布局有2列。

android:layout_row設置組件位於第幾行,從0開始計數的,如android:layout_row="1"為設置組件在第2行。

android:layout_column設置組件位於第幾列,從0開始計數的,如android:layout_column="1"為設置組件在第2列。

android:layout_rowSpan設置組件橫跨幾行,如android:layout_rowSpan="2"為縱向橫跨2行。

android:layout_columnSpan設置組件橫跨幾列,如android:layout_columnSpan="2"為橫向橫跨2列。

注意事項:低版本sdk是如何使用GridLayout的呢?要導入v7包的gridlayout包即可,因為GirdLayout是4.0后才推出的,標簽代碼。

<android.support.v7.widget.GridLayout>

FrameLayout幀布局

FrameLayout幀布局是什么樣的呢?所有子控件都放在左上角且后面元素都是直接覆蓋在前面元素之上一種布局模式。

常用屬性:

android:foreground設置改幀布局容器的前景圖像,什么是前景圖像,前景圖像是永遠處於幀布局容器的最上面的圖像,就是不會被覆蓋的圖片。

android:foregroundGravity設置前景圖像顯示的位置

列子代碼

FrameLayout

<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@+id/FrameLayout"
  android:layout_width="match_parent"
  android:layout_height="match_parent">

  <TextView
  android:layout_width="200dp"
  android:layout_height="200dp"
  android:background="#FF6143" />
  <TextView
  android:layout_width="150dp"
  android:layout_height="150dp"
  android:background="#7BFE00" />
  <TextView
  android:layout_width="100dp"
  android:layout_height="100dp"
  android:background="#FFFF00" />

</FrameLayout>

用幀布局可以做出霓虹燈的效果,即為每個TextVeiw設置layout_gravity="center"即可,即可以看到不一樣的效果。

效果

AbsoluteLayout絕對布局

AbsoluteLayout絕對布局是通過x,y位置來為子控件設置位置的,即android:layout_x和android:layout_y屬性。

四大控制屬性.png

由於絕對布局不常見,不常用,因為在不同大小的適配屏幕上的位置直觀上會變化,適應能力差,所以不建議使用。

RelativeLayout相對布局

RelativeLayout是一個相對布局的視圖組,用來顯示相對位置的子視圖類,在默認情況下,所有子視圖對會分布在左上角。

這里簡單溫習一下相關屬性即可:

android:layout_below位於某控件下方,以id為標記
android:layout_above位於某控件上方,以id為標記
android:layout_toLeftOf位於某控件左方,以id為標記
android:layout_toRightOf 位於某控件右方,以id為標記

android:layout_alignBottom與某控件底部對齊,以id為標記
android:layout_alignTop與某控件頂部對齊,以id為標記
android:layout_alignLeft與某控件左邊緣對齊,以id為標記
android:layout_alignRight 與某控件右邊緣對齊,以id為標記

android:layout_alignBaseline與某控件的文本內容在一條直線上

android:layout_alignParentBottom在父容器最下,為true或false
android:layout_alignParentTop在父容器最上,為true或false
android:layout_alignParentLeft 在父容器最左,為true或false
android:layout_alignParentRight 在父容器最右,為true或false

android:layout_marginTop和父容器上端的距離,單位為dp
android:layout_marginBottom和父容器下端的距離,單位為dp
android:layout_marginLeft和父容器左端的距離,單位為dp
android:layout_marginRight和父容器右端的距離,單位為dp
android:layout_margin和父容器四周的距離,單位為dp

android:layout_centerVertical在父類的垂直居中,為true或false
android:layout_centerHorizontal 在父類的水平居中,為true或false
android:layout_centerInParent在父類的水平垂直居中

結論

線性布局:
指子控件以水平或垂直方式排列

相對布局:
指子控件以控件之間的相對位置或子控件相對於父容器的位置排列

幀布局:
指所有子控件均放在左上角且后面元素直接覆蓋在前面元素之上

絕對布局:
指子控件通過絕對定位x,y位置來決定其位置擺放

表格布局:
指以行列的形式放置子控件,每一行是一個TableRow對象或者View對象

結語

  • 本文主要講解 Android精通:TableLayout布局,GridLayout網格布局,FrameLayout幀布局,AbsoluteLayout絕對布局,RelativeLayout相對布局
  • 下面我將繼續對Java、 Android中的其他知識 深入講解 ,有興趣可以繼續關注
  • 小禮物走一走 or 點贊

送❤


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM