表格布局

      表格布局由TableLayout所代表,TableLayout继承了LinearLayout,因此它的本质依然是线性布局管理器。表格布局采用行、列的形式来管理UI组件,TableLayout并不需要明确地声明包含多少行、多少列,而是通过添加TableRow、其他组件来控制表格的行数和列数。

      每次向TableLayout中添加一个TableRow,该TableRow就是一个表格行,TableRow也是容器,因此它也可以不断地添加其他组件,每添加一个子组件该表格就增加一列。

      如果直接向TableLayout中添加组件,那么这个组件将直接占用一行。

      在表格布局中,列的宽度由该列中最宽的那个单元格决定,整个表格布局的宽度则取决于父容器的宽度(默认总是占满父容器本身)。

      在表格布局中,列的宽度由该列中最宽的那个单元格决定,整个表格布局的宽度则取决于父容器的宽度(默认总是占满容器本身)。

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

  • Shrinkable:如果某个列被设为Shrinkable,那么该列的所有单元格的宽度可以被收缩,以保证该表格能适应父容器的宽度。
  • Stretchable:如果某个列被设为Stretchable,那么该列的所有单元格的宽度可以被拉伸,以保证组件能完全填满表格空余空间。
  • Collapsed:如果某个列被设为Collapsed,那么该列的所有单元格会被隐藏。

TableLayout继承了LinearLayout,因此它完全可以支持LinearLayout所支持的全部XML属性,除此之外,TableLayout还支持如表2.6所示的XML属性。

表2.6 TableLayout的常用XML属性及相关方法

XML属性 相关方法            说  明             
android:collapseColumns setColumnCollapsed(int,boolean) 设置需要被隐藏的列的序列号。多个列序号之间用逗号隔开
android:shrinkColumns  setShrinkAllColumns(boolean) 设置允许被收缩的列的序列号。多个列序号之间用逗号隔开 
 android:stretchColumns  setStretchAllColumns(boolean) 设置允许被拉伸的列的序列号,多个列序号之间用逗号隔开 

 实例:丰富的表格布局

    下面的程序示范了如何使用TableLayout来管理组件的布局。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <!-- 定义第1个表格布局,指定第2列允许收缩,第3列允许拉伸 -->
   <TableLayout android:id="@+id/TableLayout01"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       android:shrinkColumns="1"
       android:stretchColumns="2">
       <!-- 直接添加按钮,它自己会占一行 -->
       <Button android:id="@+id/ok1"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="独自一行的按钮" />
       <!-- 添加一个表格行 -->
       <TableRow >
           <!-- 为该表格行添加三个按钮 -->
             <Button android:id="@+id/ok2"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="普通按钮" />
               <Button android:id="@+id/ok3"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="收缩的按钮" />
                  <Button android:id="@+id/ok4"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="拉伸的按钮" />
       </TableRow>
   </TableLayout>
     <!-- 定义第2个表格布局,指定第2列隐藏 -->
   <TableLayout android:id="@+id/TableLayout02"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       android:collapseColumns="1"
     >
         <Button android:id="@+id/ok5"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="普通按钮2" /> 
              <!-- 添加一个表格行 -->
       <TableRow >
           <!-- 为该表格行添加三个按钮 -->
             <Button android:id="@+id/ok6"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="普通按钮3" />
               <Button android:id="@+id/ok7"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="普通按钮4" />
                  <Button android:id="@+id/ok8"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="普通按钮5" />
       </TableRow>
   </TableLayout>
      <!-- 定义第3个表格布局,指定第2列和第三列可以被拉伸-->
   <TableLayout android:id="@+id/TableLayout03"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       android:stretchColumns="1,2"
     >
          <Button android:id="@+id/ok9"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="独自一行的按钮" /> 
              <!-- 添加一个表格行 -->
       <TableRow >
           <!-- 为该表格行添加三个按钮 -->
             <Button android:id="@+id/ok10"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="普通按钮" />
               <Button android:id="@+id/ok11"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="拉伸的按钮" />
                  <Button android:id="@+id/ok12"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="拉伸的按钮" />
       </TableRow>
        <TableRow >
           <!-- 为该表格行添加两个按钮 -->
             <Button android:id="@+id/ok13"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="普通按钮" />
               <Button android:id="@+id/ok14"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="拉伸的按钮" />
       </TableRow>
   </TableLayout>
   
  
</LinearLayout>

使用Activity来显示上面的界面布局将会看到如图2.11所示界面。

 

posted @ 2013-09-26 10:58  TealerProg  Views(468)  Comments(0Edit  收藏  举报