簡單的屬性動畫解決摺疊窗(抽屜)動畫問題

1. 背景
2. 使用方法

背景

最近有個需求要實現摺疊窗的問題,效果如下

在網上找的方案基本上都是自定義View,這裏自己做了一個屬性動畫的工具類,讓你很靈活的實現上述效果.

使用方法

2.1現在提供工具類代碼

public class OpenShrinkAnimUtil {
    /**
     * 展開佈局動畫
     */
    public static void animateOpen(View v,int mHiddenViewMeasuredHeight) {
        v.setVisibility(View.VISIBLE);
        ValueAnimator animator = createDropAnimator(v, 0,
                mHiddenViewMeasuredHeight);
        animator.start();

    }

    /**u
     * 關閉佈局動畫
     */
    public static void animateClose(final View view) {
        int origHeight = view.getHeight();
        ValueAnimator animator = createDropAnimator(view, origHeight, 0);
        animator.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                view.setVisibility(View.GONE);
            }

        });
        animator.start();
    }

    /**
     * 順時針旋轉180°箭頭動畫
     */
    public static void animationIvOpen(View v) {
        RotateAnimation animation = new RotateAnimation(0, 90,
                Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
                0.5f);
        animation.setFillAfter(true);
        animation.setDuration(100);
        v.startAnimation(animation);
    }

    /**
     * 逆時針旋轉180°箭頭動畫
     */
    public static void animationIvClose(View v) {
        RotateAnimation animation = new RotateAnimation(90, 0,
                Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
                0.5f);
        animation.setFillAfter(true);
        animation.setDuration(100);
        v.startAnimation(animation);
    }

    /**
     * 創建動畫
     *
     * @param v     需要實現動畫下效果的視圖
     * @param start 開始高度
     * @param end   結束高度
     * @return 動畫對象
     */
    private static ValueAnimator createDropAnimator(final View v, int start, int end) {
        ValueAnimator animator = ValueAnimator.ofInt(start, end);
        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator arg0) {
                int value = (int) arg0.getAnimatedValue();
                ViewGroup.LayoutParams layoutParams = v.getLayoutParams();
                layoutParams.height = value;
                v.setLayoutParams(layoutParams);
            }
        });
        return animator;
    }

一共四個方法

1.箭頭順時針旋轉90°動畫
2.箭頭逆時針旋轉90°動畫
3.展開佈局動畫
4.關閉佈局動畫

2.2那麼接下就是如何使用了

點擊摺疊欄的時候,我們判斷一下當前展開佈局是否可見就可以了,如果可見則隱藏,如果隱藏了,則設置爲可見.注意這裏我們需要擁有一個箭頭朝右的圖片

  /**
     *主要就是展開佈局動畫，和箭頭朝下的動畫，注意這裏我們需要一個向右的箭頭圖片
     * @param layParamSetting 想要展開隱藏的佈局
     * @param rightArrow 右邊的箭頭
     */
    private void controlPanel(View layParamSetting,View rightArrow) {
        //如果佈局被隱藏了，則展開
        if (layParamSetting.getVisibility() == View.GONE) {
            OpenShrinkAnimUtil.animateOpen(layParamSetting, DEFAULT_PARAM_SETTING_HEIGHT);
            OpenShrinkAnimUtil.animationIvOpen(rightArrow);
        } else {
            OpenShrinkAnimUtil.animateClose(layParamSetting);
            OpenShrinkAnimUtil.animationIvClose(rightArrow);
        }
    }

DEFAULT_PARAM_SETTING_HEIGHT是展開佈局的高度,我們只需在VIew繪製完成的時候去拿它的高度即可.可以利用View.post(Runnable action)方法來獲取高度.代碼如下:

mLayParamSetting.post(new Runnable() {
                @Override
                public void run() {
                //獲取展開動畫的高度.
					DEFAULT_PARAM_SETTING_HEIGHT  = mLayParamSetting.getMeasuredHeight();                  
                }
            });

或者我們可以直接在佈局的時候將高度設置成固件值.

至此就完成了上述動畫.

如果任何疑問,請聯繫郵箱:[email protected]