目录
Android中动画之视图动画(View Animation)
一、概述
Android中的动画分为:View Animation(视图动画)和Property Animation(属性动画)。
其中 View Animation包括:Tween Animation(补间动画)和 Frame Animation(逐帧动画)。
Property Animation包括:ValueAnimator和ObjectAnimator。
本文先总结视图动画中的补间动画和逐帧动画
二、View Animation(视图动画)
(一)补间动画(Tween Animation)
1.通过Xml实现补间动画
(1)标签:
alpha:渐变透明的动画效果
scale:渐变尺寸伸缩动画效果
translation:画面变换位置移动动画效果
rotate:画面转移旋转动画效果
set:定义动画集
动画属性
android:duration 动画持续时长,单位毫秒
android:fillAfter 设置为true表示 动画结束时保持结束时的状态
android:fillBefore 设置为true 表示动画结束时将还原到初始化状态
android:fillEnable 和 fillBefore作用相同
android:repeatCount 指定动画重复的次数 设置为 infinite 表示无限循环
android:repeatMode 用于指定动画重复的类型,reverse:表示倒序回放,restart:表示重放,但是必须与repeatCount一起使用才有果。
(2)Xml存放位置 res/anim ,通过R.anim.XXX进行访问;也可以放在res/drawable ,通过R.drawable.XXX进行访问。
(3)使用动画
Animation animation = AnimationUtils。loadAnimation(上下文,R.anim.XXX);
控件.startAnimation(Animation animation);(之间可以设置一些动画的属性方法)。
各个标签的解析
(1)scale
android:fromXScale android:toXScale 浮点值 1.0表示自身无变化 0.5表示缩小1倍,2.0表示放大1倍。
android:fromYScale android:toYScale 和上面类似。
android:pivotX android:pivotY 缩放起始的xy坐标,可以是 数值、百分数、百分数p,(50,50%,50%p)。
数值50:表示在当前视图左上角,即原点处加50px,
百分数50%:表示在当前控件的左上角加上自己宽度或高度的50%,
百分数p:表示在当前控件的左上角加上父控件宽度或高度的50%。
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXScale="0.5" android:toXScale="2.0"
android:fromYScale="0.5" android:toYScale="2.0"
android:pivotX="50%" android:pivotY="50%"
android:fillAfter="true"
android:duration="2000"/>
(2)alpha
android:fromAlpha android:toAlpha 表示动画开始和结束的透明度,取值范围0.0~1.0。0.0表示全透明,1.0表示完全不透明。(其他属性和scale类似)
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:fromAlpha="0.5"
android:toAlpha="1.0"
android:duration="2000"/>
(3)rotate
android:fromDegrees 动画开始时的角度位置 android:toDegrees 动画结束时旋转到的角度位置。
正值代表顺时针方向的度数,负值代表逆时针方向的度数。
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="180" />
(4)translate
android:fromXDelta android:toXDelta android:fromYDelta android:toYDelta
值可以是数值 百分数 百分数p(有正负,表示方向)
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="0"
android:toXDelta="200"
android:fromYDelta="0"
android:toYDelta="200" />
(5)set 动画集合
注意:在set标签中设置repeatCount属性是无效的,必须对每个动画单位单独设置才有作用
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"
android:fillAfter="false">
<scale
android:repeatMode="reverse"
android:fromXScale="0.5"
android:fromYScale="0.5"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="2.0"
android:toYScale="2.0" />
<rotate
android:repeatMode="reverse"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="180" />
<translate
android:repeatMode="reverse"
android:fromXDelta="0"
android:fromYDelta="0"
android:toXDelta="200"
android:toYDelta="200" />
<alpha
android:repeatMode="reverse"
android:fromAlpha="0.5"
android:toAlpha="1.0" />
</set>
2.通过代码实现补间动画
(1)scale
ScaleAnimation scaleAnimation = new ScaleAnimation(0.5f, 2.0f, 0.5f, 2.0f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
scaleAnimation.setDuration(2000);
scaleAnimation.setFillAfter(false);
scaleAnimation.setInterpolator(new BounceInterpolator());
scaleAnimation.setRepeatCount(Animation.INFINITE);
scaleAnimation.setRepeatMode(Animation.REVERSE);
mIvAnimTarget.startAnimation(scaleAnimation);
(2)alpha
AlphaAnimation alphaAnimation = new AlphaAnimation(0.5f, 1.0f);
alphaAnimation.setInterpolator(new AccelerateInterpolator());
alphaAnimation.setDuration(2000);
alphaAnimation.setRepeatCount(2);
alphaAnimation.setRepeatMode(Animation.REVERSE);
mIvAnimTarget.startAnimation(alphaAnimation);
(3)rotate
RotateAnimation rotateAnimation = new RotateAnimation(45.f, 270.f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
rotateAnimation.setDuration(2000);
rotateAnimation.setInterpolator(new BounceInterpolator());
rotateAnimation.setRepeatCount(3);
rotateAnimation.setRepeatMode(Animation.REVERSE);
mIvAnimTarget.startAnimation(rotateAnimation);
(4)translate
TranslateAnimation translateAnimation = new TranslateAnimation(Animation.ABSOLUTE, 0, Animation.ABSOLUTE, 200, Animation.ABSOLUTE, 0, Animation.ABSOLUTE, 200);
translateAnimation.setDuration(2000);
translateAnimation.setFillAfter(true);
translateAnimation.setInterpolator(new AccelerateDecelerateInterpolator());
mIvAnimTarget.startAnimation(translateAnimation);
3.Animation中的其他方法
void cancel(); 取消动画
void reset(); 将控件重置到动画开始前的状态
void setAnimationListener(Animation.AnimationListener listener)设置动画的监听
translateAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
//动画开始
}
@Override
public void onAnimationEnd(Animation animation) {
//动画结束
}
@Override
public void onAnimationRepeat(Animation animation) {
//动画重复
}
});
4.插值器
详细的插值器方面的知识点期待后续
(1)AccelerateDecelerateInterpolator 加速减速插值器
表示在开始与结束的地方速率变化比较慢,在中间的时候加速
(2)AccelerateInterpolator 加速插值器
表示动画开始的地方速率改变比较慢,然后加速。
(3)DecelerateInterpolator 减速插值器
表示在动画开始的一瞬间加速到最大值,然后逐渐变慢
(4)LinearInterpolator 线性插值器 匀速插值器
表示动画过程中速率保持恒定
(5)BounceInterpolator 弹跳插值器
表示模拟了控件自由落地后回弹的效果
(6)AnticipateInterpolator 初始偏移插值器
表示在动画开始i的时候向前偏移一段距离,然后应用动画
(7)OvershootInterpolator 结束偏移插值器
表示在动画结束时,沿动画方向继续运动一段距离后再结束动画。
(8)AnicipateOvershootInterpolator 是前两者的合体
表示在动画开始时偏移一段距离,在结束时偏移一段距离
(9)CycleInterpolator 循环插值器
表示动画循环播放特定的次数
三.逐帧动画
使用:
(1)定义XML动画文件
放在res/anim文件夹下,通过R.anim.文件名使用
放在res/drawable文件夹下,通过R.drawable.文件名使用
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false"><!--true 只进行一次,false 无线循环-->
<item
android:drawable="@drawable/shape_has_task_dot"
android:duration="200" /><!--动画元素和当前元素执行的时间-->
<!--后面可以有多个item-->
</animation-list>
(2)设置给ImageView
通过src设置时,使用就需要getDrawable获取
通过background设置时,使用时就需要getBackground获取
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/frame_anim"/>
(3)AnimationDrawable开始动画
AnimationDrawable drawable = (AnimationDrawable) mImageView.getDrawable();
drawable.start();
四.结束语
这是写的第一篇博客,哈哈,还是个新手,之前没有写博客的习惯(后悔莫及),本文知识对Android中的动画做一个小小的总结,其中很多细节方面的东西还没有总结到位,希望大家多多指正,我之后也会逐步的对本文在进行修改,后续我会更加努力的去总结。
你还不改变自己,难道要等下辈子吗? ————致自己