How to animate Image View Behind Other Image View In Android

Question

I have two images(plus and multiply ones) show below.When 'plus' image clicked, 'multiply' image is starting translate animation from the same position of the 'plus' image and going to the end of screen shown in attached last image.My problem is that 'multiply' image is animating in front of the 'plus' image shown in the attached second image.I want to animate it behind the 'plus' image not in front.

My xml for the image layouts :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent">


<LinearLayout
    android:id="@+id/parent"
    android:layout_width="match_parent"
    android:layout_height="40dp"
    android:layout_marginTop="100dp"
    android:clipChildren="false"
    android:clipToPadding="false">

    <ImageView
        android:id="@+id/plus"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:clipChildren="true"
        android:clipToPadding="true"
        android:scaleType="centerInside"
        android:src="@drawable/plus" />


    <ImageView
        android:id="@+id/multiply"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:clickable="true"
        android:scaleType="centerInside" />

</LinearLayout>
</LinearLayout> 

Answer 1

1. Change the xml layout sequence:

   • For RelativeLayout, the first view you wrote in xml will be drawn firstly.
   • So you need to write multiply imageview first then plus imageview.

2. If you want to change the z-order dynamically, you can use view.bringToFront() API.

   • See: https://developer.android.com/reference/android/view/View.html#bringToFront()

   • or view.setZ(float) from Android 5.0 (API 21) https://developer.android.com/reference/android/view/View.html#setZ(float)

Answer 2

just use Relative layout and change a little bit ... like this

<RelativeLayout
    android:id="@+id/parent"
    android:layout_width="match_parent"
    android:layout_height="40dp"
    android:layout_marginTop="100dp"
    android:clipChildren="false"
    android:clipToPadding="false">

    <ImageView
        android:id="@+id/multiply"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:clickable="true"
        android:src="@android:drawable/btn_star_big_on"
        android:scaleType="centerInside" />

    <ImageView
        android:id="@+id/plus"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:clipChildren="true"
        android:clipToPadding="true"
        android:scaleType="centerInside"
        android:src="@android:drawable/btn_star_big_off" />

</RelativeLayout>