Search Flex Samples

Positioning a label within a progress bar using the ProgressBar.labelPlacement property

We’ve looked at this briefly in a previous entry, but here’s a quick look at each of the five options for the ProgressBar.labelPlacement property.





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

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

layout="vertical"

verticalAlign="middle"

backgroundColor="white">


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

<mx:HBox>

<mx:VBox>

<mx:RadioButtonGroup id="rbg" />

<mx:RadioButton label="left" group="{rbg}" />

<mx:RadioButton label="center" group="{rbg}" />

<mx:RadioButton label="right" group="{rbg}" />

<mx:RadioButton label="top" group="{rbg}" />

<mx:RadioButton label="bottom" group="{rbg}" />

</mx:VBox>

<mx:VBox backgroundColor="white"

horizontalAlign="center"

verticalAlign="middle"

width="200" height="100%">



<mx:ProgressBar id="progressBar"

barColor="haloOrange"

label="{rbg.selectedValue}"

labelPlacement="{rbg.selectedValue}"

mode="manual"

width="150"

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



</mx:VBox>

</mx:HBox>



</mx:Application>

0 comments:

Related Flex Samples

Learn Flex: Flex Samples | Flex Video Tutorials Flex Examples