我要评论在app中合理地使用动画能够获得友好愉悦的用户体验，android中的动画有view动画、属性动画、帧动画、布局动画、转场动画等，在5.x以后有又新增了矢量动画，这些动画在平常开发中使用较为普遍，所以有必要做一次完整的总结。
一、view动画
view动画定义了渐变alpha、旋转rotate、缩放scale、平移translate四种基本动画，并且通过这四种基本动画的组合使用，可以实现多种交互效果。
view动画使用非常简单，不仅可以通过xml文件来定义动画，同样可以通过java代码来实现动画过程。
1.xml文件定义view动画
通过xml来定义view动画涉及到一些公有的属性（在androidstudio上不能提示）：
android:duration 动画持续时间
android:fillafter 为true动画结束时，view将保持动画结束时的状态
android:fillbefore 为true动画结束时，view将还原到开始开始时的状态
android:repeatcount 动画重复执行的次数
android:repeatmode 动画重复模式 ，重复播放时restart重头开始，reverse重复播放时倒叙回放，该属性需要和android:repeatcount一起使用
android:interpolator 插值器，相当于变速器，改变动画的不同阶段的执行速度复制代码这些属性是从animation中继承下来的，在alpha、rotate、scale、translate标签中都可以直接使用。
利用xml文件定义view动画需要在工程的res目录下创建anim文件夹，所有的xml定义的view动画都要放在anim目录下。
渐变view_anim_alpha.xml：
<?xml version="1.0" encoding="utf-8"?><alphaxmlns:android="http://schemas.android.com/apk/res/android"android:duration="2000"android:fromalpha="1.0"android:toalpha="0"></alpha>复制代码旋转view_anim_rotate.xml：
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="2000"
android:fillafter="true"
android:fromdegrees="0"
android:pivotx="50%"
android:pivoty="50%"
android:todegrees="360">
</rotate>复制代码缩放view_anim_scale.xml：
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="2000"
android:fromxscale="1.0"
android:fromyscale="1.0"
android:pivotx="50%"
android:pivoty="50%"
android:toxscale="0.5"
android:toyscale="0.5">
</scale>复制代码平移view_anim_translate.xml：
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="2000"
android:fromxdelta="0"
android:fromydelta="0"
android:toxdelta="100%"
android:toydelta="100%">
</translate>复制代码rotate、scale动画的android:pivotx和android:pivoty属性、translate动画的android:toxdelta和android:toydelta属性的取值都可以是都可以数值、百分数、百分数p，比如：50、50%、50%p，他们取值的代表的意义各不相同：
50表示以view左上角为原点沿坐标轴正方向(x轴向右，y轴向下)偏移50px的位置；
50%表示以view左上角为原点沿坐标轴正方向(x轴向右，y轴向下)偏移view宽度或高度的50%处的位置；
50%p表示以view左上角为原点沿坐标轴正方向(x轴向右，y轴向下)偏移父控件宽度或高度的50%处的位置（p表示相对于parentview的位置）。
"50"位置点
"50%"位置点
"50%p"位置点
通过定义xml动画资源文件，在activity中调用：
public void clicktoalpha(view view) {
animation alphaanim = animationutils.loadanimation(getapplicationcontext(), r.anim.view_anim_alpha);
mtargetview.startanimation(alphaanim);
}
public void clicktorotate(view view) {
animation rotateanim = animationutils.loadanimation(getapplicationcontext(), r.anim.view_anim_rotate);
mtargetview.startanimation(rotateanim);
}
public void clicktoscale(view view) {
animation scaleanim = animationutils.loadanimation(getapplicationcontext(), r.anim.view_anim_scale);
mtargetview.startanimation(scaleanim);
}
public void clicktotranslate(view view) {
animation translateanim = animationutils.loadanimation(getapplicationcontext(), r.anim.view_anim_translate);
mtargetview.startanimation(translateanim);
}
public void clicktoset(view view) {
animation setanim = animationutils.loadanimation(getapplicationcontext(), r.anim.view_anim_set);
mtargetview.startanimation(setanim);
}复制代码2.java代码实现view动画
在平常的业务逻辑中也可以直接用java代码来实现veiw动画，android系统给我们提供了alphaanimation、rotateanimation、scaleanimation、translateanimation四个动画类分别来实现view的渐变、旋转、缩放、平移动画。
渐变：
public void clicktoalpha(view view) {
alphaanimation alphaanimation = new alphaanimation(1, 0);
alphaanimation.setduration(2000);
mtargetview.startanimation(alphaanimation);
}复制代码旋转：
public void clicktorotate(view view) {
rotateanimation rotateanimation = new rotateanimation(
0, 360,
animation.relative_to_self, 0.5f,
animation.relative_to_self, 0.5f);
rotateanimation.setduration(2000);
mtargetview.startanimation(rotateanimation);
}复制代码缩放：
public void clicktoscale(view view) {
scaleanimation scaleanimation = new scaleanimation(
1, 0.5f,
1, 0.5f,
animation.relative_to_self, 0.5f,
animation.relative_to_self, 0.5f);
scaleanimation.setduration(2000);
mtargetview.startanimation(scaleanimation);
}复制代码平移：
public void clicktotranslate(view view) {
translateanimation translateanimation = new translateanimation(
animation.relative_to_self, 0,
animation.relative_to_self, 1,
animation.relative_to_self, 0,
animation.relative_to_self, 1);
translateanimation.setduration(2000);
mtargetview.startanimation(translateanimation);
}复制代码组合：
public void clicktoset(view view) {
alphaanimation alphaanimation = new alphaanimation(1, 0);
alphaanimation.setduration(2000);
rotateanimation rotateanimation = new rotateanimation(
0, 360,
animation.relative_to_self, 0.5f,
animation.relative_to_self, 0.5f);
rotateanimation.setduration(2000);
scaleanimation scaleanimation = new scaleanimation(
1, 0.5f,
1, 0.5f,
animation.relative_to_self, 0.5f,
animation.relative_to_self, 0.5f);
scaleanimation.setduration(2000);
translateanimation translateanimation = new translateanimation(
animation.relative_to_self, 0,
animation.relative_to_self, 1,
animation.relative_to_self, 0,
animation.relative_to_self, 1);
translateanimation.setduration(2000);
animationset animationset = new animationset(true);
animationset.addanimation(alphaanimation);
animationset.addanimation(rotateanimation);
animationset.addanimation(scaleanimation);
animationset.addanimation(translateanimation);
mtargetview.startanimation(animationset);
}复制代码
view动画效果
view动画可以设置一个动画执行的监听器：
animation.setanimationlistener(new animation.animationlistener() {
@override
public void onanimationstart(animation animation) {
// 动画开始
}
@override
public void onanimationend(animation animation) {
// 动画结束
}
@override
public void onanimationrepeat(animation animation) {
//动画重复
}
});复制代码通过设置监听器可以在动画执行的开始、结束、重复时做一些其他的业务逻辑。
二、属性动画
所谓属性动画，就是改变对象object的属性来实现动画过程。属性动画是对view的动画的扩展，通过它可以实现更多漂亮的动画效果。同时属性动画的作用对象不仅仅是view，任何对象都可以。
属性动画的作用效果就是：在一个指定的时间段内将对象的一个属性的属性值动态地变化到另一个属性值。
1.objectanimator
objectanimator是最常用的属性动画执行类。
privatevoidstartjavapropertyanimator() {
objectanimator
.offloat(mimageview, "rotationy", 0f, 360f)
.setduration(2000)
.start();
}复制代码上面的代码就是通过objectanimator在2000ms内将mimageview的rotationy属性的属性值从0f变化的360f。
objectanimator实现属性动画
objectanimtor可以用ofint、offloat、ofobject等静态方法，传入动画作用的目标object、属性字段、属性开始值、属性中间值、属性结束值等参数来构造动画对象。
在动画更新的过程中，通过不断去调用对象属性的setter方法改变属性值，不断重绘实现动画过程。如果没有给定动画开始属性值，那么系统会通过反射去获取object对象的初始值作为动画的开始值。
属性动画也同样可以通过xml文件来定义，同样在工程的res目录下创建animator文件夹，xml文件定义的objectanimator动画要放在该文件夹下。
property_animator.xml：
<?xml version="1.0" encoding="utf-8"?>
<objectanimator xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="2000"
android:propertyname="rotationy"
android:valuefrom="0"
android:valueto="360"
android:valuetype="floattype">
</objectanimator>复制代码java代码调用：
private void startxmlpropertyanimator() {
animator animator = animatorinflater.loadanimator(getapplicationcontext(),
r.animator.property_animator);
animator.settarget(mimageview);
animator.start();
}复制代码最终效果如上图。
属性动画也同样可以组合使用，通过animatorset类和xml文件的set标签都可以同时改变对象的多个属性，实现更加丰富的动画效果。
通过animatorset创建动画集：
private void startjavapropertyanimatorset() {
animator scalexanimator = objectanimator.offloat(mimageview, "scalex", 1, 0.5f);
scalexanimator.setduration(2000);
animator scaleyanimator = objectanimator.offloat(mimageview, "scaley", 1, 0.5f);
scaleyanimator.setduration(2000);
animator rotationxanimator = objectanimator.offloat(mimageview, "rotationx", 0, 360);
rotationxanimator.setduration(2000);
animator rotationyanimator = objectanimator.offloat(mimageview, "rotationy", 0, 360);
rotationyanimator.setduration(2000);
animatorset animatorset = new animatorset();
animatorset.play(scalexanimator)
.with(scaleyanimator)
.before(rotationxanimator)
.after(rotationyanimator);
animatorset.start();
}复制代码animatorset通过before、with、after三个方法可以组合多个属性动画，with表示与给定动画同时执行，before在给定动画执行之前执行，after表示在给定动画执行之后执行。
animatorset构建属性动画集
通过xml文件定义属性动画集：
property_animator_set.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectanimator
android:duration="2000"
android:propertyname="scalex"
android:valuefrom="1"
android:valueto="0.5"
android:valuetype="floattype"/>
<objectanimator
android:duration="2000"
android:propertyname="scaley"
android:valuefrom="1"
android:valueto="0.5"
android:valuetype="floattype"/>
<objectanimator
android:duration="2000"
android:propertyname="alpha"
android:valuefrom="1"
android:valueto="0.5"
android:valuetype="floattype"/>
</set>复制代码在java代码中调用属性动画集：
private void startxmlpropertyanimatorset() {
animator animator = animatorinflater.loadanimator(getapplicationcontext(),
r.animator.property_animator_set);
animator.settarget(mimageview);
animator.start();
}复制代码
xml定义属性动画集
同样，属性动画也可以添加动画执行监听器：
animator.addlistener(new animator.animatorlistener() {
@override
public void onanimationstart(animator animation) {
// 动画开始
}
@override
public void onanimationend(animator animation) {
// 动画结束
}
@override
public void onanimationcancel(animator animation) {
// 动画取消
}
@override
public void onanimationrepeat(animator animation) {
// 动画重复
}
});复制代码在监听到属性动画开始、结束、取消、重复时可以去做一些其他的逻辑业务。
2.valueanimator
valueanimator是objectanimator的父类，它继承自animator。valueanimaotor同样提供了ofint、offloat、ofobject等静态方法，传入的参数是动画过程的开始值、中间值、结束值来构造动画对象。可以将valueanimator看着一个值变化器，即在给定的时间内将一个目标值从给定的开始值变化到给定的结束值。在使用valueanimator时通常需要添加一个动画更新的监听器，在监听器中能够获取到执行过程中的每一个动画值。
privatevoidstartvalueanimator() {
valueanimatorvalueanimator= valueanimator.offloat(0, 1);
valueanimator.setduration(300);
valueanimator.start();
valueanimator.addupdatelistener(newvalueanimator.animatorupdatelistener() {
@overridepublicvoidonanimationupdate(valueanimator animation) {
// 动画更新过程中的动画值，可以根据动画值的变化来关联对象的属性，实现属性动画floatvalue= (float) animation.getanimatedvalue();
log.d("valueanimator", "动画值：" + value);
}
});
}复制代码在300ms内将数值0变化到1的动画值的变化log：
02-25 23:16:57.586 d/valueanimator:动画值：0.002-25 23:16:57.596 d/valueanimator:动画值：0.00790217502-25 23:16:57.616 d/valueanimator:动画值：0.02955961202-25 23:16:57.636 d/valueanimator:动画值：0.06698727602-25 23:16:57.646 d/valueanimator:动画值：0.11810201402-25 23:16:57.666 d/valueanimator:动画值：0.1812879702-25 23:16:57.686 d/valueanimator:动画值：0.254548202-25 23:16:57.706 d/valueanimator:动画值：0.3306310202-25 23:16:57.716 d/valueanimator:动画值：0.416615702-25 23:16:57.736 d/valueanimator:动画值：0.505235902-25 23:16:57.746 d/valueanimator:动画值：0.593690602-25 23:16:57.766 d/valueanimator:动画值：0.6791839602-25 23:16:57.786 d/valueanimator:动画值：0.754520802-25 23:16:57.796 d/valueanimator:动画值：0.8267103402-25 23:16:57.826 d/valueanimator:动画值：0.8885729302-25 23:16:57.836 d/valueanimator:动画值：0.9381532702-25 23:16:57.856 d/valueanimator:动画值：0.972188202-25 23:16:57.876 d/valueanimator:动画值：0.9938441502-25 23:16:57.886 d/valueanimator:动画值：1.0复制代码valueanimator的使用一般会结合更新监听器animatorupdatelistener，大多数时候是在自定义控件时使用。
下面是用valueanimator自定义控件实现动画打开关闭效果。
expanded_veiw.xml：
<?xml version="1.0" encoding="utf-8"?>
<linearlayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/white"
android:divider="@drawable/divider"
android:orientation="vertical"
android:showdividers="middle">
<linearlayout
android:id="@+id/ll_expanded_question"
android:layout_width="match_parent"
android:layout_height="48dp"
android:gravity="center_vertical">
<textview
android:id="@+id/tv_expanded_question"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:gravity="center_vertical"
android:padding="8dp"
android:text="如何把一本很难的书看懂？"
android:textcolor="#999999"
android:textsize="16sp"/>
<imageview
android:id="@+id/iv_expanded_indicator"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_marginright="16dp"
android:src="@drawable/img_up"/>
</linearlayout>
<textview
android:id="@+id/tv_expanded_answer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="8dp"
android:text="多读几遍。真的特别有用。至少看三遍。从开头看，看到中间，重头再来，再看得多一点，在从新开始，建议看到快结束时再从新开始。"
android:textcolor="#999999"
android:textsize="16sp"/>
</linearlayout>复制代码publicclassexpandedviewextendsframelayout {
private textview mtvanswer;
privateboolean isclosed;
private imageview mivindicator;
publicexpandedview(context context, attributeset attrs) {
super(context, attrs);
init(context);
}
privatevoidinit(context context) {
viewview= layoutinflater.from(context).inflate(r.layout.expanded_view, this, true);
linearlayoutllquestion= (linearlayout) view.findviewbyid(r.id.ll_expanded_question);
llquestion.setonclicklistener(newonclicklistener() {
@overridepublicvoidonclick(view v) {
anim();
}
});
mtvanswer = (textview) view.findviewbyid(r.id.tv_expanded_answer);
mivindicator = (imageview) view.findviewbyid(r.id.iv_expanded_indicator);
}
privatevoidanim() {
// 指示器旋转valueanimatorvalueanimator1= isclosed
? valueanimator.offloat(180, 0)
: valueanimator.offloat(0, 180);
valueanimator1.setduration(500);
valueanimator1.addupdatelistener(newvalueanimator.animatorupdatelistener() {
@overridepublicvoidonanimationupdate(valueanimator animation) {
floatvalue= (float) animation.getanimatedvalue();
mivindicator.setrotation(value);
}
});
valueanimator1.start();
// 打开开关闭操作finalintanswerheight= mtvanswer.getmeasuredheight();
valueanimatorvalueanimator2= isclosed
? valueanimator.ofint(-answerheight, 0)
: valueanimator.ofint(0, -answerheight);
valueanimator2.setduration(500);
finalmarginlayoutparamsparams= (marginlayoutparams) mtvanswer.getlayoutparams();
valueanimator2.addupdatelistener(newvalueanimator.animatorupdatelistener() {
@overridepublicvoidonanimationupdate(valueanimator animation) {
intvalue= (int) animation.getanimatedvalue();
params.bottommargin = value;
mtvanswer.setlayoutparams(params);
}
});
valueanimator2.addlistener(newanimator.animatorlistener() {
@overridepublicvoidonanimationstart(animator animation) {
}
@overridepublicvoidonanimationend(animator animation) {
isclosed = !isclosed;
}
@overridepublicvoidonanimationcancel(animator animation) {
}
@overridepublicvoidonanimationrepeat(animator animation) {
}
});
valueanimator2.start();
}
}复制代码
valueanimator自定义控件效果图
3.typeevaluator
objectanimator和valueanimator都有ofobject方法，传入的都有一个typeevaluator类型的参数。typeevaluator是一个接口，里面也只有一个抽象方法：
public t evaluate(float fraction, t startvalue, t endvalue);复制代码再看ofint方法中没有传入该参数，但实际上调用ofint方法时，系统已经有实现了typeevaluator接口的intevaluator，它的源码也非常简单：
public integer evaluate(float fraction, integer startvalue, integer endvalue) {
int startint = startvalue;
return (int)(startint + fraction * (endvalue - startint));
}复制代码fraction范围为0到1，表示动画执行过程中已完成程度。
泛型t即为动画执行的属性类型。
所以我们要用属性动画来执行复杂对象的动画过程，就需要自定义typeevaluator，实现动画逻辑。
先来定义一个对象
publicclasscircle {
privateint raduis; // 半径privateint color; // 颜色privateint elevation; // 高度publiccircle(int raduis, int color, int elevation) {
this.raduis = raduis;
this.color = color;
this.elevation = elevation;
}
publicintgetraduis() {
return raduis;
}
publicvoidsetraduis(int raduis) {
this.raduis = raduis;
}
publicintgetcolor() {
return color;
}
publicvoidsetcolor(int color) {
this.color = color;
}
publicintgetelevation() {
return elevation;
}
publicvoidsetelevation(int elevation) {
this.elevation = elevation;
}
}复制代码自定义控件circleview，将circle作为它的一个属性：
public class circleview extends view {
private circle circle;
private paint mpaint;
public circleview(context context, attributeset attrs) {
super(context, attrs);
circle = new circle(168, color.red, 0);
mpaint = new paint();
mpaint.setantialias(true);
}
@requiresapi(api = build.version_codes.lollipop)
@override
protected void ondraw(canvas canvas) {
super.ondraw(canvas);
setelevation(circle.getelevation());
mpaint.setcolor(circle.getcolor());
canvas.drawcircle(getmeasuredheight() / 2, getmeasuredheight() / 2, circle.getraduis(), mpaint);
}
public void setcircle(circle circle) {
this.circle = circle;
postinvalidate();
}
public circle getcircle() {
return circle;
}
}复制代码objectanimator使用：
private void start1() {
circle startcircle = new circle(168, color.red, 0);
circle middlecircle = new circle(300, color.green, 15);
circle endcircle = new circle(450, color.blue, 30);
objectanimator.ofobject(mcircleview, "circle", new circleevaluator(), startcircle, middlecircle, endcircle)
.setduration(5000)
.start();
}复制代码valueanimator使用：
private void start2() {
circle startcircle = new circle(168, color.red, 0);
circle middlecircle = new circle(300, color.green, 15);
circle endcircle = new circle(450, color.blue, 30);
valueanimator valueanimator = valueanimator.ofobject(new circleevaluator(), startcircle, middlecircle, endcircle);
valueanimator.setduration(5000);
valueanimator.addupdatelistener(new valueanimator.animatorupdatelistener() {
@override
public void onanimationupdate(valueanimator animation) {
circle circle = (circle) animation.getanimatedvalue();
mcircleview.setcircle(circle);
}
});
valueanimator.start();
}复制代码
自定义typeevaluator效果图
需要注意的是，系统调用获取控件setter、getter方法是通过反射获取的，属性的名称必须和getter、setter方法名称后面的字符串一致，比如上面的getter、setter方法分别为getcircle、setcircle，那么属性名字就必须为circle。
三、帧动画
帧动画需要开发者制定好动画每一帧，系统一帧一帧的播放图片。
private void start1() {
animationdrawable ad = new animationdrawable();
for (int i = 0; i < 7; i++) {
drawable drawable = getresources().getdrawable(getresources().getidentifier("ic_fingerprint_" + i, "drawable", getpackagename()));
ad.addframe(drawable, 100);
}
ad.setoneshot(false);
mimageview.setimagedrawable(ad);
ad.start();
}复制代码帧动画同样也可以在xml文件中配置，直接在工程drawable目录新建animation-list标签：
<?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/ic_fingerprint_0" android:duration="100"/>
<item android:drawable="@drawable/ic_fingerprint_1" android:duration="100"/>
<item android:drawable="@drawable/ic_fingerprint_2" android:duration="100"/>
<item android:drawable="@drawable/ic_fingerprint_3" android:duration="100"/>
<item android:drawable="@drawable/ic_fingerprint_4" android:duration="100"/>
<item android:drawable="@drawable/ic_fingerprint_5" android:duration="100"/>
<item android:drawable="@drawable/ic_fingerprint_6" android:duration="100"/>
</animation-list>复制代码private void start2() {
mimageview.setimageresource(r.drawable.frame_anim);
animationdrawable animationdrawable = (animationdrawable) mimageview.getdrawable();
animationdrawable.start();
}复制代码其中android:onshot属性和setoneshot方法表示是否只执行一次。
animationdrawable实际是上是一个drawable动画，动画执行的过程总会给你不断重绘drawable的每一帧图像，实现动态播放效果。
帧动画效果图
发表评论