Ajout d'une image sur le côté droit de la barre de titre d'un panneau dans Flex 4

Question

J'essaye de créer un composant MXML basé sur le panneau d'allumage et je voudrais ajouter une image à l'extrémité droite de la barre de titre , de sorte que le panneau aura un texte sur la barre de titre et une petite image à la bonne extrémité. J'utilise un skin pour définir les couleurs, le remplissage d'arrière-plan, etc. Mais comment ajouter cette image à l'extrémité droite de la barre de titre? Je voudrais rendre cette image incommensurable de sorte que lorsque le composant est inséré, soit l'image par défaut est utilisée, soit une nouvelle image peut être fournie.

S'il vous plaît aider avec vos idées.

Answer 1

Ajoutez le composant d'image à votre apparence et donnez-lui un ID, définissez également l'image par défaut que vous souhaitez afficher. Créez ensuite un composant ActionScript qui étend le panneau. Dans votre code de panneau personnalisé, déclarez une pièce de peau en utilisant le même nom que l'identifiant que vous avez placé dans votre skin. Maintenant, remplacer la fonction partAdded dans votre panneau personnalisé et définir l'image à tout ce que vous aimez:

package mypackage 
{ 
    import spark.components.Panel; 
    import spark.primitives.BitmapImage; 

    public class MyCustomPanel extends Panel 
    { 

     [SkinPart (required="false")] 
     public var panelIcon:BitmapImage; 

     override protected function partAdded(partName:String, instance:Object):void { 
      super.partAdded(partName, instance); 

      if (instance == panelIcon) { 
       panelIcon.source = someOtherImageSource; 
      } 
     } 
    } 
} 

Enfin, associer votre fichier de la peau avec votre panneau personnalisé, que ce soit en CSS ou en réglant le skinClass lorsque vous utilisez votre panneau personnalisé .

Answer 2

Vous pouvez toujours utiliser la TitleWindow et réutiliser le bouton de fermeture pour faire autre chose que fermer. Il y a un bon exemple d'habillage des boutons TitleWindow et TitleWindowClose ici: http://blog.flexexamples.com/2010/04/04/changing-the-close-button-skin-on-the-spark-titlewindow-container-in-flex-4/