Day-14 TableLayout

TableLayout（表格布局）
TableLayout是我相当爱用的布局之一，
他能够井然有序地将元件排序，
就如同表格一般，
尤其对於键盘、算盘等程序相当合适。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <TableLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TableRow>
            <Button
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="sin"/>
            <Button
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="cos"/>
            <Button
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="tan"/>
        </TableRow>
    </TableLayout>

    <TableLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TableRow>
            <Button
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="X"/>
            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Y"/>
            <Button
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="Z"/>
        </TableRow>
        <TableRow>
            <Button
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="我偷偷拉长了X的空间"/>
            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="w"
                android:layout_span="2"/>
        </TableRow>
    </TableLayout>

    <TableLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:stretchColumns="2">
        <TableRow>
            <Button
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="1"/>
            <Button
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="2"/>
            <Button
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="被我补满了"/>
        </TableRow>
    </TableLayout>

    <TableLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:collapseColumns="2">
        <TableRow>
            <Button
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="一号选手就位"/>
            <Button
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="二号选手就位"/>
            <Button
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:text="我不见了"/>
        </TableRow>
    </TableLayout>

    <TableLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:shrinkColumns="0">
        <TableRow>
            <Button
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="A"/>
            <Button
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="B"/>
            <Button
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="我只会压缩到A的大小RRRRRRRRRR"/>
        </TableRow>
    </TableLayout>

</LinearLayout>

执行画面如下

第一行：tablelayout的width属性为match_parent，同时三个Button皆给予android:layout_weight="1"，
    因此三个Button会填满且平均分配於第一行
第二行及第三行写在同个tablelayout底下，因此当下方Button字数较多时，会拉长上方Button的宽度
第四行：tablelayout给予android:stretchColumns="2"，表示剩下空间由第2个栏位填满
第五行：tablelayout给予android:collapseColumns="2"，表示隐藏第2个栏位
第六行：tablelayout给予android:shrinkColumns="0"，表示将第0个栏位空间缩小