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
1 public class MainActivity extends Activity { 2 3 4 private ImageView ivBall; 5 6 @Override 7 protected void onCreate(Bundle savedInstanceState) { 8 super.onCreate(savedInstanceState); 9 setContentView(R.layout.ball); 10 11 ivBall = (ImageView) findViewById(R.id.ivBall); 12 } 13 14 /** 15 * 对应Button的点击事件 16 * @param view 17 */ 18 public void run(View view) 19 { 20 //设置自定义的TypeEvaluator,起始属性,终止属性 21 ValueAnimator valueAnimator = ValueAnimator.ofObject(new MyTypeEvaluator(), new Point(0, 0), new Point(0, 0)); 22 //设置持续时间 23 valueAnimator.setDuration(2000); 24 //设置加速时间插值器 25 valueAnimator.setInterpolator(new MyInperpolator()); 26 valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { //设置监听器 27 @Override 28 public void onAnimationUpdate(ValueAnimator animation) { 29 //将最新计算出的属性值设置给ImageView 30 Point point = (Point) animation.getAnimatedValue(); 31 ivBall.setX(point.x); 32 ivBall.setY(point.y); 33 } 34 }); 35 36 //开启动画 37 valueAnimator.start(); 38 } 39 40 /** 41 * 自定义时间插值器,这里实现了线性时间插值器 42 */ 43 class MyInperpolator implements TimeInterpolator 44 { 45 46 @Override 47 public float getInterpolation(float input) { 48 return input; 49 } 50 } 51 52 /** 53 * 实现的自己的TypeEvaluator 54 */ 55 class MyTypeEvaluator implements TypeEvaluator<Point> { 56 57 @Override 58 public Point evaluate(float fraction, Point startValue, Point endValue) { 59 Point point = new Point(); 60 point.x = startValue.x + fraction * 500; 61 point.y = startValue.y + fraction * 500; 62 63 return point; 64 } 65 } 66 67 68 /** 69 * 保存坐标信息 70 */ 71 class Point 72 { 73 float x; 74 float y; 75 public Point() 76 {} 77 78 public Point(float x, float y) { 79 this.x = x; 80 this.y = y; 81 } 82 } 83 84 }
布局文件:
ball.xml:
1 <?xml version="1.0" encoding="utf-8"?> 2 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 android:orientation="vertical" android:layout_width="match_parent" 4 android:layout_height="match_parent"> 5 6 <ImageView 7 android:id="@+id/ivBall" 8 android:layout_width="40dp" 9 android:layout_height="40dp" 10 android:background="@drawable/blue_ball"/> 11 12 <LinearLayout 13 android:layout_width="wrap_content" 14 android:layout_height="wrap_content" 15 android:layout_alignParentBottom="true"> 16 17 <Button 18 android:id="@+id/btnVertical" 19 android:layout_width="wrap_content" 20 android:layout_height="wrap_content" 21 android:text="run" 22 android:onClick="run"/> 23 24 </LinearLayout> 25 26 27 </RelativeLayout>
小球的背景:
blue_ball.xml:
1 <?xml version="1.0" encoding="utf-8"?> 2 <shape xmlns:android="http://schemas.android.com/apk/res/android" 3 android:shape="oval"> 4 5 6 <solid android:color="#0000ff"></solid> 7 <size 8 android:width="40dp" 9 android:height="40dp"></size> 10 <gradient 11 android:startColor="#FFFF0000" 12 android:endColor="#80FF00FF" 13 android:angle="45"/> 14 <padding android:left="7dp" 15 android:top="7dp" 16 android:right="7dp" 17 android:bottom="7dp" /> 18 <corners android:radius="8dp" /> 19 20 </shape>
最终的效果是:
通过这个例子再结合官方文档http://developer.android.com/guide/topics/graphics/prop-animation.html#interpolators应该不难理解属性动画了。