自定义视图中的Android Animate矩形

时间:2014-03-27 16:53:17

标签: android animation view rect

我创建了一个扩展View的类,我将在一个布局中引用它,以便在屏幕上绘制。

这个类只表示一个Rectangle,我希望矩形的长度一直减小到0。

构造

public CardAnimationNew(Context context, AttributeSet attrs) {
    super(context, attrs);
    mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    mPaint.setColor(getResources().getColor(R.color.card_grey_underline));
}

onMeasure:

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);

    if (mRectangle == null) {
        mWidth = getMeasuredWidth();
        mHeight = getMeasuredHeight();
        mRectangle = new Rect(0, 0, mWidth, mHeight);
        animateRectangle();
    }
}

animateRectangle:

private void animateRectangle() {
    mObjectAnimator = ObjectAnimator.ofFloat(mRectangle, "width", 5);
    mObjectAnimator.setDuration(1000);
    mObjectAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator valueAnimator) {
            invalidate();
        }
    });
    mObjectAnimator.start();
}

的onDraw:

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    canvas.drawRect(mRectangle, mPaint);
}

问题Rect根本没有动画效果。它保持相同的长度。我哪里错了?

2 个答案:

答案 0 :(得分:4)

根据documentation,该属性需要您正在应用动画师的类中的setter。

  

此名称将用于派生一个setter函数,该函数将被调用以设置动画值。

重点是Rect没有setWidth()或setHeight()

此外,Rect不具有宽度和高度属性,您可以设置其四个坐标(topleftrightbottom的动画。 )并实现您所需的效果。 (只需将宽度视为Math.abs(left - right),将高度视为Math.abs(top - bottom))。

为了使它能够处理Rect(或者像下面的例子中的RectF一样 - 如果你需要在Rect上使用int setters而不是float)你需要通过添加setter来创建子类。您需要的财产

private class AnimatableRectF extends RectF{
        public AnimatableRectF() {
            super();
        }

        public AnimatableRectF(float left, float top, float right, float bottom) {
            super(left, top, right, bottom);
        }

        public AnimatableRectF(RectF r) {
            super(r);
        }

        public AnimatableRectF(Rect r) {
            super(r);
        }

        public void setTop(float top){
            this.top = top;
        }
        public void setBottom(float bottom){
            this.bottom = bottom;
        }
        public void setRight(float right){
            this.right = right;
        }
        public void setLeft(float left){
            this.left = left;
        }

    }

然后你可以用正常方式为它设置动画......这里有一个动画AnimatableRectF动画的例子,名为mCurrentRect来执行翻译:

float translateX = 50.0f;
float translateY = 50.0f;
ObjectAnimator animateLeft = ObjectAnimator.ofFloat(mCurrentRect, "left", mCurrentRect.left, mCurrentRect.left+translateX);
ObjectAnimator animateRight = ObjectAnimator.ofFloat(mCurrentRect, "right", mCurrentRect.right, mCurrentRect.right+translateX);
ObjectAnimator animateTop = ObjectAnimator.ofFloat(mCurrentRect, "top", mCurrentRect.top, mCurrentRect.top+translateY);
ObjectAnimator animateBottom = ObjectAnimator.ofFloat(mCurrentRect, "bottom", mCurrentRect.bottom, mCurrentRect.bottom+translateY);
animateBottom.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                        @Override
                        public void onAnimationUpdate(ValueAnimator valueAnimator) {
                            postInvalidate();
                        }
                    });
AnimatorSet rectAnimation = new AnimatorSet();
rectAnimation.playTogether(animateLeft, animateRight, animateTop, animateBottom);
rectAnimation.setDuration(1000).start();

我知道它不是解决您问题的复制/粘贴解决方案,但我希望此代码可以帮助您了解如何解决您的问题!

答案 1 :(得分:1)

RectEvaluator是这样做的方法。基本上你可以在Rect上使用ObjectAnimator并给它一个开始和结束rect,它将评估它们之间的步骤。这只是api> = 18。这里有一个不错的报道http://cogitolearning.co.uk/?p=1451