Android 动画之补间动画(Tween Animation)

概述

无需定义动画过程的每一帧,只需要定义出发和结束这两个关键帧,并指定动画变化的时间和方式。
四种基本效果:
透明度(Alpha)、大小(Scale)、位移(Translate)、旋转(Rotate)

插值器(Interpolator)

Interpolator 类是一个空接口,继承自 TimeInterpolator。它负责控制动画的变化速度,如:匀速、加速、减速、抛物线等多种速度变化。

/** 
 * 插值器 
 */  
public interface Interpolator extends TimeInterpolator {  
}  
  
/** 
 * 时间插值器 
 */  
public interface TimeInterpolator {  
  
    /** 
     * @param input 0.0 - 1.0 之间的值 
     * @return 返回值可以小于 0.0,也可以大于1.0 
     */  
    float getInterpolation(float input);  
} 
Android SDk 提供的几个插值器实现类:
  • AccelerateDecelerateInterpolator:动画开始和结束时速度慢,中间速度加速;
  • AccelerateInterpolator:动画开始慢,一直加速;
  • AnticipateInterpolator:动画先向后,然后向前滑动;
  • AnticipateOvershootInterpolator:动画先向后,然后向前甩一定值后返回最后的值;
  • BounceInterpolator:动画结束时弹起;
  • CycleInterpolator:动画循环播放,速率改变遵循正弦曲线;
  • DecelerateInterpolator:动画开始时速率改变快,然后变慢;
  • LinearInterpolator:动画匀速改变;
  • OvershootInterpolator:动画向前甩一定值后,再返回原来位置;
  • PathInterpolator:(新增)通过定义路径坐标,动画可以按照路径坐标运行;这里的坐标不是指十字坐标系,而是单方向,也就是可以从 0-1 ,然后弹回 0.6 ,再弹到0.8,知道时间结束。

注:如果不符合实际要求,可以通过实现 Interpolator 接口自定义。

透明度(AlphaAnimation)

透明度取值(0~1)

  • XML 方式:
  
  
  
      
 
Animation animation = AnimationUtils.loadAnimation(this, R.anim.anim_ceshi);  
imageView.startAnimation(animation); 
  • 代码方式:
/** 
 * 透明度动画 
 * @param fromAlpha 开始值 
 * @param toAlpha 结束值 
 */  
public AlphaAnimation(float fromAlpha, float toAlpha) {  
    mFromAlpha = fromAlpha;  
    mToAlpha = toAlpha;  
} 
AlphaAnimation alphaAnimation = new AlphaAnimation(0, 1);  
alphaAnimation.setDuration(1000);  
// 动画结束后保留结束后的状态  
alphaAnimation.setFillAfter(true);  
imageView.startAnimation(alphaAnimation);  

缩放(ScaleAnimation)

  • XML 方式:
  
  
  
      
  

注:用法同上。

  • 代码方式
/** 
 * 构造方法 
 * @param fromX     动画开始时X坐标的伸缩尺寸 
 * @param toX       动画结束时X坐标的伸缩尺寸 
 * @param fromY     动画开始时Y坐标的伸缩尺寸 
 * @param toY       动画结束时Y坐标的伸缩尺寸 
 * @param pivotXType    动画在X轴的伸缩模式,也就是中心点相对于哪个物件,取值:Animation.ABSOLUTE、RELATIVE_TO_SELF、RELATIVE_TO_PARENT 
 * @param pivotXValue/pivotX    缩放动画的中心点X坐标 
 * @param pivotYType    动画在Y轴的伸缩模式,也就是中心点相对于哪个物件,取值:Animation.ABSOLUTE、RELATIVE_TO_SELF、RELATIVE_TO_PARENT 
 * @param pivotYValue/pivotY    缩放动画的中心点Y坐标 
 */  
public ScaleAnimation(float fromX, float toX, float fromY, float toY,  
                      int pivotXType, float pivotXValue, int pivotYType, float pivotYValue) {  
} 
ScaleAnimation scaleAnimation = new ScaleAnimation(1.0f, 4.0f, 1.0f, 4.0f, Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF, 0.0f);  
scaleAnimation.setDuration(2000);  
scaleAnimation.setFillAfter(true);  
imageView.startAnimation(scaleAnimation);  

位移(TranslateAnimation)

  • XML 方式:
  
  
  
      
  

注:用法同上。

  • 代码方式
/** 
 * 构造方法 
 * @param fromXType     动画开始时X轴的伸缩模式 
 * @param fromXValue    动画开始时当前view的X坐标 
 * @param toXType       动画结束时X轴的伸缩模式 
 * @param toXValue      动画结束时当前view的X坐标 
 * @param fromYType     动画开始时Y轴的伸缩模式 
 * @param fromYValue    动画开始时当前view的Y坐标 
 * @param toYType       动画结束时Y轴的伸缩模式 
 * @param toYValue      动画结束时当前view的Y坐标 
 */  
public TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue,  
                          int fromYType, float fromYValue, int toYType, float toYValue) {  
}
TranslateAnimation translateAnimation = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF, 2.0f, Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF, 2.0f);  
translateAnimation.setDuration(2000);  
translateAnimation.setFillAfter(true);  
imageView.startAnimation(translateAnimation);  

旋转(RotateAnimation)

  • XML 方式:
  
  
  
      
  

注:用法同上。

  • 代码方式
/** 
 * 构造方法 
 * @param fromDegrees   动画开始时旋转角度 
 * @param toDegrees     动画结束时旋转角度 
 * @param pivotXType    动画在X轴的旋转模式 
 * @param pivotXValue   动画相对于物件的X坐标开始位置 
 * @param pivotYType    动画在Y轴的旋转模式 
 * @param pivotYValue   动画相对于物件的Y坐标开始位置 
 */  
public RotateAnimation(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue,  
                       int pivotYType, float pivotYValue) {  
} 
RotateAnimation rotateAnimation = new RotateAnimation( 0, -720, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);  
rotateAnimation.setDuration(2000);  
rotateAnimation.setFillAfter(true);  
imageView.startAnimation(rotateAnimation);  

自定义补间动画

继承Animation,并重写这个抽象基类中的 applyTransformation 方法,在方法中实现具体的动画变换逻辑。

你可能感兴趣的:(Android 动画之补间动画(Tween Animation))