如何在表格布局中的列之间设置分隔符？答案

【问题标题】：How to set divider between columns in tablelayout?如何在表格布局中的列之间设置分隔符？
【发布时间】：2012-04-09 12:31:59
【问题描述】：

我想创建一个带有列分隔符的表格。我想用垂直条形图像划分我的列。为此，我使用了"android:divider="@drawable/abc"，但它不起作用。以下是我的 xml 文件：

 <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="horizontal" 
   android:stretchColumns="*"
    android:padding="5dip"
android:divider="@drawable/tracking_green"
>
<TableRow  >

<TextView
    android:id="@+id/retaileritem1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:text="xxxxxxx" />

<TextView
    android:id="@+id/retaileritem2"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:text="xxxxxxx" />

<ImageView
    android:id="@+id/retailerimage1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:src="@drawable/tracking_green" />

</TableRow>

【问题讨论】：

标签： android divider android-tablelayout

【解决方案1】：

添加 android:showDividers="middle"

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="horizontal" 
  android:stretchColumns="*"
  android:padding="5dip"
  android:divider="@drawable/tracking_green"
  android:showDividers="middle"
>

【讨论】：

还有什么办法可以改变分隔线的颜色吗？
例如：如果你使用 --- android:divider="@color/orangeBackground" 那么你可以在colors.xml中定义值比如--- #FF8000

【解决方案2】：

我就是这样做的！

代码

<LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:orientation="vertical" >

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:padding="5dp" >

                <TextView
                    android:id="@+id/textView4"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="1"
                    android:paddingBottom="50dp"
                    android:text="Salary Details"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:textStyle="bold" />

                <TableLayout
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:shrinkColumns="0"
                    android:stretchColumns="1" >

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

                        <TextView
                            android:layout_gravity="center_vertical"
                            android:gravity="left"
                            android:text="Financial Year"
                            android:textColor="@android:color/white"
                            android:textSize="14sp"
                            android:textStyle="bold" />

                        <Spinner
                            android:id="@+id/spnSearchByCity"
                            android:layout_width="fill_parent"
                            android:layout_height="40dp"
                            android:layout_gravity="center_vertical"
                            android:entries="@array/year"
                            tools:listitem="@android:layout/simple_spinner_dropdown_item" />
                    </TableRow>
                </TableLayout>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="#d30059"
                    android:orientation="vertical"
                    android:paddingTop="50dp" >

                    <TableLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content" >

                        <TableRow
                            android:id="@+id/tableRow1"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:background="@android:color/white" >

                            <TextView
                                android:id="@+id/textView1"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_marginBottom="1dp"
                                android:layout_marginLeft="1dp"
                                android:layout_marginTop="1dp"
                                android:layout_weight="1"
                                android:background="#d30059"
                                android:gravity="center"
                                android:text="Month"
                                android:textAppearance="?android:attr/textAppearanceMedium" />

                            <TextView
                                android:id="@+id/textView2"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_marginBottom="1dp"
                                android:layout_marginLeft="1dp"
                                android:layout_marginTop="1dp"
                                android:layout_weight="1"
                                android:background="#d30059"
                                android:gravity="center"
                                android:text="Net Salary"
                                android:textAppearance="?android:attr/textAppearanceMedium" />

                            <TextView
                                android:id="@+id/textView3"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_marginBottom="1dp"
                                android:layout_marginLeft="1dp"
                                android:layout_marginRight="1dp"
                                android:layout_marginTop="1dp"
                                android:layout_weight="1"
                                android:background="#d30059"
                                android:gravity="center"
                                android:text="Click"
                                android:textAppearance="?android:attr/textAppearanceMedium" />
                        </TableRow>

                        <TableRow
                            android:id="@+id/tableRow2"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:background="@android:color/white" >

                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_marginBottom="1dp"
                                android:layout_marginLeft="1dp"
                                android:layout_weight="1"
                                android:background="#d30059"
                                android:gravity="center"
                                android:text="Jan"
                                android:textAppearance="?android:attr/textAppearanceMedium" />

                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_marginBottom="1dp"
                                android:layout_marginLeft="1dp"
                                android:layout_weight="1"
                                android:background="#d30059"
                                android:gravity="center"
                                android:text="11305"
                                android:textAppearance="?android:attr/textAppearanceMedium" />

                            <LinearLayout
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:layout_marginBottom="1dp"
                                android:layout_marginLeft="1dp"
                                android:layout_marginRight="1dp"
                                android:layout_weight="1"
                                android:background="#d30059"
                                android:gravity="center"
                                android:orientation="vertical" >

                                <TextView
                                    android:id="@+id/txtDetailsOneId"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_weight="1"
                                    android:background="#000000"
                                    android:text="DETAILS"
                                    android:textAppearance="?android:attr/textAppearanceMedium" />
                            </LinearLayout>
                        </TableRow>

                        <TableRow
                            android:id="@+id/tableRow3"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:background="@android:color/white" >

                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_marginBottom="1dp"
                                android:layout_marginLeft="1dp"
                                android:layout_weight="1"
                                android:background="#d30059"
                                android:gravity="center"
                                android:text="Feb"
                                android:textAppearance="?android:attr/textAppearanceMedium" />

                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_marginBottom="1dp"
                                android:layout_marginLeft="1dp"
                                android:layout_weight="1"
                                android:background="#d30059"
                                android:gravity="center"
                                android:text="11405"
                                android:textAppearance="?android:attr/textAppearanceMedium" />

                            <LinearLayout
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:layout_marginBottom="1dp"
                                android:layout_marginLeft="1dp"
                                android:layout_marginRight="1dp"
                                android:layout_weight="1"
                                android:background="#d30059"
                                android:gravity="center"
                                android:orientation="vertical" >

                                <TextView
                                    android:id="@+id/txtDetailsTwoId"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_weight="1"
                                    android:background="#000000"
                                    android:text="DETAILS"
                                    android:textAppearance="?android:attr/textAppearanceMedium" />
                            </LinearLayout>
                        </TableRow>

                        <TableRow
                            android:id="@+id/tableRow4"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content" >
                        </TableRow>
                    </TableLayout>
                </LinearLayout>
            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:padding="50dp" >

                <Button
                    android:id="@+id/btnMainMenuId"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="5dp"
                    android:text="MAIN MENU"
                    android:textColor="@android:color/white"
                    android:textSize="12sp" />
            </LinearLayout>
        </LinearLayout>

快照

【讨论】：

【解决方案3】：

现在回答这个问题已经很晚了，但这是正确的方法。

对于行之间的分隔符：

<TableLayout
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:divider="@color/colorPrimary"
    android:showDividers="middle">

对于列之间的分隔符：

<TableRow
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:divider="@color/colorPrimary"
    android:showDividers="middle">

说明：

<TableLayout> 中的分隔符标签用于在其直接子项之间放置分隔符，即行。

虽然<TableRow> 中的分隔符标签用于在其直接子项之间放置分隔符，即列

【讨论】：

【解决方案4】：

我想要的是这样一张桌子

我在我的 style.xml 中添加了这个

    <style name="Divider">
        <item name="android:layout_width">1dip</item>
        <item name="android:layout_height">match_parent</item>
        <item name="android:background">@color/divider_color</item>
    </style>

    <style name="Divider_invisible">
        <item name="android:layout_width">1dip</item>
        <item name="android:layout_height">match_parent</item>
    </style>

Then in my table layout 

 <TableLayout
            android:id="@+id/table"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:stretchColumns="*" >

            <TableRow
                android:id="@+id/tableRow1"
                android:layout_width="fill_parent"
                android:layout_height="match_parent"
                android:background="#92C94A" >

                <TextView
                    android:id="@+id/textView11"
                    android:paddingBottom="10dp"
                    android:paddingLeft="5dp"
                    android:paddingRight="5dp"
                    android:paddingTop="10dp" />

                <LinearLayout
                    android:layout_width="1dp"
                    android:layout_height="match_parent" >

                    <View style="@style/Divider_invisible" />
                </LinearLayout>

                <TextView
                    android:id="@+id/textView12"
                    android:paddingBottom="10dp"
                    android:paddingLeft="5dp"
                    android:paddingRight="5dp"
                    android:paddingTop="10dp"
                    android:text="@string/main_wo_colon"
                    android:textColor="@color/white"
                    android:textSize="16sp" />

                <LinearLayout
                    android:layout_width="1dp"
                    android:layout_height="match_parent" >

                    <View style="@style/Divider" />
                </LinearLayout>

                <TextView
                    android:id="@+id/textView13"
                    android:paddingBottom="10dp"
                    android:paddingLeft="5dp"
                    android:paddingRight="5dp"
                    android:paddingTop="10dp"
                    android:text="@string/side_wo_colon"
                    android:textColor="@color/white"
                    android:textSize="16sp" />

                <LinearLayout
                    android:layout_width="1dp"
                    android:layout_height="match_parent" >

                    <View style="@style/Divider" />
                </LinearLayout>

                <TextView
                    android:id="@+id/textView14"
                    android:paddingBottom="10dp"
                    android:paddingLeft="5dp"
                    android:paddingRight="5dp"
                    android:paddingTop="10dp"
                    android:text="@string/total"
                    android:textColor="@color/white"
                    android:textSize="16sp" />
            </TableRow>

            <!-- display this button in 3rd column via layout_column(zero based) -->

            <TableRow
                android:id="@+id/tableRow2"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="#6F9C33" >

                <TextView
                    android:id="@+id/textView21"
                    android:padding="5dp"
                    android:text="@string/servings"
                    android:textColor="@color/white"
                    android:textSize="16sp" />

                <LinearLayout
                    android:layout_width="1dp"
                    android:layout_height="match_parent" >

                    <View style="@style/Divider" />
                </LinearLayout>

..........
.......
......

【讨论】：

【解决方案5】：

由于 tablelayout 不直接提供此功能，因此一种可能的方式可能是 framelayout。将所需的表格放在另一个 background_table 上方，该表格只有一行，高度/宽度为“match_parent”。添加具有所需布局权重的 3 列。将垂直分隔线图像视图添加到第二列。主表也应该在其行中使用相同的 layout_weihts +margin 以看起来不错。

可以通过在“待分离”表格行之间添加一个imageview来实现水平分隔。

尚未测试，只是一种方法

好吧

【讨论】：

【解决方案6】：

在带有垂直分隔符的列表中，按如下方式使用 ImageView：

<ImageView 
    android:id="@+id/divider"
    android:contentDescription="@string/divider"
    android:layout_width="1dp"
    android:layout_height="65dp"
    android:layout_marginTop="8sp" 
    android:background="#3B3B3B"
    />

为避免在列表中没有元素时显示分隔线，您可以删除 android:background="#3B3B3B" 行并以编程方式设置它：

((ImageView) view.findViewById(R.id.divider)).setBackgroundColor(Color.parseColor("#3B3B3B"));

【讨论】：

【解决方案7】：

尝试设置第二个 textview marginleft=1dp。如果你不想要分隔线设置 marginleft = 0dp

【讨论】：