第5章 布局Layouts之TableLayout表格布局
TableLayout表格布局
TableLayout是指將子元素的位置分配到行或列中。Android的一個(gè)TableLayout有許多TableRow組成,每一個(gè)TableRow都會(huì)定義一個(gè)Row。 TableLayout容器不會(huì)顯示Row,Column,及Cell的邊框線,每個(gè)Row擁有0個(gè)或多個(gè)Cell,每個(gè)Cell擁有一個(gè)View對(duì)象。
在使用tablelayout時(shí),應(yīng)注意每一個(gè)cell的寬度。
我們下面通過(guò)XML布局和Java代碼布局兩種方式分別舉例:
一、XML方式布局
1、創(chuàng)建一個(gè)空白Activity
2、打開(kāi) res/layout/activity_main.xml 文件,修改成以下代碼。
(1)第①部分
<?xml version="1.0" encoding="utf-8" ?>,每個(gè)XML文檔都由XML序言開(kāi)始,在前面的代碼中的第一行便是XML序言,<?xml version="1.0">。這行代碼表示按照1.0版本的XML規(guī)則進(jìn)行解析。encoding = "utf-8"表示此xml文件采用utf-8的編碼格式。編碼格式也可以是GB2312。
(2)第②部分
<LinearLayout 表示采用表格布局管理器。
(3)第③部分
android:layout_width="match_parent" android:layout_height="match_parent"表示布局管理器寬度和高充將填充整個(gè)屏幕寬度和高度。
(4)第④部分
android:stretchColumns="1"表示表格布局管理器中第2列內(nèi)組件可以擴(kuò)充到的有可用空間。
3、插入1行TableRow、1個(gè)文本TextView、1個(gè)TextEdit。
4、打開(kāi) res/layout/activity_main.xml 文件,修改成以下代碼。
(1)第①部分
<TableRow></TableRow>代表一行,可以在其中填充控件。
(2)第②部分
添加一個(gè)標(biāo)簽<TextView>。
(3)第③部分
添加一個(gè)編輯框<EditText>。
5、依次再插入2行<TableRow>、密碼標(biāo)簽<TextView>、密碼編輯框<EditText>、2個(gè)按鈕Button:注冊(cè)、登錄。
代碼如下:
6、最終顯示效果如下:
附:表格布局常見(jiàn)屬性介紹
(1)TableLayout行列數(shù)的確定
TableLayout的行數(shù)由開(kāi)發(fā)人員直接指定,即有多少個(gè)TableRow對(duì)象(或View控件),就有多少行。
TableLayout的列數(shù)等于含有最多子控件的TableRow的列數(shù)。如第一TableRow含2個(gè)子控件,第二個(gè)TableRow含3個(gè),第三個(gè)TableRow含4個(gè),那么該TableLayout的列數(shù)為4.
(2)TableLayout可設(shè)置的屬性詳解
TableLayout可設(shè)置的屬性包括全局屬性及單元格屬性。
a)全局屬性也即列屬性,有以下3個(gè)參數(shù):
android:stretchColumns 設(shè)置可伸展的列。該列可以向行方向伸展,最多可占據(jù)一整行。
android:shrinkColumns 設(shè)置可收縮的列。當(dāng)該列子控件的內(nèi)容太多,已經(jīng)擠滿所在行,那么該子控件的內(nèi)容將往列方向顯示。
android:collapseColumns 設(shè)置要隱藏的列。
示例:
android:stretchColumns="0" 第0列可伸展
android:shrinkColumns="1,2" 第1,2列皆可收縮
android:collapseColumns="*" 隱藏所有行
說(shuō)明:列可以同時(shí)具備stretchColumns及shrinkColumns屬性,若此,那么當(dāng)該列的內(nèi)容N多時(shí),將"多行"顯示其內(nèi)容。(這里不是真正的多行,而是系統(tǒng)根據(jù)需要自動(dòng)調(diào)節(jié)該行的layout_height)
b)單元格屬性,有以下2個(gè)參數(shù):
android:layout_column 指定該單元格在第幾列顯示
android:layout_span 指定該單元格占據(jù)的列數(shù)(未指定時(shí),為1)
示例:
android:layout_column="1" 該控件顯示在第1列
android:layout_span="2" 該控件占據(jù)2列
說(shuō)明:一個(gè)控件也可以同時(shí)具備這兩個(gè)特性。
二、Java代碼方式布局
上面我們已經(jīng)了解采用XML進(jìn)行LinearLayout布局,我們現(xiàn)在再來(lái)學(xué)習(xí)一下如何使用Java代碼完成與之同樣功能。
Java代碼方式暫略。
GridLayout網(wǎng)格布局
android4.0以上版本出現(xiàn)的GridLayout布局解決了以上問(wèn)題。GridLayout布局使用虛細(xì)線將布局劃分為行、列和單元格,也支持一個(gè)控件在行、列上都有交錯(cuò)排列。而GridLayout使用的其實(shí)是跟LinearLayout類(lèi)似的API,只不過(guò)是修改了一下相關(guān)的標(biāo)簽而已,所以對(duì)于開(kāi)發(fā)者來(lái)說(shuō),掌握 GridLayout還是很容易的事情。GridLayout的布局策略簡(jiǎn)單分為以下三個(gè)部分:
首先它與LinearLayout布局一樣,也分為水平和垂直兩種方式,默認(rèn)是水平布局,一個(gè)控件挨著一個(gè)控件從左到右依次排列,但是通過(guò)指定android:columnCount設(shè)置列數(shù)的屬性后,控件會(huì)自動(dòng)換行進(jìn)行排列。另一方面,對(duì)于GridLayout布局中的子控件,默認(rèn)按照wrap_content的方式設(shè)置其顯示,這只需要在GridLayout布局中顯式聲明即可。
其次,若要指定某控件顯示在固定的行或列,只需設(shè)置該子控件的android:layout_row和android:layout_column屬性即可,但是需要注意: android:layout_row= 表示從第一行開(kāi)始,android:layout_column= 表示從第一列開(kāi)始,這與編程語(yǔ)言中一維數(shù)組的賦值情況類(lèi)似。
最后,如果需要設(shè)置某控件跨越多行或多列,只需將該子控件的android:layout_rowSpan或者layout_columnSpan屬性設(shè)置為數(shù)值,再設(shè)置其layout_gravity屬性為fill即可,前一個(gè)設(shè)置表明該控件跨越的行數(shù)或列數(shù),后一個(gè)設(shè)置表明該控件填滿所跨越的整行或整列。