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>


 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章