Question

我正在做一个带有两个过滤器的按钮，当用户将光标放在它上面时（鼠标悬停）和当光标退出时有两个补间过滤器。非常基本的东西。

过滤器是Glow和DropShadow。 Glow应用于文本，而DropShadow应用于按钮背景（一个简单的矩形）。

这里的问题是GlowIn的转换不起作用。当鼠标悬停在过滤器上时，它会立即以完全alpha的形式应用滤镜。 GlowOut虽然有效。

虽然它被设置为0.25次，但我只用了整整5秒就确定了它，但它仍然没有用，所以它不是时间问题。

这是我的代码：

import caurina.transitions.Tweener;
import caurina.transitions.properties.FilterShortcuts;
import flash.filters.GlowFilter;
FilterShortcuts.init();

texto.mouseEnabled = false;

this.addEventListener(MouseEvent.MOUSE_OVER, FiltersIn);
this.addEventListener(MouseEvent.MOUSE_OUT, FiltersOut);

var glow = new GlowFilter(0xFFFFFF, 0, 5, 5, 3, 250);
texto.filters = [glow];

function FiltersIn(MouseEvent):void{
    Tweener.addTween(this, {_DropShadow_distance:5, _DropShadow_alpha:1, _DropShadow_blurX:5, _DropShadow_blurY:5, time:0.25, transition:"easeOutCubic"});
    Tweener.addTween(texto, {_Glow_alpha:100, time:0.25, transition:"easeOutCubic"});
}
function FiltersOut(MouseEvent):void{
    Tweener.addTween(this, {_DropShadow_distance:0, _DropShadow_alpha:0, _DropShadow_blurX:0, _DropShadow_blurY:0, time:0.25, transition:"EaseInCubic"});
    Tweener.addTween(texto, {_Glow_alpha:0, time:0.25, transition:"easeInCubic"});
}

Answer 1

问题是辉光滤镜的alpha属性范围是0到1，而不是0到100.但是Tweener仍然尊重你提供它的值 - 所以在插入alpha值时，它会去跳到1以上，可能在第一帧到100。所以这就是为什么你会立刻看到它完整的alpha。如果您将100换成1，那将解决它。

并且反向补间仍然按预期工作的原因是因为alpha值被限制为1，所以即使尝试将其设置为50,60等等到100，当辉光滤镜存储实际值时，它将其限制为1，允许反向补间在1和0之间平滑插值。

这是编辑的地方：

import caurina.transitions.Tweener;
import caurina.transitions.properties.FilterShortcuts;
import flash.filters.GlowFilter;
FilterShortcuts.init();

texto.mouseEnabled = false;

this.addEventListener(MouseEvent.MOUSE_OVER, FiltersIn);
this.addEventListener(MouseEvent.MOUSE_OUT, FiltersOut);

var glow = new GlowFilter(0xFFFFFF, 0, 5, 5, 3, 250);
texto.filters = [glow];

function FiltersIn(MouseEvent):void{
    Tweener.addTween(this, {_DropShadow_distance:5, _DropShadow_alpha:1, _DropShadow_blurX:5, _DropShadow_blurY:5, time:0.25, transition:"easeOutCubic"});
    Tweener.addTween(texto, {_Glow_alpha:1, time:0.25, transition:"easeOutCubic"});
}
function FiltersOut(MouseEvent):void{
    Tweener.addTween(this, {_DropShadow_distance:0, _DropShadow_alpha:0, _DropShadow_blurX:0, _DropShadow_blurY:0, time:0.25, transition:"EaseInCubic"});
    Tweener.addTween(texto, {_Glow_alpha:0, time:0.25, transition:"easeInCubic"});
}

Answer 2

编辑：由于混淆因素，上一个答案不正确！请看新答案。

Answer 3

专业提示：不要打扰使用Tweener :) 使用GreenSock的Tweenmax或Starling的Juggler - 他们只是最好的

AS3 Filter GlowIn not Tweening

3 个答案: