1、前言：
在前一篇博客当中楼主介绍了一下关于DrawableAnimation的使用，今天来介绍一下关于Android当中的另外一种动画的实现机制，那就是Tween Animation的实现（补间动画）也有人称呼它为View动画，这种动画框架在Android3.0之前可为是Android中的一家独大，同时也让我们开发人员精疲力尽，为什么这么说呢？因为View动画，他操作的是View的改变，而View的一些具体的属性是没有改变的，最常见的就是我们给他设置的OnClickListener，view移动了，事件却不跟着他进行移动，Google当然也不会容忍这种事发生，所以就在Android3.0以后的 版本当中推出了属性动画来解决我们开发人员所面临的尴尬的问题。我们现在学习它也要掌握它的实现思想。好了，我们来看一看，它的实现吧
2、正文：
<1>、都有哪些动画？
其实现在看来我们的Tween Animation确实有一定的局限性，因为他只提供了，透明度，旋转，缩放，位移这几种常见的动画，我们也可以这么理解，就是如果我们掌握了透明度，旋转，缩放，平移，外加它们这些动画是怎么实现的，自己去实现一个自己的动画，那么恭喜你，你可以过关，过关以后，去看楼主的下一篇博客，属性动画。
<2>、Tween Animation的实现原理。
刚刚在前面说过Tween Animation定义了几种常见的动画，其实它的实现，就是控制View，在每次绘制视图的时候，去在View的ViewGroup中drawChild方法中获取该View的Animation的Transformation值，canvas.concat(transfoemToApply.getMatrix()),通过矩阵去实现动画的帧，如果该动画没有完成，则通过invalidate()方法进行不断地重绘，从而达到整个动画的绘制
补充：首先我们应该明白在我们每一个View当中都有一个Animation对象，而这个对象当中有一个Transformation对象，而这个对象里面维护了一个可以根据时间因子改变的Matrix，，然后我们通过canvas.concat(transfoemToApply.getMatrix())获取我们的矩阵，从而实现我们的动画，这一块的内容我也会在后续博客当中跟大家说到。
<3>、API,语法：
我们的Tween Animation的实现，主要分成了两部分，我们可以通过代码去控制我们的动画，我们也可以通过XML定义我们的动画，定义好了以后我们只需要在代码当中加载一下，便可以使用了，
<1>、通过XML去定义动画，如果我们要去定义一个XML的动画，我们需要在/res/anim/目录下创建相应的XML文件，
Alpha：淡入淡出动画效果
<span style="font-size:18px;"><alpha
android:fromAlpha="1.0"
android:toAlpha="0.0"
android:duration="500" />
<!--
fromAlpha:开始时透明度，透明度在0和1之间取值，类型是float类型
toAlpha： 结束时透明度
duration：动画持续时间
--> </span>rotate：旋转效果
<span style="font-size:18px;"><rotate
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromDegrees="300"
android:toDegrees="-360"
android:pivotX="10%"
android:pivotY="100%"
android:duration="10000" />
<!--
fromDegrees 动画开始时的角度
toDegrees 动画结束时物件的旋转角度,正代表顺时针
pivotX 属性为动画相对于物件的X坐标的开始位置
pivotY 属性为动画相对于物件的Y坐标的开始位置
-->
</span>
scale：缩放效果：
<scale
android:interpolator= "@android:anim/decelerate_interpolator"
android:fromXScale="0.0"
android:toXScale="1.5"
android:fromYScale="0.0"
android:toYScale="1.5"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="0"
android:duration="10000"
android:repeatCount="1"
android:repeatMode="reverse" />
<!--
fromXDelta,fromYDelta 起始时X，Y座标,屏幕右下角的座标是X:320,Y:480
toXDelta， toYDelta 动画结束时X,Y的座标
-->
<!--
fromXScale,fromYScale， 动画开始前X,Y的缩放，0.0为不显示，1.0为正常大小
toXScale，toYScale， 动画最终缩放的倍数， 1.0为正常大小，大于1.0放大
pivotX， pivotY 动画起始位置，相对于屏幕的百分比,两个都为50%表示动画从屏幕中间开始
startOffset， 动画多次执行的间隔时间，如果只执行一次，执行前会暂停这段时间，单位毫秒
duration， 一次动画效果消耗的时间，单位毫秒，值越小动画速度越快
repeatCount， 动画重复的计数，动画将会执行该值+1次
repeatMode， 动画重复的模式，reverse为反向，当第偶次执行时，动画方向会相反。restart为重新执行，方向不变
--> translate.xml 移动效果：
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="320"
android:toXDelta="0"
android:fromYDelta="480"
android:toYDelta="0"
android:duration="10000" />
</set>
<!--
fromXDelta,fromYDelta 起始时X，Y座标,屏幕右下角的座标是X:320,Y:480
toXDelta， toYDelta 动画结束时X,Y的座标
--> 下面单独说说关于interpolator
指定动画插入器，所谓的插入器，说白了就是用来控制动画速度的一个控制器而在XML当中可以使用的是三种，分别是
accelerate_decelerate_interpolator 先加速-后减速插入器
accelerate_interpolator， 加速插入器
decelerate_interpolator。 减速插入器
当我们定义完成以后呢，我们就可以在Java代码当中使用
Animation animation = AnimationUtils.loadAnimation(this, R.anim.XXXX);
view.startAnimation(animation);以上就是我们使用XML来定义动画的API。下面我们来看看如何使用代码来实现我们的动画，如果我们要去使用代码来实现动画，首先我还是要在这里给大家介绍代码API
在这里我们首先来看动画的抽象类，Animation，这个类是Tween Animation动画具体实现类的基类，提供了动画启动，停止，重复，持续时间等方法
Animation 有如下常用方法：
setDuration(long time) 设置动画持续时间，单位为毫秒。
startNow(); 启动动画的主要方法，使用之前必须先使用setAnimation()为某一个View对象设置动画，另外用户可以是用View组件的startAnimation();来启动动画。
start();和上述方法功能一直，区别在与该方法可以用于getTransfoemation()；方法被调用时启动动画
cancel();用户取消动画，
setRepeatCount(int repeatCount);设置动画重复次数，设置为n 执行n+1次动画，为-1，一直
setFillEnables(boolean fillEnabled);根据boolean值来实现是否开启填充效果，
setRepeatMode(int repeatMode):RESTART:重新从头开始，REVERSE:表示反方向执行
setSatartOffset(long startOffset):动画延迟startOffset毫秒开始执行。
AlphaAnimation：透明度变换动画：
new AlphaAnimation(float fromAlpha, float toAlpha);构建透明度渐变动画，从fromAlpha到toAlpha
ScaleAnimation：缩放动画：
new ScaleAnimation(float fromX, float toX, float fromY, float toY, int pivotXType, folatpivotXValus,int pivotYType, folatpivotYValus);以（<pivotXType模式，pivotXValus的值>,<pivotYType模式，pivotYValus的值>）坐标点为缩放中心，在X方向比例从fromX到toX，在Y方向比例从fromY到toY。
TranslateAnimation：平移动画：
newTranslateAnimation(float fromXDelta, float toXDelta,float fromYDelta,float toYDelta);坐标点从（ fromXDelta, fromYDelta）到（toXDelta，toYDelta）
RotateAnimation：旋转动画：
newRotateAnimation(float fromDegress, float toDegress,int pivotXType, folat pivotXValus, int pivotYType, folatpivotYValus)以（<pivotXType模式，pivotXValus的值>,<pivotYType模式，pivotYValus的值>）坐标点为旋转中心，从fromDegress度旋转到toDegress。
关于动画的插值器，(Interpolators)的使用。
AccelerateDecelerateInterpolators：慢慢开始和结束，在中间加速。
AccelerateInterpolators：慢慢开始，然后加快速度。
AnticipateInterpolator：开始向后，然后向前
AnticipateOvershootInterpolator：开始向后，然后向前，超过目标值，然后返回目标值
BounceInterpolator:动画在结束的时候弹起
CycleInterpolator：动画循环特定的次数，速率变化方式为正玄曲线
DecelerateInterpolator：开始快，然后慢
LinearInterpolator：以恒定的速率变化
OvershootInterpolator：向前冲一定值后再回到原来的位置
TimeInterpolator：这一个比较特殊，它的存在就是为我们自定义而生的，在下一节楼主的博客中，为大家详细讲解
以上就是动画的所有API,但是我们的问题来了，如果我想对一个View同时去执行多个动画的时候我们应该怎么办呢。这个时候我们就又要介绍另外的一个API了，那就是AniamtionSet，其实大家可以把它想象成为是一个动画的集合，我们把我们所拿到的多个动画放入其中，然后让我们的View对象去开启他就OK了，好了，下面我们直接开始一个Animation的小Demo，让大家可以更好地去理解我们的的Tween Animation。
我们通过几个Button去控制我们的动画，然后用一个ImageView作为这个动画的载体，就这么简单。
大家会觉得为什么在缩放上面的变换不是很平滑呢，那是楼主在上面加入了插值器的效果，插值器效果很多，在这里楼主就不一一列举了，下面给大家看代码，/res/layout/activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ImageView
android:id="@+id/image"
android:padding="20dip"
android:layout_width="match_parent"
android:layout_height="350dip"
android:src="@mipmap/empty_logo_black"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
>
<Button
android:layout_width="0dip"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
android:text="透明度"
android:onClick="alpha"
android:textColor="#fff"/>
<Button
android:layout_width="0dip"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
android:text="缩放"
android:onClick="scale"
android:textColor="#fff"/>
<Button
android:layout_width="0dip"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
android:onClick="rotate"
android:text="旋转"
android:textColor="#fff"/>
<Button
android:layout_width="0dip"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
android:text="平移"
android:onClick="translate"
android:textColor="#fff"/>
<Button
android:layout_width="0dip"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
android:text="全部"
android:onClick="all"
android:textColor="#fff"/>
</LinearLayout>
</RelativeLayout>
Java代码如下所示，MainActivity.Java
package com.suansuan.tweenanimation;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.animation.AlphaAnimation;
import android.view.animation.AnimationSet;
import android.view.animation.AnticipateOvershootInterpolator;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
public class MainActivity extends AppCompatActivity {
private ImageView mImage;
private long duration = 1000;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mImage = (ImageView) findViewById(R.id.image);
}
/** 淡入淡出动画 */
public void alpha(View view){
AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);
alphaAnimation.setDuration(duration);
//保持最后的状态，
alphaAnimation.setFillAfter(true);
mImage.startAnimation(alphaAnimation);
}
/** 缩放动画 */
public void scale(View view){
ScaleAnimation scaleAnimation = new ScaleAnimation(1f, 0f, 1f, 0f,ScaleAnimation.RELATIVE_TO_SELF, 0.5f,
ScaleAnimation.RELATIVE_TO_SELF, 0.5f);
scaleAnimation.setDuration(duration);
scaleAnimation.setInterpolator(new AnticipateOvershootInterpolator());
//保持最后的状态，
scaleAnimation.setFillAfter(true);
mImage.startAnimation(scaleAnimation);
}
/** 旋转动画 */
public void rotate(View view){
RotateAnimation rotateAnimation = new RotateAnimation(0f, 360f, ScaleAnimation.RELATIVE_TO_SELF, 0.5f,
ScaleAnimation.RELATIVE_TO_SELF, 0.5f);
rotateAnimation.setDuration(duration);
//保持最后的状态，
rotateAnimation.setFillAfter(true);
mImage.startAnimation(rotateAnimation);
}
/** 平移动画 */
public void translate(View view){
TranslateAnimation translateAnimation = new TranslateAnimation(0, 0, 0, 500);
translateAnimation.setDuration(duration);
//保持最后的状态，
translateAnimation.setFillAfter(true);
mImage.startAnimation(translateAnimation);
}
/** 使用AnimationSet全部执行 */
public void all(View view){
AnimationSet animationSet = new AnimationSet(false);
AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);
animationSet.addAnimation(alphaAnimation);
ScaleAnimation scaleAnimation = new ScaleAnimation(1f, 0f, 1f, 0f,ScaleAnimation.RELATIVE_TO_SELF, 0.5f,
ScaleAnimation.RELATIVE_TO_SELF, 0.5f);
animationSet.addAnimation(scaleAnimation);
RotateAnimation rotateAnimation = new RotateAnimation(0f, 360f, ScaleAnimation.RELATIVE_TO_SELF, 0.5f,
ScaleAnimation.RELATIVE_TO_SELF, 0.5f);
animationSet.addAnimation(rotateAnimation);
TranslateAnimation translateAnimation = new TranslateAnimation(0, 0, 0, 500);
animationSet.addAnimation(translateAnimation);
animationSet.setDuration(6000);
mImage.startAnimation(animationSet);
}
}
最后一点，我说说动画的监听吧，
<pre name="code" class="java"> mAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
//动画将要开始的时候的监听回调
}
@Override
public void onAnimationEnd(Animation animation) {
//动画结束的时候的监听回调
}
@Override
public void onAnimationRepeat(Animation animation) {
//当动画重复时回调
}
});好了 以上就是我们Tween Animation的基础知识，其实在我们平时开发当中还有好多，一篇博客根部就写不完，所以在这里说下常用的基础知识。好了，下面我们去做一个练习，我们做一个在我们的ListView下拉的时候，我们下来出来的Item增加动画效果，好了我们先看一下效果，很简单对吧，但是有很多的Bug，没关系，我们学习了属性动画以后会在很大的程度上面去改变，去优化的。
我们去看看是怎么实现的把，我们这里使用到了一个开源的库，而这个库的作用就是随机生成好看的颜色，
compile 'com.github.lzyzsd.randomcolor:library:1.0.0'
这就是这个库的链接，如果是使用Eclipse的同学，请到Github上面下载，我们先看资源文件/res/layout/activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:padding="5dip"
android:layout_height="match_parent">
<ListView
android:id="@+id/lv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:dividerHeight="5dip"
/>
</LinearLayout>很简短，就是一个ListView。
package com.suansuan.textapplication.textanimator;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.AlphaAnimation;
import android.view.animation.AnimationSet;
import android.view.animation.AnticipateOvershootInterpolator;
import android.view.animation.ScaleAnimation;
import android.widget.AbsListView;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import com.github.lzyzsd.randomcolor.RandomColor;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private AnimationSet mAnimation;
private List<Integer> list;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
/** 初始化View */
private void initView() {
ListView mListView = (ListView) findViewById(R.id.lv);
initAnimation();
list = new ArrayList<>();
mListView.setAdapter(new MyAdapter());
}
/** 初始化Animation */
private void initAnimation() {
mAnimation = new AnimationSet(true);
ScaleAnimation scaleAnimation = new ScaleAnimation(0.8f, 1f, 1f, 1f, ScaleAnimation.RELATIVE_TO_SELF, 0.5f,
ScaleAnimation.RELATIVE_TO_SELF, 0.5f);
mAnimation.addAnimation(scaleAnimation);
AlphaAnimation alphaAnimation = new AlphaAnimation(0.2f, 1f);
mAnimation.addAnimation(alphaAnimation);
mAnimation.setDuration(1000);
mAnimation.setInterpolator(new AnticipateOvershootInterpolator());
}
/** ListView的数据适配器 */
class MyAdapter extends BaseAdapter{
@Override
public int getCount() {
return 20;
}
@Override
public Object getItem(int position) {
return null;
}
@Override
public long getItemId(int position) {
return 0;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
RandomColor randomColor = new RandomColor();
if(convertView == null){
convertView = new ImageView(getApplicationContext());
AbsListView.LayoutParams layoutParams = new AbsListView.LayoutParams(AbsListView.LayoutParams.MATCH_PARENT, 400);
convertView.setLayoutParams(layoutParams);
convertView.setBackgroundColor(randomColor.randomColor());
}else{
convertView.setBackgroundColor(randomColor.randomColor());
}
/** 使用List的原因就是在我们的Item第一次出来的时候进行动画展示，以后不用再做动画展示 */
if (!list.contains(position)) {
convertView.startAnimation(mAnimation);
list.add(position);
}
return convertView;
}
}
}
好了，今天的博客就到这里了，感谢各位观看，我们一起努力，一起快乐的码代码，我是刘酸酸，有错请指出，谢谢
397
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
