Translate animation created programmatically has incorrect duration and offset

Question

Here's what needs to be done:

I have a top bar with 3 buttons. Two on the right can be pressed and nothing is interesting about them. The left one replaces all three buttons with other three. With animation: middle and right (new ones) buttons slide out from left button's position to their corresponding places, while old buttons fade out. The left button gets replaced without movement: old one fades out, new one fades in.

How this was done:

final Animation fadeOut, fadeIn;
Animation fadeOutWithListener;
fadeIn = AnimationUtils.loadAnimation(this, R.anim.camera_top_bar_fade_in);
fadeOut = AnimationUtils.loadAnimation(this, R.anim.camera_top_bar_fade_out);
final TranslateAnimation slideAnim;

slideAnim = new TranslateAnimation(
    Animation.RELATIVE_TO_PARENT, -flashAutoBtn.getLeft(),
    Animation.RELATIVE_TO_SELF, 0,
    Animation.RELATIVE_TO_SELF, 0,
    Animation.RELATIVE_TO_SELF, 0);
slideAnim.setDuration(1000L);
slideAnim.setStartOffset(0);
fadeOutWithListener = AnimationUtils.loadAnimation(this, R.anim.camera_top_bar_fade_out);
fadeOutWithListener.setAnimationListener(new Animation.AnimationListener() {
    @Override
    public void onAnimationStart(Animation animation) {
        flashAutoBtn.startAnimation(fadeIn);
        flashOnBtn.startAnimation(slideAnim);
        flashOffBtn.startAnimation(slideAnim);
    }
    @Override
    public void onAnimationEnd(Animation animation) {
        flashBtn.setVisibility(View.INVISIBLE);
        gridBtn.setVisibility(View.INVISIBLE);
        switchCameraSideBtn.setVisibility(View.INVISIBLE);
        flashAutoBtn.setVisibility(View.VISIBLE);
        flashOffBtn.setVisibility(View.VISIBLE);
        flashOnBtn.setVisibility(View.VISIBLE);
    }
    @Override
    public void onAnimationRepeat(Animation animation) { }
});

flashBtn.startAnimation(fadeOutWithListener);
gridBtn.startAnimation(fadeOut);
switchCameraSideBtn.startAnimation(fadeOut);

How it actually works: fadeIn/Out animations are ok - they defined in xml, have duration set to 1000 and last 1 second. With no offset.

Two translation animations work incorrectly: first, they don't start at the same time with that fadeOutWithListener animation. Instead, they wait for like 100 or 200 ms then quickly (with duration of 100 or 200 ms) flash their transformation (coordinates are correct btw) and disappear. After fadeOutWithListener is done - listener's onAnimationEnd fires up and buttons become visible.

This is a final try - before I did without listener - just consecutive calls of startAnimation and setVisibility - was the same identical behavior.

see how you can use Scenes with TransitionManager here: pastebin.com/u4TfVB21, when working with 4+ but pre Kitkat devices use backport library: github.com/guerwan/TransitionsBackport — pskink

Adem Adem · Accepted Answer · 2014-11-27T09:30:30

if you apply two animation to same ui at same time, as I remember, latest one will be performed.

to make multiple animation at same time, you need to use AnimationSet

AnimationSet set = new AnimationSet(false);
set.addAnimation(fadeOut);
set.addAnimation(slideOut);
view.setAnimation(set);
set.start();

Translate animation created programmatically has incorrect duration and offset

1 Answers