Android開發UI之GridLayout的使用

標籤：

1.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列顯示該控制項。

 1 <?xml version="1.0" encoding="utf-8"?> 2 <GridLayout xmlns:android="http://schemas.android.com/apk/res/android" 3     android:layout_width="wrap_content" 4     android:layout_height="wrap_content" 5     android:orientation="horizontal" 6     android:rowCount="2" 7     android:columnCount="3" > 8 　　<Button 9         android:id="@+id/one"10         android:layout_column="1"11         android:text="1"/>12 　　<Button13         android:id="@+id/two"14         android:layout_column="0"15         android:text="2"/>16 　　　<Button17         android:id="@+id/three"18         android:text="3"/>19 　　<Button20         android:id="@+id/devide"21         android:text="/"/>

對應的顯示：

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檔案樣本：

 1 <?xml version="1.0" encoding="utf-8"?> 2 <GridLayout xmlns:android="http://schemas.android.com/apk/res/android" 3     android:layout_width="wrap_content" 4     android:layout_height="wrap_content" 5     android:orientation="horizontal" 6     android:rowCount="2" 7     android:columnCount="3" > 8 　　<Button 9         android:id="@+id/one"10         android:layout_column="0"11         android:layout_columnSpan="2"12         android:text="1"/>13 　　<Button14         android:id="@+id/two"15         android:text="2"/>16 　　　<Button17         android:id="@+id/three"18         android:text="3"/>19 　　<Button20         android:id="@+id/devide"21         android:text="/"/>22 23 </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檔案樣本：

 1 <?xml version="1.0" encoding="utf-8"?> 2 <GridLayout xmlns:android="http://schemas.android.com/apk/res/android" 3     android:layout_width="wrap_content" 4     android:layout_height="wrap_content" 5     android:orientation="horizontal" 6     android:rowCount="2" 7     android:columnCount="3" > 8 　　<Button 9         android:id="@+id/one"10         android:layout_column="0"11         android:layout_columnSpan="2"12         android:layout_gravity="fill"13         android:text="1"/>14 　　<Button15         android:id="@+id/two"16         android:text="2"/>17 　　　<Button18         android:id="@+id/three"19         android:text="3"/>20 　　<Button21         android:id="@+id/devide"22         android:text="/"/>23 24 </GridLayout>

對應的顯示：

 

3 應用樣本

定義一個簡單的計算機介面，包含“0-9、.、+、-、*、/、=、”。用GridLayout實現。

layout檔案

 1 <?xml version="1.0" encoding="utf-8"?> 2 <!-- GridLayout： 5行 4列 水平布局 --> 3 <GridLayout xmlns:android="http://schemas.android.com/apk/res/android" 4     android:layout_width="wrap_content" 5     android:layout_height="wrap_content" 6     android:orientation="horizontal" 7     android:rowCount="5" 8     android:columnCount="4" > 9 　　<Button10         android:id="@+id/one"11         android:text="1"/>12 　　<Button13         android:id="@+id/two"14         android:text="2"/>15 　　　<Button16         android:id="@+id/three"17         android:text="3"/>18 　　<Button19         android:id="@+id/devide"20         android:text="/"/>21 　　<Button22         android:id="@+id/four"23         android:text="4"/>24 　　<Button25         android:id="@+id/five"26         android:text="5"/>27 　　<Button28         android:id="@+id/six"29         android:text="6"/>30 　　<Button31         android:id="@+id/multiply"32         android:text="×"/>33 　　<Button34         android:id="@+id/seven"35         android:text="7"/>36 　　<Button37         android:id="@+id/eight"38         android:text="8"/>39 　　<Button40         android:id="@+id/nine"41         android:text="9"/>42     <Button43         android:id="@+id/minus"44         android:text="-"/>45     <Button46         android:id="@+id/zero"47         android:layout_columnSpan="2"48         android:layout_gravity="fill"49         android:text="0"/>50 　　<Button51         android:id="@+id/point"52         android:text="."/>53     <Button54         android:id="@+id/plus"55         android:layout_rowSpan="2"56         android:layout_gravity="fill"57         android:text="+"/>58     <Button59         android:id="@+id/equal"60         android:layout_columnSpan="3"61         android:layout_gravity="fill"62         android:text="="/> 63 </GridLayout>

 

 

轉自：http://www.cnblogs.com/skywang12345/p/3154150.html

Android開發UI之GridLayout的使用