Android 属性动画：这是一篇很详细的 属性动画 总结&攻略

前言

Android

Android

Android

目录

1. 属性动画出现的原因

Property Animation

Android 3.0

API 11

Property Animation

1.1 背景

Android

Android

Frame Animation

Tweened animation

1.2 问题

View

Button

TextView

LinearLayout

View

View

View

View

1.3 问题

Android 3.0

Property Animation

Property Animation

2. 简介

Java

3. 特点

4. 工作原理

ValueAnimator

ObjectAnimator

5. 具体使用

5.1 ValueAnimator类

ValueAnimator

ValueAnimator.ofInt（int values）

ValueAnimator.ofFloat（float values）

ValueAnimator.ofObject（int values）

5.1.1 ValueAnimator.ofInt（int values）

IntEvaluator

XML

Java

Java

// 步骤1：设置动画属性的初始值 & 结束值
ValueAnimator anim = ValueAnimator.ofInt(0, 3);
// ofInt（）作用有两个
// 1. 创建动画实例
// 2. 将传入的多个Int参数进行平滑过渡:此处传入0和1,表示将值从0平滑过渡到1
// 如果传入了3个Int参数 a,b,c ,则是先从a平滑过渡到b,再从b平滑过渡到C，以此类推
// ValueAnimator.ofInt()内置了整型估值器,直接采用默认的.不需要设置，即默认设置了如何从初始值 过渡到 结束值
// 关于自定义插值器我将在下节进行讲解
// 下面看看ofInt()的源码分析 ->>关注1

// 步骤2：设置动画的播放各种属性
anim.setDuration(500);
// 设置动画运行的时长

anim.setStartDelay(500);
// 设置动画延迟播放时间

anim.setRepeatCount(0);
// 设置动画重复播放次数 = 重放次数+1
// 动画播放次数 = infinite时,动画无限重复

anim.setRepeatMode(ValueAnimator.RESTART);
// 设置重复播放动画模式
// ValueAnimator.RESTART(默认):正序重放
// ValueAnimator.REVERSE:倒序回放

// 步骤3：将改变的值手动赋值给对象的属性值：通过动画的更新监听器
// 设置 值的更新监听器
// 即：值每次改变、变化一次,该方法就会被调用一次
anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {

int currentValue = (Integer) animation.getAnimatedValue();
// 获得改变后的值

System.out.println(currentValue);
// 输出改变后的值

// 步骤4：将改变后的值赋给对象的属性值，下面会详细说明
View.setproperty（currentValue）；

// 步骤5：刷新视图，即重新绘制，从而实现动画效果
View.requestLayout();

}
});

anim.start();
// 启动动画
}

// 关注1：ofInt（）源码分析
public static ValueAnimator ofInt(int... values) {
// 允许传入一个或多个Int参数
// 1. 输入一个的情况（如a）：从0过渡到a；
// 2. 输入多个的情况（如a，b，c）：先从a平滑过渡到b，再从b平滑过渡到C

ValueAnimator anim = new ValueAnimator();
// 创建动画对象
anim.setIntValues(values);
// 将传入的值赋值给动画对象
return anim;
}

效果图

res/animator

.xml

// ValueAnimator采用<animator>  标签
<animator xmlns:android="http://schemas.android.com/apk/res/android"
android:valueFrom="0"   // 初始值
android:valueTo="100"  // 结束值
android:valueType="intType" // 变化值类型 ：floatType & intType

android:duration="3000" // 动画持续时间（ms），必须设置，动画才有效果
android:startOffset ="1000" // 动画延迟开始时间（ms）
android:fillBefore = “true” // 动画播放完后，视图是否会停留在动画开始的状态，默认为true
android:fillAfter = “false” // 动画播放完后，视图是否会停留在动画结束的状态，优先于fillBefore值，默认为false
android:fillEnabled= “true” // 是否应用fillBefore值，对fillAfter值无影响，默认为true
android:repeatMode= “restart” // 选择重复播放动画模式，restart代表正序重放，reverse代表倒序回放，默认为restart|
android:repeatCount = “0” // 重放次数（所以动画的播放次数=重放次数+1），为infinite时无限重复
android:interpolator = @[package:]anim/interpolator_resource // 插值器，即影响动画的播放速度,下面会详细讲

/>

Animator animator = AnimatorInflater.loadAnimator(context, R.animator.set_animation);
// 载入XML动画

animator.setTarget(view);
// 设置动画对象

animator.start();
// 启动动画

效果图

实例说明

150px

500px

Button mButton = (Button) findViewById(R.id.Button);
// 创建动画作用对象：此处以Button为例

// 步骤1：设置属性数值的初始值 & 结束值
ValueAnimator valueAnimator = ValueAnimator.ofInt(mButton.getLayoutParams().width, 500);
// 初始值 = 当前按钮的宽度，此处在xml文件中设置为150
// 结束值 = 500
// ValueAnimator.ofInt()内置了整型估值器,直接采用默认的.不需要设置
// 即默认设置了如何从初始值150 过渡到 结束值500

// 步骤2：设置动画的播放各种属性
valueAnimator.setDuration(2000);
// 设置动画运行时长:1s

// 步骤3：将属性数值手动赋值给对象的属性:此处是将 值 赋给 按钮的宽度
// 设置更新监听器：即数值每次变化更新都会调用该方法
valueAnimator.addUpdateListener(new AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animator) {

int currentValue = (Integer) animator.getAnimatedValue();
// 获得每次变化后的属性值
System.out.println(currentValue);
// 输出每次变化后的属性值进行查看

mButton.getLayoutParams().width = currentValue;
// 每次值变化时，将值手动赋值给对象的属性
// 即将每次变化后的值 赋 给按钮的宽度，这样就实现了按钮宽度属性的动态变化

// 步骤4：刷新视图，即重新绘制，从而实现动画效果
mButton.requestLayout();

}
});

valueAnimator.start();
// 启动动画

}

效果图

5.1.2 ValueAnimator.oFloat（float values）

ValueAnimator anim = ValueAnimator.ofFloat(0, 3);
// 其他使用类似ValueAnimator.ofInt（int values），此处不作过多描述

res/animator

.xml

// ValueAnimator采用<animator>  标签
<animator xmlns:android="http://schemas.android.com/apk/res/android"
// 设置属性同上
android:valueFrom="0"
android:valueTo="100"
android:valueType="intType"/>

Animator animator = AnimatorInflater.loadAnimator(context, R.animator.set_animation);
// 载入XML动画

animator.setTarget(view);
// 设置动画对象

animator.start();
// 启动动画

效果图

ValueAnimator.ofInt（）

ValueAnimator.oFloat（）

ValueAnimator.oFloat（）

FloatEvaluator

ValueAnimator.ofInt（）

IntEvaluator

ValueAnimator.oFloat（）

5.1.3 ValueAnimator.ofObject（）

// 创建初始动画时的对象  & 结束动画时的对象
myObject object1 = new myObject();
myObject object2 = new myObject();

ValueAnimator anim = ValueAnimator.ofObject(new myObjectEvaluator(), object1, object2);
// 创建动画对象 & 设置参数
// 参数说明
// 参数1：自定义的估值器对象（TypeEvaluator 类型参数） - 下面会详细介绍
// 参数2：初始动画的对象
// 参数3：结束动画的对象
anim.setDuration(5000);
anim.start();

ValueAnimator.ofObject（）

TypeEvaluator

估值器（TypeEvaluator） 介绍

Interpolator

TypeEvaluator

ValueAnimator.ofFloat（）

FloatEvaluator

FloatEvaluator

public class FloatEvaluator implements TypeEvaluator {
// FloatEvaluator实现了TypeEvaluator接口

// 重写evaluate()
public Object evaluate(float fraction, Object startValue, Object endValue) {
// 参数说明
// fraction：表示动画完成度（根据它来计算当前动画的值）
// startValue、endValue：动画的初始值和结束值
float startFloat = ((Number) startValue).floatValue();

return startFloat + fraction * (((Number) endValue).floatValue() - startFloat);
// 初始值 过渡 到结束值 的算法是：
// 1. 用结束值减去初始值，算出它们之间的差值
// 2. 用上述差值乘以fraction系数
// 3. 再加上初始值，就得到当前动画的值
}
}

ValueAnimator.ofInt（）

ValueAnimator.ofFloat（）

FloatEvaluator

IntEvaluator

ValueAnimator.ofObject（）

ValueAnimator.ofObject（）

TypeEvaluator

// 实现TypeEvaluator接口
public class ObjectEvaluator implements TypeEvaluator{

// 复写evaluate（）
// 在evaluate（）里写入对象动画过渡的逻辑
@Override
public Object evaluate(float fraction, Object startValue, Object endValue) {
// 参数说明
// fraction：表示动画完成度（根据它来计算当前动画的值）
// startValue、endValue：动画的初始值和结束值

... // 写入对象动画过渡的逻辑

return value;
// 返回对象动画过渡的逻辑计算后的值
}

实例说明

TypeEvaluator

ValueAnimator.ofObject（）

步骤1：定义对象类

ValueAnimator.ofObject（）

public class Point {

// 设置两个变量用于记录坐标的位置
private float x;
private float y;

// 构造方法用于设置坐标
public Point(float x, float y) {
this.x = x;
this.y = y;
}

// get方法用于获取坐标
public float getX() {
return x;
}

public float getY() {
return y;
}
}

步骤2：根据需求实现TypeEvaluator接口

TypeEvaluator

// 实现TypeEvaluator接口
public class PointEvaluator implements TypeEvaluator {

// 复写evaluate（）
// 在evaluate（）里写入对象动画过渡的逻辑
@Override
public Object evaluate(float fraction, Object startValue, Object endValue) {

// 将动画初始值startValue 和 动画结束值endValue 强制类型转换成Point对象
Point startPoint = (Point) startValue;
Point endPoint = (Point) endValue;

// 根据fraction来计算当前动画的x和y的值
float x = startPoint.getX() + fraction * (endPoint.getX() - startPoint.getX());
float y = startPoint.getY() + fraction * (endPoint.getY() - startPoint.getY());

// 将计算后的坐标封装到一个新的Point对象中并返回
Point point = new Point(x, y);
return point;
}

}

TypeEvaluator

Point

步骤3：将属性动画作用到自定义View当中

/**
* Created by Carson_Ho on 17/4/18.
*/
public class MyView extends View {
// 设置需要用到的变量
public static final float RADIUS = 70f;// 圆的半径 = 70
private Point currentPoint;// 当前点坐标
private Paint mPaint;// 绘图画笔

// 构造方法(初始化画笔)
public MyView(Context context, AttributeSet attrs) {
super(context, attrs);
// 初始化画笔
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaint.setColor(Color.BLUE);
}

// 复写onDraw()从而实现绘制逻辑
// 绘制逻辑:先在初始点画圆,通过监听当前坐标值(currentPoint)的变化,每次变化都调用onDraw()重新绘制圆,从而实现圆的平移动画效果
@Override
protected void onDraw(Canvas canvas) {
// 如果当前点坐标为空(即第一次)
if (currentPoint == null) {
currentPoint = new Point(RADIUS, RADIUS);
// 创建一个点对象(坐标是(70,70))

// 在该点画一个圆:圆心 = (70,70),半径 = 70
float x = currentPoint.getX();
float y = currentPoint.getY();
canvas.drawCircle(x, y, RADIUS, mPaint);

// (重点关注)将属性动画作用到View中
// 步骤1:创建初始动画时的对象点  & 结束动画时的对象点
Point startPoint = new Point(RADIUS, RADIUS);// 初始点为圆心(70,70)
Point endPoint = new Point(700, 1000);// 结束点为(700,1000)

// 步骤2:创建动画对象 & 设置初始值 和 结束值
ValueAnimator anim = ValueAnimator.ofObject(new PointEvaluator(), startPoint, endPoint);
// 参数说明
// 参数1：TypeEvaluator 类型参数 - 使用自定义的PointEvaluator(实现了TypeEvaluator接口)
// 参数2：初始动画的对象点
// 参数3：结束动画的对象点

// 步骤3：设置动画参数
anim.setDuration(5000);
// 设置动画时长

// 步骤3：通过 值 的更新监听器，将改变的对象手动赋值给当前对象
// 此处是将 改变后的坐标值对象 赋给 当前的坐标值对象
// 设置 值的更新监听器
// 即每当坐标值（Point对象）更新一次,该方法就会被调用一次
anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
currentPoint = (Point) animation.getAnimatedValue();
// 将每次变化后的坐标值（估值器PointEvaluator中evaluate（）返回的Piont对象值）到当前坐标值对象（currentPoint）
// 从而更新当前坐标值（currentPoint）

// 步骤4：每次赋值后就重新绘制，从而实现动画效果
invalidate();
// 调用invalidate()后,就会刷新View,即才能看到重新绘制的界面,即onDraw()会被重新调用一次
// 所以坐标值每改变一次,就会调用onDraw()一次
}
});

anim.start();
// 启动动画

} else {
// 如果坐标值不为0,则画圆
// 所以坐标值每改变一次,就会调用onDraw()一次,就会画一次圆,从而实现动画效果

// 在该点画一个圆:圆心 = (30,30),半径 = 30
float x = currentPoint.getX();
float y = currentPoint.getY();
canvas.drawCircle(x, y, RADIUS, mPaint);
}
}

}

步骤4：在布局文件加入自定义View空间

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="scut.carson_ho.valueanimator_ofobject.MainActivity">

<scut.carson_ho.valueanimator_ofobject.MyView
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</RelativeLayout>

步骤5：在主代码文件设置显示视图

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}

效果图

源码地址

特别注意

ValueAnimator.ofObject（）

ValueAnimator

ObjectAnimator

5.2 ObjectAnimator类

5.2.1 实现动画的原理

View

alpha

ValueAnimator

ValueAnimator

ObjectAnimator

ValueAnimator

ValueAnimator

ObjectAnimator

5.2.2 具体使用

XML

Java

Java

ObjectAnimator animator = ObjectAnimator.ofFloat(Object object, String property, float ....values);

// ofFloat()作用有两个
// 1. 创建动画实例
// 2. 参数设置：参数说明如下
// Object object：需要操作的对象
// String property：需要操作的对象的属性
// float ....values：动画初始值 & 结束值（不固定长度）
// 若是两个参数a,b，则动画效果则是从属性的a值到b值
// 若是三个参数a,b,c，则则动画效果则是从属性的a值到b值再到c值
// 以此类推
// 至于如何从初始值 过渡到 结束值，同样是由估值器决定，此处ObjectAnimator.ofFloat（）是有系统内置的浮点型估值器FloatEvaluator，同ValueAnimator讲解

anim.setDuration(500);
// 设置动画运行的时长

anim.setStartDelay(500);
// 设置动画延迟播放时间

anim.setRepeatCount(0);
// 设置动画重复播放次数 = 重放次数+1
// 动画播放次数 = infinite时,动画无限重复

anim.setRepeatMode(ValueAnimator.RESTART);
// 设置重复播放动画模式
// ValueAnimator.RESTART(默认):正序重放
// ValueAnimator.REVERSE:倒序回放

animator.start();
// 启动动画

res/animator

.xml

res/animator/set_animation.xml

// ObjectAnimator 采用<animator>  标签
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:valueFrom="1"   // 初始值
android:valueTo="0"  // 结束值
android:valueType="floatType"  // 变化值类型 ：floatType & intType
android:propertyName="alpha" // 对象变化的属性名称

/>

Animator animator = AnimatorInflater.loadAnimator(context, R.animator.view_animation);
// 载入XML动画

animator.setTarget(view);
// 设置动画对象

animator.start();
// 启动动画

a. 透明度

mButton = (Button) findViewById(R.id.Button);
// 创建动画作用对象：此处以Button为例

ObjectAnimator animator = ObjectAnimator.ofFloat(mButton, "alpha", 1f, 0f, 1f);
// 表示的是:
// 动画作用对象是mButton
// 动画作用的对象的属性是透明度alpha
// 动画效果是:常规 - 全透明 - 常规
animator.setDuration(5000);
animator.start();

b. 旋转

mButton = (Button) findViewById(R.id.Button);
// 创建动画作用对象：此处以Button为例

ObjectAnimator animator = ObjectAnimator.ofFloat(mButton, "rotation", 0f, 360f);

// 表示的是:
// 动画作用对象是mButton
// 动画作用的对象的属性是旋转alpha
// 动画效果是:0 - 360
animator.setDuration(5000);
animator.start();

c. 平移

mButton = (Button) findViewById(R.id.Button);
// 创建动画作用对象：此处以Button为例

float curTranslationX = mButton.getTranslationX();
// 获得当前按钮的位置
ObjectAnimator animator = ObjectAnimator.ofFloat(mButton, "translationX", curTranslationX, 300,curTranslationX);

// 表示的是:
// 动画作用对象是mButton
// 动画作用的对象的属性是X轴平移（在Y轴上平移同理，采用属性"translationY"
// 动画效果是:从当前位置平移到 x=1500 再平移到初始位置
animator.setDuration(5000);
animator.start();

d. 缩放

mButton = (Button) findViewById(R.id.Button);
// 创建动画作用对象：此处以Button为例

ObjectAnimator animator = ObjectAnimator.ofFloat(mButton, "scaleX", 1f, 3f, 1f);
// 表示的是:
// 动画作用对象是mButton
// 动画作用的对象的属性是X轴缩放
// 动画效果是:放大到3倍,再缩小到初始大小
animator.setDuration(5000);
animator.start();

ObjectAnimator.ofFloat

String property

alpha

rotation

translationX

scaleY

ObjectAnimator

ObjectAnimator.ofFloat(Object object, String property, float ....values)

ObjectAnimator

set（） & get（）

ObjectAnimator animator = ObjectAnimator.ofFloat(mButton, "rotation", 0f, 360f);
// 其实Button对象中并没有rotation这个属性值
// ObjectAnimator并不是直接对我们传入的属性名进行操作
// 而是根据传入的属性值"rotation" 去寻找对象对应属性名对应的get和set方法，从而通过set（） &  get（）对属性进行赋值

// 因为Button对象中有rotation属性所对应的get & set方法
// 所以传入的rotation属性是有效的
// 所以才能对rotation这个属性进行操作赋值
public void setRotation(float value);
public float getRotation();

// 实际上，这两个方法是由View对象提供的，所以任何继承自View的对象都具备这个属性

// 使用方法
ObjectAnimator animator = ObjectAnimator.ofFloat(Object object, String property, float ....values);
anim.setDuration(500);
animator.start();
// 启动动画，源码分析就直接从start()开始

<--  start()  -->
@Override
public void start() {
AnimationHandler handler = sAnimationHandler.get();

if (handler != null) {
// 判断等待动画（Pending）中是否有和当前动画相同的动画，如果有就把相同的动画给取消掉
numAnims = handler.mPendingAnimations.size();
for (int i = numAnims - 1; i >= 0; i--) {
if (handler.mPendingAnimations.get(i) instanceof ObjectAnimator) {
ObjectAnimator anim = (ObjectAnimator) handler.mPendingAnimations.get(i);
if (anim.mAutoCancel && hasSameTargetAndProperties(anim)) {
anim.cancel();
}
}
}
// 判断延迟动画（Delay）中是否有和当前动画相同的动画，如果有就把相同的动画给取消掉
numAnims = handler.mDelayedAnims.size();
for (int i = numAnims - 1; i >= 0; i--) {
if (handler.mDelayedAnims.get(i) instanceof ObjectAnimator) {
ObjectAnimator anim = (ObjectAnimator) handler.mDelayedAnims.get(i);
if (anim.mAutoCancel && hasSameTargetAndProperties(anim)) {
anim.cancel();
}
}
}
}

super.start();
// 调用父类的start()
// 因为ObjectAnimator类继承ValueAnimator类，所以调用的是ValueAnimator的star（）
// 经过层层调用，最终会调用到 自动赋值给对象属性值的方法
// 下面就直接看该部分的方法
}

<-- 自动赋值给对象属性值的逻辑方法 ->>

// 步骤1：初始化动画值
private void setupValue(Object target, Keyframe kf) {
if (mProperty != null) {
kf.setValue(mProperty.get(target));
// 初始化时，如果属性的初始值没有提供，则调用属性的get（）进行取值
}
kf.setValue(mGetter.invoke(target));
}
}

// 步骤2：更新动画值
// 当动画下一帧来时（即动画更新的时候），setAnimatedValue（）都会被调用
void setAnimatedValue(Object target) {
if (mProperty != null) {
mProperty.set(target, getAnimatedValue());
// 内部调用对象该属性的set（）方法，从而从而将新的属性值设置给对象属性
}

}

get（）

set（）

ObjectAnimator

ObjectAnimator

set（） & get（）

View

setRotation()

getRotation()

setTranslationX()

getTranslationX()

setScaleY()

getScaleY()

set（）

get（）

5.2.3 通过自定义对象属性实现动画效果

步骤1：设置对象类属性的set（） & get（）方法

set（）

get（）

get（）

set（）

get（）

set（）

get（）

set（）

public class MyView2 extends View {
// 设置需要用到的变量
public static final float RADIUS = 100f;// 圆的半径 = 100
private Paint mPaint;// 绘图画笔

private String color;
// 设置背景颜色属性

// 设置背景颜色的get() & set()方法
public String getColor() {
return color;
}

public void setColor(String color) {
this.color = color;
mPaint.setColor(Color.parseColor(color));
// 将画笔的颜色设置成方法参数传入的颜色
invalidate();
// 调用了invalidate()方法,即画笔颜色每次改变都会刷新视图，然后调用onDraw()方法重新绘制圆
// 而因为每次调用onDraw()方法时画笔的颜色都会改变,所以圆的颜色也会改变
}

// 构造方法(初始化画笔)
public MyView2(Context context, AttributeSet attrs) {
super(context, attrs);
// 初始化画笔
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaint.setColor(Color.BLUE);
}

// 复写onDraw()从而实现绘制逻辑
// 绘制逻辑:先在初始点画圆,通过监听当前坐标值(currentPoint)的变化,每次变化都调用onDraw()重新绘制圆,从而实现圆的平移动画效果
@Override
protected void onDraw(Canvas canvas) {
canvas.drawCircle(500, 500, RADIUS, mPaint);
}
}

步骤2：在布局文件加入自定义View控件

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="scut.carson_ho.valueanimator_ofobject.MainActivity">

<scut.carson_ho.valueanimator_ofobject.MyView2
android:id="@+id/MyView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</RelativeLayout>

步骤3：根据需求实现TypeEvaluator接口

public class ColorEvaluator implements TypeEvaluator {
// 实现TypeEvaluator接口

private int mCurrentRed;

private int mCurrentGreen ;

private int mCurrentBlue ;

// 复写evaluate（）
// 在evaluate（）里写入对象动画过渡的逻辑:此处是写颜色过渡的逻辑
@Override
public Object evaluate(float fraction, Object startValue, Object endValue) {

// 获取到颜色的初始值和结束值
String startColor = (String) startValue;
String endColor = (String) endValue;

// 通过字符串截取的方式将初始化颜色分为RGB三个部分，并将RGB的值转换成十进制数字
// 那么每个颜色的取值范围就是0-255
int startRed = Integer.parseInt(startColor.substring(1, 3), 16);
int startGreen = Integer.parseInt(startColor.substring(3, 5), 16);
int startBlue = Integer.parseInt(startColor.substring(5, 7), 16);

int endRed = Integer.parseInt(endColor.substring(1, 3), 16);
int endGreen = Integer.parseInt(endColor.substring(3, 5), 16);
int endBlue = Integer.parseInt(endColor.substring(5, 7), 16);

// 将初始化颜色的值定义为当前需要操作的颜色值
mCurrentRed = startRed;
mCurrentGreen = startGreen;
mCurrentBlue = startBlue;

// 计算初始颜色和结束颜色之间的差值
// 该差值决定着颜色变化的快慢:初始颜色值和结束颜色值很相近，那么颜色变化就会比较缓慢;否则,变化则很快
// 具体如何根据差值来决定颜色变化快慢的逻辑写在getCurrentColor()里.
int redDiff = Math.abs(startRed - endRed);
int greenDiff = Math.abs(startGreen - endGreen);
int blueDiff = Math.abs(startBlue - endBlue);
int colorDiff = redDiff + greenDiff + blueDiff;
if (mCurrentRed != endRed) {
mCurrentRed = getCurrentColor(startRed, endRed, colorDiff, 0,
fraction);
// getCurrentColor()决定如何根据差值来决定颜色变化的快慢 ->>关注1
} else if (mCurrentGreen != endGreen) {
mCurrentGreen = getCurrentColor(startGreen, endGreen, colorDiff,
redDiff, fraction);
} else if (mCurrentBlue != endBlue) {
mCurrentBlue = getCurrentColor(startBlue, endBlue, colorDiff,
redDiff + greenDiff, fraction);
}
// 将计算出的当前颜色的值组装返回
String currentColor = "#" + getHexString(mCurrentRed)
+ getHexString(mCurrentGreen) + getHexString(mCurrentBlue);

// 由于我们计算出的颜色是十进制数字，所以需要转换成十六进制字符串:调用getHexString()->>关注2
// 最终将RGB颜色拼装起来,并作为最终的结果返回
return currentColor;
}

// 关注1:getCurrentColor()
// 具体是根据fraction值来计算当前的颜色。

private int getCurrentColor(int startColor, int endColor, int colorDiff,
int offset, float fraction) {
int currentColor;
if (startColor > endColor) {
currentColor = (int) (startColor - (fraction * colorDiff - offset));
if (currentColor < endColor) {
currentColor = endColor;
}
} else {
currentColor = (int) (startColor + (fraction * colorDiff - offset));
if (currentColor > endColor) {
currentColor = endColor;
}
}
return currentColor;
}

// 关注2:将10进制颜色值转换成16进制。
private String getHexString(int value) {
String hexString = Integer.toHexString(value);
if (hexString.length() == 1) {
hexString = "0" + hexString;
}
return hexString;
}

}

步骤4：调用ObjectAnimator.ofObject（）方法

public class MainActivity extends AppCompatActivity {

MyView2 myView2;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

myView2 = (MyView2) findViewById(R.id.MyView2);
ObjectAnimator anim = ObjectAnimator.ofObject(myView2, "color", new ColorEvaluator(),
"#0000FF", "#FF0000");
// 设置自定义View对象、背景颜色属性值 & 颜色估值器
// 本质逻辑：
// 步骤1：根据颜色估值器不断 改变 值
// 步骤2：调用set（）设置背景颜色的属性值（实际上是通过画笔进行颜色设置）
// 步骤3：调用invalidate()刷新视图，即调用onDraw（）重新绘制，从而实现动画效果

anim.setDuration(8000);
anim.start();
}
}

效果图

源码地址

5.2.4 特别注意：如何手动设置对象类属性的 set（） & get（）

a. 背景

ObjectAnimator

ObjectAnimator.ofFloat(Object object, String property, float ....values)

ObjectAnimator

set（） & get（）

View

setWidth（）

View

View

setWidth（）

View

width

Button  mButton = (Button) findViewById(R.id.Button);
// 创建动画作用对象：此处以Button为例
// 此Button的宽高设置具体为具体宽度200px

ObjectAnimator.ofInt(mButton, "width", 500).setDuration(5000).start();
// 设置动画的对象

效果图

View

setWidth

public void setWidth(int pixels) {
mMaxWidth = mMinWidth = pixels;
mMaxWidthMode = mMinWidthMode = PIXELS;
// 因为setWidth（）并不是设置View的宽度，而是设置Button的最大宽度和最小宽度的
// 所以通过setWidth（）无法改变控件的宽度
// 所以对width属性做属性动画没有效果

requestLayout();
invalidate();
}

@ViewDebug.ExportedProperty(category = "layout")
public final int getWidth() {
return mRight - mLeft;
// getWidth的确是获取View的宽度
}

b. 问题

c. 解决方案

set（）

get（）

get（）

set（）

get（）

set（）

get（）

set（）

get（）& set（）

Button

public class MainActivity extends AppCompatActivity {
Button mButton;
ViewWrapper wrapper;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

mButton = (Button) findViewById(R.id.Button);
// 创建动画作用对象：此处以Button为例

wrapper = new ViewWrapper(mButton);
// 创建包装类,并传入动画作用的对象

mButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {

ObjectAnimator.ofInt(wrapper, "width", 500).setDuration(3000).start();
// 设置动画的对象是包装类的对象
}
});

}
// 提供ViewWrapper类,用于包装View对象
// 本例:包装Button对象
private static class ViewWrapper {
private View mTarget;

// 构造方法:传入需要包装的对象
public ViewWrapper(View target) {
mTarget = target;
}

// 为宽度设置get（） & set（）
public int getWidth() {
return mTarget.getLayoutParams().width;
}

public void setWidth(int width) {
mTarget.getLayoutParams().width = width;
mTarget.requestLayout();
}

}

}

效果图

5.4 总结

ValueAnimator

ObjectAnimator

ValueAnimator

ValueAnimator

ObjectAnimator

ObjectAnimator

6. 额外的使用方法

6.1 组合动画（AnimatorSet 类）

AnimatorSet

AnimatorSet.play(Animator anim)   ：播放当前动画
AnimatorSet.after(long delay)   ：将现有动画延迟x毫秒后执行
AnimatorSet.with(Animator anim)   ：将现有动画和传入的动画同时执行
AnimatorSet.after(Animator anim)   ：将现有动画插入到传入的动画之后执行
AnimatorSet.before(Animator anim) ：  将现有动画插入到传入的动画之前执行

XML

Java

Java

// 步骤1：设置需要组合的动画效果
ObjectAnimator translation = ObjectAnimator.ofFloat(mButton, "translationX", curTranslationX, 300,curTranslationX);
// 平移动画
ObjectAnimator rotate = ObjectAnimator.ofFloat(mButton, "rotation", 0f, 360f);
// 旋转动画
ObjectAnimator alpha = ObjectAnimator.ofFloat(mButton, "alpha", 1f, 0f, 1f);
// 透明度动画

// 步骤2：创建组合动画的对象
AnimatorSet animSet = new AnimatorSet();

// 步骤3：根据需求组合动画
animSet.play(translation).with(rotate).before(alpha);
animSet.setDuration(5000);

// 步骤4：启动动画
animSet.start();

效果图

XML

res/animator

.xml

res/animator/set_animation.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:ordering="sequentially" >
// 表示Set集合内的动画按顺序进行
// ordering的属性值:sequentially & together
// sequentially:表示set中的动画，按照先后顺序逐步进行（a 完成之后进行 b ）
// together:表示set中的动画，在同一时间同时进行,为默认值

<set android:ordering="together" >
// 下面的动画同时进行
<objectAnimator
android:duration="2000"
android:propertyName="translationX"
android:valueFrom="0"
android:valueTo="300"
android:valueType="floatType" >
</objectAnimator>

<objectAnimator
android:duration="3000"
android:propertyName="rotation"
android:valueFrom="0"
android:valueTo="360"
android:valueType="floatType" >
</objectAnimator>
</set>

<set android:ordering="sequentially" >
// 下面的动画按序进行
<objectAnimator
android:duration="1500"
android:propertyName="alpha"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType" >
</objectAnimator>
<objectAnimator
android:duration="1500"
android:propertyName="alpha"
android:valueFrom="0"
android:valueTo="1"
android:valueType="floatType" >
</objectAnimator>
</set>

</set>

mButton = (Button) findViewById(R.id.Button);
// 创建动画作用对象：此处以Button为例

AnimatorSet animator = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.set_animation);
// 创建组合动画对象  &  加载XML动画
animator.setTarget(mButton);
// 设置动画作用对象
animator.start();
// 启动动画

效果图

6.2 ViewPropertyAnimator用法

Java

Google

ViewPropertyAnimator

// 使用解析
View.animate().xxx().xxx();
// ViewPropertyAnimator的功能建立在animate()上
// 调用animate()方法返回值是一个ViewPropertyAnimator对象,之后的调用的所有方法都是通过该实例完成
// 调用该实例的各种方法来实现动画效果
// ViewPropertyAnimator所有接口方法都使用连缀语法来设计，每个方法的返回值都是它自身的实例
// 因此调用完一个方法后可直接连缀调用另一方法,即可通过一行代码就完成所有动画效果

// 以下是例子
mButton = (Button) findViewById(R.id.Button);
// 创建动画作用对象：此处以Button为例

mButton.animate().alpha(0f);
// 单个动画设置:将按钮变成透明状态
mButton.animate().alpha(0f).setDuration(5000).setInterpolator(new BounceInterpolator());
// 单个动画效果设置 & 参数设置
mButton.animate().alpha(0f).x(500).y(500);
// 组合动画:将按钮变成透明状态再移动到(500,500)处

// 特别注意:
// 动画自动启动,无需调用start()方法.因为新的接口中使用了隐式启动动画的功能，只要我们将动画定义完成后，动画就会自动启动
// 该机制对于组合动画也同样有效，只要不断地连缀新的方法，那么动画就不会立刻执行，等到所有在ViewPropertyAnimator上设置的方法都执行完毕后，动画就会自动启动
// 如果不想使用这一默认机制，也可以显式地调用start()方法来启动动画

6.3 监听动画

Animation

Java

addListener（）

Animation.addListener(new AnimatorListener() {
@Override
public void onAnimationStart(Animation animation) {
//动画开始时执行
}

@Override
public void onAnimationRepeat(Animation animation) {
//动画重复时执行
}

@Override
public void onAnimationCancel()(Animation animation) {
//动画取消时执行
}

@Override
public void onAnimationEnd(Animation animation) {
//动画结束时执行
}
});

// 特别注意：每次监听必须4个方法都重写。

Animator

AnimatorSet

ValueAnimator

ObjectAnimator

AnimatorSet

ValueAnimator

ObjectAnimator

addListener()

动画适配器AnimatorListenerAdapter

addListener(new AnimatorListener())

AnimatorListenerAdapter

anim.addListener(new AnimatorListenerAdapter() {
// 向addListener()方法中传入适配器对象AnimatorListenerAdapter()
// 由于AnimatorListenerAdapter中已经实现好每个接口
// 所以这里不实现全部方法也不会报错
@Override
public void onAnimationStart(Animator animation) {
// 如想只想监听动画开始时刻，就只需要单独重写该方法就可以
}
});

Android

属性动画

7. 总结

Android

请帮顶或评论点赞！因为你们的赞同/鼓励是我写作的最大动力！

Android

Android