android animation alpha

 

8.4 淡入和淡出

闪动效果是最简单的动画，是打开动画宝库的钥匙。通过扩展闪动动画，可以创建略微复杂的动画效果：淡入和淡出。

8.4.1 数学模型

在设计动画时，设计者必须经常和数学模型打交道。初学者也许会被“数学模型”这个词吓倒，不过不用太担心，淡入淡出使用的数学模型并不复杂：

（1）透明度值=初始透明度+时间*变化速率。

（2）变化速率=变化量/单位时间周期。

其轨迹图像如图8-13所示。

相应的代码描述为。

var alpha_offset:Number;
var timer_count:Number;
Object.alpha = Object.alpha * ( 1 + timer_count * alpha_offset );

图8-13 淡入效果轨迹图像

根据本模型，假设变化速率为0.05时，则每个时间周期，对象的透明度增加0.05。如果对象的初始透明度是0，对象在动画开始的时候完全不可见， 则经历1个时间周期后，对象的alpha变为0.05；经历2个时间周期后，对象的alpha变为0.10；经历3个时间周期后，对象的alpha变为 0.15……当经历20个时间周期后，对象的alpha变为1.00，此时对象完全不透明显示。换而言之，这一过程就是动画对象在20个时间周期内从不可 见逐渐切入到完全显示状态，实现了对象的淡入。

同理，淡出效果也可以使用此模型，不过变化速率是一个负值。假设变化速率为-0.05，则每个时间周期，对象的透明度减少0.05。对于一个初始 alpha属性为1的对象，为当经历20个时间周期后，其alpha值变为0.00，此时对象完全透明不可见。这一过程实现了动画对象由完全显示到完全消 失的渐变效果，是为淡出。

考虑到淡入和淡出效果都是基于同样的数学模型，可以在代码实现时运用函数将其过程模块化。

（1）建立参数fadeInOut()，该函数不需要返回值，但显然需要参数，分别是对象anim_obj，以及对象的变化速率fade_rate。代码如下。

function fadeInOut(anim_obj:DisplayObject，fade_rate:Number):void{
return;
}

（2）在函数内添加代码，以根据变化速率fade_rate控制动画对象anim_obj的alpha属性。本函数将来是在定时器的触发响应函数中 周期调用的，所以每一次执行时，只需要修改1*fade_rate到anim_obj.alpha即可。只需要一条语句就能达到目的。

anim_obj.alpha+=fade_rate;

（3）将此函数添加到例8-4中，修改定时器响应函数，注释掉原有的语句，新添加对fadeInOut()的引用。整体代码如下：

var animTimer:Timer = new Timer(50， 100);
animTimer.addEventListener("timer"， animTimerHandler);
animTimer.addEventListener("timerComplete"， animComplete);
animTimer.start();

function animTimerHandler(event:TimerEvent):void {
//动画代码编写入口
//animObject1.alpha=(animObject1.alpha==1?0:1);
fadeInOut(animObject1，-0.05)//新增对fadeInOut()函数的引用
}
//响应定时器结束事件
function animComplete(event:TimerEvent):void {
animObject1.alpha=1;
}
//自定义的模块
function fadeInOut(anim_obj:DisplayObject，fade_rate:Number):void{
anim_obj.alpha+=fade_rate;
return;
}

（4）至此，代码初步成型了。运行程序，可以看到显示对象animObject1逐渐淡出的效果。如果把fadeInOut函数中的 fade_rate设为正值，这可以令alpha初始状态为0的不可见对象逐渐淡入。fade_rate的绝对值越小，淡入淡出的过程就越平滑，读者可自 行实验。

使用如此简短的代码，便能实现淡入淡出效果，可见AS3确实是很简便的动画控制语言。下一节将介绍如何进一步强化模块，使其能胜任更多的任务。

 

 

http://hi.baidu.com/sun_star_mao/blog/item/4b731fb5f253317a8bd4b2b7.html