2009-09-10 6 views
1

J'ai donc un PopupButton et quand je clique sur le bouton, je veux que le menu qui apparaît soit arrondi. Comment ferais-je cela?Flex 3: Menu arrondi avec un PopUpButton

MISE À JOUR: J'ai trouvé une mise à jour similaire à ce que je veux faire, il se trouve sur la page suivante:

http://blog.flexmonkeypatches.com/2007/10/08/flex-rounded-menues-using-masking/comment-page-1/

La seule différence est que je montre le menu avec un PopUpButton. Jusqu'à présent, c'est ce que j'ai pour ma commande Menu:

package { 

    import flash.display.Sprite; 

    import mx.controls.Menu; 
    import mx.events.MenuEvent; 

    public class MyMenu extends Menu { 

     public function MyMenu() { 
      super(); 
      addEventListener("menuShow", onMenuShow); 
     } 

     private function onMenuShow(e:MenuEvent):void { 
      callLater(maskRoundedCorners,[e]); 
     } 


    private function maskRoundedCorners(e:MenuEvent):void { 

       var menu:Menu = e.menu as Menu; 
       menu.cacheAsBitmap=false; 

       if (!menu.mask){ 
        var maskx:uint = menu.x; 
        var masky:uint = menu.y; 
        var maskw:uint = menu.getExplicitOrMeasuredWidth(); 
        var maskh:uint = menu.getExplicitOrMeasuredHeight(); 
        var rad:int = menu.getStyle("cornerRadius") * 2; 

        var roundRect:Sprite = new Sprite(); 
        roundRect.graphics.beginFill(0xFFFFFF); 
        roundRect.graphics.drawRoundRect(maskx,masky,maskw,maskh,rad); 
        roundRect.graphics.endFill(); 
        menu.mask = roundRect; 
      } 
     } 
    } 
} 

Quelqu'un peut-il me aider avec ce que je suis absent ... Je ne sais pas si je dois passer outre l'une des fonctions des classes de menu.

Quand je charge mon exemple:

addEventListener ("menuShow", onMenuShow);

se déclenche mais lorsque je clique sur le bouton PopUpButton pour afficher le menu, la fonction onMenuShow n'est pas déclenchée et le menu normal est affiché sans les coins arrondis.

Toute aide à ce sujet est appréciée.

Merci

Répondre

1

Enfin compris cela. Voici la solution que j'ai trouvé:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> 

    <mx:Script> 
     <![CDATA[ 
      import mx.controls.Menu; 

      [Bindable] 
      private var myMenu:Menu; 

      private function popUpButtonInit():void { 
       myMenu = new Menu(); 
       myMenu.dataProvider = arr; 

      } 

      private function menuOpenHandler():void { 
        var maskx:uint = myMenu.x; 
        var masky:uint = myMenu.y - 1; 
        var maskw:uint = myMenu.getExplicitOrMeasuredWidth(); 
        var maskh:uint = myMenu.getExplicitOrMeasuredHeight(); 
        var rad:int = myMenu.getStyle("cornerRadius"); 

        var roundRect:Sprite = new Sprite(); 
        roundRect.graphics.beginFill(0xFFFFFF); 
        roundRect.graphics.drawRoundRect(maskx, masky, maskw, maskh, rad); 
        roundRect.graphics.endFill(); 
        myMenu.mask = roundRect; 

      }   


     ]]> 
    </mx:Script> 

    <mx:Style> 
     Menu { 
      corner-radius: 30; 
     } 
    </mx:Style> 

    <mx:Array id="arr"> 
     <mx:Object label="Alert" /> 
     <mx:Object label="Button" /> 
     <mx:Object label="ButtonBar" /> 
     <mx:Object label="CheckBox" /> 
     <mx:Object label="ColorPicker" /> 
     <mx:Object label="ComboBox" /> 
    </mx:Array> 

    <mx:PopUpButton width="78" height="25" 
        initialize="popUpButtonInit();" 
        popUp="{myMenu}" popUpGap="3" open="menuOpenHandler();" 
        horizontalCenter="0" verticalCenter="0"> 
    </mx:PopUpButton> 

</mx:Application> 

Si vous avez une meilleure solution, veuillez commenter.