android-TableLayout以及TableRow的使用

android-TableLayout以及TableRow的使用

TableLayout是一种可以制作表格的布局，它和GridLayout的区别是GridLayout只能制定每一列宽度一样的表格布局，而TableLayout能够制定各列宽度不一样的表格布局。

TableLayout的主要属性:

android:collapseColumns=”0,1” 隐藏第0列和第1列

android:stretchColumns=”0,1” 第0列和第1列可以向行方向扩展

android:stretchColumns=”*” 所有列可以向行方向扩展

android:shrinkColumns=”0,1” 第0列和第1列可以向列方向扩展

TableRow的子控件的主要属性：

android:layout_column=”1” 该控件显示在第1列

android:layout_span=”2” 该控件占据2列

注：TableLayout里面的子控件可以为TableRow或者其他View，但是其子控件的android:layout_width属性被系统固定为match_parent，TableLayout里面所有行中某一列的宽度的最大值是这一列的宽度。

代码示例

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorBlack"
android:orientation="vertical">

<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorAccent">

<!--android:layout_width="wrap_content"不会起作用-->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="父match_parent，子wrap_content"/>
</TableLayout>

<TableLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorAccent">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="父wrap_content，子wrap_content"/>
</TableLayout>

<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorAccent">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="父match_parent，子match_parent"/>
</TableLayout>

<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorAccent">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="正常情况:"/>

<!--android:layout_width="wrap_content"不会起作用-->
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorPrimary">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:text="normal0"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:text="normal1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="normal2"/>

</TableRow>

</TableLayout>

<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorAccent"
android:collapseColumns="0">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="测试列隐藏:"/>

<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorPrimary">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:text="normal0"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:text="normal1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="normal2"/>

</TableRow>

</TableLayout>

<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorAccent"
android:stretchColumns="0">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="测试列扩展:"/>

<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorPrimary">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:text="normal0"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:text="normal1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="normal2"/>

</TableRow>

</TableLayout>

<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorAccent"
android:shrinkColumns="0">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="测试列收缩:"/>

<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorPrimary">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:text="normal0normal0normal0normal0normal0normal0normal0normal0normal0"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:text="normal1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="normal2"/>

</TableRow>

</TableLayout>

<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorAccent">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="测试单元格属性:"/>

<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorPrimary">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:text="normal0"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:text="normal1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="normal2"/>

</TableRow>

<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorPrimary">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_column="1"
android:text="我在第一列"/>
</TableRow>

<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorPrimary">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_span="2"
android:text="我可以占据两列"/>
</TableRow>

</TableLayout>

<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:stretchColumns="*">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:text="制作表格:"/>

<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="1dp"
android:background="@color/colorPrimary">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:gravity="center"
android:text="normal0"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:gravity="center"
android:text="normal1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:gravity="center"
android:text="normal2"/>

</TableRow>

<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="1dp"
android:paddingRight="1dp"
android:paddingBottom="1dp"
android:background="@color/colorPrimary">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:gravity="center"
android:text="normal0"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:layout_marginRight="1dp"
android:gravity="center"
android:text="normal1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
android:gravity="center"
android:text="normal2"/>

</TableRow>
</TableLayout>

</LinearLayout>

运行结果：