0

我是 Animate/CreateJS 的新手，我想知道如何使它工作。我想要的是当我将鼠标悬停在一个对象上时，另一个从 0 alpha 到 1 出现。我搜索了谷歌，但我找不到任何可以帮助我解决这个问题的东西。

代码是这样的：

var frequency = 3;
stage.enableMouseOver(frequency);
this.movieClip_1.addEventListener("mouseover", fl_MouseOverHandler);

function fl_MouseOverHandler()
{

// Execute movieclip 2 function

}


var movieClip_2_FadeInCbk = fl_FadeSymbolIn.bind(this);
this.addEventListener('tick', movieClip_2_FadeInCbk);
this.movieClip_2.alpha = 0;

   function fl_FadeSymbolIn()
   {
   this.movieClip_2.alpha += 0.01;
   if(this.movieClip_2.alpha >= 1)
   {
        this.removeEventListener('tick', movieClip_2_FadeInCbk);
   }
}

提前致谢。

4

2 回答 2

1

您编写的代码并不遥远。你有一个 alpha 淡入淡出代码，当你想开始淡入时，你只需要添加 tick 监听器。还要确保.bind(this)在传入任何访问this它们的处理函数时使用，否则你会遇到问题：

var frequency = 3;
stage.enableMouseOver(frequency);
this.movieClip_1.addEventListener("mouseover", fl_MouseOverHandler.bind(this));

function fl_MouseOverHandler() {
    this.addEventListener('tick', movieClip_2_FadeInCbk);
}

this.movieClip_2.alpha = 0;

var movieClip_2_FadeInCbk = fl_FadeSymbolIn.bind(this);
function fl_FadeSymbolIn() {
   this.movieClip_2.alpha += 0.01;
   if (this.movieClip_2.alpha >= 1) {
       this.removeEventListener('tick', movieClip_2_FadeInCbk);
   }
}

或者，您可以使用Tween：

var frequency = 3;
stage.enableMouseOver(frequency);
this.movieClip_1.addEventListener("mouseover", fl_MouseOverHandler.bind(this));

this.movieClip_2.alpha = 0;

function fl_MouseOverHandler() {
    createjs.Tween.get(this.movieClip_2).to({alpha: 1}, 1000);
}
于 2017-03-07T19:18:50.223 回答
0

您只需要 Tween 类：

private var buttonTween:Tween;

button.addEventListener(MouseEvent.ROLL_OVER, onRollOver);
button.addEventListener(MouseEvent.ROLL_OUT, onRollOut);

private function onRollOver(e:MouseEvent):void {
    if (buttonTween && buttonTween.isPlaying) {
        buttonTween.stop();
    }
    buttonTween = new Tween(e.target, "alpha", Elastic.easeOut, button.alpha, 1, 3, true);
}

private function onRollOut(e:MouseEvent):void {
    if (buttonTween && buttonTween.isPlaying) {
        buttonTween.stop();
    }
    buttonTween = new Tween(e.target, "alpha", Elastic.easeOut, button.alpha, 0, 3, true);
}

随意自定义您需要/想要的参数。

为了减少代码重复，你甚至可以将它放在一个只用几个参数调用的函数中，如下所示：

private function tweenButtonAlpha(button:ButtonObject, endAlpha:Number):void {
    if (buttonTween && buttonTween.isPlaying) {
        buttonTween.stop();
    }
    buttonTween = new Tween(button, "alpha", Elastic.easeOut, button.alpha, endAlpha, 3, true);
}
于 2017-03-07T18:47:24.950 回答