How to partially overlap views within a relative layout

Question

I'm trying overlap the pink button over the green view, but my "z-offset" is the opposite of what I want.

Is the effect I'm looking for only achievable with frame layouts?

<include layout="@layout/button"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:layout_above="@+id/view"
    android:layout_alignParentRight="true"
    android:layout_marginRight="15dp"
    android:layout_marginBottom="-50dp"/>

<include layout="@layout/view"
    android:id="@id/view"
    android:layout_height="100dp"
    android:layout_width="match_parent"
    android:layout_alignParentBottom="true"/>

Answer 1

View s are drawn in the order they're listed in your layout, with the first one listed being the farthest away on the z-axis, the last being the closest. If you want the button on top, list it last in the layout.

<include layout="@layout/view"
    android:id="@id/view"
    android:layout_height="100dp"
    android:layout_width="match_parent"
    android:layout_alignParentBottom="true"/>

<include layout="@layout/button"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:layout_above="@+id/view"
    android:layout_alignParentRight="true"
    android:layout_marginRight="15dp"
    android:layout_marginBottom="-50dp"/>

Answer 2

In relative layout, the view you add last is always on top of the other.So you just have to swap your views

First @layout/view then @layout/button

<include layout="@layout/view"
    android:id="@id/view"
    android:layout_height="100dp"
    android:layout_width="match_parent"
    android:layout_alignParentBottom="true"/>

<include layout="@layout/button"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:layout_above="@+id/view"
    android:layout_alignParentRight="true"
    android:layout_marginRight="15dp"
    android:layout_marginBottom="-50dp"/>