Android高级动画所有代码
一、简介:vectordrawable允许你基于xml创建一个矢量图形。在API21时第一次发布。
二、优点:1、体积小;2、一个图片适配所有屏幕;3、可以实现非常优美的动画效果;4、svg格式的图片可以转化为vectordrawable。
阿里的矢量图分享网站:iconfont.cn
三、兼容性:使用Gradle 1.5+和AppCompat23.2+,可以支持Android3.0+的动态和静态VectorDrawable。
四、通过创建一个简单的动态vectordrawable动画讲解使用方法
1、兼容性配置:
注意gradle的版本最好是在2.1以上。
[1]、在app/build.gradle中配置:
android {
compileSdkVersion 23
buildToolsVersion "23.0.3"
defaultConfig {
......
vectorDrawables.useSupportLibrary=true
}
}
dependencies {
...
compile 'com.android.support:appcompat-v7:23.4.0'
}
2、在res/drawable中创建一个vectordrawable,命名为rect_vector.xml:
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="48dp"
android:height="48dp"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:name="rect_vector"
android:fillColor="#000000"
android:pathData="M0,0,L0,24,L24,24,L24,0 z"/>
</vector>
android:width——drawable的固定宽度
android:height——drawblae的固定高度
android:viewportWidth——viewport的宽度,viewport是画布上的基本单位,画布的宽度被分为多少格。
android:viewportHeight——viewport的高度,viewport是画布上的基本单位,画布的高度被分为多少格。
<path>标签:定义路径怎么画。
android:pathData中的数据讲解:M=MoveTo(M X,Y)将画线移动到指定坐标位置;
L=LineTo(L X,Y)画直线到指定的坐标位置;
z=ClosePath()关闭路径。
3、在res/animator中创建一个属性动画,这个属性动画会让对象从黑色变化为浅绿色,命名为:changecolor.xml。
<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:propertyName="fillColor"
android:duration="5000"
android:valueFrom="@android:color/black"
android:valueTo="@android:color/holo_green_light"
android:valueType="colorType">
</objectAnimator>
在这里面可以设置很多属性动画,比如:
位移动画(需要把vectordrawable中的path用group标签包裹起来,rotation、pivot、scale、translate的动画都需要用group标签包裹)
<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:propertyName="translateX"
android:duration="1000"
android:repeatMode="reverse"
android:repeatCount="infinite"
android:valueFrom="0"
android:valueTo="10"
android:valueType="floatType"
android:interpolator="@android:interpolator/accelerate_decelerate">
</objectAnimator>
4、使用animated-vector连接vectordrawable和属性动画,命名为change_color.xml:
<?xml version="1.0" encoding="utf-8"?>
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/rect_vector">
<target
android:animation="@animator/changecolor"
android:name="rect_vector"/>
</animated-vector>
5、在布局文件中引入:
<ImageView
android:layout_width="50dip"
android:layout_height="50dip"
android:layout_marginTop="20dip"
android:scaleType="fitXY"
android:onClick="imageAnim"
app:srcCompat="@drawable/change_color"/>
6、点击启动动画:
public void imageAnim(View view){
ImageView imageView=(ImageView)view;
Drawable drawableColor = imageView.getDrawable();
if (drawableColor instanceof Animatable) {
((Animatable) drawableColor).start();
}
}
这样我们就创建了一个简单的属性动画。
参考:
https://developer.android.com/reference/android/graphics/drawable/VectorDrawable.html
https://developer.android.com/reference/android/graphics/drawable/AnimatedVectorDrawable.html