CODEWITHSUNDEEP
androidanimationviewandroid-animationalpha
Can Poyrazoğlu
Can Poyrazoğlu

Reputation: 34840

Android doesn't animate alpha if it's initially zero

I am trying to animate alpha of an Android view (two animations, both fade in and fade out). It all works fine if the view's alpha is initially 1, by default. However, I want that view to be transparent initially, hence I've set it's alpha to zero:

indicatorContainer.setAlpha(0);

Now, the animations won't work. It will never become visible. If I comment out that line, the view is initially displayed (which I don't want), but my animations works fine when I invoke them. I though it's something trivial but apparently it's not. What am I doing wrong?

UPDATE: I've also tried a floating point 0f instead of integer 0 after reading some API changes involving the setAlpha method, thinking that my call may be calling the incorrect overload, but nothing changed.

Upvotes: 22

Views: 12644

Answers (5)

Scott Barbour
Scott Barbour

Reputation: 474

This might be irrelevant to the OP but I thought I'd share it regardless as it might help someone out in the future.

Please be aware that if you're initial animation combines animate().alpha(0.0f) with a manipulation of the View's Y or X-axis translation (e.g. animate().translationYBy(500) you have to reset this property before fading back in (using animate().alpha(1.0f).

I came across this SO post thinking that setting alpha back to 1.0f was failing when in actual fact it was still working as it should, but the animation was occurring off screen because I hadn't reset my Y-Axis translation (Homer Simpson *doh* moment).

Handily, to easily resolve this issue, you can add a AnimatorEndListener to your animation for when it finishes (as @Nikhil Verma mentioned above) where you can add a single line of code to reset the X/Y-axis translation.

In the scenario I faced I wanted the animation to float down and fade out so adjusted the Y-axis & alpha accordingly. After it had floated and faded I set a Listener to reset the Y axis translation like so:

 loadingMask.animate().translationYBy(500); //starts animation by moving it down the screen
        loadingMask.animate().alpha(0.0f) //fades out
        .setDuration(1500) //over 1.5s
        .setListener(new AnimatorEndListener() { //when animation completes
            @Override
            public void onAnimationEnd(Animator animation) {
                loadingMask.setTranslationY(0); //reset the y axis translation
            }
        });

Now, when I want the animation to repeat again, I can set the alpha of my View to 1.0f and it works as intended.

Upvotes: 1

Gene Bo
Gene Bo

Reputation: 12103

Here's how I was able to kinda solve for this - not particularly elegant, but manageable:

  1. Set the view to the initial alpha you want 0.0f or otherwise.

  2. When the event occurs where you need the view to have more (or less) visibility/alpha - eg, right before you start an animation - at that point you can update the alpha and then run the animation on the view

I'm still getting some choppiness when the animation repeats, but this approach might work for scenarios where the animation is not repeated

Upvotes: 0

Ashlesha Sharma
Ashlesha Sharma

Reputation: 949

One can try following, a more simple way:

view.animate().alpha(1).setDuration(ANIMATION_DURATION);

Upvotes: 1

ypresto
ypresto

Reputation: 1045

I faced same issue where indicatorContainer is ImageButton. Below code fixes this very, very annoying issue...

// XXX: Does not work if just 0. It calls `ImageView#setAlpha(int)` deprecated method.
indicatorContainer.setAlpha(0.0f);
ViewCompat.animate(indicatorContainer).alpha(1);

Upvotes: 3

Nikhil Verma
Nikhil Verma

Reputation: 1730

Try something like this: 

  mRelativeLayout.setAlpha(0f);
    mRelativeLayout.animate().alpha(1f).setDuration(500).setListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator animation) {
            super.onAnimationEnd(animation);
            mRelativeLayout.setVisibility(View.VISIBLE);
            //OR
            mRelativeLayout.setAlpha(1f);
        }
    });

Upvotes: 13

Related Questions