Android表格布局(Table Layout)html
先来看布局管理器之间继承关系图:android
图1布局
可知TableLayout继承了LinearLayout,因此表格布局本质上依然是线性管理器。spa
表格布局采用行、列的形式来管理组件,它并不须要明确地声明包含了多少行、多少列,而是经过添加TableRow、其余组件来控制表格的行数和列数。code
每向TableLayout添加一个TableRow,该TableRow就是一个表格行,TableRow也是容器,所以它也能够不断地添加组件,每添加一个子组件该表格就添加一列。xml
TableLayout通常如下面两种方式实现:htm
(1) 本身做为最顶层父容器blog
<!--定义一个TableLayout,有两行 第1列全部单元格的宽度能够被收缩,以保证该表格能适应父容器的宽度 第2列全部单元格的宽度能够拉伸,以保证能彻底填满表格空余空间--> <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/TableLayout1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:shrinkColumns="1" android:stretchColumns="2"> <!--这是此TableLayout的第1行,没有使用TableRow,直接添加一个Button,那么次Button本身占用整行 --> <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="独自一行的按钮1"/> <!-- 这是第2行,先添加一个TableRow,并为TableRow添加三个Button,也就是此行包含三列 --> <TableRow> <Button android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="普通按钮1"/> <Button android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="被收缩的按钮1"/> <Button android:id="@+id/button4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="被拉伸的按钮1"/> </TableRow> <!--这是此TableLayout的第3行,没有使用TableRow,直接添加一个Button,那么次Button本身占用整行 --> <Button android:id="@+id/button5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="独自一行的按钮2"/> <!-- 这是第4行,先添加一个TableRow,并为TableRow添加三个Button,也就是此行包含三列 --> <TableRow> <Button android:id="@+id/button6" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="普通按钮2"/> <Button android:id="@+id/button7" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="被收缩的按钮2"/> <Button android:id="@+id/button8" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="被拉伸的按钮2"/> </TableRow> </TableLayout>
效果以下:继承
图2ip
这里只有一个TableLayout,若是咱们想单独控制地4行,好比想把“普通按钮2”隐藏,也就是增长android:collapseColumns="0",这样会把“普通按钮1”,这一列也隐藏了,以下图:
图3
但若是要实现只“普通按钮2”这列,咱们来看下面的实现
(2) LinearLayout做为TableLayout的容器
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent">--> <!--定义第1个TableLayout,有两行 第1列全部单元格的宽度能够被收缩,以保证该表格能适应父容器的宽度 第2列全部单元格的宽度能够拉伸,以保证能彻底填满表格空余空间--> <TableLayout android:id="@+id/TableLayout1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:shrinkColumns="1" android:stretchColumns="2"> <!--这是此TableLayout的第1行,没有使用TableRow,直接添加一个Button,那么次Button本身占用整行 --> <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="独自一行的按钮1"/> <!-- 这是第2行,先添加一个TableRow,并为TableRow添加三个Button,也就是此行包含三列 --> <TableRow> <Button android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="普通按钮1"/> <Button android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="被收缩的按钮1"/> <Button android:id="@+id/button4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="被拉伸的按钮1"/> </TableRow> </TableLayout> <!--定义第2个TableLayout,有两行 第1列全部单元格的宽度能够被收缩,以保证该表格能适应父容器的宽度 第2列全部单元格的宽度能够拉伸,以保证能彻底填满表格空余空间--> <TableLayout android:id="@+id/TableLayout2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:collapseColumns="0" android:shrinkColumns="1" android:stretchColumns="2"> <!--这是此TableLayout的第3行,没有使用TableRow,直接添加一个Button,那么次Button本身占用整行 --> <Button android:id="@+id/button5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="独自一行的按钮2"/> <!-- 这是第4行,先添加一个TableRow,并为TableRow添加三个Button,也就是此行包含三列 --> <TableRow> <Button android:id="@+id/button6" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="普通按钮2"/> <Button android:id="@+id/button7" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="被收缩的按钮2"/> <Button android:id="@+id/button8" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="被拉伸的按钮2"/> </TableRow> </TableLayout> </LinearLayout>
效果以下:
图4
经过在第2个TableLayout中增长android:collapseColumns="0"实现,这里须要主要的是LinearLayout的android:orientation属性值的设置,若是没有这一项或是其值为horizontal,那么后面两行都看不到,由于是以水平方向排列的,后面两行显示在前两行的右边,看不到。