Search code examples
apache-flexflex4menubaralignmentmenu-items

Flex 4.5 align menu items center


I have searched the net, but all those tuts are for Flex 3.

What is the approcach in Flex 4.5 to align the mx:MenuBar items in middle of the bar ?

(usually they are on the far left side)


Solution

  • from flexdeveloper.eu, set itemAlign to center:

    package custom{
        import flash.geom.Rectangle;
    
        import mx.controls.MenuBar;
        import mx.controls.menuClasses.IMenuBarItemRenderer;
        import mx.core.IFlexDisplayObject;
    
        public class AlignableMenuBar extends MenuBar {
            private static  const MARGIN_WIDTH:int=10;
            private var background:IFlexDisplayObject;
            public var itemAlign:String;
    
            public function AlignableMenuBar() {
                super();
            }
    
            override protected  function updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void {
                if (this.itemAlign == "right") {
                    updateDisplayListRightAlign(unscaledWidth,unscaledHeight);
                } else if (this.itemAlign == "center") {
                    updateDisplayListCenterAlign(unscaledWidth,unscaledHeight);
                } else {
                    updateDisplayListLeftAlign(unscaledWidth,unscaledHeight);
                }
            }
    
            protected function updateDisplayListLeftAlign(unscaledWidth:Number,unscaledHeight:Number):void {
                super.updateDisplayList(unscaledWidth,unscaledHeight);
    
                var lastX:Number=MARGIN_WIDTH;
                var lastW:Number=0;
                var len:int=menuBarItems.length;
    
                var clipContent:Boolean=false;
                var hideItems:Boolean=unscaledWidth == 0 || unscaledHeight == 0;
    
                for (var i:int=0; i < len; i++) {
                    var item:IMenuBarItemRenderer=menuBarItems[i];
    
                    item.setActualSize(item.getExplicitOrMeasuredWidth(),unscaledHeight);
                    item.visible=! hideItems;
    
                    lastX=item.x=lastX + lastW;
                    lastW=item.width;
    
                    if (! hideItems && item.getExplicitOrMeasuredHeight() > unscaledHeight || lastX + lastW > unscaledWidth) {
                        clipContent=true;
                    }
                }
    
                if (background) {
                    background.setActualSize(unscaledWidth,unscaledHeight);
                    background.visible=! hideItems;
                }
    
                // Set a scroll rect to handle clipping.
                scrollRect=clipContent?new Rectangle(0,0,unscaledWidth,unscaledHeight):null;
    
            }
    
            protected function updateDisplayListCenterAlign(unscaledWidth:Number,unscaledHeight:Number):void {
                super.updateDisplayList(unscaledWidth,unscaledHeight);
    
                var len:int=menuBarItems.length;
    
                var totalWidth:int=0;
                for (var i:int=0; i < len; i++) {
                    var tempItem:IMenuBarItemRenderer=menuBarItems[i];
                    totalWidth+= tempItem.width;
                }
                var lastX:Number=(this.width - totalWidth)/2;
                var lastW:Number=0;
    
                var clipContent:Boolean=false;
                var hideItems:Boolean=unscaledWidth == 0 || unscaledHeight == 0;
    
                for (var j:int=0; j < len; j++) {
                    var item:IMenuBarItemRenderer=menuBarItems[j];
    
                    item.setActualSize(item.getExplicitOrMeasuredWidth(),unscaledHeight);
                    item.visible=! hideItems;
    
                    lastX=item.x=lastX + lastW;
    
                    lastW=item.width;
    
                    if (! hideItems && item.getExplicitOrMeasuredHeight() > unscaledHeight || lastX + lastW > unscaledWidth) {
                        clipContent=true;
                    }
                }
    
                if (background) {
                    background.setActualSize(unscaledWidth,unscaledHeight);
                    background.visible=! hideItems;
                }
    
                // Set a scroll rect to handle clipping.
                scrollRect=clipContent?new Rectangle(0,0,unscaledWidth,unscaledHeight):null;
    
    
            }
    
            protected function updateDisplayListRightAlign(unscaledWidth:Number,unscaledHeight:Number):void {
                super.updateDisplayList(unscaledWidth,unscaledHeight);
    
                var len:int=menuBarItems.length;
    
                var totalWidth:int=0;
                for (var i:int=0; i < len; i++) {
                    var tempItem:IMenuBarItemRenderer=menuBarItems[i];
                    totalWidth+= tempItem.width;
                }
                var lastX:Number=this.width - totalWidth;
                var lastW:Number=0;
    
                var clipContent:Boolean=false;
                var hideItems:Boolean=unscaledWidth == 0 || unscaledHeight == 0;
    
                for (var j:int=0; j < len; j++) {
                    var item:IMenuBarItemRenderer=menuBarItems[j];
    
                    item.setActualSize(item.getExplicitOrMeasuredWidth(),unscaledHeight);
                    item.visible=! hideItems;
    
                    lastX=item.x=lastX + lastW;
    
                    lastW=item.width;
    
                    if (! hideItems && item.getExplicitOrMeasuredHeight() > unscaledHeight || lastX + lastW > unscaledWidth) {
                        clipContent=true;
                    }
                }
    
                if (background) {
                    background.setActualSize(unscaledWidth,unscaledHeight);
                    background.visible=! hideItems;
                }
    
                // Set a scroll rect to handle clipping.
                scrollRect=clipContent?new Rectangle(0,0,unscaledWidth,unscaledHeight):null;
            }
        }
    }