無法將垂直分隔線添加到TableLayout Android

我想向我的TableLayout添加清晰的分隔線。無法將垂直分隔線添加到TableLayout Android

我TableLayout看起來像這樣：

但我想每排兩個textview S之間添加一行（分頻器）。我曾嘗試在兩個textview之間放置一個View，但它延伸了這一行。

這裏是我的上述佈局代碼：

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:id="@+id/row" 
android:layout_gravity="center" 
android:showDividers="beginning" 
android:orientation="horizontal" 
android:stretchColumns="1" 
android:background="@drawable/custom_background"> 

<TableRow> 
    <TextView 
     android:text="Name" 
     android:padding="3dip" /> 

    <TextView 
     android:text="Imran" 
     android:gravity="left" 
     android:padding="3dip" /> 
</TableRow> 

<View 
    android:layout_height="2dip" 
    android:background="#FF909090" /> 

<TableRow> 
    <TextView 
     android:text="Name" 
     android:padding="3dip" /> 

    <TextView 
     android:text="Test" 
     android:gravity="left" 
     android:padding="3dip" /> 
</TableRow> 

<View 
    android:layout_height="2dip" 
    android:background="#FF909090" /> 

<TableRow> 
    <TextView 
     android:text="Name" 
     android:padding="3dip" /> 

    <TextView 
     android:text="Test" 
     android:gravity="left" 
     android:padding="3dip" /> 
</TableRow>

我想達到以下佈局：

誰能幫我用實現上述佈局TableLayout或其他方式？

來源

2016-11-20 Linux Holic

這是主要的xml文件。您可以使用

android:divider="@drawable/vertical_divider" 
    android:showDividers="middle"

在線性佈局中顯示垂直分隔線。我設計了你的佈局，我不喜歡錶佈局，你可以嘗試線性佈局。

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:background="@drawable/rounded_corner" 
android:orientation="vertical"> 


<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal" 
    android:divider="@drawable/vertical_divider" 
    android:showDividers="middle"> 

    <TextView 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:padding="16dp" 
     android:text="Lorem ipsum" /> 

    <TextView 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:padding="16dp" 
     android:text="Lorem ipsum" /> 
    </LinearLayout> 

<View 
    android:layout_width="match_parent" 
    android:layout_height="1dp" 
    android:background="#FFCCCCCC"></View> 

    <LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:divider="@drawable/vertical_divider" 
    android:orientation="horizontal" 
    android:showDividers="middle"> 

    <TextView 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:padding="16dp" 
     android:text="Lorem ipsum" /> 

    <TextView 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:padding="16dp" 
     android:text="Lorem ipsum" /> 
    </LinearLayout> 

<View 
    android:layout_width="match_parent" 
    android:layout_height="1dp" 
    android:background="#FFCCCCCC"></View> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:divider="@drawable/vertical_divider" 
    android:orientation="horizontal" 
    android:showDividers="middle"> 

    <TextView 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:padding="16dp" 
     android:text="Lorem ipsum" /> 

    <TextView 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:padding="16dp" 
     android:text="Lorem ipsum" /> 
    </LinearLayout> 

    <View 
    android:layout_width="match_parent" 
    android:layout_height="1dp" 
    android:background="#FFCCCCCC"></View> 

    </LinearLayout>

這裏是

rounded_corner.xml

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

    <solid android:color="#00000000" /> 
    <stroke 
    android:width="1dp" 
    android:color="#bababa" /> 

    <padding 
    android:bottom="1dp" 
    android:left="1dp" 
    android:right="1dp" 
    android:top="1dp" /> 

    <corners 
    android:bottomLeftRadius="25dip" 
    android:bottomRightRadius="25dip" 
    android:topLeftRadius="25dip" 
    android:topRightRadius="25dip" /> 
    </shape>

下面的代碼的

vertical_divider.xml 

    <?xml version="1.0" encoding="UTF-8"?> 
    <inset xmlns:android="http://schemas.android.com/apk/res/android" 
    android:insetBottom="2dp" 
    android:insetTop="2dp"> 
    <shape> 
     <size android:width="1dp" /> 
     <solid android:color="#FFCCCCCC" /> 
    </shape> 
    </inset>

將您的顏色代碼上面:)

輸出的代碼

來源

2016-11-20 21:13:46

感謝您幫助我，但我需要在第一個textview旁邊的分隔符不在中間。我怎樣才能做到這一點？我試過android：showdividers =「開始」，但它仍然在中間顯示垂直分隔線。 –

親愛的玩textview的重量。嘗試權重1.5和0.5， –

根據此代碼在具有水平方向的內部佈局中添加weightSum並更改文字查看的權重。 <的LinearLayout 機器人：weightSum = 「2」機器人：showDividers = 「中間」> < /的LinearLayout> –

我覺得這個解決方案要容易得多。

你TableLayout：

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_margin="10dp" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_centerInParent="true" 
    android:divider="@drawable/table_divider" 
    android:showDividers="middle" 
    android:shrinkColumns="*" 
    android:background="@drawable/rounded_corners"> 

    <TableRow 
     android:divider="@drawable/table_divider" 
     android:showDividers="middle" 
     android:weightSum="3"> 

     <TextView 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:padding="3dp" 
      android:text="Column1" 
      android:textStyle="bold" /> 

     <TextView 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:padding="3dp" 
      android:text="Column2" 
      android:textStyle="bold" /> 

     <TextView 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:padding="3dp" 
      android:text="Column3" 
      android:textStyle="bold" /> 
    </TableRow> 

    <TableRow 
     android:divider="@drawable/table_divider" 
     android:showDividers="middle" 
     android:weightSum="3"> 

     <TextView 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:padding="3dp" 
      android:text="Column1" /> 

     <TextView 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:padding="3dp" 
      android:text="Column2" /> 

     <TextView 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:padding="3dp" 
      android:text="Column3" /> 
    </TableRow> 

</TableLayout>

你的背景繪製：

<?xml version="1.0" encoding="utf-8"?>

<solid android:color="#00000000" /> 
<stroke 
    android:width="1dp" 
    android:color="@android:color/black" /> 

<corners 
    android:bottomLeftRadius="10dp" 
    android:bottomRightRadius="10dp" 
    android:topLeftRadius="10dp" 
    android:topRightRadius="10dp" />

併爲您的分頻器形狀：

table_divider.xml 

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"> 
    <size android:height="1dp" /> 
    <size android:width="1dp" /> 
    <solid android:color="@android:color/black" /> 
</shape>

結果：

如果你不需要的背景下，你可以在你TableLayout，並在每個的TableRow做到這一點：

android:showDividers="beginning|middle|end"

結果沒有背景：

來源

2017-03-20 11:28:42 blk0ut

無法將垂直分隔線添加到TableLayout Android

回答

相關問題