Android中动画之视图动画(View Animation)

目录

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中的动画做一个小小的总结,其中很多细节方面的东西还没有总结到位,希望大家多多指正,我之后也会逐步的对本文在进行修改,后续我会更加努力的去总结。

你还不改变自己,难道要等下辈子吗?  ————致自己

 

 

 

 

 

 

 

 

 

 

  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值