动画效果(一)-渐变动画
来源:互联网 发布:淘宝耐克篮球鞋正品店 编辑:程序博客网 时间:2024/05/17 20:28
第1节 概述
在安卓系统中,为了界面或者其中的组件在切换、改变的时候显得自然生动、具有流动性的美感,就给它们添加了动画的效果。
例如图片切换的时候,前一张图片淡出,后一张图片淡入。
动画分了三类: frame动画(逐帧动画)、 property动画(属性动画)、 tween动画(渐变动画)。
逐帧动画有点像播放电影,它把很多图片串起来,按照顺序一张一张显示,通过播放形成动画效果;
属性动画是对控件某个属性使用的动画,例如一个按钮的宽度要从窄设置到宽,而我们希望它的宽度调整的时候,能看到它从窄到宽变化的过程,这时就需要使用属性动画。
渐变动画是对控件整体使用的动画,有四种最常见到的效果:透明、平移、缩放和旋转。
/*******************************************************************/
* 版权声明
* 本教程只在CSDN和安豆网发布,其他网站出现本教程均属侵权。
/*******************************************************************/
第2节 渐变动画
渐变动画有四种最常见到的效果:透明、平移、缩放和旋转。这四种效果都有共同点,
- 动画对象作为整体一点点变化;
- 这是一个状态的迁移过程,需要时间的配合,动画的时间长短可以指定,动画变化的速度也是可以指定的;
- 动画执行后,这个动画的对象,并不是真正的变成了动画展示的那样,它其实还保持着以前的样子,你看到的不过是个它的影子罢了,动画结束,影子就消失了。
动画效果可以通过资源文件定义,也可以通过代码来定义。
2.1 透明动画
透明动画的效果是,动画对象的透明度从一个程度变成另一个程度。例如从透明变成不透明这种淡入效果。
2.1.1 xml定义透明动画
通过xml定义透明动画,
- 在
res
下新建一个anim目录
,然后在这个目录下创建一个xml文件
; 定义动画效果,
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="1500" android:interpolator="@android:anim/linear_interpolator"/></set>
透明动画的各个属性代表了如下的含义:
<alpha/>
标签:这是一个透明效果的动画;fromAlpha
:动画开始时,动画对象的透明度值,取值在0-1
之间,0是完全透明,1是完全不透明,0
和1
之间的值就是各种半透效果;toAlpha
:动画结束时,动画对象的透明度值,取值在0-1
之间;duration
:动画持续的时间,单位是毫秒;interpolator
:这是插值器,用来指定动画变化的速率,例如是先快后慢,还是先慢后快,或者是均匀的变化。安卓系统为我们提供了很多现成的插值器,我们可以直接使用,例如上面的线性插值器@android:anim/linear_interpolator
;
淡入效果就是刚开始没有显示,逐渐显示出来,所以它的fromAlpha
就要设置成0
,toAlpha
设置成1
;
淡出效果就是刚开始显示,逐渐隐藏起来,所以它的fromAlpha
就要设置成1
,toAlpha
设置成0
;
另外,Android SDK也提供了自定义插值器的方法,我们在以后介绍。
2.1.2 java代码定义透明动画
通过java代码定义透明动画,
- 创建一个AlphaAnimation,填入起始alpha值和结束的alpha值;
- 设定持续时间;
- 设定插值器;
AlphaAnimation anim = new AlphaAnimation(0, 1);anim.setDuration(1500);anim.setInterpolator(context, android.R.interpolator.linear);
2.2 平移动画
平移动画的效果是,动画对象沿着水平方向或者垂直方向移动(或者两个方向同时移动)到另一位置。
2.2.1 xml定义平移动画
通过xml定义透明动画,
- 在
res
下新建一个anim目录
,然后在这个目录下创建一个xml文件
; 定义动画效果,
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromXDelta="-100%" android:fromYDelta="-100%" android:toXDelta="0%" android:toYDelta="0%" android:duration="1500" android:interpolator="@android:anim/linear_interpolator"/></set>
平移动画的各个属性代表了如下的含义:
<translate/>
标签:这是一个平移效果的动画;fromXDelta
:动画开始时,动画对象相对于它真实位置在x方向上的坐标;fromYDelta
:动画开始时,动画对象相对于它真实位置在y方向上的坐标;toXDelta
:动画结束时,动画对象相对于它真实位置在y方向上的坐标;toYDelta
:动画结束时,动画对象相对于它真实位置在y方向上的坐标;duration
:动画持续的时间,单位是毫秒;interpolator
:这是插值器,用来指定动画变化的速率;
起始坐标有3种表达方式:
- 动画对象的绝对位置:用数值表示。
动画对象相对自身的位置:用
%
表示。例如给fromXDelta
设定-100%
,表示动画开始时,起始的左边边界相对于自身真实位置,在负的自身宽度的地方;动画对象相对于它父布局的位置:用
%p
表示,这里的p
就是parent
的缩写。
让对象从左往右平移进入的效果,就是让它的fromXDelta
设置成-100%
,toXDelta
设置成0%
;fromYDelta
设置成0%
;toYDelta
设置成0%
;
让对象从下往上平移进入的效果,就是让它的fromXDelta
设置成0%
,toXDelta
设置成0%
;fromYDelta
设置成100%
(y坐标是从上到下为正方向);toYDelta
设置成0%
;
2.2.2 java代码定义平移动画
通过java代码定义平移动画,
- 创建一个TranslateAnimation,填入x y方向的起始坐标和结束坐标;设置坐标时,可以设定坐标的类型,
Animation.RELATIVE_TO_SELF
表示使用相对自身的位置坐标,Animation.RELATIVE_TO_PARENT
表示使用相对父布局的位置坐标,Animation.ABSOLUTE
表示使用绝对位置坐标; - 设定持续时间;
- 设定插值器;
//使用坐标的绝对位置创建动画TanslateAnimation anim = new TanslateAnimation(-150, 0, -50, 0);anim.setDuration(1500);anim.setInterpolator(context, android.R.interpolator.linear);//使用坐标的相对位置创建动画TanslateAnimation anim = new TanslateAnimation(Animation.RELATIVE_TO_SELF, -1.0, Animation.RELATIVE_TO_SELF, 0, Animation.RELATIVE_TO_SELF, -1.0, Animation.RELATIVE_TO_SELF, 0);anim.setDuration(1500);anim.setInterpolator(context, android.R.interpolator.linear);
2.3 缩放动画
伸缩动画的效果是,动画对象以某个位置为中心进行放大或者缩小。
2.3.1 xml定义伸缩动画
通过xml定义伸缩动画,
- 在
res
下新建一个anim目录
,然后在这个目录下创建一个xml文件
; 定义动画效果,
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <scale android:fromXScale="-100%" android:fromYScale="-100%" android:toXScale="0%" android:toYScale="0%" android:pivotX="50%" android:pivotY="50%" android:duration="1500" android:interpolator="@android:anim/linear_interpolator"/></set>
伸缩动画的各个属性代表了如下的含义:
<scale/>
标签:这是一个伸缩效果的动画;fromXScale
:动画开始时,动画对象在x方向上相对于它真实大小的缩放比例;fromYScale
:动画开始时,动画对象在x方向上相对于它真实大小的缩放比例;toXScale
:动画结束时,动画对象在y方向上相对于它真实大小的缩放比例;toYScale
:动画结束时,动画对象在y方向上相对于它真实大小的缩放比例;duration
:动画持续的时间,单位是毫秒;interpolator
:这是插值器,用来指定动画变化的速率;pivotX
:动画进行缩放时的中心点x坐标;pivotY
:动画进行缩放时的中心点y坐标;
这里的pivotX
与pivotY
可以设置绝对坐标,也可以设置相对自身的相对坐标%
,以及相对于父布局的相对坐标%p
。
2.3.2 java代码定义伸缩动画
通过java代码定义伸缩动画,
- 创建一个ScaleAnimation,填入x y方向的起始伸缩比例和结束伸缩比例;设置中心坐标时,可以设定坐标的类型,
Animation.RELATIVE_TO_SELF
表示使用相对自身的位置坐标,Animation.RELATIVE_TO_PARENT
表示使用相对父布局的位置坐标,Animation.ABSOLUTE
表示使用绝对位置坐标; - 设定持续时间;
- 设定插值器;
//使用中心点的绝对位置创建动画ScaleAnimation anim = new ScaleAnimation(1, 2, 1, 2, 50, 150);anim.setDuration(1500);anim.setInterpolator(context, android.R.interpolator.linear);//使用中心点的相对位置创建动画ScaleAnimation anim = new ScaleAnimation(1, 2, 1, 2, Animation.RELATIVE_TO_SELF, 0.5, Animation.RELATIVE_TO_SELF, 0.5);anim.setDuration(1500);anim.setInterpolator(context, android.R.interpolator.linear);
2.4 旋转动画
旋转动画的效果是,动画对象以某个位置为中心进行旋转。
2.4.1 xml定义旋转动画
通过xml定义旋转动画,
- 在
res
下新建一个anim目录
,然后在这个目录下创建一个xml文件
; 定义动画效果,
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <rotate android:fromDegrees="0" android:toDegrees="360" android:pivotX="50%" android:pivotY="50%" android:duration="1500" android:interpolator="@android:anim/linear_interpolator"/></set>
伸缩动画的各个属性代表了如下的含义:
<rotate/>
标签:这是一个旋转效果的动画;fromDegrees
:动画开始时,动画对象相对于真实位置旋转的角度;toDegrees
:动画开始时,动画对象相对于真实位置旋转的角度;duration
:动画持续的时间,单位是毫秒;interpolator
:这是插值器,用来指定动画变化的速率;pivotX
:动画进行缩放时的中心点x坐标;pivotY
:动画进行缩放时的中心点y坐标;
这里的pivotX
与pivotY
可以设置绝对坐标,也可以设置相对自身的相对坐标%
,以及相对于父布局的相对坐标%p
。
2.4.2 java代码定义旋转动画
通过java代码定义旋转动画,
- 创建一个RotateAnimation,填入起始角度和结束角度;设置中心坐标时,可以设定坐标的类型,
Animation.RELATIVE_TO_SELF
表示使用相对自身的位置坐标,Animation.RELATIVE_TO_PARENT
表示使用相对父布局的位置坐标,Animation.ABSOLUTE
表示使用绝对位置坐标; - 设定持续时间;
- 设定插值器;
//使用中心点的绝对位置创建动画RotateAnimation anim = new RotateAnimation(0, 360, 50, 150);anim.setDuration(1500);anim.setInterpolator(context, android.R.interpolator.linear);//使用中心点的相对位置创建动画ScaleAnimation anim = new ScaleAnimation(0, 360, Animation.RELATIVE_TO_SELF, 0.5, Animation.RELATIVE_TO_SELF, 0.5);anim.setDuration(1500);anim.setInterpolator(context, android.R.interpolator.linear);
2.5 使用动画
2.5.1 使用xml定义的动画
- 使用
AnimationUtils.loadAnimation()
装载动画; - 对要使用动画的对象使用
startAnimation()
函数,启动动画;
Animation anim = AnimationUtils.loadAnimation(this, R.anim.custom_anim);mAnimationTarget.startAnimation(anim);
2.5.2 使用代码定义的动画
使用代码定义的动画就和使用xml一样,对要使用动画的对象使用startAnimation()
函数,启动动画;
mAnimationTarget.startAnimation(anim);
2.6 多个动画效果叠加
这几种动画不仅可以单独使用,也可以混合着使用,例如你希望一个对象一边淡入一边做平移。
2.6.1 xml定义多个动画
对同一个对象同时使用多个动画效果,只要在定义动画的xml文件中,添加多个希望的动画就行了。
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"> <rotate ....../> <scale ....../> <translate ....../> <alpha ....../></set>
2.6.2 java代码定义多个动画
在java代码中可以,
- 创建多个动画;
- 创建AnimationSet;
- 将创建的多个动画加入到AnimatonSet当中;
TranslateAnimation anim1 = new TranslateAnimation(...);ScaleAnimation anim2 = new ScaleAnimation(...);AlphaAnimation Anim3 = new AlphaAnimation(...);RotateAnimation anim4 = new RotateAnimation(...);AnimationSet set = new AnimationSet(true);set.addAnimation(anim1);set.addAnimation(anim2);set.addAnimation(anim3);set.addAnimation(anim4);mAnimationTarget.startAnimation(set);
2.7 渐变动画的监听
有的时候,需要知道一个动画执行的状态,就需要给动画添加一个监听器。通过监听器获得动画状态变化的通知。
TranslateAnimation anim = new TranslateAnimation(...);anim.setAnimationListener(new Animation.AnimationListener() { @Override public void onAnimationStart(Animation animation) { //动画开始 } @Override public void onAnimationEnd(Animation animation) { //动画结束 } @Override public void onAnimationRepeat(Animation animation) { //动画重复执行 }});
2.8 渐变动画的其它共同属性
在前面我们已经介绍了android:duration
android:interpolator
等共同的属性。现在我们再介绍几个其它的重要属性。
2.8.1 android:fillAfter
假设一个按钮被使用透明效果的动画,从不透明变到全透明。动画完成后,这个按钮会被还原到它的真实状态(按钮并没有消失或透明,仍然显示在以前的位置)。
如果给这个动画设置了android:fillAfter
属性为true
,那么在执行完动画后,按钮还是保持动画最后一帧的效果。
这两个属性要设置在<set/>
标签当中才能有效果。
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android" android:fillAfter="false"> ......</set>
也就是说,如果是用代码创建动画的话,得把这个动画放到AnimationSet
之中再来设置属性。
RotateAnimation anim = new RotateAnimation(...);AnimationSet set = new AnimationSet(true);set.addAnimation(anim);set.setFillAfter(true);
2.8.2 android:repeatMode
与android:repeatCount
可以通过设置android:repeatCount
的数值,让动画重复播放;
- 该值为大于
0
:动画重复该数值表示的次数; - 该值设置为
INFINITE
:动画将会无限循环进行下去;
当android:repeatCount
被设置大于0
以后,还可以配合使用android:repeatMode
,
- 该值设置为
RESTART
:每一次动画执行完成后,回到最初状态重新执行下一次动画; - 该值设置为
REVERSE
:每一次动画执行完成后,动画倒着执行;
/*******************************************************************/
* 版权声明
* 本教程只在CSDN和安豆网发布,其他网站出现本教程均属侵权。
*另外,我们还推出了Arduino智能硬件相关的教程,您可以在我们的网店跟我学Arduino编程中购买相关硬件。同时也感谢大家对我们这些码农的支持。
*最后再次感谢各位读者对安豆
的支持,谢谢:)
/*******************************************************************/
- 动画效果(一)-渐变动画
- jq渐变动画效果
- 动画的渐变效果
- jQuery 颜色渐变动画效果
- ActionBar 背景渐变动画效果
- ActionBar 背景渐变动画效果
- ViewPager动画效果(一)
- android_animation(渐变动画)
- Android 启动程序时动画效果(渐变)
- android实现alpha渐变动画效果
- 在状态栏上做渐变动画效果
- Android_UI_美化_图片渐变动画效果
- CSS3动画效果一
- Silverlight学习笔记--动画效果-- 渐变风格方式动画
- Android动画效果总结(一)
- Android实用技巧.动画效果(一)
- 动画效果 --Animation 总汇(动画专题研究一)
- android 自定义动画效果 一
- 全文检索:倒排索引的理解
- 设计模式一 策略模式
- Android 开发的两种框架 MVC和MVP 的简单分析
- Spring 4.x官方参考文档中文版——第21章 Web MVC框架(15)
- Android StatusBarUtil:设置Android系统下方虚拟键键盘透明度
- 动画效果(一)-渐变动画
- 仿映客直播界面的跑马灯效果
- 世界名曲
- 重定向
- 解决ie8不支持placeholder方法
- think in java笔记 upcasting
- RESTful思想
- 当使用PHP use 关键词时
- 单例宏的书写