1

I am trying to add an animation to my app that will hide or show a menu on single tap. Basically something similar to Pulse news readers article view. I am able to animate the menu container. However,the menu does not slide down at the same time as the main container is creating space for the menu holder. I would like to know how to fix this issue.

Here is my animation code:

if(homeTabBar.getVisibility() == View.GONE){
    homeTabBar.setVisibility(View.VISIBLE);
    final Animation tabBlockHolderAnimation = AnimationUtils.loadAnimation(ArticleActivity.this, R.anim.tab_down);

    tabBlockHolderAnimation.setFillAfter(true);
    homeTabBar.startAnimation(tabBlockHolderAnimation);


}else{

    final Animation tabBlockHolderAnimation = AnimationUtils.loadAnimation(ArticleActivity.this, R.anim.tab_up);
    tabBlockHolderAnimation.setAnimationListener(new AnimationListener(){



    @Override
    public void onAnimationEnd(Animation animation) {

    // TODO Auto-generated method stub

    homeTabBar.setVisibility(View.GONE);
   }
});

tabBlockHolderAnimation.setFillAfter(true);

homeTabBar.startAnimation(tabBlockHolderAnimation);
Switch
  • 131
  • 2
  • 4
  • 13

1 Answers1

13
public void toggle() {
    TranslateAnimation anim = null;

    isOpen = !isOpen;

    if (isOpen) {
        layoutRoot.setVisibility(View.VISIBLE);
        anim = new TranslateAnimation(0.0f, 0.0f, layoutRoot.getHeight(), 0.0f);
    } else {
        anim = new TranslateAnimation(0.0f, 0.0f, 0.0f, layoutRoot.getHeight());
        anim.setAnimationListener(collapseListener);
    }

    anim.setDuration(300);
    anim.setInterpolator(new AccelerateInterpolator(1.0f));
    layoutRoot.startAnimation(anim);
}

Animation.AnimationListener collapseListener = new Animation.AnimationListener() {
    public void onAnimationEnd(Animation animation) {
        layoutRoot.setVisibility(View.GONE);
    }

    @Override
    public void onAnimationRepeat(Animation animation) {
    }

    @Override
    public void onAnimationStart(Animation animation) {
    }
};
mobiledev Alex
  • 2,228
  • 2
  • 28
  • 30
  • 3
    I get the same result as my implementation. – Switch Aug 23 '11 at 05:27
  • 1
    Hey, very nice code. I use it. I have only one problem. layoutRoot is blinks when I collapse and animation listener call View.GONE. When I don't use View.GONE but anim.fillAfter(true) it doesn't blink but component's position doesn't change with animation. Don't you have this problem? – Martin Vandzura Aug 10 '12 at 09:35
  • the layout blinks because it adds the view to the Layout, you can use View.INVISIBLE but the drawback is it will take up the space in your existing layout and so it can look bad with blank space. – PravinDodia Sep 09 '12 at 21:53