Swipe animation from left to right infinite time

Question

I have an imageview in my relativelayout,my requirement is:

i want to swipe the imageview from left to right and fadeout, again from left,fadein swipe left to right and fade out

 ----                           ----
|    |   swipe left to right   |    |  Fade out here
|    |   --> ---> --->         |    |
|    |                         |    |
 ----                           ----

Fade in again from left and Repeat:

 ----                           ----
|    |   swipe left to right   |    |  Fade out here
|    |   --> ---> --->         |    |
|    |                         |    |
 ----                           ----

this question doesn't match any other question on stack,so don't try to flag it.

what i know is, i can use this:

This is for left to right animation:

<set xmlns:android="http://schemas.android.com/apk/res/android"
     android:shareInterpolator="false">
  <translate android:fromXDelta="-100%" android:toXDelta="0%"
             android:fromYDelta="0%" android:toYDelta="0%"
             android:duration="700"/>
</set>

and for fade in and fade out effect:

fadein.xml

    <?xml version="1.0" encoding="UTF-8"?>
       <set xmlns:android="http://schemas.android.com/apk/res/android">
         <alpha android:fromAlpha="0.0" android:toAlpha="1.0" 
          android:interpolator="@android:anim/accelerate_interpolator" 
          android:duration="2000"/>
     </set>
fadeout.xml

    <?xml version="1.0" encoding="UTF-8"?>
       <set xmlns:android="http://schemas.android.com/apk/res/android">
         <alpha android:fromAlpha="1.0" android:toAlpha="0.0" 
          android:interpolator="@android:anim/accelerate_interpolator" 
          android:duration="2000"/>
     </set>

but the problem is how to relocate the imageview back at same position after fading it out from right to come back at left again and repeat.

Answer 1

You could add an Animation Listener to both animations.

At onAnimationEnd() of the fade-out animation, set the visibility of the ImageView to GONE. Then, start the fade-in animation and on onAnimationStart() for that one set the visibility of the ImageView to VISIBLE.

You don't need to set the position of the image at all, just let the animations do their thing.

EDIT:

Add a translate component to your animations in addition to the fade:

fadein.xml

<?xml version="1.0" encoding="UTF-8"?>
   <set xmlns:android="http://schemas.android.com/apk/res/android" 
      android:interpolator="@android:anim/accelerate_interpolator">
     <alpha android:fromAlpha="0.0" android:toAlpha="1.0" 
      android:duration="2000" />
     <translate android:fromXDelta="-100%" android:toXDelta="0%"
      android:duration="700" />
 </set>

fadeout.xml

<?xml version="1.0" encoding="UTF-8"?>
   <set xmlns:android="http://schemas.android.com/apk/res/android" 
      android:interpolator="@android:anim/accelerate_interpolator" >
     <alpha android:fromAlpha="1.0" android:toAlpha="0.0" 
      android:duration="2000"/>
     <translate android:fromXDelta="0%" android:toXDelta="100%" 
      android:duration="700"/>
 </set>