Search code examples
apache-flexlayouttabstabnavigator

Flex: Tab Navigator tab position


I need to develop a Tab Navigator with a few tabs on the left hand side and one tab on the right hand side, I have experimented with the "tabOffset" property, but this does not seem to be able to help

enter image description here

Thanks in advance!


Solution

  • I made custom TabNavigator component.

    package
    {
    import mx.containers.TabNavigator;
    import mx.controls.Button;
    import mx.events.FlexEvent;
    
    public class CustomTabNavigator extends TabNavigator
    {
        public function CustomTabNavigator()
        {
            super();
        }
    
        override protected function createChildren(): void
        {
            super.createChildren();
            tabBar.addEventListener(FlexEvent.CREATION_COMPLETE, addSpacer);
        }
    
        public function addSpacer(event: FlexEvent): void
        {
            var buttonCount: int = tabBar.getChildren().length;
    
            var _width : Number = this.width;
            var button: Button = tabBar.getChildAt(buttonCount-1) as Button;
    
            _width = _width - button.width;
            button.x = _width;
        }
    }
    }