Android ViewFlipper with translation animation - not working properly

Question

I want to display banner(images moving in x direction) in my application. For that i am using ViewFlipper with Translation animation. Please find my below code..

my layout: banner.xml

<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" >
        <ViewFlipper
                android:id="@+id/banner_image"
                android:layout_width="match_parent"
                android:layout_height="258dp" />
</RelativeLayout>

In animation: in_from_right.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false" >

  <translate
    android:duration="3000"
    android:fromXDelta="100%"
    android:fromYDelta="0%"
    android:toXDelta="0%"
    android:toYDelta="0%" />

</set>

Out Animation: out_to_left.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="3000"/>
</set>

My Java Code

public class BannerView extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.banner);
    
    ViewFlipper myViewFlipper = (ViewFlipper) findViewById(R.id.banner_image);
    
    //Setting first image in viewFlipper
    ImageView imageView1 = new ImageView(HomeView.this);
    imageView1.setImageDrawable(getResources().getDrawable(R.drawable.img1));
    myViewFlipper.addView(imageView1);

    //Setting second image in viewFlipper
    ImageView imageView2 = new ImageView(HomeView.this);
    imageView2.setImageDrawable(getResources().getDrawable(R.drawable.img2));
    myViewFlipper.addView(imageView2);
    myViewFlipper.setAutoStart(true);

    //Setting in and out animation
    myViewFlipper.setInAnimation(HomeView.this,R.anim.in_from_right);
    myViewFlipper.setOutAnimation(HomeView.this,R.anim.out_to_left);

    //Starting the view filpper to rotate
    myViewFlipper.startFlipping();
}
}

Here my problem is,

When i set the duration for in and out animation as "5000", ViewFilpper's behavior is changing like the below,

Image start to move slowly and ending quickly.

I dont know where i am missing. I want to slow down the speed. Please help me resolve the issue.

Answer 1

Thanks for your reply. I found the solution for my problem. Please find my answer below.

I have changed my interpolator in xml as below:

 android:interpolator="@android:anim/decelerate_interpolator"

And then i used android:flipInterval="5000" in my viewflipper solved my problem.

Answer 2

Update: I whipped up some sample code and there is a big stutter halfway through as if the 2nd view is forcibly moved to catch up to the 1st view. After much trial and error I found that setting android:flipInterval="5000" in the viewflipper xml properties fixed it. I can only assume that the default flipInterval is shorter than 5000 and hence the issue.

 <ViewFlipper
        android:id="@+id/viewflipper"
        android:layout_width="match_parent"
        android:layout_height="258dp"
        android:flipInterval="5000" >

If you still find the animation not smooth enough:

Put this in your xml for the translate animation:

android:interpolator="@android:anim/linear_interpolator"

And then

android:startOffset="1000" 

to slide_out_to_left so it waits a bit before continuing.