Android 之表格布局(TableLayout)

最新推荐文章于 2025-12-05 11:27:21 发布

最新推荐文章于 2025-12-05 11:27:21 发布 · 213 阅读

文章标签：

#android #TableLayout #表格布局

Android 专栏收录该内容

102 篇文章

订阅专栏

本文详细介绍了如何在Android应用中利用TableLayout和嵌套布局实现灵活的界面布局，通过实例展示了如何调整列的属性（如拉伸、收缩、隐藏）以适应不同的屏幕尺寸和需求，提供了在不同场景下的布局解决方案。

[size=medium][color=cyan][b]
表格布局---(TableLayout)

TableLayout 类以行和列形式管理控件，每行为一个TableRow对象，也可以为View对象，
当为View 对象时，该View对象将跨越该行的所有列，在TableRow 中也可以添加子空间，
每添加一个子空间为一列；

在TableLayout中，可以设置三种属性：
* Shrinkable ，该列的宽度可以进行收缩，以使表格能够适应其父容器的大小；
* Stretchable ，该列的宽度可以进行拉伸，以时其填满表格中空闲的空间；
* Collapsed,该列将被隐藏；

注：在指定列的时候是根据对应的列号进行指定的，列号从 0 开始；
一个列可以同时拥有拉伸和收缩的属性；

表格布局中，列的宽度由该列中最宽的那个单元决定，整个表格的宽度则取决
于父容器的宽度；
表格布局还支持嵌套，可以将一个表格布局放在另一个表格布局中，也可以在
表格布局中添加其他的界面布局，例如：线性布局、相对布局等；

案例如下：
效果实现，使用线性布局和表格布局嵌套；[/b][/color][/size]

效果图如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <!-- 嵌套表格布局 -->

    <TableLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#DEB887"
        android:stretchColumns="2" >

        <Button
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="独占一行" />

        <TableRow>

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button2" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button2" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button2" />
        </TableRow>
    </TableLayout>

    <!-- 隐藏列,隐藏第二列，拉伸第三列 -->

    <TableLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#00008B"
        android:collapseColumns="1"
        android:stretchColumns="2" >

        <TableRow>

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button5" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button6" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button7" />
        </TableRow>
    </TableLayout>

    <!-- 拉伸 2 3 两列  收缩第1列 -->

    <TableLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#7FFF00"
        android:shrinkColumns="0"
        android:stretchColumns="1" >

        <Button
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="独占一行的按钮" />

        <TableRow>

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button9" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button10" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button11" />
        </TableRow>

        <TableRow>

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button12" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button13" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="button14" />
        </TableRow>
    </TableLayout>

</LinearLayout>