android -- 视图动画

作者:opLW 记录平时所学内容
参考:启舰大神的《Android自定义控件开发入门与实战》

视图动画的使用

目录

1.视图动画概述
2.视图动画标签详解
3.视图动画的代码实现
4.Intepolator插值器
5.逐帧动画

1.视图动画概述

  • 概述
    android的视图动画又alpha,scale,scale,translate,rotate,set.
  • XML标签
    (1)alpha渐变透明度的动画效果。
    (2)scale渐变尺寸伸缩动画效果。
    (3)translate画面变换位置移动动画效果。
    (4)rotate画面旋转动画效果。
    (5)set定义上述动画的任意组合。
  • 动画存放的位置
    (1)存放在res/anim,使用R.anim.XX访问。
    (2)存放在res/drawable,使用R.drawable.XX访问。
  • 使用动画文件
//加载动画
Animation animation = AnimationUtil.loadAnimation(this,R.anim.XX)
//启动动画
tv.startAnimation(animation)

2.视图动画标签详解

  • 继承自Animation的属性。

(scale,alpha,translate,rotate)动画都继承自Animation,所以下述的属性,是他们都有的。

属性 作用
android:duration 设置完成一次动画的时间,以毫秒为单位
android:fillAfter 设置为true时,动画播放结束时,保持结束的样子不变
android:fillBefore android:fillEnabled 其中一个设置为true时,动画结束时将还原到起始的样子
android:repeatCount 用于指定动画循环的次数,当取值infinite时,动画无限循环
android:repeatMode 用于设定重复的类型,有reverse和restart两种
Android:interpolator 设定插值器,影响动画播放的速率
  • scale标签
属性 作用
android:fromXScale 动画起始时,控件在X轴方向上相对自身的缩放比例。取值为浮点数,如1.0表示没有变化,2.0表示放大一倍
android:toXScale 动画结束时,控件在X轴方向上相对自身的缩放比例
android:fromYScale 动画起始时,控件在Y轴方向上相对自身的缩放比例
android:toYScale 动画结束时,控件在Y轴方向上相对自身的缩放比例
android:pivotX X轴方向上缩放的参照点,取值有三种类型:数值,百分数,百分数p,如50,50%,50%p,下面会详细讲解这三种类型的意思
android:pivotY Y轴方向上缩放的参照点

(1)当pivotX取值50,pivotY取值40时。(其中红色点为TextView的原点,蓝色点为参照点,一下单位都为px)

此时参照点的位置为**(原点+50, 原点+40)**
[外链图片转存失败(img-tjoPyQL6-1563697870242)(http://po8upthot.bkt.clouddn.com/FtKBRuTTFz-UNeDo8CMiBM04iZVq =300x200)]

(2)当pivotX取值50%,pivotY取值40%时。

此时参照点的位置为**(原点+TextView宽度的50%, 原点+TextView高度的40%)**
[外链图片转存失败(img-2ZnU37A8-1563697870243)(http://po8upthot.bkt.clouddn.com/FmJqr17gaLa6d3GfI9tVAsWmbpw3 =300x200)]

(1)当pivotX取值50%p,pivotY取值40%p时。

此时参照点的位置为**(原点+父布局宽度的50%, 原点+父布局高度的40%)**
[外链图片转存失败(img-hA7Qi4ua-1563697870243)(http://po8upthot.bkt.clouddn.com/FqRDTVW1i_2HrcO9lfIXKuF0vK8l =300x200)]

  • alpha标签
属性 作用
android:fromAlpha 动画开始时的透明度,取值范围是0.0-1.0,表示完全透明到完全不透明
android:toAlpha 动画结束时的透明度,取值范围是0.0-1.0,表示完全透明到完全不透明
  • rotate标签
属性 作用
android:fromDegrees 动画开始旋转时的角度位置,正值表示顺时针方向,负值表示逆时针方向
android:toDegrees 动画结束时旋转到的角度位置,正值表示顺时针方向,负值表示逆时针方向
android:pivotX 旋转中心的x轴坐标,取值有三种类型同上述的scale标签的pivotX一样,这里不再赘述。
android:pivotY 旋转中心的y轴坐标,取值同上
  • translate标签
属性 作用
android:fromXDelta 起始点的X坐标,取值有三种类型同上述的scale标签的pivotX一样,这里不再赘述。
android:fromYDelta 起始点的Y坐标,取值同上
android:toXDelta 结束点的X坐标,取值同上
android:toXDelta 结束点的Y坐标,取值同上
  • set标签
    set标签本身没有动画,对set设置的属性会作用到set标签下的所有子动画。

注意点(set标签中的repeatCount属性是无效的,需要对每个子动画分别设置)

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fillAfter="true">

<alpha
    android:fromAlpha="0.0"
    android:toAlpha="1.0"/>

<scale
    android:fromXScale="0.0"
    android:toXScale="1.4"
    android:fromYScale="0.0"
    android:toYScale="1.4"
    android:pivotX="50%"
    android:pivotY="50%"/>

...//可以包含其他的动画
</set>

3.视图动画的代码实现

  • 概述
    下面简述视图标签在代码实现中对应的类,以及标签属性在代码中对应的方法。
标签
scale ScaleAnimation
alpha AlphaAnimation
rotate RotateAnimation
translate TranslateAnimation
set SetAnimation
标签属性 方法
android:duration setDuration(long)
android:fillAfter setFillAfter(boolean)
android:filBefore setFillBefore(boolean)
android:fillEnabled setFillEnabled(boolean)
android:repeatCount setRepeatCount(int)
android:repeatMode setRepeatMode(int)
android:interpolator setInterpolator(Interpolator)
  • 继承自Animation共有的方法
void cancel(); //取消动画
void reset(); //将动画还原到开始前的状态
void setAnimationListener(AnimationListener listener); //添加监听器
  • 举例ScaleAnimation的构造函数
ScaleAnimation(Context context, AttributeSet attrs)
ScaleAnimation(float fromX, float toX, float fromY, toY)
ScaleAnimation(float fromX, float toX, float fromY, toY, float pivotX, float pivotY)
ScaleAnimation(float fromX, float toX, float fromY, toY, 
float pivotXType, float pivotXValue, float pivotYType, float pivotYValue)

注意: 如上第四个构造函数,其中pivotXValue对应的值有数值,百分数,百分数p,此时pivotXType对应的值是Animation.ABSOLUTE,Animation.RELATIVE_TO_SELF,Animation.RELATIVE_TO_PARENT。其他类似不再赘述。

  • AnimationSet
AnimationSet(Context context, AttributeSet attrs)
AnimationSet(boolean shareInterpolator)

注意: 第二个构造函数的参数,表示是否对包含的所有子元素使用同一个插值器。

  • 综合使用
Animation alpha = new AlphaAnimation(1.0f, 0.1f);
Animation scale = new ScaleAnimation(0.0f, 1.4f, 0.0f, 1.4f,
          Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
AnimationSet set = new AnimationSet(true);
set.addAnimation(alpha);
set.addAnimation(scale);
set.setDuration(1000);
set.setIntepolator(new LinearIntepolator())
tv.startAnimation(set); //将动画添加到对应的控件

4.Intepolator插值器

  • Intepolator简述

三峡大坝,估计大家都很熟悉。大坝通过做一些中间的操作(其实我不太清楚(.?)来达到控制水流的速度。我觉得这个比喻可能跟插值器比较相似了,插值器作为一个中间者,同样通过一些操作来控制动画播放的速度。具体可以看我另外一篇文章自定义Interpolator

  • Intepolator的种类
名称 作用
LinearIntepolator 使动画匀速播放
DecelerateIntepolator 使动画减速播放
AccelerateIntepolator 使动画加速播放
AccelerateDecelerateIntepolator 使动画先加速播放,然后减速停止
BounceIntepolator 模拟自然界物体自由落地后回弹的动画效果
AnticipateIntepolator 后面详细介绍
OvershootIntepolator 后面详细介绍
AnticipateOvershootIntepolator 后面详细介绍
CycleIntepolator 后面详细介绍

前五种插值器都比较好理解,下面单独介绍后面几种。(借用启舰大神书本中的图片。?)

(1)AnticipateIntepolator

特点 一开始返回的是负值。表示在动画开始之后,会先往反方向进行一小段。
例如: 对于旋转动画,会先反方向旋转一段后再向目标方向旋转;对于放大动画,会先缩小之后再放大。
构造器 除了默认的构造器之外,还有一个带参数的 public AnticipateIntepolator(float tension)
参数 tension表示张力值,默认的值是2,值越大,初始时偏移的量越大,而且变化的速度越快。
具体效果: 如下

在这里插入图片描述
(2)OvershootIntepolator

在这里插入图片描述
特点 OvershootIntepolator的原理与AnticipateIntepolator类似。只不过OvershootIntepolator会超过目标值之后再返回目标值,AnticipateIntepolator是先低于初始值,再返回初始值,然后继续向着目标前进。
构造函数 public OvershootIntepolator(float tension),参数越大,结束时的偏移量越大,而且速度越快。

(3)AnticipateOvershootIntepolator
在这里插入图片描述
特点 这个是前面两者的结合版,兼具前面两者的特点。
构造函数:

public AnticipateOvershootIntepolator(float tension) 
public AnticipateOvershootIntepolator(float tension, float extraTension)
//其中extraTension代表额外的张力

(4)CycleIntepolator

在这里插入图片描述
特点 使动画类似正弦曲线变化。
构造函数 public CycleIntepolator(float cycles),其中参数cycles表示循环的次数。

5.逐帧动画

  • 定义逐帧动画的XML文件
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot=["true" | "false"]>
    <item
        android:drawable="@[packpage:]drawable/drawable_resource_name"
        android:duration="integer"/>
</animation-list>

注意 这个文件只可以定义在res/drawable中,并不可以定义在res/anim中,书里面讲错了。

要点:
(1)根元素的android:oneshot是必须的,true时表示动画播放一次之后结束,false表示动画无限播放。
(2)一个item代表一帧的动画,其中drawable代表一张图片对应的资源,duration代表这张图片持续的时间。通过设置多个item就可以达到逐帧动画。
(3)可以通过给ImageView的android:src或者android:background设置动画,然后通过如下代码开启动画。

/*通过android:src设置时对应的取出方式。如果通过android:background设置,
则通过iv.getBackground()来获取。
*/
Animation anim = iv.getDrawable(); 
anim.start();
  • 使用代码实现逐帧动画
    逐帧动画需要AnimationDrawable类的支持,有以下方法:
方法名 作用
void start() 开始播放逐帧动画
void stop() 停止播放逐帧动画
int getDuration(int index) 得到第index帧对应的持续时间
Drawable getFrame(int index) 得到第index帧对应的Drawable对象
int getNumberOfFrames() 得到当前动画的总帧数
boolean isRunning() 判断当前动画是否正在播放
void setOneShot(boolean oneshot) 设置帧动画是否执行一次
boolean isOneShot() 判断当前帧动画是否只执行一次
void addFrame(Drawable, int duration) 为帧动画添加一帧的动画

例子如下:

final AnimationDrawable anim = new AnimationDrawable();
for (int i = 1; i <=14; i++){
	int id = getResources().getIdentifier("list_icon_gif_playing" + i, "drawable", getPackageName());
	Drawable drawable = getResources().getDrawable(id);
	anim.addFrame(drawable, 60);
}
anim.setOneShot(true);
iv.setBackground(anim);
anim.start();

注意: getResources().getIdentifier(“list_icon_gif_playing” + i, “drawable”, getPackageName())函数。
第一个参数 要查找资源的ID
第二个参数 资源所在的文件件类型
第三个参数 应用的包名
例子 如果要获取的是string,则可以这样写 getResources().getIdentifier(“name”, “string”, getPackageName())

结束 ?

记录美好学习的点点滴滴,希望能和各位一起学习!
好记性不如烂笔头!!
万水千山总是情,麻烦手下别留情。
如若讲得有不妥,文末留言告知我,
如若觉得还可以,收藏点赞要一起。

opLW原创七言律诗,转载请注明出处

发布了21 篇原创文章 · 获赞 28 · 访问量 7335

猜你喜欢

转载自blog.csdn.net/qq_36518248/article/details/88623521