Adding icons to the Flex ButtonBar control – mx:ButtonBar

The following example shows how you can add icons to the ButtonBar control in Flex.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">

<mx:Script>
<![CDATA[
[Bindable]
[Embed("assets/Button.png")]
private var buttonIcon:Class;

[Bindable]
[Embed("assets/ButtonBar.png")]
private var buttonBarIcon:Class;

[Bindable]
[Embed("assets/CheckBox.png")]
private var checkBoxIcon:Class;

[Bindable]
[Embed("assets/ColorPicker.png")]
private var colorPickerIcon:Class;
]]>

</mx:Script>

<mx:Array id="arr">
<mx:Object label="Button" icon="{buttonIcon}" />
<mx:Object label="ButtonBar" icon="{buttonBarIcon}" />
<mx:Object label="CheckBox" icon="{checkBoxIcon}" />
<mx:Object label="ColorPicker" icon="{colorPickerIcon}" />
</mx:Array>

<!-- The data provider has an "icon" property. -->
<mx:ButtonBar id="buttonBar" dataProvider="{arr}" height="32" />

</mx:Application>