Android-属性动画原理总结

Android属性动画允许开发者随着时间的流逝改变对象的属性。

我们用一个小案例看下它是如何工作的。

下面是官方文档提供的一张原理图：

从图中可以看到ValueAnimator类封装了：

一个TimeInerpolator,

一个TypeEvaluator,

动画执行的时间duration，

属性的起始值startPropertyValue，属性终止值endPropertyValue。

当我们使用属性动画就需要提供这些信息，可以是系统提供的，我们也可以自己实现，那么当一个ValueAnimator设置了这些属性，它门是如何协同工作的呢？

（勿喷。。。）

首先系统根据已经流失的时间和持续时间计算出一个elapsed fraction，将它传递给时间插值器的getInterpolation(float input)方法，该方法对输入值进行映射到0-1之间的interpolated fraction，接着该值被传递给Evaluator的evaluate(float fraction, Point start, Point end)方法，又该方法返回本次计算的属性值，可以在AnimatorUpdateListener的onAnimationUpdate(ValueAnimator anition)方法的参数animation的getAnimatedValue()方法获得最新的属性，然后重新给对象设置该属性，完成对对象属性的修改。

下面举个栗子：该例子演示了一个红色的小球匀速运动的例子。

MainActivity.java

public class MainActivity extends Activity {


    private  ImageView ivBall;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.ball);

        ivBall = (ImageView) findViewById(R.id.ivBall);
    }

    /**
     *  对应Button的点击事件
     * @param view
     */
    public void run(View view)
    {
        //设置自定义的TypeEvaluator，起始属性，终止属性
        ValueAnimator valueAnimator = ValueAnimator.ofObject(new MyTypeEvaluator(), new Point(0, 0), new Point(0, 0));
        //设置持续时间
        valueAnimator.setDuration(2000);
        //设置加速时间插值器
        valueAnimator.setInterpolator(new MyInperpolator());
        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {    //设置监听器
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                //将最新计算出的属性值设置给ImageView
                Point point = (Point) animation.getAnimatedValue();
                ivBall.setX(point.x);
                ivBall.setY(point.y);
            }
        });

        //开启动画
        valueAnimator.start();
    }

    /**
     * 自定义时间插值器，这里实现了线性时间插值器
     */
    class MyInperpolator implements TimeInterpolator
    {

        @Override
        public float getInterpolation(float input) {
            return input;
        }
    }

    /**
     * 实现的自己的TypeEvaluator
     */
    class MyTypeEvaluator implements TypeEvaluator<Point> {

        @Override
        public Point evaluate(float fraction, Point startValue, Point endValue) {
            Point point = new Point();
            point.x = startValue.x + fraction * 500;
            point.y = startValue.y + fraction * 500;

            return point;
        }
    }


    /**
     * 保存坐标信息
     */
    class Point
    {
        float x;
        float y;
        public Point()
        {}

        public Point(float x, float y) {
            this.x = x;
            this.y = y;
        }
    }

}

布局文件：

ball.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/ivBall"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:background="@drawable/blue_ball"/>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true">

        <Button
            android:id="@+id/btnVertical"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="run"
            android:onClick="run"/>

    </LinearLayout>


</RelativeLayout>

小球的背景：

blue_ball.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">


    <solid android:color="#0000ff"></solid>
    <size
        android:width="40dp"
        android:height="40dp"></size>
    <gradient
        android:startColor="#FFFF0000"
        android:endColor="#80FF00FF"
        android:angle="45"/>
    <padding android:left="7dp"
        android:top="7dp"
        android:right="7dp"
        android:bottom="7dp" />
    <corners android:radius="8dp" />

</shape>

　　

最终的效果是：

 

 

通过这个例子再结合官方文档http://developer.android.com/guide/topics/graphics/prop-animation.html#interpolators应该不难理解属性动画了。