Flash AS3 barre de navigation fluide

Question

Je suis horrible avec AS3. J'ai essayé cet effet de différentes façons. J'essaie d'obtenir une barre de navigation dans AS3 qui fait quelque chose comme ça.

A | B | C | D

cliquez sur diapositives C bar et vous obtenez

C | A | B | D

cliquez sur la barre D diapositives et vous obtenez

D | A | B | C

et ainsi de suite.

Aide ou un lien pour aider est très appréciée. En ce moment j'ai autant. Chacun va au MovieClip, joue à mi-chemin et s'arrête. Maintenant, je dois jouer l'autre moitié avant d'aller à l'étiquette spécifiée suivante.

Answer 1

Salut, j'ai donné la réponse de Jascha le plus un parce qu'il sert le but, mais je vais juste vous promener dans le code ci-dessous afin que vous puissiez comprendre comment ce genre de chose est atteint. Il a également un certain nombre de contrôles/configurations supplémentaires

//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

Assurez-vous simplement que la première position x initiale des boutons est 14. Ou que vous ajustez le code en conséquence.

exemple ici 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"}); 
    } 
}