一步一步学android之布局管理器——TableLayout

前几天生病，博客没更新，今天接着学习第三个布局管理器TableLayout（表格布局），顾名思义就不难理解它是采用表格的形式对控件的布局进行管理的，在TableLayout布局中需要使用TableRow来对表格中的行进行控制，然后再把组件放在TableRow中，同样先来看看TableLayout的定义（http://developer.android.com/reference/android/widget/TableLayout.html）：

一般TableLayout布局一般用在对程序进行列表输出的操作上，下面写个例子来看看TableLayout的用法：

效果如下：

main.xml：

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/TableLayout1"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <TableRow>        <EditText            android:id="@+id/editText1"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="请输入你想查询的问题...." >        </EditText>        <Button            android:id="@+id/button1"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="查询" />    </TableRow>    <View        android:layout_height="2px"        android:background="#ff909090" />    <TableRow>        <TextView            android:id="@+id/tx"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="请选择检索范围："            android:textSize="15sp" />        <RadioGroup            android:id="@+id/choose"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:checkedButton="@+id/china"            android:orientation="horizontal" >            <RadioButton                android:id="@+id/china"                android:text="中国" />            <RadioButton                android:id="@+id/usa"                android:text="美国" />        </RadioGroup>    </TableRow></TableLayout>

上面的代码首先选择TableLayout进行布局，然后定义两个TableRow，之后在第一行中加入一个EditText和Button，第二行中加入一个TextView和RadioGroup，这些控件在控件篇都已经使用过，程序为了看起来有区别，就在第一行和第二行之间加了条横线，就是view那个标签。

前面说到TableLayout比较适合输出列表数据，下面同样写个例子来看看：

main.xml：

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/TableLayout01"    android:layout_width="match_parent"    android:layout_height="match_parent"     >    <TableRow>        <TextView            android:layout_column="0"            android:text="ID"            android:layout_gravity="center_horizontal"            android:padding="8px"/><!-- 定义组件的大小 -->        <TextView            android:layout_column="1"            android:text="姓名"            android:layout_gravity="center_horizontal"            android:padding="8px"/>        <TextView            android:layout_column="2"            android:text="EMAIL"            android:layout_gravity="center_horizontal"            android:padding="8px"/>        <TextView            android:layout_column="3"            android:text="地址"            android:layout_gravity="center_horizontal"            android:padding="8px"/>    </TableRow>    <View         android:layout_height="2px"        android:background="#FF909090"/>    <TableRow>        <TextView             android:layout_column="0"            android:text="CSDN"            android:gravity="center_horizontal"            android:padding="3px"/>        <TextView             android:layout_column="1"            android:text="CSDN博客"            android:gravity="center_horizontal"           android:padding="3px"/>        <TextView             android:layout_column="2"            android:text="csdn.net"            android:gravity="center_horizontal"            android:padding="3px"/>        <TextView             android:layout_column="3"            android:text="广东省广州市白云区河边"            android:gravity="center_horizontal"            android:padding="3px"/>    </TableRow><TableRow>        <TextView             android:layout_column="0"            android:text="ZLK"            android:gravity="center_horizontal"           android:padding="3px"/>        <TextView             android:layout_column="1"            android:text="KAY"            android:gravity="center_horizontal"           android:padding="3px"/>        <TextView             android:layout_column="2"            android:text="blog.csdn.net/Kaypro"            android:gravity="center_horizontal"            android:padding="3px"/>        <TextView             android:layout_column="3"            android:text="广州"            android:gravity="center_horizontal"            android:padding="3px"/>    </TableRow></TableLayout>

效果图如下：

可以发现有些数据显示不完整（广东省广州市白云区河边），出现这个情况我们可以设置TableLayout的属性android:shrinkColumns="3"（0开始），这句话是定义为可收缩列。同时TableLayout还有android:collapseColumns="0,3"属性设置那列不显示，总体修改后的main.xml如下：

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/TableLayout01"    android:layout_width="match_parent"    android:layout_height="match_parent"     android:collapseColumns="0,3"    android:shrinkColumns="3">        <TableRow>        <TextView            android:layout_column="0"            android:text="ID"            android:layout_gravity="center_horizontal"            android:padding="8px"/><!-- 定义组件的大小 -->        <TextView            android:layout_column="1"            android:text="姓名"            android:layout_gravity="center_horizontal"            android:padding="8px"/>        <TextView            android:layout_column="2"            android:text="EMAIL"            android:layout_gravity="center_horizontal"            android:padding="8px"/>        <TextView            android:layout_column="3"            android:text="地址"            android:layout_gravity="center_horizontal"            android:padding="8px"/>    </TableRow>    <View         android:layout_height="2px"        android:background="#FF909090"/>    <TableRow>        <TextView             android:layout_column="0"            android:text="CSDN"            android:gravity="center_horizontal"            android:padding="3px"/>        <TextView             android:layout_column="1"            android:text="CSDN博客"            android:gravity="center_horizontal"           android:padding="3px"/>        <TextView             android:layout_column="2"            android:text="csdn.net"            android:gravity="center_horizontal"            android:padding="3px"/>        <TextView             android:layout_column="3"            android:text="广东省广州市白云区河边"            android:gravity="center_horizontal"            android:padding="3px"/>    </TableRow><TableRow>        <TextView             android:layout_column="0"            android:text="ZLK"            android:gravity="center_horizontal"           android:padding="3px"/>        <TextView             android:layout_column="1"            android:text="KAY"            android:gravity="center_horizontal"           android:padding="3px"/>        <TextView             android:layout_column="2"            android:text="blog.csdn.net/Kaypro"            android:gravity="center_horizontal"            android:padding="3px"/>        <TextView             android:layout_column="3"            android:text="广州"            android:gravity="center_horizontal"            android:padding="3px"/>    </TableRow></TableLayout>

效果图如下（android:shrinkColumns=“3”这里我把第三行忽略掉了，看不见效果，后面会有，不用担心）

前面提到的Layout都可以代码实现，TableLayout也同样可以，MainActivity.java：

package com.example.tablelayoutdemo;import android.annotation.SuppressLint;import android.app.Activity;import android.graphics.Color;import android.os.Bundle;import android.view.View;import android.view.ViewGroup;import android.view.ViewGroup.LayoutParams;import android.widget.TableLayout;import android.widget.TableRow;import android.widget.TextView;@SuppressLint("ParserError")public class MainActivity extends Activity {//定义好要显示的数据private String titleData[][] = new String[][] {{ "ID", "姓名", "EMAIL", "地址" },{ "CSDN", "CSDN", "csdn.net", "广东省广州市白云区河边" },{ "ZLK", "KAY", "blog.csdn.net/Kaypro", "广州" } };@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);//新建TableLayoutTableLayout t = new TableLayout(this);//定义TableLayout的宽和高TableLayout.LayoutParams layoutParam = new TableLayout.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT,ViewGroup.LayoutParams.FILL_PARENT);//就是android:shrinkColumns="3"的意思t.setColumnShrinkable(3,true);//下面4行代码是对那条横线的定义View v = new View(this);v.setBackgroundColor(Color.BLACK);LayoutParams viewParams = new LayoutParams(ViewGroup.LayoutParams.FILL_PARENT,2);v.setLayoutParams(viewParams);//设置表格的背景颜色t.setBackgroundColor(Color.YELLOW);//下面开始初始化for (int i = 0; i < this.titleData.length; i++) {//如果到了第二行就添加横线if(i==1){t.addView(v);}//创建表格行（第一层循环的作用就是行的建立）TableRow tr = new TableRow(this);for (int j = 0; j < this.titleData[i].length; j++) {//创建文本组件（第二层循环作用就是遍历行元素，建立textview，然后添加到当下循环下的tablerow中TextView tv = new TextView(this);tv.setText(this.titleData[i][j]);tr.addView(tv, j);}t.addView(tr);}setContentView(t, layoutParam);}}

效果图如下：

看见地址那列的河边的边字收缩下拉了吧，就是android:shrinkColumns="3"这句的作用。

好了，TableLayout就说到这里了。