Comment créer un bouton bascule réutilisable dans AS3?

Question

J'essaie de rendre le code ci-dessous réutilisable. J'ai besoin de plusieurs boutons à bascule dans mon projet flash. En ce moment, le code ci-dessous fonctionne sur un bouton. Si je continue et que je crée plus de boutons, et que je suis le format ci-dessous, je devrais créer des fonctions séparées pour chaque bouton.

Je souhaite placer le code réutilisable dans un fichier ActionScript distinct et non dans le fichier FLA. J'essaye de mettre le rolloverToggle, le rolloverToggle, et le toggleClick dans une classe que je fais.

// /////////////////////////////////////////////////////////////////////// 

// ------- Need to make this code reusable ------- 

// /////////////////////////////////////////////////////////////////////// 

// code on Frame 1 

toggleButton.addEventListener(MouseEvent.MOUSE_OVER, rolloverToggle); 
toggleButton.addEventListener(MouseEvent.MOUSE_OUT, rolloutToggle); 
toggleButton.addEventListener(MouseEvent.CLICK, toggleClick); 
toggleButton.buttonState = "off"; 

// function rolloverToggle 
function rolloverToggle(event:MouseEvent) { 
    toggleButton.gotoAndStop(toggleButton.buttonState+" over"); 
} 

// function rolloutToggle 
function rolloutToggle(event:MouseEvent) { 
    toggleButton.gotoAndStop(toggleButton.buttonState); 
} 

// function toggleClick 
function toggleClick(event:MouseEvent) { 
    if (toggleButton.buttonState == "on") { 
      toggleButton.buttonState = "off"; 
      toggleButton.gotoAndStop(1); 
     } else { 
      toggleButton.buttonState = "on";  
     } 
} 

Answer 1

Ceci est assez simple. Créez une nouvelle classe de boutons génériques et ajoutez tous vos écouteurs d'événement. Pour chaque nouveau bouton que vous voulez créer, étendre simplement votre bouton générique et remplir le code requis dans les écouteurs d'événements .:

class GenericToggleButton extends Button 
{ 
    public GenericToggleButton() 
    { 
     this.addEventListener(MouseEvent.MOUSE_OVER, rolloverToggle); 
     this.addEventListener(MouseEvent.MOUSE_OUT, rolloutToggle); 
     this.addEventListener(MouseEvent.MOUSE_CLICK, toggleClick); 
    } 

    protected function rolloverToggle(event:MouseEvent):void 
    { 
     this.gotoAndStop(this.buttonState+" over"); 
    } 

    protected function rolloutToggle(event:MouseEvent):void 
    { 
     this.gotoAndStop(this.buttonState); 
    } 

    protected function toggleClick(event:MouseEvent):void 
    { 
     if (this.buttonState == "on") { 
      this.buttonState = "off"; 
      this.gotoAndStop(1); 
     } else { 
      this.buttonState = "on"; 
     } 
    } 
} 

Maintenant apparaissent juste cette classe et ajoutez votre fonctionnalité.

class NewButton extends GenericToggleButton 
{ 
    public NewButton() 
    { 
     super(); 
    } 

    override protected function toggleClick(event:MouseEvent):void 
    { 
     super.toggleClick(event); 

     // do magic for this button 
    } 

    // ETC 
}