How to bring ImageView in front of Button in android 5?

Question

In android versions previous to lolipop, the following code works and an image is in front of the button. But in android 5 the imageview is put behind the button.

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

<Button
    android:id="@+id/button"
    android:layout_width="210sp"
    android:layout_height="210sp"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:background="@drawable/round_button"
    android:drawablePadding="10dip"
    android:gravity="center_vertical|center_horizontal" />


<ImageView
    android:id="@+id/imageView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:contentDescription="@string/torch"
    android:src="?attr/imageview" />

 </RelativeLayout>

Answer 1

The problem appears Android 5.0's elevation property. Apparently, the RelativeLayout Z-axis ordering is tied into elevation . If both widgets have the same elevation , the RelativeLayout will determine the Z-axis order -- you can see that if you were to switch your layout to be both Button widgets, for example. However, if one widget ( Button ) has an elevation , and another widget ( ImageView ) does not, the elevation will take precedence.

You can remove the Button elevation via android:stateListAnimator="@null" or by defining your own custom animator . Or, you can add some elevation to your ImageView to get it to be higher on the Z axis than is the Button .

Answer 2

Button elevation and translationZ values are defined in framework as below:

<!-- Elevation when button is pressed -->
<dimen name="button_elevation_material">1dp</dimen>
<!-- Z translation to apply when button is pressed -->
<dimen name="button_pressed_z_material">2dp</dimen>

Source

Like CommonsWare explained, set the translationZ of ImageView higher than Button value will give the result as expected.