Android TableLayout 实现边框

TableLayout简介：

我们做android应用项目，通常会用到TableLayout布局和使用边框突出内容。然则，Android中的TableLayout并没有像HTML中table的border属性，这时就需要我们自己通过其他方式来实现边框。

单元格可以为empty，并且通过android:layout_column可以设置index值实现跳开某些单元格。在TableRow之间 添加View,设置layout_height以及背景色，就可以实现一条间隔线。android:layout_span可以设置合并几个单元格。

边框实现思想：

通过设定TableLayout，TableRow，TableRow里面View(控件)的BackGround颜色反衬出边框的颜色。

 

布局代码：

<?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="wrap_content"
    android:orientation="vertical"
    android:stretchColumns="*" >

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

        <TextView
            style="@style/textview_allgrade_title"
            android:text="@string/xiaoxue" />
    </TableRow>

    <TableRow
        android:id="@+id/tableRow1_1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/darker_gray" >

        <TextView
            android:id="@+id/grade1"
            style="@style/textview_allgrade_content"
            android:onClick="switchGrade"
            android:text="@string/grade1" />

        <TextView
            android:id="@+id/grade2"
            style="@style/textview_allgrade_content"
            android:onClick="switchGrade"
            android:text="@string/grade2" />

        <TextView
            android:id="@+id/grade3"
            style="@style/textview_allgrade_content"
            android:onClick="switchGrade"
            android:text="@string/grade3" />
    </TableRow>

    <TableRow
        android:id="@+id/tableRow1_2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/darker_gray" >

        <TextView
            android:id="@+id/grade4"
            style="@style/textview_allgrade_content"
            android:onClick="switchGrade"
            android:text="@string/grade4" />

        <TextView
            android:id="@+id/grade5"
            style="@style/textview_allgrade_content"
            android:onClick="switchGrade"
            android:text="@string/grade5" />

        <TextView
            android:id="@+id/grade6"
            style="@style/textview_allgrade_content"
            android:onClick="switchGrade"
            android:text="@string/grade6" />
    </TableRow>

</TableLayout>

 其中textview_allgrade_content为在style.xml中的代码：

<style name="textview_allgrade_content">
        <item name="android:layout_height">30dp</item>
        <item name="android:gravity">center</item>
        <item name="android:textStyle">bold</item>
        <item name="android:layout_margin">1dip</item>
        <item name="android:background">#0000ff</item>
        <item name="android:textSize">20sp</item>
        <item name="android:clickable">true</item>
    </style>