Changing the track height of a Flex ProgressBar control

The following example shows how you can change the track height of a ProgressBar 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[

import mx.events.SliderEvent;

import mx.controls.ProgressBarLabelPlacement;

private function slider_change(evt:SliderEvent):void {

progressBar.setStyle("trackHeight", evt.value);

}

]]>

</mx:Script>

<mx:XML id="labelPlacementXML">

<items>

<item>

<label>ProgressBarLabelPlacement.BOTTOM</label>

<data>{ProgressBarLabelPlacement.BOTTOM}</data>

</item>

<item>

<label>ProgressBarLabelPlacement.CENTER</label>

<data>{ProgressBarLabelPlacement.CENTER}</data>

</item>

<item>

<label>ProgressBarLabelPlacement.TOP</label>

<data>{ProgressBarLabelPlacement.TOP}</data>

</item>

<item>

<label>ProgressBarLabelPlacement.LEFT</label>

<data>{ProgressBarLabelPlacement.LEFT}</data>

</item>

<item>

<label>ProgressBarLabelPlacement.RIGHT</label>

<data>{ProgressBarLabelPlacement.RIGHT}</data>

</item>

</items>

</mx:XML>

<mx:ApplicationControlBar dock="true">

<mx:Label text="trackHeight:" />

<mx:HSlider id="slider"

minimum="0"

maximum="32"

value="{NaN}"

liveDragging="true"

snapInterval="1"

tickInterval="4"

dataTipPrecision="0"

width="100"

change="slider_change(event);" />

<mx:Spacer width="100%" />

<mx:Label text="labelPlacement:" />

<mx:ComboBox id="comboBox"

dataProvider="{labelPlacementXML.item}" />

</mx:ApplicationControlBar>

<mx:ProgressBar id="progressBar"

mode="manual"

labelPlacement="{comboBox.selectedItem.data}"

creationComplete="progressBar.setProgress(35, 100);" />

</mx:Application>

Flex Samples

Latest Flex Samples

Flex Top Links

Changing the track height of a Flex ProgressBar control

0 comments:

Related Flex Samples

Search Flex Samples
	Submit search form