Android looks expand animation

Question

I am trying to edit this source to create a simple function that will work on all of my views.

@Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); RelativeLayout mLayout1 = (RelativeLayout) findViewById(R.id.layout1); RelativeLayout mLayoutToBeExpanded1 = (RelativeLayout) findViewById(R.id.layout_exp_1); addAction(mLayout, mLayoutToBeExpanded); RelativeLayout mLayout2 = (RelativeLayout) findViewById(R.id.layout2); RelativeLayout mLayoutToBeExpanded2 = (RelativeLayout) findViewById(R.id.layout_exp_2); addAction(mLayout2, mLayoutToBeExpanded2); RelativeLayout mLayout3 = (RelativeLayout) findViewById(R.id.layout3); RelativeLayout mLayoutToBeExpanded3 = (RelativeLayout) findViewById(R.id.layout_exp_3); addAction(mLayout3, mLayoutToBeExpanded3); } public void addAction(final View layout, final View summary) { summary.getViewTreeObserver().addOnPreDrawListener( new ViewTreeObserver.OnPreDrawListener() { @Override public boolean onPreDraw() { summary.getViewTreeObserver().removeOnPreDrawListener(this); summary.setVisibility(View.GONE); final int widthSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); final int heightSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); summary.measure(widthSpec, heightSpec); mAnimator = slideAnimator(0, summary.getMeasuredHeight(), summary); return true; } }); layout.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if (summary.getVisibility() == View.GONE) { expand(summary); } else { collapse(summary); } } }); } private void expand(View summary) { //set Visible summary.setVisibility(View.VISIBLE); /* Remove and used in preDrawListener final int widthSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); final int heightSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); mLinearLayout.measure(widthSpec, heightSpec); mAnimator = slideAnimator(0, mLinearLayout.getMeasuredHeight()); */ mAnimator.start(); } private void collapse(final View summary) { int finalHeight = summary.getHeight(); ValueAnimator mAnimator = slideAnimator(finalHeight, 0, summary); mAnimator.addListener(new Animator.AnimatorListener() { @Override public void onAnimationEnd(Animator animator) { //Height=0, but it set visibility to GONE summary.setVisibility(View.GONE); } @Override public void onAnimationStart(Animator animator) { } @Override public void onAnimationCancel(Animator animator) { } @Override public void onAnimationRepeat(Animator animator) { } }); mAnimator.start(); } private ValueAnimator slideAnimator(int start, int end, final View summary) { ValueAnimator animator = ValueAnimator.ofInt(start, end); animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator valueAnimator) { //Update Height int value = (Integer) valueAnimator.getAnimatedValue(); ViewGroup.LayoutParams layoutParams = summary.getLayoutParams(); layoutParams.height = value; summary.setLayoutParams(layoutParams); } }); return animator; } 

Problem: The first 2 layouts work only once. After the first extension -> crash, onClickFunction does not work. The 3rd layout works fine, I can expand / collapse it several times. Any solution?

Answer 1

I decided on my own, so this is a working solution for an extensible layout.

Using:

 addAction(YourLayout, LayoutToBeExpanded) 

Functions:

  public void addAction(final View layout, final View summary) { layout.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if (summary.getVisibility() == View.GONE) { expand(summary); } else { collapse(summary); } } }); } private void expand(View summary) { //set Visible summary.setVisibility(View.VISIBLE); final int widthSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); summary.measure(widthSpec, 300); mAnimator = slideAnimator(0, 300, summary); mAnimator.start(); } private void collapse(final View summary) { int finalHeight = summary.getHeight(); ValueAnimator mAnimator = slideAnimator(finalHeight, 0, summary); mAnimator.addListener(new Animator.AnimatorListener() { @Override public void onAnimationEnd(Animator animator) { //Height=0, but it set visibility to GONE summary.setVisibility(View.GONE); } @Override public void onAnimationStart(Animator animator) { } @Override public void onAnimationCancel(Animator animator) { } @Override public void onAnimationRepeat(Animator animator) { } }); mAnimator.start(); } private ValueAnimator slideAnimator(int start, int end, final View summary) { ValueAnimator animator = ValueAnimator.ofInt(start, end); animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator valueAnimator) { //Update Height int value = (Integer) valueAnimator.getAnimatedValue(); ViewGroup.LayoutParams layoutParams = summary.getLayoutParams(); layoutParams.height = value; summary.setLayoutParams(layoutParams); } }); return animator; } 

If you also want to collapse "mLayoutToBeExpanded" when configuring yourself, use this:

  public void addAction(final View layout, final View summary) { layout.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if (summary.getVisibility() == View.GONE) { expand(summary); } else { collapse(summary); } } }); summary.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { if (summary.getVisibility() == View.VISIBLE) { collapse(summary); } else { //nothing } } }); } 

Answer 2

Use this method to crash and expand animation:

  public void expandOrCollapse(final View v,String exp_or_colpse) { TranslateAnimation anim = null; if(exp_or_colpse.equals("expand")) { anim = new TranslateAnimation(0.0f, 0.0f, -v.getHeight(), 0.0f); v.setVisibility(View.VISIBLE); } else{ anim = new TranslateAnimation(0.0f, 0.0f, 0.0f, -v.getHeight()); AnimationListener collapselistener= new AnimationListener() { @Override public void onAnimationStart(Animation animation) { } @Override public void onAnimationRepeat(Animation animation) { } @Override public void onAnimationEnd(Animation animation) { v.setVisibility(View.GONE); } }; anim.setAnimationListener(collapselistener); } // To Collapse // anim.setDuration(300); anim.setInterpolator(new AccelerateInterpolator(0.5f)); v.startAnimation(anim); } 

And Call this method in your code:

  //For Expand View expandOrCollapse(YourView,"expand"); //For Collapse View expandOrCollapse(yourView,"collapse"); 

Answer 3

  ValueAnimator expandAnimation = ValueAnimator.ofInt(mainView.getHeight(), 400); expandAnimation.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(final ValueAnimator animation) { int height = (Integer) animation.getAnimatedValue(); RelativeLayout.LayoutParams lp = (LayoutParams) mainView.getLayoutParams(); lp.height = height; } }); expandAnimation.setDuration(500); expandAnimation.start(); 

Answer 4

Just an alternative, easy to use. To expand the view using animation:

 view.setPivotY(0); ObjectAnimator.ofFloat(view, "scaleY", 0f, 1f).setDuration(300).start();