鼠标移动时激活循环

Question

我只是要解释一下上下文，这样就更清楚了。

我制作了这个菜单：我的菜单

我希望制作一个改进和更高级的版本相同的菜单。

我在咖啡表面制作了一个波浪动画，并希望在鼠标移动时使其循环，在鼠标不移动时停止循环。

很抱歉缺乏规范，因为我对动作脚本很陌生，但我希望有人能够帮助我。 ：）

谢谢， 马蒂厄

Answer 1

好吧，你说过了 - 利用 MouseEvent.MOUSE_MOVE 在循环例程中设置条件。

    private var _isMoving:Boolean = false;

    stage.addEventListener(MouseEvent.MOUSE_MOVE, checkMouse);
    this.addEventListener(Event.ENTER_FRAME, doLoop);

    private function checkMouse(e:MouseEvent):void 
    {
        _isMoving = true;
    }
    private function doLoop(e:Event):void 
    {
        trace("moving =" + _isMoving);

         if(_isMoving)
         {
           // loop animation
         }

        _isMoving = false;
    }

Answer 2

根据您希望它如何工作，我将按如下方式执行此操作：

1. 创建波浪咖啡的动画
2. 确保动画循环
   • 请注意，默认情况下剪辑会循环播放，因此您所要做的就是匹配第一帧和最后一帧！
3. 将剪辑放在当前咖啡图形的边缘
   • 双击图形进行编辑
   • 将循环动画的实例从库中拖到图形的“边缘”上
   • 或者只是将整个浅棕色图形替换为循环的动画图形
4. 当鼠标移动时，在动画循环剪辑上调用播放
5. 当鼠标停止时，在动画循环剪辑上调用停止

一些示例代码如下：

    public function init():void {
        menuClip.addEventListener(MouseEvent.MOUSE_OVER, onMenuRollOver);
        menuClip.addEventListener(MouseEvent.MOUSE_OUT, onMenuRollOut);
    }

    public function onMenuRollOver(event:MouseEvent):void {
        stage.addEventListener(MouseEvent.MOUSE_MOVE, onMove);
        /* do the stuff you're currently doing to animate the clip here.
        something like: coffee graphic height = ease to mouseHeight */

    }

    public function onMenuRollOut(event:MouseEvent):void {
        /* do the stuff you're currently doing to stop the clip here. */
        stage.removeEventListener(MouseEvent.MOUSE_MOVE, onMove);
        coffeeClip.stop();
    }

    public function onMove(event:MouseEvent):void {
        resetTimer();
        coffeeClip.play(); //note: play has no effect when movie is playing (that's ideal in this case)
    }

    public function resetTimer():void {
        if(mouseMovementTimer == null) createTimer();
        mouseMovementTimer.reset();
        mouseMovementTimer.start();
    }

    public function createTimer():Timer {
        mouseMovementTimer = new Timer(DELAY, 1); //fiddle with the delay variable. Try 500, at first
        mouseMovementTimer.addEventListener(TimerEvent.TIMER, stopAnimationLoop);
    }

    public function stopAnimationLoop(event:TimerEvent):void {
        mouseMovementTimer.removeEventListener(TimerEvent.TIMER, stopAnimationLoop); //optional but recommended
        mouseMovementTimer = null;
        coffeClip.stop();
    }

当然，您需要执行诸如 call init() 和 import flash.utils.Timer 之类的操作，并初始化 mouseMovementTimer 等变量、menuClip、coffeeClip 和 DELAY。

警告：这段代码是我的想法，未经测试。因此，其中可能存在小错误，但您应该了解总体思路：

• 当用户将鼠标悬停在菜单上时添加鼠标侦听器
• 如果用户将鼠标移出菜单则删除该侦听器
• 让该侦听器播放循环影片剪辑
• 触发事件 时间内未检测到移动，将停止循环剪辑
• 如果触发器关闭后一段

关键在于检测鼠标何时停止移动。 Flash 可以很好地检测交互，但由于显而易见的原因无法检测非交互。解决这个问题的一个简单方法是触发一个计时器，一旦自上次活动以来已经过去了太多时间，该计时器就会关闭。然后，当计时器触发时，您就知道操作已停止！

我认为这是解决您的问题的关键。我希望这能以某种方式帮助某人。

〜gmale