1. 程式人生 > >六大布局之非常用佈局

六大布局之非常用佈局

前言

Hi,大家好,新的一週開始啦,讓我們繼續遨遊在Android的知識海洋中吧!上一次我們講到了RelativeLayout,相信不少小夥伴已經著手實戰,那麼今天我們為大家帶來六大布局中剩下的三個佈局。本篇文章可以和前面的FrameLayout一同歸類到Android非常用佈局之中,雖然不常用,但是小夥伴們也要知道它的一些基礎屬性哦~

六大布局之AbsoluteLayout

簡介

AbsoluteLayout(絕對佈局), 之所以把這個放到最後,是因為絕對佈局,我們基本上都是不會使用的,當然你也可以直接跳過這一 篇博文,不過作為一個喜歡增長姿勢的程式設計師,我們還是可以瞭解這個AbsoluteLayout

佈局的。放入該佈局的UI控制元件通過android:layout_xandroid:layout_y 兩個屬性指定其準確的座標值,並顯示在螢幕上。

理論上,AbsoluteLayout佈局可用以完成任何的佈局設計,靈活性很大,但是在實際的工程應用中不提倡使用這種佈局。因為使用這種佈局不但需要精確計算每個元件的大小,增大運算量,而且當應用程式在不同螢幕尺寸的手機上執行時會產生不同效果。

佈局屬性

AbsoluteLayout 的佈局屬性就兩個:

  • android:layout_x : 設定控制元件在佈局中的 X 軸方向距離。
  • android:layout_y : 設定控制元件在佈局中的 Y
    抽方向距離。

AbsoluteLayout 只有這個兩個屬性,從絕對佈局的名字就可以看出來,就是在 X 軸方向和 Y 軸方向通過 dip值(或者 px ) 絕對固定距離。

例項

在例子中顯示三個View。

img

從例子中可以得出下面結論:

  • 寫在面佈局View會覆蓋寫在上面的View。
  • 在絕對定位中,如果子元素不設定layout_xlayout_y,那麼它們的預設值是0。

六大布局之TableLayout

簡介

TableLayout(表格佈局)是將子view分別排列成行和列的佈局,TableLayout是由許多TableRow物件組成的,表格佈局以行列的形式管理子控制元件,每一個單元是一個TableRow

或者View物件。

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

佈局屬性

TableLayout 常用佈局屬性:

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

img

圖中按鈕2被拉伸來替補空白。

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

img

圖中又在上面佈局新增按鈕5,此時 android:shrinkColumns="1",按鈕2被收縮了。

  • collapseColumns設定需要被隱藏的列的序號 使用該屬性可以隱藏某列。

img

圖中在上面的佈局中新增 android:collapseColumns="1" ,原來的按鈕2被隱藏了。

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

img

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

img

六大布局之GridLayout

簡介

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

佈局屬性

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

img

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

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

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

img

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列。

網格佈局在實際應用中很少使用,一般都是通過系統提供的另個一個列表控制元件 RecyclerView

結論

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

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

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

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

表格佈局: 指以行列的形式放置子控制元件,每一行是一個TableRow物件或者View物件

網格佈局: 指以網格狀放置子控制元件,可以控制網格內部行、列個數

結語

以上就是本篇的全部內容,Android六大布局的基本使用也已經全部告訴大家,希望小夥伴們可以發揮你們的想象力,將不同的佈局融合出來一個demo發給我們,我們會將效果非常炫的demo進行展示,歡迎小夥伴踴躍投稿~

PS:如果還有未看懂的小夥伴,歡迎加入我們的QQ技術交流群:892271582,裡面有各種大神回答小夥伴們遇到的問題哦~

相關推薦

六大非常佈局

前言 Hi,大家好,新的一週開始啦,讓我們繼續遨遊在Android的知識海洋中吧!上一次我們講到了RelativeLayout,相

Android 六大 LinearLayout(線性佈局)

LinearLayout( 線性佈局) 檢索 Android 中有六大布局: LinearLayout(線性佈局),RelativeLayout(相對佈局),TableLayout(表格佈局) FrameLayout(幀佈局),AbsoluteLayout(絕對佈局),Gr

六大LinearLayout

1. 什麼是Layout? Layout——介面佈局,為應用程式提供介面架構。控制Activity中控制元件的大小、位置、顏色等

Android自學筆記 Android五大線性佈局的功能、常用屬性、用法

1.介紹:   線性佈局管理器對存放其中的控制元件或佈局採用線性方式管理 2.LinearLayout的常用屬性android:orientation = “vertical” —— 該屬性決定它子類

Android四大元件、六大、五大儲存

                                                                             一.四大元件: 四大元件分別為activity、service、content provider、b

Duilib六大及絕對佈局和相對佈局

duilib的Layout目錄專門放置佈局相關的容器控制元件,這6個佈局分別為:Container、VerticalLayout、HorizontalLayout、TileLayout、TabLayout、ChildLayout。容器之間可以任意相互巢狀。 一、Contai

Android UITableLayout

you column true xmlns art parent 名稱 str demo 從字面上了解TableLayout是一種表格式的布局。這樣的布局會把包括的元素以行和列的形式進行排列。表格的列數為每一行的最大列數。當然表格裏邊的單元格是能夠為空的。 實例:La

Android TableLayout

簡介 方向 源代碼 1.0 code columns adding ble 單元 1 TableLayout簡介 TableLayout是表格布局。TableLayout 可設置的屬性包括全局屬性及單元格屬性。 1.1 全局屬性 有以下3個參數: android:stret

Android FrameLayout

signed 方向 ont androi idt different erl 很難 sig 1 FrameLayout簡介 對於FrameLayout,官方介紹是:FrameLayout is designed to block out an area on the scr

React Native

enter body ima lower posit 不能 效果 ignite 定位 讀懂這篇文章,RN布局不是問題 寬度單位和像素密度 react的寬度不支持百分比,設置寬度時不需要帶單位 {width: 10}, 那麽10代表的具體寬度是多少呢? 不知

CSS3flex效果

方向 fff lang 距離 absolut 換行 row pla containe <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title

css

冰箱 移動端 前端開發 編寫 發的 ive 前端 max 正常 一、流式布局(Liquid Layout) 流式布局(Liquid)的特點(也叫"Fluid") 是頁面元素的寬度按照屏幕分辨率進行適配調整,但整體布局不變。代表作柵欄系統(網格系統)。 網頁中主要的劃分區域的

微信小程序行內元素和塊級元素

外邊距 邊距 gin add 屬性 微信 如果 改變 盒子模型 元素按照顯示方式主要可以分為塊級元素和行內元素,元素的顯示方式由display屬性控制。 塊級元素特點總結: 1、總是在新行上開始 2、寬度的默認為width+margin-left+margin-right+

WPF入門教程系列十——Border與ViewBox(五)

last () put prev 裝飾 wpf 背景 .text 部分 九. Border Border 是一個裝飾的控件,此控件繪制邊框及背景,在 Border 中只能有一個子控件,若要顯示多個子控件,需要將一個附加的 Panel 控件放置在父 Border 中。然後可以

WPF入門教程系列八——Grid與UniformGrid(三)

input 接下來 toolbar wid ids 全部 ica tar 生成 五. Grid Grid顧名思義就是“網格”,它的子控件被放在一個一個實現定義好的小格子裏面,整齊配列。 Grid和其他各個Panel比較起來,功能最多也最為復雜。要使用Grid,首先要向Row

響應式浮動聖杯(雙飛翼)—-自適應寬度

由於 部分 gin asi 禁用 代碼 寬度 sof cin 前端開發中自適應布局在實際應用中越來越普遍,特別是隨著更多高級瀏覽器的出現html5和css3得到了更好的應用。 聖杯布局有個好處,完全符合前端開發中漸進增強的理念,由於瀏覽器解析是從DOM的上至下,這樣聖杯布局

CSS+div左中右經典(五)

doc src png .com image border blog ack alt <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <titl

CSS+div經典(四)

footer link enter mage htm charset wid align mar 固定寬度且居中 <!DOCTYPE html> <html> <head> <meta charset="utf-8">

後臺反例

round clas doctype idt oot lan htm AD right <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

頁面三欄

三欄布局 bubuko AC center mage http contain width yellow 1.浮動布局 <div class="container"> <div class="left">left</div>