AS3移动按钮阵列，具有流体动画和AT状态

Question

我想设置一组movieclip按钮，通过标签在我的时间线上导航，这就是它的梨形。

在花了三天时间阅读和尝试大多数在线解决方案后，我找不到一种方法能100%有效而不会以某种方式失败。

我对下面的方法感到有些高兴，因为我看到了一篇博客文章，其中涵盖了调用帧等的不同方法，并强调了下面的错误：

clipArray[i].mouseChildren = false; //Hidden bugbear

我在下面添加了完整的代码，所以希望它能帮助其他类似的几乎求助于hari kari的人。

import flash.events.MouseEvent;
import flash.events.Event;
var clipArray:Array = [btn_1,btn_2]; // Movieclip's called btn_1 etc...
var destArray:Array = ["page_1","page_2"]; Labels on timeline...
for (var i:int = 0; i < clipArray.length; i++) {
clipArray[i].buttonMode = true; // Define Button from Movie Clip
clipArray[i].useHandCursor = true; // Enable HandCursor over clip
clipArray[i].mouseChildren = false; // Define clip as single denomination
clipArray[i].addEventListener(MouseEvent.MOUSE_OVER, mouseOverHandler);
clipArray[i].addEventListener(MouseEvent.MOUSE_OUT, mouseOutHandler);
clipArray[i].addEventListener(Event.ENTER_FRAME, frameHandler);
clipArray[i].addEventListener(MouseEvent.CLICK,clickHandler, false, 0, true);
}
function clickHandler(event:MouseEvent):void {
for (var i:int = 0; i < clipArray.length; i++) {
    if (event.currentTarget == clipArray[i]) {
        this.gotoAndStop(destArray[i]);
        clipArray[i].mouseEnabled = false;
        clipArray[i].useHandCursor = false;
        clipArray[i].alpha = 0.5;
    } else {
        clipArray[i].mouseEnabled = true;
        clipArray[i].useHandCursor = true;
        clipArray[i].alpha = 1;
    }
}
}
function mouseOverHandler(e:MouseEvent){
e.target.onOff = true;
}
function mouseOutHandler(e:MouseEvent){
e.target.onOff = false;
}
function frameHandler(e:Event){
if(e.target.onOff){
    e.target.nextFrame();
} else {
    e.target.prevFrame();
}
}

这很好，但现在我对它是否是"好"代码的理解是一个问题，如果可以以任何方式改进的话，我想知道为什么以及如何从2学习AS3的问题是，你经常在网上看到代码而没有完全掌握细节。

暂时来说，我很高兴这被证明是一场噩梦，需要找到或解决，并希望它能帮助其他处于类似心态的人。

当你学习时，添加具有流动性的MovieClip按钮并从阵列中取消成为一项为期三天的任务。。。

Answer 1

如果你把所有这些都放在一个类中，并使用Tween类来移动到你的"标签"而不是时间线，你可能会发现你有更多的自由。这意味着您可以删除事件侦听器，直到动画完成。

此外，看起来您最好使用MouseEvent.ROLL_OVER和MouseEvent_ROLL_OUT

老实说，在没有看到整个项目的情况下，我不知道你的一些方法想做什么，但我很快就为你写了一个类。我已经用将按钮动画化到一个混乱的位置来代替页面之间的动画。（记得将你用IDE创建的MovieClips导出到actionscript中，并将其命名为Button01、Button02等。）我希望这能让你朝着正确的方向前进：）

package com
{
import flash.display.MovieClip;
import flash.events.MouseEvent;
import flash.events.Event;
import fl.transitions.Tween;
import fl.transitions.easing.*;
import fl.transitions.TweenEvent;
import flash.display.DisplayObject;
import flash.display.DisplayObjectContainer;
public class Main extends MovieClip
{
    private var btn_1:Button01 = new Button01;
    private var btn_2:Button02 = new Button02;
    private var clipArray:Array = new Array();
    private var xAxis:Number = 0;
    private var yAxis:Number = 0;
    private static const WIDTH:int = 300;
    private static const HEIGHT:int = 250;
    private var tweenButton:Tween;
    public function Main()
    {
        makeArrays();
        addChildren();
        setEventListeners()
    }
    private function makeArrays():void
    {
        for(var i:uint=0; i<2; i++)
            clipArray.push(this['btn_'+(i+1)]);
    }
    private function addChildren():void
    {
        for(var i:uint=0; i<clipArray.length; i++){
            addChild(clipArray[i]);
            clipArray[i].x = WIDTH*Math.random();
            clipArray[i].y = HEIGHT*Math.random();
        }
    }
    private function setEventListeners():void
    {
        for (var i:uint=0; i<clipArray.length; i++) {
            clipArray[i].buttonMode = true; // Define Button from Movie Clip
            //clipArray[i].useHandCursor = true; // Enable HandCursor over clip
            //clipArray[i].mouseChildren = false; // Define clip as single denomination // DON'T NEED THIS WITH ROLL_OVER
            clipArray[i].addEventListener(MouseEvent.ROLL_OVER, mouseOverHandler);
            clipArray[i].addEventListener(MouseEvent.ROLL_OUT, mouseOutHandler);
            clipArray[i].addEventListener(Event.ENTER_FRAME, frameHandler);
            clipArray[i].addEventListener(MouseEvent.CLICK, clickHandler, false, 0, true);
        }
    }
    private function tweenButtons(e:Event):void
    {
        var dispObj = e.currentTarget as DisplayObject;
        dispObj.removeEventListener(MouseEvent.CLICK, clickHandler)
        tweenButton = new Tween(dispObj, 'x', Regular.easeIn, dispObj.x, WIDTH*Math.random(), 1, true);
        tweenButton = new Tween(dispObj, 'y', Regular.easeIn, dispObj.y, HEIGHT*Math.random(), 1, true);
        tweenButton.addEventListener(TweenEvent.MOTION_FINISH, reattachEventListener);
    }
    private function reattachEventListener(e:Event):void
    {
        tweenButton.removeEventListener(TweenEvent.MOTION_FINISH, reattachEventListener);
        for (var i:uint=0; i<clipArray.length; i++) {
            if(!(hasEventListener(MouseEvent.CLICK)))
               clipArray[i].addEventListener(MouseEvent.CLICK, clickHandler, false, 0, true);
        }
    }
    private function clickHandler(e:MouseEvent):void
    {
        for (var i:uint=0; i<clipArray.length; i++) {
            if (e.currentTarget == clipArray[i]) {
                tweenButtons(e);
                clipArray[i].buttonMode = false
                clipArray[i].alpha = 0.5;
            } else {
                clipArray[i].buttonMode = true;
                clipArray[i].alpha = 1;
            }
        }
    }
    private function mouseOverHandler(e:MouseEvent):void // I HAVE NO IDEA WHAT YOU'RE TRYING TO DO HERE
    {
        e.target.onOff = true;
    }
    private function mouseOutHandler(e:MouseEvent):void // I HAVE NO IDEA WHAT YOU'RE TRYING TO DO HERE
    {
        e.target.onOff = false;
    }
    private function frameHandler(e:Event):void // I HAVE NO IDEA WHAT YOU'RE TRYING TO DO HERE
    {
        if(e.target.onOff){
            e.target.nextFrame();
        }else{
            e.target.prevFrame();
        }
    }
}
}