前面两篇介绍了VectorDrawable的基本应用和一些属性的介绍,这一篇我们主要介绍AnimatedVectorDrawable,即使用VectorDrawable制作的图片加上一些属性动画,来制作含有动画效果的VectorDrawable。
一般需要四个步骤,如下:
一、创建VectorDrawable图片drawable/vectordrawable.xml:
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="64dp"
android:width="64dp"
android:viewportHeight="600"
android:viewportWidth="600" >
<group
android:name="rotationGroup"
android:pivotX="300.0"
android:pivotY="300.0"
android:rotation="45.0" >
<path
android:name="v"
android:fillColor="#000000"
android:pathData="M300,70 l 0,-70 70,70 0,0 -70,70z" />
</group>
</vector>
创建一个名为rotationGroup的group在其中画了一个三角形的patch,名为v,并将其顺时针旋转45度(android:rotation=”45.0”)
二、创建动画文件anim/rotation.xml :
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:duration="6000"
android:propertyName="rotation"
android:valueFrom="0"
android:valueTo="360"
android:repeatCount="infinite"
android:repeatMode="reverse"
/>
</set>
android:duration持续时间6s
android:valueFrom=”0” android:valueTo=”360” 从0旋转到3600度
android:repeatCount=”infinite”重复次数无限次
android:repeatMode=”reverse”重复模式反向
anim/path_morph.xml :
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:duration="6000"
android:propertyName="pathData"
android:valueFrom="M300,70 l 0,-70 70,70 0,0 -70,70z"
android:valueTo="M300,70 l 0,-70 70,0 0,140 -70,0 z"
android:valueType="pathType"
android:repeatCount="infinite"
android:repeatMode="reverse"
/>
</set>
三、创建一个文件将动画和drawable连接起来drawable/avd.xml :
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
//对应的drawable文件
android:drawable="@drawable/vectordrawable" >
<target
//将drawable下的rotationGroup和rotation关联
android:name="rotationGroup"
android:animation="@anim/rotation" />
<target
//将drawable下的v和path_morph关联
android:name="v"
android:animation="@anim/path_morph" />
</animated-vector>
四、播放动画、创建activity_main.xml布局文件和MainActivity.java
<ImageView
android:id="@+id/imageaa"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/avd"/>
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageView imageView = (ImageView)findViewById(R.id.imageaa);
Drawable drawable = imageView.getDrawable();
if (drawable != null && drawable instanceof Animatable){
((Animatable) drawable).start();
}
}
效果图如下:
大功告成 !!!