您的位置:首页 > 移动开发 > Android开发

Android动画-Tweened animation(补间动画)

2016-12-12 19:48 387 查看
Android动画主要分为以下三类:

Tweened animation(补间动画)- 在android3.0(API11)之前支持,该动画仅仅支持对View操作,而且View在做动画的时候,View相应的实际属性值并没有发生改变,例如:一个Button起始位置left, top, right, bottom为(0,0, 50, 50),经过水平平移50操作移到(50,0,100,50),然后将该Button固定在平移后的位置,这时候Button的点击事件的触发区域仍然是(0,0, 50, 50)。

Frame animation(帧动画)- 在android3.0(API11)之前支持,该动画顺序播放事先准备好的图像,类似于放电影。

Property animation(属性动画)- 在android3.0(API11)开始支持,属性动画不像补间动画,属性动画通过改变对象的实际属性来实现动画,而且属性动画操作的对象不局限于View。

在本文中,主要介绍Tweened animation(补间动画)的相关使用。

补间动画的动画操作主要分为以下四类:

alpha(透明动画)

scale (缩放动画)

translate (平移动画)

rotate (旋转动画)

注:每种动画都有xml和代码两种设置方式。

一、补间动画的一些共同属性

共同属性特性
android:duration动画的持续时间(单位 : 毫秒)
android:fillAfter当设置为true,动画最终停留在最后一帧
android:fillBefore当设置为true,动画最终停留在第一帧
android:fillEnabled当设置为true,考虑android:fillBefore的值
android:interpolator插值器类型
android:repeatCount动画重复次数
android:repeatMode动画重复的方式
android:startOffset动画延迟多久开始
android:zAdjustment开始的动画在z轴上显示的位置
android:detachWallpaper当窗口在一个墙纸上,墙纸不会随动画而动(仅适用于窗口动画)
注:android:fillAfter 和 android:fillBefore同时设置为true时,以android:fillAfter为主,即动画最终停留在最后一帧。

常量:

Animation.RELATIVE_TO_SELF:用户传入的值是相对于做动画的对象本身;

Animation.RELATIVE_TO_PARENT:用户传入的值是相对于做动画的对象的父对象;

Animation.ABSOLUTE:用户传入的值是绝对大小。

二、 alpha (透明动画)

alpha动画控制View的透明度变化。

2.1 代码上的实现

private void transformAlpha(){
AlphaAnimation alphaAnimation = new AlphaAnimationCustom(1,0); // 不透明到透明
alphaAnimation.setDuration(200);// 动画持续0.2秒
alphaAnimation.setFillAfter(true); // 动画最终停留在最后一帧
//   alphaAnimation.setRepeatCount(-1); // 动画无限循环
//   alphaAnimation.setRepeatMode(Animation.REVERSE);// 动画的循环方式为反过来循环
mImageView.startAnimation(alphaAnimation);// mImageView是一个ImageView
}


2.2 在anim文件下的xml实现

在新建tweened_alpha.xml文件里加入下面代码:

<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator ="@android:anim/accelerate_decelerate_interpolator"
android:fromAlpha="1.0"
android:toAlpha="0"
android:fillAfter ="true"
android:repeatCount ="-1"
android:duration ="1000"
android:repeatMode="reverse"
android:zAdjustment ="top" />


在代码中使用tweened_alpha.xml文件:

Animation animation = AnimationUtils.loadAnimation(this, R.anim.tweened_alpha);
mImageView.startAnimation(animation);


三、Translate动画(平移动画)

3.1 代码上的实现

private void transformTranslate(){
//假设mImageView宽高为400,值类型为Animation.RELATIVE_TO_SELF,则下面表示mImageView的左上角从(0,0)平移到(200,200),其中mImageView的左上角坐标为(0,0). 等价于TranslateAnimation translateAnimation = new TranslateAnimation(0, 200, 0, 200);
TranslateAnimation translateAnimation = new TranslateAnimation(Animation.RELATIVE_TO_SELF,
0, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0,
Animation.RELATIVE_TO_SELF, 0.5f);
translateAnimation.setDuration(300); // 动画持续0.3秒
translateAnimation.setFillAfter(true); // 动画最终停留在最后一帧
mImageView.startAnimation(translateAnimation);
}


3.2 在anim文件下的xml实现

在新建tweened_translate.xml文件里加入下面代码:

<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator = "@android:anim/anticipate_interpolator"
android:fromXDelta="0%"
android:toXDelta="50%"
android:fromYDelta="0%"
android:toYDelta="50%"
android:duration="1000"
android:fillBefore = "false"
android:fillAfter = "true"
android:repeatMode = "reverse"
android:repeatCount = "-1"
android:zAdjustment = "top"/>


在代码中使用tweened_translate.xml文件:

Animation animation = AnimationUtils.loadAnimation(this, R.anim.tweened_translate);
mImageView.startAnimation(animation);


四、Rotate动画(旋转动画)

4.1 在代码中的实现

private void transformRotate(){
RotateAnimation rotateAnimation = new RotateAnimation(0, 90); // 默认是绕着进行动画的对象的左上角(动画坐标原点)旋转,顺时针旋转90度
rotateAnimation.setDuration(200); // 动画持续0.2秒
rotateAnimation.setFillAfter(true); // 动画最终停留在最后一帧
mImageView.startAnimation(rotateAnimation);
}


4.2 在anim文件下的xml实现

在新建tweened_rotate.xml文件里加入下面代码:

<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator = "@android:anim/anticipate_interpolator"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="1000"
android:repeatMode = "reverse"
android:repeatCount = "-1"
android:zAdjustment = "top"/>


代码中使用tweened_rotate.xml文件:

Animation animation = AnimationUtils.loadAnimation(this, R.anim.tweened_rotate);
mImageView.startAnimation(animation); // mImageView绕着自身中心旋转360度


五、Scale动画(缩放动画)

5.1 在代码中的实现

private void transformScale(){
// 相当于进行动画的对象中心将对象缩小50%
ScaleAnimation scaleAnimation = new ScaleAnimation(1.0f, 0.5f, 1.0f, 0.5f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
scaleAnimation.setDuration(300);
scaleAnimation.setFillAfter(true);
mImageView.startAnimation(scaleAnimation);
}


5.2 在anim文件下的xml实现

在新建tweened_scale.xml文件里加入下面代码:

<scale
xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator = "@android:anim/anticipate_interpolator"
android:fromXScale="1"
android:toXScale="0.5"
android:fromYScale="1"
android:toYScale="0.5"
android:pivotX="50%"
android:pivotY="50%"
android:duration="1000"
android:repeatMode="reverse"
android:repeatCount = "-1"
android:zAdjustment = "top"/>


代码中使用tweened_scale.xml文件:

Animation animation = AnimationUtils.loadAnimation(this, R.anim.tweened_scale);
mImageView.startAnimation(animation); // mImageView相对自身中心缩小50%


六、动画集合

6.1 在代码中的实现

private void transformAnimationSet(){
AnimationSet animationSet = new AnimationSet(true); //动画集,使用共享插值器
ScaleAnimation scaleAnimation = new ScaleAnimation(1.0f, 0.5f, 1.0f, 0.5f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f); // 缩放动画
TranslateAnimation translateAnimation = new TranslateAnimation(Animation.RELATIVE_TO_SELF,
0, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0,
Animation.RELATIVE_TO_SELF, 0.5f); // 平移动画
animationSet.addAnimation(scaleAnimation); // 将缩放动画添加到动画集
animationSet.addAnimation(translateAnimation); // 将平移动画添加到动画集
animationSet.setDuration(200);
mImageView.startAnimation(animationSet); // 开始动画集
}


6.2 在anim文件下的xml实现

在新建tweened_set.xml文件里加入下面代码:

<?xml version="1.0" encoding="utf-8"?>
<!--android:fillBefore和android:fillAfter只能在set中设置才有效-->
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false"
android:fillBefore = "false"
android:fillAfter = "true">

<alpha
android:interpolator = "@android:anim/accelerate_decelerate_interpolator"
android:fromAlpha="1.0"
android:toAlpha="0.3"
android:fillAfter = "true"
android:repeatCount = "-1"
android:duration = "1000"
android:repeatMode="reverse"
android:zAdjustment = "top"/>

<scale
android:interpolator = "@android:anim/anticipate_interpolator"
android:fromXScale="1"
android:toXScale="0.5"
android:fromYScale="1"
android:toYScale="0.5"
android:pivotX="50%"
android:pivotY="50%"
android:duration="1000"
android:repeatMode="reverse"
android:repeatCount = "-1"
android:zAdjustment = "top"/>

<translate
android:interpolator = "@android:anim/anticipate_interpolator"
android:fromXDelta="0%"
android:toXDelta="50%"
android:fromYDelta="0%"
android:toYDelta="50%"
android:duration="1000"
android:fillBefore = "false"
android:fillAfter = "true"
android:repeatMode = "reverse"
android:repeatCount = "-1"
android:zAdjustment = "top"/>

<rotate
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="1000"
android:repeatMode = "reverse"
android:repeatCount = "-1"
android:zAdjustment = "top"/>
</set>


代码中使用tweened_set.xml文件:

Animation animation = AnimationUtils.loadAnimation(this, R.anim.tweened_set);
mImageView.startAnimation(animation); // mImageView执行动画集
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: