Android 自学之表格布局 TableLayout

表格布局(TableLayout),表格布局采用行、列的形式来管理UI组件，TableLayout并不需要明确的声明多少行，多少列，而是通过TableRow、其他组件来控制表格的行数和列数。

每次想TableLayout中添加一个TableRow，TableRow是一个表格行，也是容器；因此他也可以不断的添加组件，没添加一个组件就是增加一列。

如果直接想TableLayout中添加组件的话，那么他就会独自占据一行的位置。

在表格布局中，列的宽度取决于该列中最宽的那列的宽度，整个表格布局的宽度取决于父容器的宽度(默认是占满父容器本身)。

在表格布局管理器中，可以为单元格设置如下三种行为方式：

Shrinkable：如果某列被设成这个属性的话，那么该列的所有单元格的宽度可以被收缩，以保证该表格适应父容器的宽度。

Stretchable：如果某列被设成这个属性的话，那么该列的所有单元格的宽度可以被拉伸，以保证组件能完全填满表格空余空间。

Collapsed：如果某列被设成这个属性的话，那么该列的所有单元格都会被掩藏。

下面程序是采用TableLayout布局

layout/main.xml

  1 <?xml version="1.0" encoding="utf-8"?>
  2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3     android:orientation="vertical"
  4     android:layout_width="fill_parent"
  5     android:layout_height="fill_parent"
  6     >
  7 <!-- 定义第一个表格布局，指定第2列允许收缩，第3列允许拉伸 -->
  8 <TableLayout android:id="@+id/TableLayout01" 
  9     android:layout_width="fill_parent" 
 10     android:layout_height="wrap_content"
 11     android:shrinkColumns="1"
 12     android:stretchColumns="2"
 13 >
 14 <!-- 直接添加按钮，它自己会占一行 -->
 15 <Button android:id="@+id/ok1" 
 16     android:layout_width="wrap_content"
 17     android:layout_height="wrap_content"
 18     android:text="独自一行的按钮"
 19     />
 20 <!-- 添加一个表格行 -->
 21 <TableRow>
 22 <!-- 为该表格行添加3个按钮 -->
 23 <Button android:id="@+id/ok2" 
 24     android:layout_width="wrap_content"
 25     android:layout_height="wrap_content"
 26     android:text="普通按钮"
 27     />     
 28 <Button android:id="@+id/ok3" 
 29     android:layout_width="wrap_content"
 30     android:layout_height="wrap_content"
 31     android:text="允许被收缩的按钮"
 32     /> 
 33 <Button android:id="@+id/ok4" 
 34     android:layout_width="wrap_content"
 35     android:layout_height="wrap_content"
 36     android:text="允许被拉伸的按钮"
 37     />
 38 </TableRow>    
 39 </TableLayout>
 40 <!-- 定义第二个表格布局 ，指定第二列隐藏-->
 41 <TableLayout android:id="@+id/TableLayout01" 
 42     android:layout_width="fill_parent" 
 43     android:layout_height="wrap_content"
 44     android:collapseColumns="1"
 45 >
 46 <!-- 直接添加按钮，它自己会占一行 -->
 47 <Button android:id="@+id/ok5" 
 48     android:layout_width="wrap_content"
 49     android:layout_height="wrap_content"
 50     android:text=" 独自一行的按钮 "
 51     />
 52 <!--定义一个表格行-->
 53 <TableRow>
 54 <!-- 为该表格行添加3个按钮 -->
 55 <Button android:id="@+id/ok6" 
 56     android:layout_width="wrap_content"
 57     android:layout_height="wrap_content"
 58     android:text="普通按钮1"
 59     />     
 60 <Button android:id="@+id/ok7" 
 61     android:layout_width="wrap_content"
 62     android:layout_height="wrap_content"
 63     android:text="被隐藏的按钮"
 64     /> 
 65 <Button android:id="@+id/ok8" 
 66     android:layout_width="wrap_content"
 67     android:layout_height="wrap_content"
 68     android:text="普通按钮 3"
 69     />
 70 </TableRow>    
 71 </TableLayout>
 72 <!-- 定义第三个表格布局 ，指定第2、3两列可以被拉伸-->
 73 <TableLayout android:id="@+id/TableLayout01" 
 74     android:layout_width="fill_parent" 
 75     android:layout_height="wrap_content"
 76     android:stretchColumns="1,2"
 77 >
 78 <!-- 直接添加按钮，它自己会占一行 -->
 79 <Button android:id="@+id/ok9" 
 80     android:layout_width="wrap_content"
 81     android:layout_height="wrap_content"
 82     android:text="独自一行的按钮"
 83     />
 84 <!--定义一个表格行-->
 85 <TableRow>
 86 <!-- 为该表格行添加3个按钮 -->
 87 <Button android:id="@+id/ok10" 
 88     android:layout_width="wrap_content"
 89     android:layout_height="wrap_content"
 90     android:text="普通按钮"
 91     />     
 92 <Button android:id="@+id/ok11" 
 93     android:layout_width="wrap_content"
 94     android:layout_height="wrap_content"
 95     android:text="允许被拉伸的按钮"
 96     /> 
 97 <Button android:id="@+id/ok12" 
 98     android:layout_width="wrap_content"
 99     android:layout_height="wrap_content"
100     android:text="允许被拉伸的按钮"
101     />
102 </TableRow>    
103 <!--定义一个表格行-->
104 <TableRow>
105 <!-- 为该表格行添加2个按钮 -->
106 <Button android:id="@+id/ok13" 
107     android:layout_width="wrap_content"
108     android:layout_height="wrap_content"
109     android:text="普通按钮"
110     />     
111 <Button android:id="@+id/ok14" 
112     android:layout_width="wrap_content"
113     android:layout_height="wrap_content"
114     android:text="允许被拉伸的按钮"
115     />
116 </TableRow>    
117 </TableLayout>
118 </LinearLayout>

上面的代码里面我们用了三次TableLayout布局：

第一个表格我们对第二列实现了收缩，第三列实现了拉伸；

第二个表格我们对第二列实现了掩藏；

第三个表格我们同时对第二、三列实现了拉伸。这些是这几个属性的使用方法

posted on 2014-05-22 15:02  杨_静  阅读(352)  评论(0)  编辑  收藏  举报

导航