Highlight the selected button in controlbar

I have 3 buttons(say b1,b2,b3) in my app which are under the controlbar on cli开发者_开发知识库cking those buttons it will open new view(components) suppose if button b1 is clicked it should highlight the button b1(bg color change). how to go about this sorry if it is noob question as am new to this

Thanks

I think you should use ToggleButton here is example also check Button Bar to group buttons

EDITED by you question i think you need to switch views on Button click in that case you may see Tab Navigator

hopes thst helps

Set toggle property for buttons to true as in documentation and then manage selected property for buttons (set it to true for active button).

Try this example,since you are looking for a solution without any button bars

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

    <mx:Script>
        <![CDATA[
            import mx.core.UIComponent;
            protected function button1_clickHandler(event:MouseEvent):void
            {
                for each(var child:UIComponent in hbox.getChildren())
                {
                    if(child.className == 'Button')
                    {
                        Button(child).selected = false;
                    }
                }
                event.currentTarget.selected = true;
            }
        ]]>
    </mx:Script>

    <mx:HBox id="hbox">
        <mx:Button label="B1" toggle="true" click="button1_clickHandler(event)"/>
        <mx:Button label="B2" toggle="true" click="button1_clickHandler(event)"/>
        <mx:Button label="B3" toggle="true" click="button1_clickHandler(event)"/>
    </mx:HBox>
</mx:Application>

For controlling the background color of the buttons in selected state,define selectedUpSkin,selectedOverSkin,selectedDownSkin(and selectedDisabledSkin)

P.S:If you are using only buttons in the control bar,you can use Button as the type of child and avoid that if statement