Android animation's first frame is applied too early on ImageView
- by Robert
I have the following View setup in one of my Activities:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/photoLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:id="@+id/photoImageView"
android:src="@drawable/backyardPhoto"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:scaleType="centerInside"
android:padding="45dip"
>
</ImageView>
</LinearLayout>
Without an animation set, this displays just fine. However I want to display a very simple animation. So in my Activity's onStart override, I have the following:
@Override
public void onStart() {
super.onStart();
mPhotoImageView = (ImageView) findViewById(R.id.photoImageView);
float offset = -25;
int top = mPhotoImageView.getTop();
TranslateAnimation anim1 = new TranslateAnimation(
Animation.ABSOLUTE, 0, Animation.ABSOLUTE, 0,
Animation.ABSOLUTE, top, Animation.ABSOLUTE, offset);
anim1.setInterpolator(new AnticipateInterpolator());
anim1.setDuration(1500);
anim1.setStartOffset(5000);
TranslateAnimation anim2 = new TranslateAnimation(
Animation.ABSOLUTE, 0, Animation.ABSOLUTE, 0,
Animation.ABSOLUTE, offset, Animation.ABSOLUTE, top);
anim2.setInterpolator(new BounceInterpolator());
anim2.setDuration(3500);
anim2.setStartOffset(6500);
mBouncingAnimation = new AnimationSet(false);
mBouncingAnimation.addAnimation(anim1);
mBouncingAnimation.addAnimation(anim2);
mPhotoImageView.setAnimation(mBouncingAnimation);
}
The problem is that when the Activity displays for the first time, the initial position of the photo is not in the center of the screen with padding around. It seems like the first frame of the animation is loaded already. Only after the animation is completed, does the photoImageView "snap" back to the intended location.
I've looked and looked and could not find how to avoid this problem. I want the photoImageView to start in the center of the screen, and then the animation to happen, and return it to the center of the screen. The animation should happen by itself without interaction from the user.