Take the 2-minute tour ×

I need to show multiple sections in single progress bar where each component is of different color. Can any one suggest me any external component or any idea to implement this.



share|improve this question
best way to do this.... create an hbox, with multiple hboxes inside it, each having a different colour, and the width of each of those HBox corresponds to the percentage of colour you would want.I will implement a similar thing tonight and post it on my blog soon. –  Neeraj Feb 17 '11 at 13:37
add comment

2 Answers

up vote 1 down vote accepted

Had to do this a while back and opted to take the following route:

I built a custom preloader by extending the DownloadProgressBar and then integrated it with this Degrafa component. http://degrafa.org/source/CapacityIndicator/CapacityIndicator.html

To create the custom preloader, I think I used this tute: http://iamjosh.wordpress.com/2007/12/18/flex-custom-preloader/

and then created a separate class that was responsible for dynamically adjusting the values in that degrafa component linked above. And then of course in your SWFDownloadProgress function (on the Progress Event), you can adjust those values accordingly.

I found this to be the quickest and a fairly clean way of doing it to achieve the most visually pleasing component, although there are other several ways to do it, here is a post for a similar question, where the second answer (not mine) shows an alternate way of handling it:

How to dynamically fill a progress bar in Flex/Actionscript?

Good luck :)

share|improve this answer
add comment

I recently answered a similar question that you may find useful: How to dynamically fill a progress bar

In a nutshell, you create a custom skin based on the ProgressBarSkin. Hope that helps.

share|improve this answer
add comment

Your Answer


