仿快递柜开门动画

低头看月亮不如抬头看太阳

已于 2023-01-06 10:39:29 修改

阅读量130

点赞数

分类专栏：布局文章标签：错切动画开门关门安卓

于 2022-11-14 15:32:56 首次发布

本文链接：https://blog.csdn.net/shma1022/article/details/127848419

版权

布局专栏收录该内容

7 篇文章 0 订阅

订阅专栏

仿快递柜开门动画

实现效果
在这里插入图片描述
原理：
通过错切和宽度动画实现开关门效果

实现代码：
ButtonWrapper，实现按钮宽度动画

public class ButtonWrapper {
    private Button button;

    public ButtonWrapper(Button button) {
        this.button = button;
    }

    public int getWidth() {
        return button.getLayoutParams().width;
    }

    public void setWidth(int width) {
        button.getLayoutParams().width = width;
        button.requestLayout();
    }

    public int getHeight() {
        return button.getLayoutParams().height;
    }

    public void setHeight(int height) {
        button.getLayoutParams().height = height;
        button.requestLayout();
    }
}

SkewAnimation，实现错切效果

public class SkewAnimation extends Animation {

    private long duration;
    private boolean fillAfter;
    private boolean open;

    public Rotate3dAnimation(long duration, boolean fillAfter) {
        this.duration = duration;
        this.fillAfter = fillAfter;
    }

    public void setOpen(boolean open) {
        this.open = open;
    }

    @Override
    public void initialize(int width, int height, int parentWidth, int parentHeight) {
        super.initialize(width, height, parentWidth, parentHeight);
        setDuration(duration);
        setFillAfter(fillAfter);
    }

    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {
        final Matrix matrix = t.getMatrix();
        matrix.reset();
        if (open) {
            matrix.setSkew(0, 0.2f * interpolatedTime);
        } else {
            matrix.setSkew(0, 0.2f * (1f - interpolatedTime));
        }
    }
}

代码使用

    public void openDoor(View view) {
        Rotate3dAnimation rotation = new Rotate3dAnimation(500, true);
        rotation.setOpen(true);
        button.startAnimation(rotation);
        ButtonWrapper wrapper = new ButtonWrapper(button);
        addViewSkewAnim = ObjectAnimator.ofInt(wrapper, "width", 143, 60);
        addViewSkewAnim.setDuration(500);
        addViewSkewAnim.start();

    }

    public void closeDoor(View view) {
        Rotate3dAnimation rotation = new Rotate3dAnimation(500, true);
        rotation.setOpen(false);
        button.startAnimation(rotation);
        ButtonWrapper wrapper = new ButtonWrapper(button);
        addViewSkewRevertAnim = ObjectAnimator.ofInt(wrapper, "width", 60, 143);
        addViewSkewRevertAnim.setDuration(500);
        addViewSkewRevertAnim.start();
    }