Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android Chain Animations

Tags:

android

I am attempting to "chain" two animations together, so when one completes, the other begins. This is working except for one issue. After the first animation is complete, it moves back to it's original position. I am setting fill after to true. What else am I missing?

Here is the code I am using. Note, this is in a class that is extending LinearLayout.

// FIRST ANIMATION
mAnimation = new TranslateAnimation(0, PANEL_END_X, 0, 0);
mAnimation.setDuration(PANEL_TRANSITION_TIME);
mAnimation.setFillAfter(true);

mAnimation.setAnimationListener(new Animation.AnimationListener() {
    public void onAnimationEnd(Animation animation) {

        // FIRST ANIMATION COMPLETE, CALL THE SECOND ANIMATION
        startAnimation(mAlphaAnimation);
    }
});

// SECOND ANIMATION     
mAlphaAnimation = new AlphaAnimation(1.0f, 0.0f);
mAlphaAnimation.setDuration(PANEL_ALPHA_TRANSITION_TIME);
mAlphaAnimation.setFillAfter(true);

Solution:

The only way I could get this to work to my satisfaction was to use an AnimationSet, but set the starting offset of the second animation to start offset + duration of the first animation, plus a little padding. They did not have to be completely exact in my case.

I tried playing with various values as CommonsWare suggested, but I would always get some type of "snapping" effect where the values would revert to their original value before taking the new one.

like image 873
Steve Avatar asked Apr 10 '12 15:04

Steve


People also ask

Is animation possible in Android?

On Android 4.4 (API level 19) and higher, you can use the transition framework to create animations when you swap the layout within the current activity or fragment. All you need to do is specify the starting and ending layout, and what type of animation you want to use.

What are animations on Android phones?

Animation is the process of adding a motion effect to any view, image, or text. With the help of an animation, you can add motion or can change the shape of a specific view. Animation in Android is generally used to give your UI a rich look and feel.

What is twined animation in Android?

Tween animations are a specific type of animation related to rotation, sliding, and movement of an object. This article explains some common Tween animations. Now we move to the code part of this article. In this article, we will use a single Activity_main.

What is Property animation in Android?

A property animation changes a property's (a field in an object) value over a specified length of time. To animate something, you specify the object property that you want to animate, such as an object's position on the screen, how long you want to animate it for, and what values you want to animate between.


2 Answers

I found what I believe to be the ideal solution in API level 11 and above using the AnimationSet.Builder class.

The Builder object is a utility class to facilitate adding animations to a AnimatorSet along with the relationships between the various animations. The intention of the Builder methods, along with the play() method of AnimatorSet is to make it possible to express the dependency relationships of animations in a natural way. Developers can also use the playTogether() and playSequentially() methods if these suit the need, but it might be easier in some situations to express the AnimatorSet of animations in pairs

For example, this sets up a AnimatorSet to play anim1 and anim2 at the same time, anim3 to play when anim2 finishes, and anim4 to play when anim3 finishes:

AnimatorSet s = new AnimatorSet();
s.play(anim1).with(anim2);
s.play(anim2).before(anim3);
s.play(anim4).after(anim3);
like image 171
Steve Avatar answered Sep 19 '22 19:09

Steve


After the first animation is complete, it moves back to it's original position. I am setting fill after to true. What else am I missing?

Animations are transient effects. If you want the effects to be permanent, you have to do that yourself in onAnimationEnd(). In the case of a TranslateAnimation, you need to change the LayoutParams or something of the affected widget to permanently keep it in its end position. Or, if you are translating it off the screen, set the visibility to View.GONE.

like image 33
CommonsWare Avatar answered Sep 21 '22 19:09

CommonsWare