Android RelativeLayout: vertical align not apply

Question

I have problem to apply vertical align for the follow layout and i don't know why. If someone can help me, please reply to this post. Thank you!

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:ads="http://schemas.android.com/apk/res-auto"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp">

    <RelativeLayout android:id="@+id/ImgUp"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       android:background="@drawable/piggy" />

    <RelativeLayout android:id="@+id/MainActivity"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:background="@drawable/list_selector"
      android:layout_marginTop="10dp"
      android:layout_marginBottom="10dp"
      android:layout_below="@id/ImgUp" 
      android:layout_centerInParent="true">

      <TextView android:id="@+id/BarcodeOperation"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableLeft="@drawable/barcode"
        android:drawablePadding="5dp"
        android:text="@string/operation_barcode"
        android:gravity="center_vertical|center_horizontal"
        android:textSize="@dimen/large25"/>
    </RelativeLayout>

    <RelativeLayout android:id="@+id/ImgDown"
       android:layout_below="@id/MainActivity"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       android:background="@drawable/piggy" />

    <RelativeLayout
          android:layout_width="wrap_content"
          android:layout_height="wrap_content">

       <com.google.android.gms.ads.AdView
          android:id="@+id/adView" 
          android:layout_alignParentBottom="true"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          ads:adSize="BANNER"
          ads:adUnitId="@string/banner_ad_unit_id" >
      </com.google.android.gms.ads.AdView>

   </RelativeLayout>

</RelativeLayout>

What this looks like is here

and what I want it to look like is here

Can someone help me?

Answer 1

This is VERY EASY:

Set the central View as centerInParent = "true".
Then set one View above it and one below it.

And... no, really, too many layouts!
Use Views, instead, to favor performances.

I ended up with something like this:

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:ads="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp"
    >

    <!-- The "footer" (the ADs) -->
    <com.google.android.gms.ads.AdView
        android:id="@+id/adView"
        android:layout_alignParentBottom="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        ads:adSize="BANNER"
        ads:adUnitId="@string/banner_ad_unit_id"
    />

    <!-- The "central View" -->
    <TextView android:id="@+id/BarcodeOperation"
        android:background="@drawable/list_selector"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp"
        android:layout_centerInParent="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableLeft="@drawable/barcode"
        android:drawablePadding="5dp"
        android:text="@string/operation_barcode"
        android:gravity="center_vertical|center_horizontal"
        android:textSize="@dimen/large25"
    />

    <!-- The "upper View" -->
    <ImageView
        android:id="@+id/ImgUp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@id/BarcodeOperation"
        android:background="@drawable/piggy"
    />

    <!-- The "lower View" -->
    <ImageView
        android:id="@+id/ImgDown"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/BarcodeOperation"
        android:background="@drawable/piggy"
    />
</RelativeLayout>

Note that i also replaced the deprecated attribute fill_parent with its equivalent match_parent (it requires API Level 8+ as the minimum SDK version - well anything below Froyo is considered OBSOLETE and out of the current Market, as shown in the Dashboard).