Android开发 第12课 TableLayout

五布局之表格布局 TableLayout

TableLayout 在3.0推出的API
表格布局模型以行列的形式管理子控件，每一行为一个TableRow的对象，当然也可以是一个View的对象。
每一个TableRow可以添加许多控件进去。
全局属性：
android:collapseColumns = ”1,2” 隐藏第2列和第3列
索引从0开始。
android:shrinkColumns = ”2” 第3列的控件，内容过多，收缩和拉伸使其不会超出屏幕。
‘’*‘’表示所有列
android:stretchColumns = ”2” 填满剩下的多余空白空间

内部控件所用属性：
android:layout_column = ”1” 该控件显示在第2列
android:layout_span = ”2” 该控件占据2列

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"

    android:shrinkColumns="3">

    <Button
        android:id="@+id/button"
        android:layout_height="wrap_content"
        android:layout_weight="wrap_content"
        android:text="button"
        />

    <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <Button
            android:id="@+id/button1"
            android:layout_height="wrap_content"
            android:layout_weight="wrap_content"
            android:text="1"
            />

        <Button
            android:id="@+id/button2"
            android:layout_height="wrap_content"
            android:layout_weight="wrap_content"
            android:text="2"
            />
        <Button
            android:id="@+id/button3"
            android:layout_height="wrap_content"
            android:layout_weight="wrap_content"
            android:text="3"
            />

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

    <TableRow
        android:id="@+id/tableRow22"
        android:layout_width="match_parent"
        android:layout_height="match_parent"

        >

        <Button
            android:id="@+id/button43"
            android:layout_height="wrap_content"
            android:layout_weight="wrap_content"
            android:text="4"
            android:layout_column="1"
            />

        <Button
            android:id="@+id/button53"
            android:layout_height="wrap_content"
            android:layout_weight="wrap_content"
            android:text="5"
            />
        <Button
            android:id="@+id/button63"
            android:layout_height="wrap_content"
            android:layout_weight="wrap_content"
            android:text="6"
            />
    </TableRow>

    <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"

        android:stretchColumns="*" >

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

            >

            <Button
                android:id="@+id/button4"
                android:layout_height="wrap_content"
                android:layout_weight="wrap_content"
                android:text="4"
                />

            <Button
                android:id="@+id/button5"
                android:layout_height="wrap_content"
                android:layout_weight="wrap_content"
                android:text="5"
                />
            <Button
                android:id="@+id/button6"
                android:layout_height="wrap_content"
                android:layout_weight="wrap_content"
                android:text="6"
                android:layout_span="2"
                />
        </TableRow>
    </TableLayout>
</TableLayout>

计算器实现

<?xml version="1.0" encoding="utf-8"?>
<TableLayout 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:stretchColumns="*"
    tools:context="com.adb.li806.mycalculator.MainActivity">

    <TextView
        android:background="#f0f0f0"
        android:id="@+id/textview"
        android:layout_width = "wrap_content"
        android:layout_height = "40dp"
        android:text="90"
        android:textColor="black"
        android:gravity="right|center_vertical"
        android:textSize="25sp"
        />

    <!--
    android:gravity="right"  让文本内容位于textview的右边
    -->
    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <Button
            android:id="@+id/button7"
            android:layout_height="wrap_content"
            android:layout_weight="wrap_content"
            android:text="7"
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button1"
            android:layout_height="wrap_content"
            android:layout_weight="wrap_content"
            android:text="8"
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="9"
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="/"
            android:textSize="20sp"/>
    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="4"
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="5"
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="6"
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button9"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="*"
            android:textSize="20sp"/>
    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
        <Button
            android:id="@+id/button8"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="1"
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button10"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="2"
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button11"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="3"
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button12"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="-"
            android:textSize="20sp"/>
    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
        <Button
            android:id="@+id/button13"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="0"
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button14"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="."
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button15"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="+"
            android:textSize="20sp"/>

        <Button
            android:id="@+id/button16"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="="
            android:textSize="20sp"/>
    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <Button
            android:id="@+id/button17"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="clear"
            android:textSize="20sp"
            android:layout_span="4"/>
        <!--android:layout_span=”4” 该控件占据4列-->
    </TableRow>


</TableLayout>