Android: Placing ImageView on overlap between layouts

Daiwik Daarun picture Daiwik Daarun · Aug 4, 2014 · Viewed 17.5k times · Source

I am trying to place an ImageView on the overlap point between two layouts. In the picture below, my goal would be to place the ImageView where the white square is. NOTE: The overlap point will not necessarily be centered vertically as shown below

enter image description here

Is this possible in XML?

My only guess right now is to do this in the actual code itself.

EDIT 8/3/2016: For reference, I think ConstraintLayouts may be the best future solution for these types of problems http://tools.android.com/tech-docs/layout-editor

Answer

paul picture paul · Aug 5, 2014

This will do what you want, with either an image of fixed height, or calculated programatically.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <RelativeLayout
        android:id="@+id/layoutTop"
        android:layout_width="match_parent"
        android:layout_height="200dp" >
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/layoutBottom"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_alignParentBottom="true"
        android:layout_below="@id/layoutTop" >
    </RelativeLayout>

    <ImageView
        android:id="@+id/overlapImage"
        android:layout_width="wrap_content"
        android:layout_height="40dp"
        android:layout_above="@id/layoutBottom"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="-20dp" <!-- This should be always half the height, can also be calculated and added programtically -->
        android:adjustViewBounds="true"
        android:src="@drawable/ic_launcher" />

</RelativeLayout>