Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android - Updating View's Height on translationY() Animation

I have a layout that I want to expand after button click, as shown below:

Expectation

The problem is I need to use Animation, so I decided to use View.animate.translationY(). Here is my code:

private void showBottomThreeLines(boolean show){
    if(show)
        mShiftContainer.animate().translationY(0);
    else
        mShiftContainer.animate().translationY(-(mFifthLineContainer.getHeight() * 3));
}

However, this is what I get after testing:

Reality

The current height is still the same as the previous height! The view's height is using MATCH_PARENT. I even tried to change it to 1000dp, but it still has the same height. How do I update view's height during translationY() animation?

like image 966
Harry Avatar asked Jun 05 '15 07:06

Harry


1 Answers

After doing some research, I find out that defining view height after its translation will not increase its height at all. It appears that the sum of the entire view's height CANNOT go exceed its parent layout's height. Which means, if you set parent layout's height as MATCH_PARENT and your screen size is 960 dp, your child view's maximum height will be 960 dp, even if you define its height, e.g. android:layout_height="1200dp".

Therefore, I decided to dynamically re-size parent layout's height, and make the footer layout's height MATCH_PARENT. By default, my parent layout's height is MATCH_PARENT, but I call below method on onCreateView():

private void adjustParentHeight(){
    WindowManager wm = (WindowManager) mContext.getSystemService(Context.WINDOW_SERVICE);
    DisplayMetrics metrics = new DisplayMetrics();
    wm.getDefaultDisplay().getMetrics(metrics);
    ViewGroup.LayoutParams params = mView.getLayoutParams();
    mFifthLineContainer.measure(0, 0);
    params.height = metrics.heightPixels + (mFifthLineContainer.getMeasuredHeight() * 3);
    mView.setLayoutParams(params);
}

This will make my footer layout become off-screen. Then I tried to use View.animate().translationY(), but then I got another problem! There is a bug in Android animation that causes flicker when you call View.setY() on onAnimationEnd(). It seems the cause is onAnimationEnd() is being called before the animation truly ends. Below are references that I use to solve this problem:

Android Animation Flicker

Android Flicker when using Animation and onAnimationEnd Listener

Therefore, I changed my showBottomThreeLines() method:

private void showBottomThreeLines(boolean show){
    if(show){
        TranslateAnimation translateAnimation = new TranslateAnimation(0, 0, -(mFifthLineContainer.getHeight() * 3), 0);
        translateAnimation.setDuration(300);
        translateAnimation.setFillAfter(true);
        translateAnimation.setFillEnabled(true);
        translateAnimation.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
                mShiftContainer.setY(mShiftContainer.getY() + mFifthLineContainer.getHeight() * 3);
            }

            @Override
            public void onAnimationEnd(Animation animation) {

            }

            @Override
            public void onAnimationRepeat(Animation animation) {

            }
        });
        mShiftContainer.startAnimation(translateAnimation);
    } else{
        TranslateAnimation translateAnimation = new TranslateAnimation(0, 0, mFifthLineContainer.getHeight() * 3, 0);
        translateAnimation.setDuration(300);
        translateAnimation.setFillAfter(true);
        translateAnimation.setFillEnabled(true);
        translateAnimation.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
                mShiftContainer.setY(mFifthLineContainer.getY());
            }

            @Override
            public void onAnimationEnd(Animation animation) {

            }

            @Override
            public void onAnimationRepeat(Animation animation) {

            }
        });
        mShiftContainer.startAnimation(translateAnimation);
    }
}
like image 145
Harry Avatar answered Nov 15 '22 01:11

Harry