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

动画篇(一)——android动画基础

2016-05-02 17:26 344 查看
本人水平有限,文章中如果出现什么不正确或者模糊的地方,还请各位小伙伴留下评论,多多指教 : )

目录

动画概述
动画种类

动画的公共属性

Animation的两种实现方式

变换动画的重要属性
AlphaAnimation 透明度动画

ScaleAnimation缩放动画

TranslateAnimation位移动画

RotateAnimation旋转动画

组合动画的使用
栗子一

栗子二

栗子三

栗子四

【动画概述】

动画种类

Tween animation 变换动画

Frame animation 帧动画

Layout animation 布局动画

Property animation 属性动画

动画的公共属性

(1)Duration:动画持续时间(单位:毫秒)

(2)fillAfter:设置为true,动画转化在动画结束后被应用

(3)fillBefore:设置为true,动画转化在动画开始前被应用

(4)interpolator:动画插入器(加速、减速插入器)

(5)repeatCount:动画重复次数

(6)repeatMode:顺序重复/倒序重复

(7)startOffset:动画之间的时间间隔

Animation的两种实现方式

(1)配置文件(res/admin)——alpha,scale,translate,rotate(适用于动画形式和参数固定)。实现方式如下:

//通过一个动画工具类去加载xml文件
Animation scale =AnimationUtils.loadAnimation(Activity.this,R.anim.alpha);
//开始动画
view.startAnimation(scale);


然后还要在res/anim/alpha.xml里面写上

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


(2)Java代码实现——AlphaAnimation,ScaleAnimation,TranslateAnimation,RotateAnimation(偏向动画的动态实现)。实现方式如下:

//透明度从%10到%100
Animation alpha = new AlphaAnimation(0.1f,1.0f);
//设置动画的时间为1秒
alpha.setDuration(1000);
//开始播放
view.startAnimation(alpha);


【变换动画的重要属性】

Animation animation= AnimationUtils.loadAnimation(MainActivity.this,R.anim.alpha);
img.startAnimation(animation);


这是使用配置文件设置动画的模板代码,加载不同的xml文件,就能实现相应的效果

AlphaAnimation (透明度动画)

(1)fromAlpha:动画起始透明度

(2)toAlpha:动画终止时透明度

0.0表示完全透明 | 1.0表示完全不透明

xml栗子:

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


java栗子:

AlphaAnimation alpha=new AlphaAnimation(0,1); //由透明到不透明
alpha.setDuration(1000);
view.startAnimation(alpha);


ScaleAnimation(缩放动画)

(1)fromX,toX 分别是起始时和结束时X坐标上的伸缩尺寸

(2)fromY,toY分别是起始和结束时y坐标上的伸缩尺寸

(3)pivotX,pivoY分别为伸缩动画相对于x,y坐标开始的位置。(可以理解为缩放中心点)

xml栗子

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:duration="2000"
android:fillAfter="false"
android:fromXScale="0.0"
android:fromYScale="0.0"
android:pivotX="50%"
android:pivotY="50%"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:toXScale="1.0"
android:toYScale="1.0"/>

</set>


java栗子:

//参数1:x轴的初始值
//参数2:x收缩后的值
//参数3:y轴的初始值
//参数4:y轴收缩后的值
//参数5:确定x轴坐标的类型
//参数6:x轴的值,0.5f表示以自身这个控件的一半长度为x轴
//参数7:确定y轴坐标的类型
//参数8:y轴的值,0.5f表示以自身这个控件的一半长度为y轴
ScaleAnimation scaleAnimation =new ScaleAnimation(
0,0.1f,0,0.1f,
Animation.RELATIVE_TO_SELF,0.5f,
Animation.RELATIVE_TO_SELF,0.5f);)
scaleAnimation.setDuration(1000);
view.startAnimation(scaleAnimation);


TranslateAnimation(位移动画)

(1)fromXDelta,fromYdelta 分别是起始时的X坐标和Y坐标。

(2)ftoXDelta,toYdelta,分别是结束时X坐标和Y坐标。

xml栗子:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="2000"
android:fromXDelta="0"
android:fromYDelta="0"
android:toXDelta="100"
android:toYDelta="100"/>
</set>


java栗子:

//参数1~2:x轴的开始位置
//参数3~4:y轴的开始位置
//参数5~6:x轴的结束位置
//参数7~8:x轴的结束位置
TranslateAnimation translateAnimation =
new TranslateAnimation(
Animation.RELATIVE_TO_SELF,0f,
Animation.RELATIVE_TO_SELF,0.5f,
Animation.RELATIVE_TO_SELF,0f,
Animation.RELATIVE_TO_SELF,0.5f); translateAnimation.setDuration(1000);
view.startAnimation(translateAnimation);


RotateAnimation(旋转动画)

(1)fromDegrees起始角度。

(2)toDegrees 终止角度

(3)pivotX,pivotY,分别为旋转动画相对于x,y的坐标开始位置。

xml栗子:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
android:duration="2000"
android:fromDegrees="0"
android:toDegrees="360"
android:fillAfter="false"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:pivotY="50%"
android:pivotX="50%"/>
</set>


java栗子:

//参数1:从哪个旋转角度开始
//参数2:转到什么角度
//后4个参数用于设置围绕着旋转的圆的圆心在哪里
//参数3:确定x轴坐标的类型,有ABSOLUT绝对坐标、RELATIVE_TO_SELF相对于自身坐标、RELATIVE_TO_PARENT相对于父控件的坐标
//参数4:x轴的值,0.5f表明是以自身这个控件的一半长度为x轴
//参数5:确定y轴坐标的类型
//参数6:y轴的值,0.5f表明是以自身这个控件的一半长度为x轴

RotateAnimation rotateAnimation = new RotateAnimation
(0, 360,
Animation.RELATIVE_TO_SELF,0.5f,
Animation.RELATIVE_TO_SELF,0.5f);
rotateAnimation.setDuration(1000);
view.startAnimation(rotateAnimation);


以上的四种基本变换动画比较简单,但是还是希望小伙伴们自己亲手码一码

【组合动画的使用】

本节内容将刚才讲解的几种基础动画进行组合,制作出更加流畅的动画

栗子一:

分别播放两个动画A和B,先播放A,设置A的AnimationListner。当onAnimationEnd触发(即A播放完毕)时,开始播放B

思路:首先加载A的动画,然后让view执行A动画,然后加载B动画,将B动画的执行逻辑放在A的动画监听事件当中。看下代码就能理解

//加载A动画
Animation animation1=AnimationUtils.loadAnimation(this,R.anim.translate);
img.startAnimation(animation1);
//加载B动画
final Animation animation2=AnimationUtils.loadAnimation(this,R.anim.rotate);
//设置动画监听事件
animation2.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {

}

@Override
public void onAnimationEnd(Animation animation) {
img.startAnimation(animation2);
}

@Override
public void onAnimationRepeat(Animation animation) {

}
});


栗子二:

写一个动画集AnimationSet(可以存储多个动画),在其中定义动画A和B,为动画B设置startOffset,其值就是前一个动画播放所需要的时间。

java代码:

Animation group_animation=AnimationUtils.loadAnimation(this,R.anim.group_anim);
img.startAnimation(group_animation);


动画配置文件:group_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha
android:duration="2000"
android:fromAlpha="0.0"
android:toAlpha="1.0" />
<alpha
android:duration="2000"
android:fillAfter="false"
android:fromAlpha="1.0"
android:startOffset="2000"
android:toAlpha="0.0" />
</set>


也可以完成栗子一的效果.

栗子三:

利用Animation的setRepeatCount、setRepeatMode来实现循环动画

代码如下:

Animation alphaAnimation=new AlphaAnimation(0.1f,1.0f);
alphaAnimation.setDuration(100);
alphaAnimation.setRepeatCount(10);
//设置重复模式
alphaAnimation.setRepeatMode(Animation.REVERSE);
img.startAnimation(alphaAnimation);


栗子四:

使用overridePendingTransition方法,完成Activity切换动画。

该方法传递2个参数:

[第二个activity进入动画] [第一个activity退出的动画]

代码如下:

Intent intent=new Intent(MainActivity.this,SecondActivity.class);
startActivity(intent);
overridePendingTransition(R.anim.zoom_in,R.anim.zoom_out);


动画配置文件:zoom_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:duration="1000"
android:pivotX="50%"
android:pivotY="50%"
android:fromYScale="0.1"
android:fromXScale="0.1"
android:toYScale="1.0"
android:toXScale="1.0"/>
<alpha
android:duration="1000"
android:fromAlpha="0.5"
android:toAlpha="1.0"/>
</set>


动画配置文件:zoom_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:duration="1000"
android:pivotX="50%"
android:pivotY="50%"
android:fromYScale="0.1"
android:fromXScale="0.1"
android:toYScale="1.0"
android:toXScale="1.0"/>
<alpha
android:duration="1000"
android:fromAlpha="0.5"
android:toAlpha="1.0"/>
</set>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  android 动画