自定义控件三部曲之动画篇(三)—— 代码生成alpha、scale、translate、rotate、set及插值器动画

自定义控件三部曲之动画篇(三)—— 代码生成alpha、scale、translate、rotate、set及插值器动画,第1张

概述一、概述前两篇,我为大家讲述了利用XML来定义动画及插值器,但在代码中,我们常常是动态生成动画的,所以,这篇将为大家讲述如何用代码生成动态生成动画及插值器。先简单写出各个标签对应的类,方便大家理解:scale ——ScaleAnimation alpha —— AlphaAnimation rotate ——RotateAnimation translate ——TranslateAnimation set ——AnimationSet二、Animation公共类官方... 一、概述

前两篇,我为大家讲述了利用XML来定义动画及插值器,但在代码中,我们常常是动态生成动画的,所以,这篇将为大家讲述如何用代码生成动态生成动画及插值器。

先简单写出各个标签对应的类,方便大家理解:

scale —— ScaleAnimationAlpha —— AlphaAnimationrotate —— RotateAnimationtranslate —— TranslateAnimationset —— AnimationSet

 

二、Animation公共类

官方SDK讲解页面为:《Animation》

第一篇中我们提到过,Animation类是所有动画(scale、Alpha、translate、rotate)的基类,它所具有的标签及对应函数为:

androID:duration                  setDuration(long)  动画持续时间,以毫秒为单位 androID:fillAfter                    setFillAfter(boolean) 如果设置为true,控件动画结束时,将保持动画最后时的状态androID:fillBefore                 setFillBefore(boolean) 如果设置为true,控件动画结束时,还原到开始动画前的状态androID:fillEnabled              setFillEnabled(boolean) 与androID:fillBefore 效果相同,都是在动画结束时,将控件还原到初始化状态androID:repeatCount           setRepeatCount(int) 重复次数androID:repeatMode            setRepeatMode(int) 重复类型,有reverse和restart两个值,取值为RESTART或 REVERSE,必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型,即回放时的动作。androID:interpolator            setInterpolator(Interpolator) 设定插值器,其实就是指定的动作效果,比如d跳效果等

在第一篇《 Animation 动画详解(一)——alpha、scale、translate、rotate、set的xml属性及用法》 我们已经讲解了每个标签具体所具有的功能,这里就不再细讲,对于使用方法会在下面的各标签中使用。

 

三、ScaleAnimation

这是scale标签对应的类,官方SDK页面为:《ScaleAnimation》

在Scale标签中,我们提到过它的自有属性有下面几条,先列一下:

androID:fromXScale    起始的X方向上相对自身的缩放比例,浮点值,比如1.0代表自身无变化,0.5代表起始时缩小一倍,2.0代表放大一倍;androID:toXScale        结尾的X方向上相对自身的缩放比例,浮点值;androID:fromYScale    起始的Y方向上相对自身的缩放比例,浮点值,androID:toYScale        结尾的Y方向上相对自身的缩放比例,浮点值;androID:pivotX            缩放起点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,当为数值时,表示在当前VIEw的左上角,即原点处加上50px,做为起始缩放点;如果是50%,表示在当前控件的左上角加上自己宽度的50%做为起始点;如果是50%p,那么就是表示在当前的左上角加上父控件宽度的50%做为起始点x轴坐标。(具体意义,后面会举例演示)androID:pivotY           缩放起点Y轴坐标,取值及意义跟androID:pivotX一样。
 

放到代码中,ScaleAnimation有下面几个构造函数:

ScaleAnimation(Context context,AttributeSet attrs)  从XML文件加载动画,基本用不到ScaleAnimation(float fromX,float toX,float fromY,float toY)ScaleAnimation(float fromX,float toY,float pivotX,float pivotY)ScaleAnimation(float fromX,int pivotXType,float pivotXValue,int pivotYType,float pivotYValue)
 

第一个构造函数是从本地XML文件加载动画,基本用不到的,我们主要看下面三个构造函数。

在标签属性androID:pivotX中有三种取值,数,百分数,百分数p;体现在构造函数中,就是最后一个构造函数的pivotXType,它的取值有三个,Animation.absolute、Animation.relative_TO_SELF和Animation.relative_TO_PARENT;

这三个构造函数难度不大,就不再细讲,举个例子说明:

在第一篇中Scale的例子的XML代码为:

<?xml version="1.0" enCoding="utf-8"?><scale xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:fromXScale="0.0"    androID:toXScale="1.4"    androID:fromYScale="0.0"    androID:toYScale="1.4"    androID:pivotX="50"    androID:pivotY="50"    androID:duration="700" />

对应的代码构造代码为:

scaleAnim = new ScaleAnimation(0.0f,1.4f,0.0f,Animation.relative_TO_SELF,0.5f,0.5f);scaleAnim.setDuration(700);

在控件使用的时候,同样是使用:

tv.startAnimation(scaleAnim);
四、AlphaAnimation

这是Alpha标签对就的类,官方SDK文档地址是:《AlphaAnimation》
同样Alpha标签自有的属性有:

androID:fromAlpha   动画开始的透明度,从0.0 --1.0 ,0.0表示全透明,1.0表示完全不透明androID:toAlpha       动画结束时的透明度,也是从0.0 --1.0 ,0.0表示全透明,1.0表示完全不透明

所对应的构造函数为:

AlphaAnimation(Context context,AttributeSet attrs)  同样,从本地XML加载动画,基本不用AlphaAnimation(float fromAlpha,float toAlpha)

这里只剩最后一个构造函数,难度不大,下面举个例子说明下用法。

 

在第一篇文章中,我们构造的XML代码为:

<?xml version="1.0" enCoding="utf-8"?><Alpha xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:fromAlpha="1.0"    androID:toAlpha="0.1"    androID:duration="3000"    androID:fillBefore="true"></Alpha>

如果用代码构造同样的效果,它所对应的代码为:

AlphaAnim = new AlphaAnimation(1.0f,0.1f);AlphaAnim.setDuration(3000);AlphaAnim.setFillBefore(true);
五、RotateAnimation

RotateAnimation类对应Rotate标签,SDK文档地址:《RotateAnimation》

Rotate标签所具有的XML属性有:

androID:fromdegrees     开始旋转的角度位置,正值代表顺时针方向度数,负值代码逆时针方向度数androID:todegrees         结束时旋转到的角度位置,正值代表顺时针方向度数,负值代码逆时针方向度数androID:pivotX               缩放起点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,具体意义已在scale标签中讲述,这里就不再重讲androID:pivotY               缩放起点Y轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p

对应的构造函数有:

RotateAnimation(Context context,AttributeSet attrs)  从本地XML文档加载动画,同样,基本不用RotateAnimation(float fromdegrees,float todegrees)RotateAnimation(float fromdegrees,float todegrees,float pivotY)RotateAnimation(float fromdegrees,float pivotYValue)
 

RotateAnimation跟ScaleAnimation差不多,关键问题同样是pivotXType和pivotYType的选择,同样有三个取值:Animation.absolute、Animation.relative_TO_SELF和Animation.relative_TO_PARENT;

根据每一篇中的XML写出对应的JAVA构造代码:

XML为:

<?xml version="1.0" enCoding="utf-8"?><rotate xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:fromdegrees="0"    androID:todegrees="-650"    androID:pivotX="50%"    androID:pivotY="50%"    androID:duration="3000"    androID:fillAfter="true">    </rotate>

对应JAVA构造代码为:

rotateAnim = new RotateAnimation(0,-650,0.5f);rotateAnim.setDuration(3000);rotateAnim.setFillAfter(true);
六、TranslateAnimation

很显示TranslateAnimation类对应translate标签,它的SDK官方文档地址为:《TranslateAnimation》

translate标签所具有的属性为:

androID:fromXDelta     起始点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,具体意义已在scale标签中讲述,这里就不再重讲androID:fromYDelta    起始点Y轴从标,可以是数值、百分数、百分数p 三种样式;androID:toXDelta         结束点X轴坐标androID:toYDelta        结束点Y轴坐标
 

这些属性所对应的构造函数为:

TranslateAnimation(Context context,AttributeSet attrs)  同样,基本不用TranslateAnimation(float fromXDelta,float toXDelta,float fromYDelta,float toYDelta)TranslateAnimation(int fromXType,float fromXValue,int toXType,float toXValue,int fromYType,float fromYValue,int toYType,float toYValue)
 

由于fromXDelta、fromYDelta、toXDelta、toYDelta这三个属性都具有三种状态,所以在构造函数中,最理想的状态就是第三个构造函数,能够指定每个值的类型,第二个构造函数:TranslateAnimation (float fromXDelta,float toYDelta)使用是绝对数值。只有最后一个构造函数可以指定百分数和相对父控件的百分数。

下面以第一篇中的XML代码为例,用JAVA代码构造同样的效果:

XML代码:

<?xml version="1.0" enCoding="utf-8"?><translate xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:fromXDelta="0"     androID:toXDelta="-80"    androID:fromYDelta="0"    androID:toYDelta="-80"    androID:duration="2000"    androID:fillBefore="true"></translate>

对应的JAVA代码为:

translateAnim = new TranslateAnimation(Animation.absolute,Animation.absolute,-80,-80);translateAnim.setDuration(2000);translateAnim.setFillBefore(true);
七:AnimationSet

AnimationSet类对应set标签,定义动作类的集合,对应的SDK文档地址为:《AnimationSet》
它自己是没有XML属性的,所以我们直接说它的构造函数:

AnimationSet(Context context,AttributeSet attrs)  同样,基本不用AnimationSet(boolean shareInterpolator)  shareInterpolator取值true或false,取true时,指在AnimationSet中定义一个插值器(interpolater),它下面的所有动画共同。如果设为false,则表示它下面的动画自己定义各自的插值器。
 

增加动画的函数为:(更多函数,请参看SDK文档)

public voID addAnimation (Animation a)

下面在第一篇中的XML代码为例写出能构造同样效果的JAVA代码:

XML代码为:

<?xml version="1.0" enCoding="utf-8"?><set xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:duration="3000"    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%"/>    <rotate    androID:fromdegrees="0"    androID:todegrees="720"    androID:pivotX="50%"    androID:pivotY="50%"/>       </set>

对应的JAVA代码为:

AlphaAnim = new AlphaAnimation(1.0f,0.1f);scaleAnim = new ScaleAnimation(0.0f,0.5f);rotateAnim = new RotateAnimation(0,720,0.5f); setAnim=new AnimationSet(true);setAnim.addAnimation(AlphaAnim);setAnim.addAnimation(scaleAnim);setAnim.addAnimation(rotateAnim); setAnim.setDuration(3000);setAnim.setFillAfter(true);
八、Interpolater插值器

关于插值器的效果及应用,我们专门开了一篇来讲,看这里:《Animation动画详解(二)——Interpolator插值器》

关于插值器的SDK讲解见《Animation Resources》中的Interpolators部分;

插值器XML属性及对应的类如下表所示:

使用方法:(为sacleAnimation增加bounce插值器)

ScaleAnimation interpolateScaleAnim=new ScaleAnimation(0.0f,0.5f);interpolateScaleAnim.setInterpolator(new BounceInterpolator());interpolateScaleAnim.setDuration(3000);
九、示例

下面我把上面所有的代码集合到一个例子中,供大家下载;

效果图如下:

   

 

总结

以上是内存溢出为你收集整理的自定义控件三部曲之动画篇(三)—— 代码生成alpha、scale、translate、rotate、set及插值器动画全部内容,希望文章能够帮你解决自定义控件三部曲之动画篇(三)—— 代码生成alpha、scale、translate、rotate、set及插值器动画所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1089534.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-27
下一篇 2022-05-27

发表评论

登录后才能评论

评论列表(0条)

保存