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>
 
About The Author

Peter deHaan

Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.

2 Responses to Setting text styles for a selected button in a ToggleButtonBar control in Flex

  1. zuccaralloo says:

    How do you do the same thing with simple buttons – setting text style when selected? My workaround right now is having a condition in the styleName property. Is there a simpler/better way? Any property I have missed?

  2. rconceiver says:

    can we use html tags in togglebuttonbar button label; for e.g. if I want to show label as “Step 1 Open Window” from this Step 1 should be in bold and rest of the text in normal.

    please help.

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">

Anti-Spam Protection by WP-SpamFree