Creating animation on ImageView while changing image resource

Question

I have only one ImageView in my layout and I am changing its resource when a gasture event detected. I just want to show an animation while changing resource of ImageView. Can I use ViewFlipper with one ImageView?

Answer 1

For a single imageview you can use this helper function:

public static void ImageViewAnimatedChange(Context c, final ImageView v, final Bitmap new_image) {     final Animation anim_out = AnimationUtils.loadAnimation(c, android.R.anim.fade_out);      final Animation anim_in  = AnimationUtils.loadAnimation(c, android.R.anim.fade_in);      anim_out.setAnimationListener(new AnimationListener()     {         @Override public void onAnimationStart(Animation animation) {}         @Override public void onAnimationRepeat(Animation animation) {}         @Override public void onAnimationEnd(Animation animation)         {             v.setImageBitmap(new_image);              anim_in.setAnimationListener(new AnimationListener() {                 @Override public void onAnimationStart(Animation animation) {}                 @Override public void onAnimationRepeat(Animation animation) {}                 @Override public void onAnimationEnd(Animation animation) {}             });             v.startAnimation(anim_in);         }     });     v.startAnimation(anim_out); } 

Answer 2

Here's an example using ImageSwitcher like @Konstantin Burov suggested:

Add this ImageSwitcher element to your xml layout:

<ImageSwitcher    android:id="@+id/slide_trans_imageswitcher"    android:layout_width="match_parent"    android:layout_height="wrap_content"> </ImageSwitcher> 

Create in and out animations in res/anim/:

Out animation:

//left_to_right_out.xml <?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android"      android:shareInterpolator="false">     <translate android:fromXDelta="0%" android:toXDelta="100%"                android:fromYDelta="0%" android:toYDelta="0%"                android:duration="700"/> </set> 

And in animation:

//left_to_right_in.xml <?xml version="1.0" encoding="utf-8"?> <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> 

Initialize them in your code:

        Animation in  = AnimationUtils.loadAnimation(this, R.anim.left_to_right_in);         Animation out = AnimationUtils.loadAnimation(this, R.anim.left_to_right_out); 

Initialize your ImageSwitcher:

private ImageSwitcher imageSwitcher; imageSwitcher = (ImageSwitcher)findViewById(R.id.slide_trans_imageswitcher); 

Attach the animations to it:

imageSwitcher.setInAnimation(in); imageSwitcher.setOutAnimation(out); 

Now everytime you set an image resource for imageSwitcher, it will switch in a slide animation.

---

For example we can change the image every X seconds:

private int animationCounter = 1; private Handler imageSwitcherHandler; imageSwitcherHandler = new Handler(Looper.getMainLooper()); imageSwitcherHandler.post(new Runnable() {     @Override     public void run() {         switch (animationCounter++) {             case 1:                 imageSwitcher.setImageResource(R.drawable.image1);                 break;             case 2:                 imageSwitcher.setImageResource(R.drawable.image2);                 break;             case 3:                 imageSwitcher.setImageResource(R.drawable.image3);                 break;         }         animationCounter %= 4;         if(animationCounter == 0 ) animationCounter = 1;          imageSwitcherHandler.postDelayed(this, 3000);     } });