View disappearing when inflated

Question

I have a custom ListActivity in which i have a custom ListAdapter that inflates a layout for each item in the list. In eclipse, in the visual editor the layout looks like this

This is made by the following code:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/largeFrame"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <RelativeLayout
        android:id="@+id/RelativeLayout1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginLeft="1dp"
        android:layout_marginRight="3dp"
        android:layout_marginTop="5dp"
        android:background="@color/mainBack"
        android:orientation="vertical" >


        <View
            android:id="@+id/imageView1"
            android:layout_width="5dp"
            android:layout_height="fill_parent"
            android:layout_alignParentLeft="false"
            android:layout_alignParentTop="false"
            android:layout_marginLeft="2dp"
            android:background="@android:color/darker_gray" />

        <TextView
            android:id="@+id/newtimeslot_class"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_marginLeft="4dp"
            android:layout_marginTop="10dp"
            android:layout_toRightOf="@+id/imageView1"
            android:text="Large Text"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textColor="@android:color/black" />

        <View
            android:id="@+id/imageView2"
            android:layout_width="wrap_content"
            android:layout_height="2dp"
            android:layout_alignRight="@+id/newtimeslot_class"
            android:layout_below="@+id/newtimeslot_class"
            android:layout_toRightOf="@+id/imageView1"
            android:background="@android:color/darker_gray" />

        <TextView
            android:id="@+id/newtimeslot_time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/newtimeslot_class"
            android:layout_alignParentRight="true"
            android:layout_marginRight="5dp"
            android:text="Medium Text"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="#646464" />

        <TextView
            android:id="@+id/newtimeslot_location"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_below="@+id/imageView2"
            android:layout_marginRight="5dp"
            android:text="Medium Text"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="#646464" />

        <TextView
            android:id="@+id/newtimeslot_comment"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_below="@+id/newtimeslot_location"
            android:layout_marginBottom="10dp"
            android:layout_marginRight="5dp"
            android:layout_marginTop="2dp"
            android:text="Medium Text"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="#646464" />
    </RelativeLayout>

</FrameLayout>

Unfortunately though, when i run this on an android device, the line to the left completely disappears. It instead looks like

I have just done the usual in terms on inflating it, and i only ever access the TextView objects. So i'm just wondering what could possibly be going on and if someone could help me out of this mess?

Cheers

Edit: The inflation code

@Override
public View newView(Context context, Cursor cursor, ViewGroup parent) {
    final View view = mInflater.inflate(R.layout.timeslotlayout_new, parent, false);

    return view;
}

Answer 1

I suspect the reference @android:color/darker_gray to be the problem.

It might be that on some devices, this value does not exist ?!? (it may be under another name for instance)

Try setting the background attribute to a COLOR value (instead of an android color reference) like this #00000 which represents black (or choose another custom color like this #A9A9A9 for DarkGray ) :

android:background="#A9A9A9"

/OR/

Create an XML file for most basic colors like done HERE, in this manner you are sure that the colors will not change among devices, and most of all, that they will exist on all devices for your application.

So if you do so (see the link), you can create a color like this (the name of the XML file does not matter at all) :

<?xml version="1.0" encoding="utf-8"?>
<resources>
   <color name="Black">#000000</color>
   <color name="DarkGray">#A9A9A9</color>
</resources>

And reference it in the following way :

android:background="@color/DarkGray"

---

Note : No matter if this solved your issue or not, I strongly advise you to follow this manner to be on the safe side.

Answer 2

Maybe you're missing to set this:

android:layout_alignParentLeft="false"

to this:

android:layout_alignParentLeft="true"

And, by the way, android:orientation="vertical" doesn't apply to a relative layout. It applies only to LinearLayout.

And to the newtimeslot_time TextView change the

android:layout_toRightOf="@+id/imageView1"

to

android:layout_toRightOf="@id/imageView1"

Hope it helps!

Cheers!