View Animation动画详解

前言

Android的动画分为ViewAnimation和PropertyAnimator。View动画的作用对象是View,它支持4种动画效果,分别是平移动画、缩放动画、旋转动画和透明度动画,除了这4种变换效果外,帧动画也属于View动画,但是帧动画的表现形式和上面的四种不太一样。这里先介绍这四种动画效果:

分类

scale 渐变尺寸伸缩动画效果
alpha 渐变透明度动画效果
translate 平移动画效果
rotate 旋转动画效果

使用

通过xml定义的anim文件位于res/anim下,使用的时候通过以下代码加载:

Animation scaleAnim = AnimationUtils.loadAnimation(context, R.anim.alpha_anim);  
view.startAnimation(scaleAnim);  

Scale

scale标签是缩放动画,可以实现动态调控件尺寸的效果,有下面几个属性:
  • android:fromXScale
    起始的X方向上相对自身的缩放比例,浮点值,比如1.0代表自身无变化,0.5代表起始时缩小一倍,2.0代表放大一倍;
  • android:toXScale
    结尾的X方向上相对自身的缩放比例,浮点值;
  • android:fromYScale
    起始的Y方向上相对自身的缩放比例,浮点值,
  • android:toYScale
    结尾的Y方向上相对自身的缩放比例,浮点值;
  • android:pivotX
    缩放起点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,当为数值时,表示在当前View的左上角,即原点处加上50px,做为起始缩放点;如果是50%,表示在当前控件的左上角加上自己宽度的50%做为起始点;如果是50%p,那么就是表示在当前的左上角加上父控件宽度的50%做为起始点x轴坐标。(具体意义,后面会举例演示)
  • android:pivotY
    缩放起点Y轴坐标,取值及意义跟android:pivotX一样。

使用实例 scale_anim.xml

<?xml version="1.0" encoding="utf-8"?>  
<scale xmlns:android="http://schemas.android.com/apk/res/android"  
    android:fromXScale="0.0"  
    android:toXScale="1.4"  
    android:fromYScale="0.0"  
    android:toYScale="1.4"  
    android:pivotX="50"  
    android:pivotY="50"  
    android:duration="700" /> 

alpha

alpha标签是透明度动画,主要有下面几个属性:
  • android:fromAlpha
    动画开始的透明度,从0.0 --1.0 ,0.0表示全透明,1.0表示完全不透明
  • android:toAlpha
    动画结束时的透明度,也是从0.0 --1.0 ,0.0表示全透明,1.0表示完全不透明

使用实例 alpha_anim.xml

<?xml version="1.0" encoding="utf-8"?>  
<alpha xmlns:android="http://schemas.android.com/apk/res/android"  
    android:duration="1500"
    android:fromAlpha="0.0"
    android:toAlpha="1.0" />

translate

平移动画效果,主要有下面几个属性:
  • android:fromXDelta
    起始点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,和scale一致
  • android:fromYDelta
    起始点Y轴从标,可以是数值、百分数、百分数p 三种样式;
  • android:toXDelta
    结束点X轴坐标
  • android:toYDelta
    结束点Y轴坐标

使用实例 translate_anim.xml

<?xml version="1.0" encoding="utf-8"?>  
<translate xmlns:android="http://schemas.android.com/apk/res/android"  
    android:duration="700"
    android:fromXDelta="0"
    android:fromYDelta="0"
    android:fillAfter="true"
    android:toXDelta="100%"
    android:toYDelta="100%"
    />

rotate

旋转动画效果,主要有下面几个属性:
  • android:fromDegrees
    开始旋转的角度位置,正值代表顺时针方向度数,负值代码逆时针方向度数
  • android:toDegrees
    结束时旋转到的角度位置,正值代表顺时针方向度数,负值代码逆时针方向度数
  • android:pivotX
    缩放起点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,具体意义已在scale标签中讲述,这里就不再重讲
  • android:pivotY
    缩放起点Y轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p

使用实例 rotate_anim.xml

<?xml version="1.0" encoding="utf-8"?>  
<rotate xmlns:android="http://schemas.android.com/apk/res/android"  
    android:duration="1500"
    android:fromDegrees="0"
    android:pivotX="0"
    android:pivotY="0"
    android:toDegrees="365" />

从Animation类继承的属性

Animation类是所有动画(scale、alpha、translate、rotate)的基类,这里以scale标签为例,讲解一下,Animation类所具有的属性及意义。
  • android:duration
    动画持续时间,以毫秒为单位
  • android:fillAfter
    如果设置为true,控件动画结束时,将保持动画最后时的状态
  • android:fillBefore
    如果设置为true,控件动画结束时,还原到开始动画前的状态
  • android:fillEnabled
    与android:fillBefore 效果相同,都是在动画结束时,将控件还原到初始化状态
  • android:repeatCount 重复次数
  • android:repeatMode
    重复类型,有reverse和restart两个值,reverse表示倒序回放,restart表示重新放一遍,必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型,即回放时的动作。
  • android:interpolator
    设定插值器,其实就是指定的动作效果,比如弹跳效果等。

Set标签

前面我们讲解了各个标签动画的意义及用法,但他们都是独立对控件起作用,如果我们要对一个控件综合以上多个动画的话,就需要用到set标签了。

set标签自已是没有属性的,他的属性都是从Animation继承而来,但当它们用于Set标签时,就会对Set标签下的所有子控件都产生作用。

使用实例 set_anim.xml

<?xml version="1.0" encoding="utf-8"?>  
<set xmlns:android="http://schemas.android.com/apk/res/android"  
    android:duration="700">

    <alpha
        android:fromAlpha="0.0"
        android:toAlpha="1.0" />

    <scale
        android:fromXScale="0"
        android:fromYScale="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="1"
        android:toYScale="1" />

    <rotate
        android:fromDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="365" />
</set>  

这个set综合了alpha、scale、rotate动画。

结尾

View Animation的使用相对来说是比较简单的,通过简单的配置动画xml,我们就可以做出各种动画效果。
Demo GitHub

参考 Android自定义控件三部曲文章索引