android 动画实践

"教程 "

Posted by Smm on November 15, 2017

动画 效果

这是最近写的两个动画。

关于动画都有这些

Animations

一、Animations介绍 Animations是一个实现android UI界面动画效果的API,Animations提供了一系列的动画效果,可以进行旋转、缩放、淡入淡出等,这些效果可以应用在绝大多数的控件中。

二、Animations的分类 Animations从总体上可以分为两大类:

1.Tweened Animations:该类Animations提供了旋转、移动、伸展和淡出等效果。Alpha——淡入淡出,Scale——缩放效果,Rotate——旋转,Translate——移动效果。

2.Frame-by-frame Animations:这一类Animations可以创建一个Drawable序列,这些Drawable可以按照指定的时间间歇一个一个的显示。

三、Animations的使用方法(代码中使用) Animations extends Object implements Cloneable 使用TweenedAnimations的步骤: 1.创建一个AnimationSet对象(Animation子类); 2.增加需要创建相应的Animation对象; 3.更加项目的需求,为Animation对象设置相应的数据; 4.将Animatin对象添加到AnimationSet对象当中; 5.使用控件对象开始执行AnimationSet。

Tweened Animations的分类

  1、Alpha:淡入淡出效果

  2、Scale:缩放效果

  3、Rotate:旋转效果

  4、Translate:移动效果

Animation的四个子类:   AlphaAnimation、TranslateAnimation、ScaleAnimation、RotateAnimation 四、具体实现

AlphaAnimation 使用

       //创建一个AnimationSet对象,参数为Boolean型,
       //true表示使用Animation的interpolator,false则是使用自己的
       AnimationSet animationSet = new AnimationSet(true);
       //创建一个AlphaAnimation对象,参数从完全的透明度,到完全的不透明
       AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);
       //设置动画执行的时间
       alphaAnimation.setDuration(500);
       //将alphaAnimation对象添加到AnimationSet当中
       animationSet.addAnimation(alphaAnimation);
       //使用ImageView的startAnimation方法执行动画
       image.startAnimation(animationSet);

RotateAnimation 使用

       AnimationSet animationSet = new AnimationSet(true);
       //参数1:从哪个旋转角度开始
       //参数2:转到什么角度
       //后4个参数用于设置围绕着旋转的圆的圆心在哪里
       //参数3:确定x轴坐标的类型,有ABSOLUT绝对坐标、RELATIVE_TO_SELF相对于自身坐标、RELATIVE_TO_PARENT相对于父控件的坐标
       //参数4:x轴的值,0.5f表明是以自身这个控件的一半长度为x轴
       //参数5:确定y轴坐标的类型
       //参数6:y轴的值,0.5f表明是以自身这个控件的一半长度为x轴
       RotateAnimation rotateAnimation = new RotateAnimation(0, 360,
              Animation.RELATIVE_TO_SELF,0.5f,
              Animation.RELATIVE_TO_SELF,0.5f);
       rotateAnimation.setDuration(1000);
       animationSet.addAnimation(rotateAnimation);
       image.startAnimation(animationSet);

ScaleAnimation 使用

       AnimationSet animationSet = new AnimationSet(true);
       //参数1:x轴的初始值
       //参数2:x轴收缩后的值
       //参数3:y轴的初始值
       //参数4:y轴收缩后的值
       //参数5:确定x轴坐标的类型
       //参数6:x轴的值,0.5f表明是以自身这个控件的一半长度为x轴
       //参数7:确定y轴坐标的类型
       //参数8:y轴的值,0.5f表明是以自身这个控件的一半长度为x轴
       ScaleAnimation scaleAnimation = new ScaleAnimation(
              0, 0.1f,0,0.1f,
              Animation.RELATIVE_TO_SELF,0.5f,
              Animation.RELATIVE_TO_SELF,0.5f);
       scaleAnimation.setDuration(1000);
       animationSet.addAnimation(scaleAnimation);
       image.startAnimation(animationSet);

TranslateAnimation 使用

       AnimationSet animationSet = new AnimationSet(true);
       //参数1~2:x轴的开始位置
       //参数3~4:y轴的开始位置
       //参数5~6:x轴的结束位置
       //参数7~8:x轴的结束位置
       TranslateAnimation translateAnimation =
          new TranslateAnimation(
              Animation.RELATIVE_TO_SELF,0f,
              Animation.RELATIVE_TO_SELF,0.5f,
              Animation.RELATIVE_TO_SELF,0f,
              Animation.RELATIVE_TO_SELF,0.5f);
       translateAnimation.setDuration(1000);
       animationSet.addAnimation(translateAnimation);
       image.startAnimation(animationSet);

AnimationSet 的使用 可以集合一起使用,可以addAnimation 好几种方法 下面有 怎么使用

Tween Animations的通用方法

  1、setDuration(long durationMills)
  设置动画持续时间(单位:毫秒)
  2、setFillAfter(Boolean fillAfter)
  如果fillAfter的值为true,则动画执行后,控件将停留在执行结束的状态
  3、setFillBefore(Boolean fillBefore)
  如果fillBefore的值为true,则动画执行后,控件将回到动画执行之前的状态
  4、setStartOffSet(long startOffSet)
  设置动画执行之前的等待时间
  5、setRepeatCount(int repeatCount)
  设置动画重复执行的次数

在代码中使用Animations可以很方便的调试、运行,但是代码的可重用性差,重复代码多。同样可以在xml文件中配置Animations,这样做可维护性变高了,只不过不容易进行调试。

一、在xml中使用Animations步骤 1.在res文件夹下建立一个anim文件夹; 2.创建xml文件,并首先加入set标签,更改标签如下:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator">
</set>

3.在该标签当中加入rotate,alpha,scale或者translate标签;

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

4.在代码当中使用AnimationUtils当中装载xml文件,并生成Animation对象。因为Animation是AnimationSet的子类,所以向上转型,用Animation对象接收。

Animation animation = AnimationUtils.loadAnimation(
                  Animation1Activity.this, R.anim.alpha);
           // 启动动画
           image.startAnimation(animation);

二、具体实现

 1、  alpha.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator">
    <!-- fromAlpha和toAlpha是起始透明度和结束时透明度 -->
    <alpha
        android:fromAlpha="1.0"
        android:toAlpha="0.0"
        android:startOffset="500"
        android:duration="500"/>
</set>
2、  rotate.xml
 
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator">
    <!--
        fromDegrees:开始的角度
        toDegrees:结束的角度,+表示是正的
        pivotX:用于设置旋转时的x轴坐标
        例
           1)当值为"50",表示使用绝对位置定位
           2)当值为"50%",表示使用相对于控件本身定位
           3)当值为"50%p",表示使用相对于控件的父控件定位
        pivotY:用于设置旋转时的y轴坐标
      -->
    <rotate
        android:fromDegrees="0"
        android:toDegrees="+360"
        android:pivotX="50%"
        android:pivotY="50%"
        android:duration="1000"/>
</set>
3、  scale.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator">
   <!--
       起始x轴坐标
           止x轴坐标
           始y轴坐标
           止y轴坐标
           轴的坐标
           轴的坐标
     -->
   <scale
       android:fromXScale="1.0"
       android:toXScale="0.0"
       android:fromYScale="1.0"
       android:toYScale="0.0"
       android:pivotX="50%"
       android:pivotY="50%"
       android:duration="1000"/>
</set>
 
4、  translate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator">
    <!--
           始x轴坐标
           止x轴坐标
           始y轴坐标
           止y轴坐标
      -->
    <translate
        android:fromXDelta="0%"
        android:toXDelta="100%"
        android:fromYDelta="0%"
        android:toYDelta="100%"
        android:duration="2000"/>
</set>

5、 .java文件

       // 使用AnimationUtils装载动画配置文件
       Animation animation = AnimationUtils.loadAnimation(
              Animation1Activity.this, R.anim.alpha);
       // 启动动画
       image.startAnimation(animation);
  
       Animation animation = AnimationUtils.loadAnimation(
              Animation1Activity.this, R.anim.rotate);
       image.startAnimation(animation);
   
       Animation animation = AnimationUtils.loadAnimation(
              Animation1Activity.this, R.anim.scale);
       image.startAnimation(animation);
   
       Animation animation = AnimationUtils.loadAnimation(Animation1Activity.this, R.anim.translate);
       image.startAnimation(animation);

AnimationSet的具体使用方法

   1.AnimationSet是Animation的子类;
 
   2.一个AnimationSet包含了一系列的Animation;
 
   3.针对AnimationSet设置一些Animation的常见属性(如startOffset,duration等),可以被包含在AnimationSet当中的Animation集成;

例:一个AnimationSet中有两个Animation,效果叠加

综合使用

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator"
    android:shareInterpolator="true">
    <!-- fromAlpha和toAlpha是起始透明度和结束时透明度 -->
    <alpha
        android:fromAlpha="1.0"
        android:toAlpha="0.0"
        android:startOffset="500"
        android:duration="500"/>
    <translate
        android:fromXDelta="0%"
        android:toXDelta="100%"
        android:fromYDelta="0%"
        android:toYDelta="100%"
        android:duration="2000"/>
</set>
 
 
       // 使用AnimationUtils装载动画配置文件
       Animation animation = AnimationUtils.loadAnimation(
              Animation2Activity.this, R.anim. doubleani);
       // 启动动画
       image.startAnimation(animation);
   }
}

第二种方法:

       AnimationSet animationSet = new AnimationSet(true);
       AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);
       RotateAnimation rotateAnimation = new RotateAnimation(0, 360,
              Animation.RELATIVE_TO_SELF,0.5f,
              Animation.RELATIVE_TO_SELF,0.5f);
       rotateAnimation.setDuration(1000);
       animationSet.addAnimation(rotateAnimation);
       animationSet.addAnimation(alphaAnimation);
       image.startAnimation(animationSet);

Interpolator的具体使用方法

   Interpolator定义了动画变化的速率,在Animations框架当中定义了一下几种Interpolator
     AccelerateDecelerateInterpolator:在动画开始与结束的地方速率改变比较慢,在中间的时候速率快。
     AccelerateInterpolator:在动画开始的地方速率改变比较慢,然后开始加速
     CycleInterpolator:动画循环播放特定的次数,速率改变沿着正弦曲线
     DecelerateInterpolator:在动画开始的地方速率改变比较慢,然后开始减速
     LinearInterpolator:动画以均匀的速率改变

分为以下几种情况: 1、在set标签中

<set xmlns:android="http://schemas.android.com/apk/res/android"	
	android:interpolator="@android:anim/accelerate_interpolator"/>

2、如果在一个set标签中包含多个动画效果,如果想让这些动画效果共享一个Interpolator。

android:shareInterpolator="true"

3、如果不想共享一个interpolator,则设置android:shareInterpolator=”true”,并且需要在每一个动画效果处添加

interpolator。

<alpha
    android:interpolator="@android:anim/accelerate_decelerate_interpolator"
    android:fromAlpha="1.0"
    android:toAlpha="0.0"
    android:startOffset="500"
    android:duration="500"/>

4、如果是在代码上设置共享一个interpolator,则可以在AnimationSet设置interpolator。

AnimationSet animationSet = newAnimationSet(true);
animationSet.setInterpolator(new AccelerateInterpolator());

5、如果不设置共享一个interpolator则可以在每一个Animation对象上面设置interpolator。

AnimationSet animationSet = newAnimationSet(false);
alphaAnimation.setInterpolator(new AccelerateInterpolator());
rotateAnimation.setInterpolator(new DecelerateInterpolator());

Frame-By-Frame Animations的使用方法

Frame-By-Frame Animations是一帧一帧的格式显示动画效果。类似于电影胶片拍摄的手法。

 main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout
        android:orientation="horizontal"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content">
       <Button
           android:id="@+id/button"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:text="运动"/>
    </LinearLayout>
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
       <ImageView
           android:id="@+id/image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"/>
    </LinearLayout>
</LinearLayout>

3、anim.xml

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
    <item android:drawable="@drawable/a_01" android:duration="50"/>
    <item android:drawable="@drawable/a_02" android:duration="50"/>
    <item android:drawable="@drawable/a_03" android:duration="50"/>
    <item android:drawable="@drawable/a_04" android:duration="50"/>
    <item android:drawable="@drawable/a_05" android:duration="50"/>
    <item android:drawable="@drawable/a_06" android:duration="50"/>
</animation-list>

4、.java文件

    private Button button = null;
    private ImageView imageView = null;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        button = (Button)findViewById(R.id.button);
        imageView = (ImageView)findViewById(R.id.image);
        button.setOnClickListener(newButtonListener());
    }
    class ButtonListener implementsOnClickListener{
       public void onClick(View v) {
           imageView.setBackgroundResource(R.anim.anim);
           AnimationDrawable animationDrawable = (AnimationDrawable)
              imageView.getBackground();
           animationDrawable.start();
       }
    }
}

LayoutAnimationsController

1、什么是LayoutAnimationsController

LayoutAnimationsController可以用于实现使多个控件按顺序一个一个的显示。

1)LayoutAnimationsController用于为一个layout里面的控件,或者是一个ViewGroup里面的控件设置统一的动画效果。

2)每一个控件都有相同的动画效果。

3)控件的动画效果可以在不同的时间显示出来。

4)LayoutAnimationsController可以在xml文件当中设置,以可以在代码当中进行设置。

2、在xml当中使用LayoutAnimationController

1)在res/anim文件夹下创建一个名为list_anim_layout.xml文件: android:delay - 动画间隔时间;子类动画时间间隔 (延迟) 70% 也可以是一个浮点数 如“1.2”等 android:animationOrder - 动画执行的循序(normal:顺序,random:随机,reverse:反向显示) android:animation – 引用动画效果文件

<layoutAnimation
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:delay="0.5"
    android:animationOrder="normal"
    android:animation="@anim/list_anim"/>

2)创建list_anim.xml文件,设置动画效果

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator"
    android:shareInterpolator="true">
    <alpha
       android:fromAlpha="0.0"
       android:toAlpha="1.0"
       android:duration="1000"/>
</set>

4)程序结构

3、在代码当中使用LayoutAnimationController 1)去掉main.xml中的android:layoutAnimation=”@anim/list_anim_layout”/> 2)创建一个Animation对象:可以通过装载xml文件,或者是直接使用Animation的构造方法创建Animation对象;

Animation animation = (Animation) AnimationUtils.loadAnimation(
              Animation2Activity.this, R.anim.list_anim);

3)创建LayoutAnimationController对象:

LayoutAnimationController controller = new LayoutAnimationController(animation); 

4)设置控件的显示顺序以及延迟时间

controller.setOrder(LayoutAnimationController.ORDER_NORMAL); 
controller.setDelay(0.5f);

5)为ListView设置LayoutAnimationController属性:

listView.setLayoutAnimation(controller);

完整代码:

       listView.setAdapter(createListAdapter());
       Animation animation = (Animation) AnimationUtils.loadAnimation(
              Animation2Activity.this, R.anim.list_anim);
      
       LayoutAnimationController controller = new LayoutAnimationController(animation); 
       controller.setOrder(LayoutAnimationController.ORDER_NORMAL); 
       controller.setDelay(0.5f);
       listView.setLayoutAnimation(controller); 

AnimationListener 1、什么是AnimationListener

1).AnimationListener是一个监听器,该监听器在动画执行的各个阶段会得到通知,从而调用相应的方法;

2).AnimationListener主要包括如下三个方法:

      ·onAnimationEnd(Animation animation) - 当动画结束时调用

      ·onAnimationRepeat(Animation animation) - 当动画重复时调用

     ·onAniamtionStart(Animation animation) - 当动画启动时调用

使用方式

           //淡入
           AlphaAnimation animation = new AlphaAnimation(0.0f, 1.0f);
           animation.setDuration(1000);
           animation.setStartOffset(500);
           //创建一个新的ImageView
           ImageView newImageView = new ImageView(
              Animation2Activity.this);
           newImageView.setImageResource(R.drawable.an);
           viewGroup.addView(newImageView,
              new LayoutParams(
                  LayoutParams.FILL_PARENT,
                  LayoutParams.WRAP_CONTENT));
           newImageView.startAnimation(animation);
       }
    }
    private class DeleteButtonListener implements OnClickListener{
       public void onClick(View v) {
           //淡出
           AlphaAnimation animation = new AlphaAnimation(1.0f, 0.0f);
           animation.setDuration(1000);
           animation.setStartOffset(500);
           //为Aniamtion对象设置监听器
           animation.setAnimationListener(
              new RemoveAnimationListener());
           imageView.startAnimation(animation);
       }
    }

3、总结一下 可以在Activity中动态添加和删除控件,方法是: 1)取到那个Layout

viewGroup = (ViewGroup)findViewById(R.id.layout);

2)添加时,先创建对象,然后添加

ImageView newImageView = new ImageView(
          Animation2Activity.this);
newImageView.setImageResource(R.drawable.an);
viewGroup.addView(newImageView,
          new LayoutParams(
              LayoutParams.FILL_PARENT,
              LayoutParams.WRAP_CONTENT)); 3)删除时,直接删除。

viewGroup.removeView(imageView);

基础介绍结束

有时候看着并没有什么用,改用的时候依然不知道怎么用

第一个gif 图中 使用的动画是 移动和缩小效果

在移动过程还是判断移动的位置变化,参数怎么判断和变化还得计算出来,所有这个变得很重要。

想要把他写好也是很费劲的一点。 还有缩小 效果。

同比例缩小 还得依靠 中心点 缩小。

基础中 很重要的一点,看一下源码

public ScaleAnimation(float fromX, float toX, float fromY, float toY, float pivotX, float pivotY) {
    throw new RuntimeException("Stub!");
}

public ScaleAnimation(float fromX, float toX, float fromY, float toY, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue) {
    throw new RuntimeException("Stub!");
}

这个源码参数中可以看出来 后面的多出两个参数,这两个是做什么的?

new ScaleAnimation(1f, 0.5f, 1f, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f)

set.addAnimation(new ScaleAnimation(1f, 0.5f, 0.5f, 0.5f));

这就是两种缩小的的效果,但是一个是我们想要的,第二个就不是我们想要的,因为改变其属性。

第二个gif 怎么做的能 首先由两种方式 gif 显示或这个 Frame-By-Frame 中使用都是可以的, 牵扯到 下来总为了效果做成了gif 的替换起来也很简单额,所有沿用了。

大神这作

NineOldAndroids

AndroidViewAnimations

NineOldAndroids animation 封装

收集效果集合

其他

这就多个效果在一起 ,移动 渐变,缩放效果

主要方法在这里了

/**
 * 打开菜单的动画
 *
 * @param view   执行动画的view
 * @param index  view在动画序列中的顺序
 * @param total  动画序列的个数
 * @param radius 动画半径
 */
private void doAnimateOpen(View view, int index, int total, int radius) {
    if (view.getVisibility() != View.VISIBLE) {
        view.setVisibility(View.VISIBLE);
    }
    double degree = Math.PI * index / ((total - 1) * 2);
    int translationX = (int) (radius * Math.cos(degree));
    int translationY = (int) (radius * Math.sin(degree));
    Log.d(TAG, String.format("degree=%f, translationX=%d, translationY=%d",
            degree, translationX, translationY));
    AnimatorSet set = new AnimatorSet();
    //包含平移、缩放和透明度动画
    set.playTogether(
            ObjectAnimator.ofFloat(view, "translationX", 0, translationX),
            ObjectAnimator.ofFloat(view, "translationY", 0, translationY),
            ObjectAnimator.ofFloat(view, "scaleX", 0f, 1f),
            ObjectAnimator.ofFloat(view, "scaleY", 0f, 1f),
            ObjectAnimator.ofFloat(view, "alpha", 0f, 1));
    //动画周期为500ms
    set.setDuration(1 * 500).start();
}

/**
 * 关闭菜单的动画
 *
 * @param view   执行动画的view
 * @param index  view在动画序列中的顺序
 * @param total  动画序列的个数
 * @param radius 动画半径
 */
private void doAnimateClose(final View view, int index, int total,
                            int radius) {
    if (view.getVisibility() != View.VISIBLE) {
        view.setVisibility(View.VISIBLE);
    }
    double degree = Math.PI * index / ((total - 1) * 2);
    int translationX = (int) (radius * Math.cos(degree));
    int translationY = (int) (radius * Math.sin(degree));
    Log.d(TAG, String.format("degree=%f, translationX=%d, translationY=%d",
            degree, translationX, translationY));
    AnimatorSet set = new AnimatorSet();
    //包含平移、缩放和透明度动画
    set.playTogether(
            ObjectAnimator.ofFloat(view, "translationX", translationX, 0),
            ObjectAnimator.ofFloat(view, "translationY", translationY, 0),
            ObjectAnimator.ofFloat(view, "scaleX", 1f, 0f),
            ObjectAnimator.ofFloat(view, "scaleY", 1f, 0f),
            ObjectAnimator.ofFloat(view, "alpha", 1f, 0f));
    //为动画加上事件监听,当动画结束的时候,我们把当前view隐藏
    set.addListener(new Animator.AnimatorListener() {
        @Override
        public void onAnimationStart(Animator animator) {
        }

        @Override
        public void onAnimationRepeat(Animator animator) {
        }

        @Override
        public void onAnimationEnd(Animator animator) {
            view.setVisibility(View.GONE);
        }

        @Override
        public void onAnimationCancel(Animator animator) {
        }
    });

    set.setDuration(1 * 500).start();
}

仔细阅读源码原理也不是很那理解。打开和关闭只是反向处理就可以了。

TimeInterpolator和TypeEvaluator

TimeInterpolator中文翻译为时间插值器,它的作用是根据时间流逝的百分比来计算出当前属性值改变的百分比,系统预置的有LinearInterpolator(线性插值器:匀速动画)、AccelerateDecelerateInterpolator(加速减速插值器:动画两头慢中间快)和DecelerateInterpolator(减速插值器:动画越来越慢)等;TypeEvaluator的中文翻译为类型估值算法,它的作用是根据当前属性改变的百分比来计算改变后的属性值,系统预置的有IntEvaluator(针对整型属性)、FloatEvaluator(针对浮点型属性)和ArgbEvaluator(针对Color属性)。可能这么说还有点晦涩,没关系,下面给出一个实例就很好理解了。

看上述动画,很显然上述动画是一个匀速动画,其采用了线性插值器和整型估值算法,在40ms内,View的x属性实现从0到40的变换,由于动画的默认刷新率为10ms/帧,所以该动画将分5帧进行,我们来考虑第三帧(x=20 t=20ms),当时间t=20ms的时候,时间流逝的百分比是0.5 (20/40=0.5),意味这现在时间过了一半,那x应该改变多少呢,这个就由插值器和估值算法来确定。拿线性插值器来说,当时间流逝一半的时候,x的变换也应该是一半,即x的改变是0.5,为什么呢?因为它是线性插值器,是实现匀速动画的,下面看它的源码:

public class LinearInterpolator implements Interpolator {  
  
    public LinearInterpolator() {  
    }  
      
    public LinearInterpolator(Context context, AttributeSet attrs) {  
    }  
      
    public float getInterpolation(float input) {  
        return input;  
    }  
}  

很显然,线性插值器的返回值和输入值一样,因此插值器返回的值是0.5,这意味着x的改变是0.5,这个时候插值器的工作就完成了。 具体x变成了什么值,这个需要估值算法来确定,我们来看看整型估值算法的源码:

public class IntEvaluator implements TypeEvaluator<Integer> {  
  
    public Integer evaluate(float fraction, Integer startValue, Integer endValue) {  
        int startInt = startValue;  
        return (int)(startInt + fraction * (endValue - startInt));  
    }  
}   上述算法很简单,evaluate的三个参数分别表示:估值小数、开始值和结束值,对应于我们的例子就分别是:0.5,0,40。根据上述算法,整型估值返回给我们的结果是20,这就是(x=20 t=20ms)的由来。 说明:属性动画要求该属性有set方法和get方法(可选);插值器和估值算法除了系统提供的外,我们还可以自定义,实现方式也很简单,因为插值器和估值算法都是一个接口,且内部都只有一个方法,我们只要派生一个类实现接口就可以了,然后你就可以做出千奇百怪的动画效果。具体一点就是:自定义插值器需要实现Interpolator或者TimeInterpolator,自定义估值算法需要实现TypeEvaluator。还有就是如果你对其他类型(非int、float、color)做动画,你必须要自定义类型估值算法。

这篇的目的

知道怎么做的还得知道其原理是什么。不要糊里糊涂做出来就结束了。 在动画方面真的还会小学生水平,在自定义view 中的使用 以及综合使用情况真的很难把握。