Android 布局之GridLayout
1 GridLayout簡介
GridLayout是Android4.0新提供的網格矩陣形式的布局控件。
GridLayout的繼承關系如下：
java.lang.Object
--> android.view.View
--> android.view.ViewGroup
--> android.widget.GridLayout
GridLayout包含的屬性如下：
android:alignmentMode
屬性說明：當設置alignMargins，使視圖的外邊界之間進行校准。可以取以下值：
alignBounds -- 對齊子視圖邊界。
alignMargins -- 對齊子視圖邊距。
android:columnCount
屬性說明：GridLayout的最大列數
android:rowCount
屬性說明：GridLayout的最大行數
android:columnOrderPreserved
屬性說明： 當設置為true，使列邊界顯示的順序和列索引的順序相同。默認是true。
android:orientation
屬性說明：GridLayout中子元素的布局方向。有以下取值：
horizontal -- 水平布局。
vertical -- 豎直布局。
android:rowOrderPreserved
屬性說明： 當設置為true，使行邊界顯示的順序和行索引的順序相同。默認是true。
android:useDefaultMargins
屬性說明： 當設置ture，當沒有指定視圖的布局參數時，告訴GridLayout使用默認的邊距。默認值是false。
這些是GridLayout布局本身的屬性。
2 GridLayout子元素屬性
上面描述的 GridLayout 的屬性，是 GridLayout 布局本身的屬性；下面 GridLayout 布局中的元素所支持的屬性。GridLayout 布局中的元素的屬性，定義在 GridLayout.LayoutParams 中。取值如下：
2.1 android:layout_column
屬性說明： 顯示該空間的列。例如，android:layout_column="0"，表示在第1列顯示該控件；android:layout_column="1"，表示在第2列顯示該控件。
layout文件示例,
<?xml version="1.0" encoding="utf-8"?> <GridLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" android:rowCount="2" android:columnCount="3" > <Button android:id="@+id/one" android:layout_column="1" android:text="1"/> <Button android:id="@+id/two" android:layout_column="0" android:text="2"/> <Button android:id="@+id/three" android:text="3"/> <Button android:id="@+id/devide" android:text="/"/> </GridLayout>
對應的顯示效果圖：
layout文件說明：
android:orientation="horizontal" -- GridLayout中控件的布局方向是水平布局。
android:rowCount="2" -- GridLayout最大的行數為2行。
android:columnCount="3" -- GridLayout最大的列數為3列。
android:layout_column="1" -- 定義控件one的位於第2列。
android:layout_column="0" -- 定義該控two件的位於第1列。
2.2 android:layout_columnSpan
屬性說明： 該控件所占的列數。例如，android:layout_columnSpan="2"，表示該控件占2列。
layout文件示例：
<?xml version="1.0" encoding="utf-8"?> <GridLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" android:rowCount="2" android:columnCount="3" > <Button android:id="@+id/one" android:layout_column="0" android:layout_columnSpan="2" android:text="1"/> <Button android:id="@+id/two" android:text="2"/> <Button android:id="@+id/three" android:text="3"/> <Button android:id="@+id/devide" android:text="/"/> </GridLayout>
對應的顯示效果圖：
layout文件說明：
數字"1"實際上占據的空間大小是2列，但是第2列顯示為空白。若要第2列不顯示空白，需要設置 android:layout_gravity屬性，參考下例。
2.3 android:layout_row
屬性說明： 該控件所在行。例如，android:layout_row="0"，表示在第1行顯示該控件；android:layout_row="1"，表示在第2行顯示該控件。它和 android:layout_column類似。
2.4 android:layout_rowSpan
屬性說明： 該控件所占的行數。例如，android:layout_rowSpan="2"，表示該控件占2行。它和 android:layout_columnSpan類似。
2.5 android:layout_gravity
屬性說明：
該控件的布局方式。可以取以下值：
top -- 控件置於容器頂部，不改變控件的大小。
bottom -- 控件置於容器底部，不改變控件的大小。
left -- 控件置於容器左邊，不改變控件的大小。
right -- 控件置於容器右邊，不改變控件的大小。
center_vertical -- 控件置於容器豎直方向中間，不改變控件的大小。
fill_vertical -- 如果需要，則往豎直方向延伸該控件。
center_horizontal -- 控件置於容器水平方向中間，不改變控件的大小。
fill_horizontal -- 如果需要，則往水平方向延伸該控件。
center -- 控件置於容器中間，不改變控件的大小。
fill -- 如果需要，則往水平、豎直方向延伸該控件。
clip_vertical -- 垂直剪切，剪切的方向基於該控件的top/bottom布局屬性。若該控件的gravity是豎直的：若它的gravity是top的話，則剪切該控件的底部；若該控件的gravity是bottom的，則剪切該控件的頂部。
clip_horizontal -- 水平剪切，剪切的方向基於該控件的left/right布局屬性。若該控件的gravity是水平的：若它的gravity是left的話，則剪切該控件的右邊；若該控件的gravity是 right的，則剪切該控件的左邊。
start -- 控件置於容器的起始處，不改變控件的大小。
end -- 控件置於容器的結束處，不改變控件的大小。
對應函數： setGravity(int)
layout文件示例：
<?xml version="1.0" encoding="utf-8"?> <GridLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" android:rowCount="2" android:columnCount="3" > <Button android:id="@+id/one" android:layout_column="0" android:layout_columnSpan="2" android:layout_gravity="fill" android:text="1"/> <Button android:id="@+id/two" android:text="2"/> <Button android:id="@+id/three" android:text="3"/> <Button android:id="@+id/devide" android:text="/"/> </GridLayout>
對應的顯示效果圖：
3 應用示例
定義一個簡單的計算器界面，包含“0-9、.、+、-、*、/、=、”。用GridLayout實現。
layout文件
<?xml version="1.0" encoding="utf-8"?> <!-- GridLayout： 5行 4列 水平布局 --> <GridLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" android:rowCount="5" android:columnCount="4" > <Button android:id="@+id/one" android:text="1"/> <Button android:id="@+id/two" android:text="2"/> <Button android:id="@+id/three" android:text="3"/> <Button android:id="@+id/devide" android:text="/"/> <Button android:id="@+id/four" android:text="4"/> <Button android:id="@+id/five" android:text="5"/> <Button android:id="@+id/six" android:text="6"/> <Button android:id="@+id/multiply" android:text="×"/> <Button android:id="@+id/seven" android:text="7"/> <Button android:id="@+id/eight" android:text="8"/> <Button android:id="@+id/nine" android:text="9"/> <Button android:id="@+id/minus" android:text="-"/> <Button android:id="@+id/zero" android:layout_columnSpan="2" android:layout_gravity="fill" android:text="0"/> <Button android:id="@+id/point" android:text="."/> <Button android:id="@+id/plus" android:layout_rowSpan="2" android:layout_gravity="fill" android:text="+"/> <Button android:id="@+id/equal" android:layout_columnSpan="3" android:layout_gravity="fill" android:text="="/> </GridLayout>
點擊下載：源代碼
效果圖：
