【6】Android 布局 - GridLayout

前言

Android4.0 后推出了网格布局 GridLayout ，可视为 TableLayout 的“升级版”。

没有了 TableRow 容器，代码更简洁；个人认为比 TableLayout 好用。

主要体现在：

• 可自定义布局中组件的排序方式
• 可自定义行列数
• 可直接设置组件位于某行列
• 可设置组件占用那些行列

相关属性

设置GridLayout属性

与 LinearLayout 布局一样，确定 android:orientation 后，布局中的控件将一个个挨着按顺序依次排列，通过android:columnCount 和 android:rowCount 设置 GridLayout 的行列数的属性后，控件会进行自动换行/列。

android:orientation

 默认horizontal（水平），vertical（竖直）

android:layout_gravity 

可设置为center、left、right...同时使用用 | 连接

android:rowCount   

设置网络布局行数

android:columnCount

设置网络布局列数

设置组件

若要指定某控件显示在固定的行或列，只需设置该子控件的 android:layout_row 和 android:layout_column 属性即可。

若要设置某控件跨越多行/列，只需将该子控件的 android:layout_rowSpan（跨越行数） 、layout_columnSpan（跨越列数） 属性设置为相应数值，再设置其layout_gravity 属性为 fill 即可。

android:layout_row 

设置组件所在行数    注意：从0开始计算；若设置为第一行则有

 android：layout_row= “0”

android:layout_column  

设置组件所在列数

androi:layout_rowSpan  

设置组件跨越的行数

androi:layout_columnSpan   

设置组件跨越的列数

示例

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnCount="4"
    android:rowCount="6">

    <TextView
        android:layout_width="387dp"
        android:layout_columnSpan="4"
        android:layout_gravity="fill"
        android:background="#E7C1CE"
        android:gravity="right|bottom"
        android:text="0"
        android:textSize="80dp" />

    <Button
        android:layout_width="103dp"
        android:text="C"
        android:textSize="80dp" />

    <Button
        android:layout_width="103dp"
        android:text="÷"
        android:textSize="80dp" />

    <Button
        android:layout_width="103dp"
        android:text="×"
        android:textSize="80dp" />

    <Button
        android:layout_width="98dp"
        android:text="<-"
        android:textSize="80dp" />

    <TextView
        android:layout_width="103dp"
        android:layout_row="3"
        android:background="#40E2DCDC"
        android:gravity="center"
        android:text="7"
        android:textSize="80dp" />

    <TextView
        android:layout_width="103dp"
        android:background="#40E2DCDC"
        android:gravity="center"
        android:text="8"
        android:textSize="80dp" />

    <TextView
        android:layout_width="103dp"
        android:background="#40E2DCDC"
        android:gravity="center"
        android:text="9"
        android:textSize="80dp" />

    <Button
        android:layout_width="103dp"
        android:text="-"
        android:textSize="80dp" />

    <TextView
        android:layout_width="103dp"
        android:background="#40E2DCDC"
        android:gravity="center"
        android:text="4"
        android:textSize="80dp" />

    <TextView
        android:layout_width="103dp"
        android:background="#40E2DCDC"
        android:gravity="center"
        android:text="5"
        android:textSize="80dp" />

    <TextView
        android:layout_width="103dp"
        android:background="#40E2DCDC"
        android:gravity="center"
        android:text="6"
        android:textSize="80dp" />

    <Button
        android:layout_width="103dp"
        android:text="+"
        android:textSize="80dp" />

    <TextView
        android:layout_width="103dp"
        android:background="#40E2DCDC"
        android:gravity="center"
        android:text="1"
        android:textSize="80dp" />

    <TextView
        android:layout_width="103dp"
        android:background="#40E2DCDC"
        android:gravity="center"
        android:text="2"
        android:textSize="80dp" />

    <TextView
        android:layout_width="103dp"
        android:background="#40E2DCDC"
        android:gravity="center"
        android:text="3"
        android:textSize="80dp" />

    <Button
        android:layout_row="5"
        android:layout_column="3"
        android:layout_gravity="fill"
        android:layout_rowSpan="2"
        android:background="#4065E0CC"
        android:text="="
        android:textSize="80dp" />

    <TextView
        android:layout_width="99dp"
        android:layout_columnSpan="2"
        android:layout_gravity="fill"
        android:background="#40E2DCDC"
        android:gravity="center"
        android:text="0"
        android:textSize="80dp" />

    <TextView
        android:layout_width="103dp"
        android:background="#40E2DCDC"
        android:gravity="center"
        android:text="."
        android:textSize="80dp"/>

</GridLayout>

效果

  预期效果                                                                                 实际效果