现在的位置: 首页 > 综合 > 正文

Android TableLayout 实现边框

2017年11月23日 ⁄ 综合 ⁄ 共 2306字 ⁄ 字号 评论关闭

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>

 

抱歉!评论已关闭.