Flash AS3 流体导航栏

Question

我对 AS3 感到很糟糕。我已经通过多种不同的方式尝试过这种效果。我正在尝试在 AS3 中获得一个具有类似功能的导航栏。

A|B|C|D

单击 C 栏幻灯片，您会得到

C|A|B|D

单击 D 条幻灯片，您会得到

D|A|B|C

等等。

非常感谢帮助或帮助链接。现在我就这么多了。

david_btn.addEventListener(MouseEvent.CLICK, menuNav);
kate_btn.addEventListener(MouseEvent.CLICK, menuNav);
robin_btn.addEventListener(MouseEvent.CLICK, menuNav);
aaron_btn.addEventListener(MouseEvent.CLICK, menuNav);
ken_btn.addEventListener(MouseEvent.CLICK, menuNav);
ann_btn.addEventListener(MouseEvent.CLICK, menuNav);

function menuNav(event:MouseEvent):void {
 gotoAndStop(event.target.name);
}

每个都转到影片剪辑，播放一半然后停止。现在我需要在进入下一个指定标签之前播放另一半。

Answer 1

您好，我已经给 Jascha 的答案加上了一个，因为它达到了目的，但是我只是将引导您完成下面的代码，以便您可以理解这种事情是如何实现的。它还具有许多额外的检查/配置等。

//these are your button instances
var originalOrder:Array = [tom, dick, harry, jane];

//this is a reference to the currently selected item
var selectedItem:MovieClip = tom;

//these are the co-ordinates of where the first item should be placed
var offsetX:Number = 100;
var offsetY:Number = 100;

//this is how much padding you want between items
var padding:Number = 8;

addEventListener(MouseEvent.CLICK, mouseClickHandler);

private function mouseClickHandler(e:Event):void
{
    var index:int = originalOrder.indexOf(e.target);
    //if the thing have clicked is in our array of buttons it is valid, we
    //could have clicked something else interactive
    if(index > -1)
    {
        //update the reference to the newly selected item
        selectedItem = originalOrder[index];
        //move the items about
        calculatePlacement();
    }
}


private function calculatePlacement():void
{
    //we want to start with our x-position being the current offset
    //plus the selectedItem's width plus the padding
    var cumlativeWidth:Number = offsetX + selectedItem.width + padding;
    var item:MovieClip;

    //loop over all the items in our list in the order they are specified
    for( var i:int = 0; i<originalOrder.length; i++)
    {
        //assign item to the currently looped item
        item = originalOrder[i];
        //if the item we are looking at is the selected item, place it at the
        //offset position
        if(item == selectedItem)
        {
            item.x = offsetX;
            item.y = offsetY;
            //We could tween using Tweener/TweenLite 
            //TweenLite.to(item, 1, {x:offsetX, y:offsetY});
        }
        //otherwise put it at our x-position, then add on its width + padding
        //to the cumulative x-position.
        else
        {
            item.x = cumlativeWidth;
            item.y = offsetY;
            //We could tween using Tweener/TweenLite 
            //TweenLite.to(item, 1, {x:offsetX, y:offsetY});
            cumlativeWidth += item.width + padding;
        }
    }
}

Answer 2

只需确保第一个按钮的初始 x 位置为 14。或者相应地调整代码。

此处示例 http://www.hupcapstudios.com/slideNav.swf

import caurina.transitions.Tweener;

var btnArray:Array = new Array(btn1,btn2,btn3,btn4);
var btnNames:Array = new Array("Tom","Dick","Harry","Marco");

for(var i:int=0;i<btnArray.length;i++)
{
    btnArray[i].btn_txt.text = btnNames[i];
    btnArray[i].addEventListener(MouseEvent.CLICK, slideBtn);
}

function slideBtn(e:Event):void
{
    var aPos:Number = e.currentTarget.x;
    var bPos:Number;
    var zeroBtn:*; 

    trace(aPos);

    if(aPos !== 14)
    {
        for(var p:int = 0;p<btnArray.length;p++)
        {
            if(btnArray[p].x == aPos)
            {
                bPos = aPos;
                break;
            }
        }
        for(var q:int = 0;q<btnArray.length;q++)
        {
            if(btnArray[q].x == 14)
            {
                zeroBtn = btnArray[q];
                break;
            }
        }

        Tweener.addTween(e.currentTarget, {x:14, time:.4,transition:"easeOutQuint"});
        Tweener.addTween(zeroBtn, {x:bPos, time:.4,transition:"easeOutQuint"});
    }
}