<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

               xmlns:s="library://ns.adobe.com/flex/spark"

               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">

    <s:layout>

        <s:VerticalLayout gap="3" />

    </s:layout>

    <fx:Script>

        <![CDATA[

            import mx.collections.ArrayList;

            /* import spark.components.ButtonBarButton;  */

            import mx.controls.buttonBarClasses.ButtonBarButton;

            private function toggleButton(idx:uint, selected:Boolean):void {

                var b3:ButtonBarButton = buttonBar.getChildAt(idx) as ButtonBarButton;

                b3.enabled = selected;

            }

        ]]>

    </fx:Script>

    <fx:Declarations>

        <!-- 将非可视元素（例如服务、值对象）放在此处 -->

        <fx:Array id="arr">

            <fx:Object label="Button"/>

            <fx:Object label="ButtonBar"/>

            <fx:Object label="ColorPicker"/>

            <fx:Object label="ComboBox"/>

        </fx:Array>

    </fx:Declarations>

    <fx:Style>

        @namespace s "library://ns.adobe.com/flex/spark";

        @namespace mx "library://ns.adobe.com/flex/mx";

        mx|ButtonBar{

            buttonStyleName:myCustomButtonStyleName;

        }

        .myCustomButtonStyleName{

            cornerRadius:10;

        }

    </fx:Style>

    <s:controlBarContent>

        <s:Form styleName="plain">

            <s:FormItem label="Button enabled:"  height="20">

                <s:CheckBox id="che1" selected="true" click="toggleButton(0,che1.selected)"/>

            </s:FormItem>

            <s:FormItem label="ButtonBar enabled:"  height="20">

                <s:CheckBox id="che2" selected="true" click="toggleButton(1,che2.selected)"/>

            </s:FormItem>

            <s:FormItem label="ColorPicker enabled:" height="20">

                <s:CheckBox id="che3" selected="true" click="toggleButton(2,che3.selected)"/>

            </s:FormItem>

            <s:FormItem label="ComboBox enabled:" height="20">

                <s:CheckBox id="che4" selected="true" click="toggleButton(3,che4.selected)"/>

            </s:FormItem>

        </s:Form>

    </s:controlBarContent>

    <mx:ButtonBar id="buttonBar" dataProvider="{arr}" itemClick="lbl.text = event.label" />

    <s:Label id="lbl"/>

</s:Application>