Android Animation Flicker

Question

I've been trawling through as many threads on this topic that I can find on the flicker that arises in Android 2.2 when dealing with AnimationListeners, but I can't quite solve my issue.

What I've got is a LinearLayout 'popover' that the user touches to move down about 100 pixels, and touches again to move it back up. I've finally got it working on the first part without any flicker (thanks to the suggestion to call clearAnimation() on the view being animated), but when doing the opposite (ie, moving the view back up), there's a flicker at the start. I can't really call clearAnimation() in the onAnimationStart() method as it won't animate!

Of course, all animation works perfectly if I used setFillAfter() without any animation listener, but then the view's touch area won't move (because the view itself hasn't "actually" moved).

Any help would be greatly appreciated.

this.popoverTab.setOnClickListener(new OnClickListener() {
    public void onClick(View v) {
        popoverTab.setClickable(false);
        popoverTab.setFocusable(false);
        if (popoverHidden) {
            Log.d(TAG, "About to show popover");
            // the popover is currently hidden, show it.
            TranslateAnimation animation = new TranslateAnimation(0, 0, 100, 0);
            animation.setDuration(700);
            animation.setFillBefore(true);
            animation.setAnimationListener(new AnimationListener() {
                public void onAnimationEnd(Animation animation) {

                }

                public void onAnimationRepeat(Animation animation) {

                }

                public void onAnimationStart(Animation animation) {
                    footer.layout(footer.getLeft(), (footer.getTop() - 100), footer.getRight(), footer.getBottom());
                }
            });
            footer.startAnimation(animation);
        } else {
            Log.d(TAG, "About to hide popover");
            // the popover is showing, hide it.
            TranslateAnimation animation = new TranslateAnimation(0, 0, 0, 100);
            animation.setDuration(700);
            animation.setFillAfter(true);
            animation.setAnimationListener(new AnimationListener() {
                public void onAnimationEnd(Animation animation) {
                    footer.clearAnimation();
                    footer.layout(footer.getLeft(), (footer.getTop() + 100), footer.getRight(), footer.getBottom());
                }

                public void onAnimationRepeat(Animation animation) {

                }

                public void onAnimationStart(Animation animation) {

                }
            });
            footer.startAnimation(animation);
        }
        // invert.
        popoverHidden = !popoverHidden;
        popoverTab.setClickable(true);
        popoverTab.setFocusable(true);
    }

});

Answer 1

I had the same problem and after few days I found the solution ... thanx to:

http://www.mail-archive.com/[email protected]/msg67535.html

I figured out a solution to this problem. The clue came from the fact that when showing the view, everything worked fine. Apparently, when the animation is running, the update that would be forced by the show happens in the background and doesn't cause the flicker. Adding a short animation to the back end of the onAnimationEnd() when we are hiding the view makes the flicker go away.

Here is the new onAndimationEnd() in the working code

  public void onAnimationEnd(Animation animation) {
            animation = new TranslateAnimation(0.0f, 0.0f, 0.0f, 0.0f);
            animation.setDuration(1);
            mPlayer0Panel.startAnimation(animation);
   }