2009-09-10 78 views
1

所以我有一個PopupButton,當我點擊按鈕時,我想彈出的菜單有圓角。我會如何去做這件事?Flex 3:帶有PopUpButton的圓形菜單

UPDATE:

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

唯一的區別是,我展示了菜單: 我發現類似我想要做一個更新,它可以在以下網頁上找到檢測PopUpButton。到目前爲止,這是我爲我的自定義菜單:

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; 
      } 
     } 
    } 
} 

誰能幫我出我缺少什麼,我......我不知道,如果我需要重寫任何菜單類的功能。

當我加載我的例子:

的addEventListener( 「以爲menuShow」,onMenuShow);

獲取消息,但是當我點擊PopUpButton顯示菜單時,onMenuShow函數沒有被觸發,並且常規菜單正在顯示出圓角。

對此的任何幫助表示讚賞。

謝謝

回答

1

終於想通了這一點。這裏是我想出的解決方案:

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

如果你碰巧有更好的解決方案,請評論。