Search Flex Samples

Disabling individual buttons on a Flex ButtonBar control

The following example shows how you can disable individual buttons on a ButtonBar control in Flex by using the getChildAt() method and enabled property on the returned button instance.





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



<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="vertical"

verticalAlign="middle"

backgroundColor="white">



<mx:Style>

ButtonBar {

buttonStyleName: myCustomButtonStyleName;

}



.myCustomButtonStyleName {

cornerRadius: 0;

}

</mx:Style>



<mx:Script>

<![CDATA[

import mx.controls.buttonBarClasses.ButtonBarButton;



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

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

b3.enabled = selected;

}

]]>

</mx:Script>



<mx:Array id="arr">

<mx:Object label="Button" />

<mx:Object label="ButtonBar" />

<mx:Object label="ColorPicker" />

<mx:Object label="ComboBox" />

</mx:Array>



<mx:ApplicationControlBar dock="true">

<mx:Form styleName="plain">

<mx:FormItem label="Button enabled:">

<mx:CheckBox id="ch1"

selected="true"

click="toggleButton(0, ch1.selected);" />

</mx:FormItem>

<mx:FormItem label="ButtonBar enabled:">

<mx:CheckBox id="ch2"

selected="true"

click="toggleButton(1, ch2.selected);" />

</mx:FormItem>

<mx:FormItem label="ColorPicker enabled:">

<mx:CheckBox id="ch3"

selected="true"

click="toggleButton(2, ch3.selected);" />

</mx:FormItem>

<mx:FormItem label="ComboBox enabled:">

<mx:CheckBox id="ch4"

selected="true"

click="toggleButton(3, ch4.selected);" />

</mx:FormItem>

</mx:Form>

</mx:ApplicationControlBar>



<mx:ButtonBar id="buttonBar"

dataProvider="{arr}"

itemClick="lbl.text = event.label;" />



<mx:Label id="lbl" />



</mx:Application>




0 comments:

Related Flex Samples

Learn Flex: Flex Samples | Flex Video Tutorials Flex Examples