Setting text styles for a selected button in a ToggleButtonBar control in Flex

The following example shows how you can set the text color for the selected button in a Flex ToggleButtonBar control by setting the selectedButtonTextStyleName style.

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/11/08/setting-text-styles-for-a-selected-button-in-a-togglebuttonbar-control-in-flex/ -->
<mx:Application name="ToggleButtonBar_selectedButtonTextStyleName_test"
        xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:Style>
        .mySelectedButtonTextStyleName {
            color: haloBlue;
        }
    </mx:Style>

    <mx:Array id="arr">
        <mx:Object label="One Fish" />
        <mx:Object label="Two Fish" />
        <mx:Object label="Red Fish" />
        <mx:Object label="Blue Fish" />
    </mx:Array>

    <mx:ToggleButtonBar id="toggleButtonBar"
            selectedButtonTextStyleName="mySelectedButtonTextStyleName"
            dataProvider="{arr}" />

</mx:Application>

Tagged as: selectedButtonTextStyleName