属性动画,字如其意,就是给属性做动画的,其实google已经提供了帧动画和补间动画,我们可以根据提供的这些动画,实现很多的功能,但是,google从3.0(api 11)开始提供了属性动画,为什么要提供属性动画呢?那是因为补间动画提供的alpha,translate,rotate,scale这些常见的动画满足不了我们的一些其他特殊需求,比如,我们要给View的背景做个颜色改变的动画,这时使用补间动画是无法实现的。还有,如果给view设置了平移的补间动画,并且给view设置了点击事件,当view移到新的位置后,点击view,是不会触发点击事件的,只有在view的初始位置点击,才能触发点击事件,由于这些种种原因,google提供了属性动画,来解决这些问题。其实使用了属性动画后,很多的补间动画的效果都可以通过属性动画来实现。由于是3.0才提供的api,所以为了兼容老版本,可以采用开源库nineoldandroids 。
下面我们来看看属性动画通过xml文件配置的通用模板:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:ordering=["sequentially"|"together"]>
<objectAnimator
android:propertyName="string"
android:valueType=["floatType"|"intType"]
android:valueFrom=["float"|"integer"|"color"]
android:valueTo=["float"|"integer"|"color"]
android:duration="integer"
android:repeatCount="integer"
android:repeatMode=["repeat"|"reverse"]
android:startOffset="integer">
</objectAnimator>
<set android:ordering=["sequentially"|"together"]>
<objectAnimator
android:propertyName="string"
android:valueType=["floatType"|"intType"]
android:valueFrom=["float"|"integer"|"color"]
android:valueTo=["float"|"integer"|"color"]
android:duration="integer"
android:repeatCount="integer"
android:repeatMode=["repeat"|"reverse"]
android:startOffset="integer">
</objectAnimator>
// ...可能还会有多个<objectAnimator />
</set>
// ...可能还会有多个<objectAnimator />
//虽然也能够配置ValueAnimator,但是,没法作用到具体的属性上,所以在xml中配置意义不大
<animator
android:valueType=["floatType"|"intType"]
android:valueFrom=["float"|"integer"|"color"]
android:valueTo=["float"|"integer"|"color"]
android:duration="integer"
android:repeatCount="integer"
android:repeatMode=["repeat"|"reverse"]
android:startOffset="integer">
</objectAnimator>
</set>
下面来看看使用xml配置一个组合动画的示例:
在res目录下,创建animator目录,然后创建animator_combination.xml文件,文件中的代码如下:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:ordering="sequentially">
<objectAnimator
android:propertyName="translationX"
android:valueType="floatType"
android:valueFrom="0"
android:valueTo="200">
</objectAnimator>
<objectAnimator
android:propertyName="translationX"
android:valueType="floatType"
android:valueFrom="200"
android:valueTo="0">
</objectAnimator>
<set android:ordering="together">
<objectAnimator
android:valueType="floatType"
android:propertyName="alpha"
android:valueFrom="1"
android:valueTo="0">
</objectAnimator>
<objectAnimator
android:propertyName="alpha"
android:valueType="floatType"
android:valueFrom="0"
android:valueTo="1">
</objectAnimator>
<objectAnimator
android:propertyName="scaleX"
android:valueType="floatType"
android:valueFrom="1"
android:valueTo="5">
</objectAnimator>
<objectAnimator
android:propertyName="scaleY"
android:valueType="floatType"
android:valueFrom="1"
android:valueTo="5">
</objectAnimator>
</set>
<objectAnimator
android:propertyName="rotation"
android:valueType="floatType"
android:valueFrom="0"
android:valueTo="180">
</objectAnimator>
</set>
具体使用上面xml文件中配置的动画:
//加载xml文件中配置的属性动画
Animator animator = AnimatorInflater.loadAnimator(PropertyAnimationBaseActivity.this, R.animator.animator_combination);
//设置属性动画作用的目标
animator.setTarget(iv);
//设置属性动画的时长
animator.setDuration(1000);
//开始执行动画
animator.start();
以上示例就完成了一个属性组合动画,当然了,也可以单独的配置某个属性动画。
平移动画
比如在animator目录下,创建animator_trans_x.xml文件,文件中的代码如下:
<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:propertyName="translationX"
android:duration="1000"
android:valueType="floatType"
android:valueFrom="0"
android:valueTo="200">
<!--android:propertyName="translationX" 属性名称是translationX,则沿着x轴方向移动 -->
<!--android:propertyName="translationY" 属性名称是translationY,则沿着y轴方向缩放 -->
</objectAnimator>
具体使用:
//通过xml文件编写TranslationX动画,需要将valueType的值设置成floatType,如果设置成intType将没有动画效果
Animator animator = AnimatorInflater.loadAnimator(PropertyAnimationBaseActivity.this, R.animator.animator_trans_x);
animator.setTarget(iv);
animator.start();
缩放动画
下面在来看看在xml文件中配置属性为"scaleY" 动画,在animator目录下,创建animator_scale_y.xml文件,文件中的代码如下:
<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:propertyName="scaleY"
android:valueFrom="1"
android:valueTo="5"
android:valueType="floatType">
<!--android:propertyName="scaleX" 属性名称是scaleX,则沿着x轴方向缩放 -->
<!--android:propertyName="scaleY" 属性名称是scaleY,则沿着y轴方向缩放 -->
</objectAnimator>
具体使用:
//通过xml文件编写ScaleY动画,需要将valueType的值设置成floatType,如果设置成intType将没有动画效果
Animator animator = AnimatorInflater.loadAnimator(PropertyAnimationBaseActivity.this, R.animator.animator_scale_y);
animator.setTarget(iv);
animator.start();
旋转动画
接着在xml文件中配置属性为"rotation"动画,在animator目录下,创建animator_rotation.xml文件,文件中的代码如下:
<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:propertyName="rotationX"
android:valueType="floatType"
android:valueFrom="0"
android:valueTo="180">
<!--android:propertyName="rotation" 属性名称是rotation,则沿着z轴旋转 -->
<!--android:propertyName="rotationX" 属性名称是rotationX,则沿着x轴旋转 -->
<!--android:propertyName="rotationY" 属性名称是rotationY,则沿着y轴旋转 -->
</objectAnimator>
具体使用:
//通过xml文件编写roatation动画,需要将valueType的值设置成floatType,如果设置成intType将没有动画效果
Animator animator = AnimatorInflater.loadAnimator(PropertyAnimationBaseActivity.this, R.animator.animator_rotation);
animator.setTarget(iv);
animator.start();
透明度动画
在animator目录下,创建animator_fade_out.xml文件,文件中的代码如下:
<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:propertyName="alpha"
android:valueType="floatType"
android:valueFrom="1"
android:valueTo="0.5">
</objectAnimator>
具体使用:
Animator animator = AnimatorInflater.loadAnimator(PropertyAnimationBaseActivity.this,R.animator.animator_fade_out);
animator.setTarget(iv);
animator.start();
上面介绍的几种动画,都是通过xml文件来配置的,下面来通过代码来创建动画,实现和上面xml文件中配置的动画相同的效果。
组合动画:
ObjectAnimator alpha = ObjectAnimator.ofFloat(iv,"alpha",1f,0f,1f);
ObjectAnimator rotation = ObjectAnimator.ofFloat(iv,"rotation",0,180);
ObjectAnimator translationX = ObjectAnimator.ofFloat(iv,"translationX",0,200,0);
ObjectAnimator scaleX = ObjectAnimator.ofFloat(iv,"scaleX",1f,5f);
ObjectAnimator scaleY = ObjectAnimator.ofFloat(iv,"scaleY",1f,5f);
AnimatorSet set = new AnimatorSet();
set.setDuration(5000);
set.play(alpha).before(rotation).after(translationX).with(scaleX).with(scaleY);
//上面的意思是alpha动画播放在ratation动画之前,translationX之后,同时,在播放alpha
//动画时,也播放scaleX和sacleY动画。(这是直接翻译),总结一句话就是,alpha动画和
//scaleX,scaleY动画在transaltionx动画播放完后 ,他们三个动画在一起懂事播放,这三个
//动画都播放完后,在播放rotation动画。
set.start();
set.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
}
});
平移动画:
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(iv,"translationX",0,200,0);
objectAnimator.setDuration(1000);
objectAnimator.start();
缩放动画(默认是以中心点进行缩放):
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(iv,"scaleY",1,5f);
objectAnimator.setDuration(1000);
objectAnimator.start();
缩放动画(以左上角为中心进行缩放):
//设置缩放的中心点
iv.setPivotX(0);
iv.setPivotY(0);
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(iv, "scaleX", 1f, 2f);
objectAnimator.setDuration(5000).start();
旋转动画:
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(iv,"rotation",0,180);
objectAnimator.setDuration(1000);
objectAnimator.start();
透明度动画:
// alpha是透明度渐变的动画效果
// 透明度的取值范围是0-1之间
// 0表示完全透明,1表示完全不透明
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(iv,"alpha",1f,0f,1f);
objectAnimator.setDuration(1000);
objectAnimator.start();