[flexcoders] How to set variableRowHeight = true in MenuBar

[nathanleewei]

I want make the same effect as following url:

http://blog.flexexamples.com/2008/10/02/adding-a-horizontal-separator-
to-a-flex-popupbutton-controls-pop-up-menu-redux/


I haved tried 2 methods to solve the problem,

//method 1
private function onMenuBarInitialize():void {                   
        var menu:Menu;
        for (var i:int = 0; i < menuBar.menus.length; i++) {
            menu = menuBar.menus[i];
            menu.variableRowHeight = true;
        }
}

//method 2
private function onMenuShow(event:MenuEvent):void {
        var t:MenuBar = event.currentTarget as MenuBar;
        event.menu.variableRowHeight = true;
}


<mx:MenuBar id="menuBar" width="100%" labelField="@label" 
initialize="onMenuBarInitialize" iconField="@icon" styleName="menuBar" 
itemClick="onMenuBar(event)" menuShow="//onMenuShow(event)">
                <mx:XMLList>
<menuitem label="File">
                        <menuitem label="New" icon="documentIcon" />
                        <menuitem label="Open..." 
icon="documentIcon"/>
                        <menuitem type="separator" />
                        <menuitem label="Close" />
                        <menuitem type="separator" />
                        <menuitem label="Save" />
                        <menuitem label="Save as..." />
                        <menuitem type="separator" />
                        <menuitem label="Import..." />
                        <menuitem label="Export..." />
                        <menuitem type="separator" />
                        <menuitem label="Exit" />
                    </menuitem>
                    <menuitem label="Edit">
                        <menuitem label="Cut" />
                        <menuitem label="Copy" />
                        <menuitem label="Paste" />
                        <menuitem type="separator" />
                        <menuitem label="Select All" />
                        <menuitem type="separator" />
                        <menuitem label="Find" />
                    </menuitem>
 </mx:XMLList>                  
        </mx:MenuBar>


But, child menu of MenuBar still presents some space at feet when it 
shown(click on MenuBar) for the FIRST time, and It presents normally when it 
shown for the second time.


Maybe it's a BUG of FLEX?!