Android開發(fā)自學(xué)筆記(AndroidStudio)-4.1布局組件

Android開發(fā)自學(xué)筆記 (AndroidStudio)—4.1布局組件一、引言Android的界面是有布局和組件協(xié)同完成的，布局好比是建筑里的框架，而組件則相當(dāng)于建筑里的磚瓦。組件按照布局的要求依次排列，就組成了用戶所看見的界面。在Android4.0之前，我們通常說 Android開發(fā)五大布局和四大組件，這五大布局就是：LinearLayout線性布局FrameLayout單幀布局，也有中文翻譯為幀布局、框架布局。RelativeLayout相對布局 AbsoluteLayout 絕對布局TableLayout表格布局 而在Android4.0之后又新增了一種GridLayout網(wǎng)格布局。二、LinearLayout線性布局線性布局是Android開發(fā)中最常見的一種布局方式，它是按照垂直或者水平方向來布局，通過“ android:orientation ”屬性可以設(shè)置線性布局的方向。屬性值有垂直(vertical)和水平(horizontal)兩種。線性布局的排列在某行或者某列并不會自動換行或換列，就是說如果采用水平布局，控件寬度超過屏幕顯示的話，后面的控件都將被隱藏，不會自動換行。常用的屬性有：android:orientation：可以設(shè)置布局的方向android:id- 為控件指定相應(yīng)的IDandroid:text- 指定控件當(dāng)中顯示的文字，需要注意的是，這里盡量使用string.xmlandroid:gravity-指定控件的基本位置，比如說居中，居右等位置android:textSize-指定控件當(dāng)中字體的大小android:background-指定控件所用的背景色，RGB命名法android:layout_width-指定控件的寬度android:layout_height- 指定控件的高度android:layout_weight- 指定控件的占用比例android:padding-指定控件的內(nèi)邊距，也就是說控件當(dāng)中的內(nèi)容android:sigleLine-如果設(shè)置為真的話，則將控件的內(nèi)容顯示在一行當(dāng)中 layout_weight屬性以控制各個控件在布局中的相對大小。 layout_weight屬性是一個非負(fù)整數(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的控件的寬度或者高度，再用剩余的寬度或高度按相應(yīng)的比例來分配每一個控件顯示的寬度或高度。線性水平布局代碼和示意圖如下：線性垂直布局代碼和示意圖如下（android:orientation通過修改該屬性值控制水平或者垂直 ）：布局也是可以嵌套的，代碼和示意圖如下：三、FrameLayout單幀布局FrameLayout是布局中最簡單的一個布局，在這個布局中，整個界面被當(dāng)成一塊空白備用區(qū)域，所有的子元素都不能被指定放置的位置，它們統(tǒng)統(tǒng)放于這塊區(qū)域的左上角，并且后面的子元素直接覆蓋在前面的子元素之上，將前面的子元素部分和全部遮擋。代碼及顯示效果圖如下：可以看到3個按鈕組件都有重疊的部分，單幀布局不會像線性布局那樣每個組件之間自動對齊。對于單幀布局的使用場景我還是有所疑惑的，不知道這種布局方式會用在什么場景下，不過我看了這一篇文章倒是略有感觸，分享一下，或許也能給大家些啟發(fā)：示例：幀布局 (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)異常。代碼及演示示例如下：補充一下用到的屬性的說明：表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.當(dāng)前組件與父組件對齊關(guān)系屬性android:layout_centerHorizontal將該組件放置在水平方向中央的位置 android:layout_centerVertical將該組件放置在垂直方向的中央的位置anroid:layout_centerInParent將該組件放置在父組件的水平及垂直中央 而對于相對布局的屬性，這里也推薦一篇博文供大家參考學(xué)習(xí)：RelativeLayout布局用到的一些重要屬性參考 五、AbsoluteLayout絕對布局AbsoluteLayout（絕對布局）布局用法如其名，組件的位置可以準(zhǔn)確的指定其在屏幕的x/y坐標(biāo)位置。雖然可以精確的去規(guī)定坐標(biāo)，但是由于代碼的書寫過于剛硬，使得在不同的設(shè)備，不同分辨率的手機移動設(shè)備上不能很好的顯示應(yīng)有的效果，所以此布局不怎么被推薦使用。在此布局中的子元素的android:layout_x和android:layout_y屬性將生效，用于描述該子元素的坐標(biāo)位置。屏幕左上角為坐標(biāo)原點（0,0），第一個0代表橫坐標(biāo)，向右移動此值增大，第二個0代表縱坐標(biāo)，向下移動，此值增大。在此布局中的子元素可以相互重疊。在實際開發(fā)中，通常不采用此布局格式。 雖然實際開發(fā)總已經(jīng)不推薦使用該布局，不過我們還是了解一下他的使用方法（不做詳細(xì)介紹，感興趣的自行去查找文檔），代碼和示意圖如下：六、TableLayout表格布局TableLayout顧名思義，此布局為表格布局，適用于N行N列的布局格式。一個TableLayout由許多TableRow組成，一個TableRow就代表TableLayout中的一行。TableRow是LinearLayout的子類，它的android:orientation屬性值恒為horizontal，并且它的 android:layout_width和android:layout_height 屬性值恒為 MATCH_PARENT 和WRAP_CONTENT。所以它的子元素都是橫向排列，并且寬高一致的。這樣的設(shè)計使得每個TableRow里的子元素都相當(dāng)于表格中的單元格一樣。在TableRow中，單元格可以為空，但是不能跨列。下面我們使用表格布局編寫示例代碼做一個三行三列的布局：TableLayout不復(fù)雜，使用也就是這么簡單，下面補充幾個常用屬性的作用：1.shrinkColumns屬性：以0為序，當(dāng)TableRow里面的控件布滿布局時，，指定列自動延伸以填充可用部分；當(dāng)TableRow里面的控件還沒有布滿布局時，shrinkColumns不起作用。 我們在布局代碼中加入該屬性時會發(fā)現(xiàn)沒有發(fā)生變化，因為 TableRow 里面的控件還沒有布滿布局，修改代碼如下就可以看到效果：2.strechColumns屬性，以第 0行為序，指定列對空白部分進行填充。代碼及效果如下：3.collapseColumns屬性：以0行為序，隱藏指定的列。這個比較容易理解，代碼及效果如下：4.layout_column屬性：以0行為序，設(shè)置組件顯示指定列5.layout_span屬性：以第 0行為序，設(shè)置組件顯示占用的列數(shù)。這兩個屬性之所以放一起，因為有些事項需要說明，先看代碼和效果圖：注意：從示意圖可知：Button1被設(shè)置了占用了2列，Button4被設(shè)置顯示在地 2列，但代碼指定Button5顯示在第1列，但沒有按照設(shè)定顯示，這樣可知TableRow在表格布局中，一行里的組件都會自動放在前一組件的右側(cè)，依次排列，只要確定了所在列，其后面的組件就無法再進行位置的設(shè)置。七、GridLayout網(wǎng)格布局GridLayout網(wǎng)格布局是Android4.0之后新加入的布局方式，與TableLayout大同小異，不過也新增了一些內(nèi)容：1.可以設(shè)置容器中組件的對其方式。2.容器中的組件可以跨多行也可以跨多列需要注意的是因為是 Android4.0之后新增的，所以APILevel14之前的SDK無法直接使用，還想使用的話就自己去百度方法，這里不再說，因為我覺得應(yīng)該很少人再做4.0之前的程序了吧？先看示例代碼吧，這個網(wǎng)格布局做計算器示例應(yīng)該是最簡單的：說明：rowCount和columnCount