Make spark ButtonBar act like mx ToggleButtonBar Flex 4

Question

Hello all i have the code below to define a buttonbar control in spark:

<s:ButtonBar id="tabs" y="15" left="0" height="31" change="VideosMenuBar_changeHandler(event)">  
        <s:ArrayCollection>
            <fx:String>Latest Videos</fx:String>
            <fx:String>Last Week Videos</fx:String>
            <fx:String>Last Month Videos</fx:String>
        </s:ArrayCollection>
</s:ButtonBar>

and i have a few questions about it:

1) how can i make this buttonbar react like an mx ToggleButtonBar that is when i press a button twice not to lose its state but maintain it and change only if i press another button?

2)How to define the default pressed button?

3)and lastly, i have applied a ready made skin of flex in my application and this has given my buttons some properties on hover,selected etc., how can i define my own via a new skin on my buttons?can i define new properties for my buttonbar so as not to be affected by the owns declared in the skin or do i have to change something in that skin and how can this be done?

Thanks a lot beforehand for your help!

Answer 1

1. Indeed. requireSelection="true"
2. ButtonBar extends List so setting the selectedIndex property should work

3. I'm not really sure what you mean, but you can change the skins of the buttons in your button bar using css:

   s|ButtonBarButton { skin-class: ClassReference("my.skin.class"); }

Or you can choose a custom button implementation by creating your own ButtonBarSkin to refer to your buttons.

<fx:Declarations>
    <fx:Component id="firstButton">
        <you:MyLastButton />
    </fx:Component>

    <fx:Component id="middleButton" >
        <you:MyLastButton />
    </fx:Component>

    <fx:Component id="lastButton" >
        <you:MyLastButton />
    </fx:Component>
</fx:Declarations>

Take a look at Spark's own ButtonBarSkin for a good example and make sure these buttons at least implement IItemRenderer or just extend ButtonBarButton