Android———Layout:TableLayout

前言：

表格布局：是一个ViewGroup以表格显示它的子视图（view）元素，即行和列标识一个视图的位置。其实android的表格布局跟HTML中的表格布局非常类似，TableRow 就像HTML表格的[tr]标记。

TableLayout简介：

把子元素放入到行与列中

不显示行、列或是单元格边界线

单元格不能横跨行，如HTML中一样

表格布局类似HTML里面的Table。每一个TableRow里面有表格行TableRow，TableRow里面可以具体定义每一个元素，设定他的对齐方式android:gravity=""

TableLayout应用：

一、三个常用属性：

android:collapseColumns:设置需要被隐藏的列的序号 

android:shrinkColumns:设置允许被收缩的列的列序号 

android:stretchColumns:设置运行被拉伸的列的列序号

以上这三个属性的列号都是从0开始算的,比如shrinkColunmns = “2”,对应的是第三列！ 

可以设置多个,用逗号隔开比如”0,2”,如果是所有列都生效,则用”*”号即可 

除了这三个常用属性,还有两个属性,分别就是跳格子以及合并单元格,这和HTML中的Table类似:

android:layout_column=”2”:表示的就是跳过第二个,直接显示到第三个格子处,从1开始算的! 

android:layout_span=”4”:表示**合并**4个单元格,也就说这个组件占4个单元格

1、CollapseColumns(隐藏列)

android:collapseColumns = “0,2”，就是隐藏第一与第三列,代码如下:

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:collapseColumns="0,2"
    tools:context="com.example.TableLayout.MainActivity"
    > 
    <!-- 
    //三种常用属性
    android:collapseColumns="0"
    android:shrinkColumns="2"
    android:stretchColumns="2"
    ! -->
    <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="one" />

        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="two" />

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="three" />

    </TableRow>

    <TableRow
        android:id="@+id/tableRow2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="four" />

        <Button
            android:id="@+id/button5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="five" />

        <Button
            android:id="@+id/button6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="six" />

    </TableRow>

</TableLayout>
           

2、StretchColumns(拉伸列)

android:stretchColumns = “1” ,设置第二个列为可拉伸列,代码如下:

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:stretchColumns="2"
    tools:context="com.example.TableLayout.MainActivity"
    > 
    <!-- 
    //三种常用属性
    android:collapseColumns="0"
    android:shrinkColumns="2"
    android:stretchColumns="2"
    ! -->
    <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="one" />

        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="two" />

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="three" />

    </TableRow>

    <TableRow
        android:id="@+id/tableRow2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="four" />

        <Button
            android:id="@+id/button5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="five" />

        <Button
            android:id="@+id/button6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="six" />

    </TableRow>

</TableLayout>
           

3、shrinkColumns(收缩列)

android:shrinkColumns = “1” 设置第二个列为可收缩列,代码如下:

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:shrinkColumns="2"
    tools:context="com.example.TableLayout.MainActivity"
    > 
    <!-- 
    //三种常用属性
    android:collapseColumns="0"
    android:shrinkColumns="2"
    android:stretchColumns="2"
    ! -->
    <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="one" />

        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="two" />

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="three" />
        
        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="four" />

        <TextView
            android:id="@+id/button5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="fivefsdfssd" />

    </TableRow>
    <TableRow
        android:id="@+id/tableRow2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/button6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="six" />

        <Button
            android:id="@+id/button7"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="seven" />

        <Button
            android:id="@+id/button8"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="eight" />

        <Button
            android:id="@+id/button9"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="nine" />

        <TextView
            android:id="@+id/button10"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="tenfsdfssdf" />
    </TableRow>

</TableLayout>