Setting TextView on top of ImageView - Android Layouts

Question

I'm building an android app and I am trying to set my layout without any success. I searched everywhere and I can't seem to find any solution.

I need to place 2 text views on top of an image. the first text view need to be about 10dp above the vertical center of the image. and the second text view should be below text view 1.

here's my code so far, though it doesn't work. can anyone here tell me what I'm missing or what am I doing wrong?

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/background"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.boromedia.parve.MainActivity" >

<RelativeLayout
    android:id="@+id/blueOvalLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:layout_marginBottom="20dp"
    android:layout_marginTop="75sp" >

    <ImageView
        android:id="@+id/blueOval"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:scaleType="centerInside"
        android:src="@drawable/blueoval" />

    <ImageView
        android:id="@+id/greenOval"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:scaleType="centerInside"
        android:src="@drawable/greenoval_small"
        android:visibility="gone" />

    <TextView
        android:id="@+id/greenOvalText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="65dp"
        android:gravity="center|center_vertical"
        android:text="@string/counter_activity_oval_done"
        android:textColor="#fff"
        android:textSize="28sp"
        android:visibility="gone" />

    <TextView
        android:id="@+id/blueOvalText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:text="@string/counter_activity_oval_text1"
        android:textColor="#fff"
        android:textSize="18sp" />

    <TextView
        android:id="@+id/blueOvalTimer"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/blueOvalText"
        android:layout_centerHorizontal="true"
        android:text="@string/counter_default"
        android:textColor="#fff"
        android:textSize="25sp" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:orientation="vertical" >
    </LinearLayout>

</RelativeLayout>

<TextView
    android:id="@+id/head_title"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_marginTop="15dp"
    android:gravity="center_vertical|center"
    android:text="@string/main_title"
    android:textSize="30sp" />

<Button
    android:id="@+id/stopButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_centerHorizontal="true"
    android:background="@android:color/transparent"
    android:text="@string/counter_activity_stop_button"
    android:textSize="20sp" />

Answer 1

Try this workaround: Change your textView for:

   <RelativeLayout
        android:id="@+id/wrapper"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_marginBottom="10dp" >

        <TextView
            android:id="@+id/blueOvalText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/counter_activity_oval_text1"
            android:textColor="#fff"
            android:textSize="18sp" />
    </RelativeLayout>

This is a wrapper for setting the margin of 10dp. Don't forget that your second textview should be below the wrapper, not below the textview!

I hope this would help;)

Answer 2

You can put your 2 TextView in a LinearLayout which will be centered in the parent :

<LinearLayout
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:orientation="vertical"
   android:layout_centerInParent="true" >

<TextView
    android:id="@+id/blueOvalText"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:text="@string/counter_activity_oval_text1"
    android:textColor="#fff"
    android:textSize="18sp" />

<TextView
    android:id="@+id/blueOvalTimer"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/blueOvalText"
    android:layout_centerHorizontal="true"
    android:text="@string/counter_default"
    android:textColor="#fff"
    android:textSize="25sp" />
</LinearLayout>