标签：table xmlns 起点 直线 启动 技术 创建 src 切换
在Android 5.X中，Google大量引入线图动画。当页面发生改变时，页面上的icon不再是生硬的切换，而是通过非常生动的动画效果，转换成另一种形态。
要实现如图的的效果，首先要创建一个静态的svg图形，即静态的VectorDrawable。
1 <?xml version="1.0" encoding="utf-8"?> 2 <vector xmlns:android="http://schemas.android.com/apk/res/android" 3 android:height="200dp" 4 android:width="200dp" 5 android:viewportWidth="110" 6 android:viewportHeight="110" 7 8 > 9 <group 10 android:name="test" 11 > 12 <path android:strokeColor="@android:color/holo_purple" 13 android:strokeWidth="2" 14 android:pathData=" 15 M 20, 80 16 L 50, 80 80, 80" 17 android:name="path1" 18 /> 19 <path android:strokeColor="@android:color/holo_blue_bright" 20 android:strokeWidth="2" 21 android:pathData=" 22 M 20, 20 23 L 50, 20 80, 20" 24 android:name="path2" 25 /> 26 </group> 27 28 </vector>
path1与和path2分别绘制了两条直线，每条直线有三个点来控制，即起点、中点和终点，形成了初始状态。
接下来实现path1的变换的objectAnimator动画。
1 <?xml version="1.0" encoding="utf-8"?> 2 <set xmlns:android="http://schemas.android.com/apk/res/android"> 3 <objectAnimator 4 android:duration="1000" 5 android:propertyName="pathData" 6 android:valueFrom=" 7 M 20, 80 8 L 50, 80 80, 80" 9 android:valueTo="M 20, 80 10 L 50, 50 80, 20" 11 android:valueType="pathType" 12 android:interpolator="@android:anim/bounce_interpolator" 13 /> 14 </set>
path2的动画
1 <?xml version="1.0" encoding="utf-8"?> 2 <set xmlns:android="http://schemas.android.com/apk/res/android"> 3 <objectAnimator 4 android:duration="1000" 5 android:propertyName="pathData" 6 android:valueFrom=" 7 M 20, 20 8 L 50, 80 80, 80" 9 android:valueTo="M 20, 20 10 L 50, 50 80, 80" 11 android:valueType="pathType" 12 android:interpolator="@android:anim/bounce_interpolator" 13 /> 14 </set>
这里需要注意的是：在svg的路径变换属性动画中，变换前后的节点数必须相同，这也是为什么前面需要使用三个点来绘制一条直线的原因，因为要使用中点来进行动画变换。
有了VectorDrawable和ObjectAnimator，剩下的只需要使用AnimatedVectorDrawable来将它们粘合在一起。
1 <?xml version="1.0" encoding="utf-8"?> 2 <animated-vector xmlns:android="http://schemas.android.com/apk/res/android" 3 android:drawable="@drawable/demo" 4 > 5 <target 6 android:animation="@animator/anim_path1" 7 android:name="path1"/> 8 <target 9 android:animation="@animator/anim_path2" 10 android:name="path2"/> 11 </animated-vector>
最后在代码中启动动画即可
1 mImageView = (ImageView) findViewById(R.id.id_imageView); 2 ((Animatable)mImageView.getDrawable()).start();
标签：table xmlns 起点 直线 启动 技术 创建 src 切换
原文地址：http://www.cnblogs.com/Stay-Hungry-Stay-Foolish/p/6664979.html
