Creating vertical line inside list(expandable) item on android

Question

So i'm trying to create a line inside the child item lists of my expandable list and it wont work, here's my layout:

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

<RelativeLayout
    android:id="@+id/rows"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:visibility="visible"
    android:layout_toLeftOf="@id/checkBox_view" >

    <LinearLayout
        android:id="@+id/row1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/row1_column1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="left"
            android:layout_weight="1"
            android:gravity="left"/>

        <TextView
            android:id="@+id/row1_column2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:gravity="right"/>
    </LinearLayout>

    <LinearLayout
        android:id="@+id/row2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/row1"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/row2_column1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="left"
            android:layout_weight="1"
            android:gravity="left"/>

        <TextView
            android:id="@+id/row2_column2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:gravity="right"/>
    </LinearLayout>

    <LinearLayout
        android:id="@+id/row3"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/row2" >

        <TextView
            android:id="@+id/row3_column1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="left"
            android:layout_weight="1"
            android:gravity="left"
            />

        <TextView
            android:id="@+id/row3_column2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:gravity="right"
            />
    </LinearLayout>
</RelativeLayout>

<View
    android:id="@+id/separator"
    android:layout_width="1dp"
    android:layout_height="match_parent"
    android:background="@color/border_grey"
    android:layout_toEndOf="@id/rows"
    android:layout_alignParentBottom="true"/></RelativeLayout>                                       

Its basically a relative layout, with a linearlayout containing a textview and checkbox and a relativelayout containing all the textfields per row:

/////////////////////////////||//////////////////
//  String 1_1 // String 1_2 ||                //
/////////////////////////////||                //
//  String 2_1 // String 2_2 ||  TXT :CHECKBOX //
/////////////////////////////||                //
//  String 3_1 // String 3_2 ||                //
/////////////////////////////||//////////////////

But the last View which should draw the vertical is not working and i've tried many alternatives using linearlayouts and still doesn't work.

Answer 1

Try this

edit: added the separator :)

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingLeft="3dp" >

<LinearLayout
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:orientation="vertical"
    android:paddingLeft="3dp" >

    <LinearLayout
        android:id="@+id/row1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/row1_column1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1" />

        <TextView
            android:id="@+id/row1_column2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/row2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/row2_column1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1" />

        <TextView
            android:id="@+id/row2_column2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/row3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/row3_column1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1" />

        <TextView
            android:id="@+id/row3_column2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>
</LinearLayout>

<View
    android:id="@+id/separator"
    android:layout_width="1dp"
    android:layout_height="match_parent"
    android:layout_alignParentBottom="true"
    android:layout_toEndOf="@id/rows"
    android:background="@color/border_grey" />

<LinearLayout
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:gravity="center"
    android:orientation="vertical"
    android:paddingLeft="3dp" >

    <LinearLayout
        android:id="@+id/checkBox_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:paddingLeft="3dp" >

        <TextView
            android:id="@+id/checkbox_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="cancelar?" />

        <CheckBox
            android:id="@+id/checkBox_state"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@android:drawable/checkbox_off_background"
            android:focusable="false"
            android:focusableInTouchMode="false" />
    </LinearLayout>
</LinearLayout>

Answer 2

The issue is that the separator do not have an actual "area" specified to draw, just by aligning bottom wouldn't specify an start and stop point, if you had two elements to say, below and above of them it would draw as you expect, other option would be using the "root layout" as LinearLayout orientation Horizontal, and set first your rows, then the separator using this code:

<View
    android:layout_width="1dp"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:background="#FFFF"/>

And then the checkbox.

That should do the trick.

Hope this helps.

Regards!