7 Replies Latest reply on Apr 20, 2011 5:13 AM by rkcy

    Bar color of ProgressBar in Spark

    rui_yangrh

      Hi,all. I use ProgressBar in Flex 3 and it's ok. I can change the bar's color by set ProgressBar's barColor style at runtime. But now I use Flex 4 and uncheck Flex 3 compatibility checkbox in Compiler configuration page, I can't use barColor style any more. I think I have to create a BarSkin class to solve it. My question is that how can I change the bar's color at runtime in Spark. I can't find any property or style for it?

        • 1. Re: Bar color of ProgressBar in Spark
          yellow267

          try this solution:

           

          create a progress bar skin and where you define the bar color write something like this:

          color = {hostComponent.runtimeColor}

           

          then create a custom component based on progress bar  or an AS3 class whitch extends progressBar like this:

          package
          {
               import mx.controls.ProgressBar;
               
               public class CustomProgressBar extends ProgressBar
               {
                    public var runtimeColor:uint;
                    
                    public function CustomProgressBar()
                    {
                         super();
                    }
               }
          }

           

          Now from your app you should change bar's color at runtime

           

          yellow

          • 2. Re: Bar color of ProgressBar in Spark
            rui_yangrh Level 1

            Thank you, yellow. But in your solution, how can I access the hostComponent in my ProgressBarSkin class?

            • 3. Re: Bar color of ProgressBar in Spark
              yellow267 Level 1

              hi,

              you should refer to hostComponent in the code of your progress bar custom skin.

               

                      override protected function initializationComplete():void
                      {
                               useChromeColor = true

                               myColor = hostComponent.myColor
                               super.initializationComplete();
                      }

              • 4. Re: Bar color of ProgressBar in Spark
                rui_yangrh Level 1

                Oops, I can't get the key point of your solution exactly, duh. Could you please give me some example code. Thanks a lot for your time

                • 5. Re: Bar color of ProgressBar in Spark
                  yellow267 Level 1

                  hi ruy...

                  i'm terribly sorry... i tried this solution on my pc and it didn't work for this component...

                  it seems that a solution like this works only for spark components skins..

                   

                  Did you try to create more skins for the progress bar and change its barskin property at runtime?

                   

                  yellow

                  • 6. Re: Bar color of ProgressBar in Spark
                    rui_yangrh Level 1

                    Never mind, yellow. I've thought about creating several Skin class, too. But I don't think it is a beautiful solution, so I want to find out a better method here to handle this problem. Maybe I should use Flex 3 compatibility mode to compile my app.

                    • 7. Re: Bar color of ProgressBar in Spark
                      rkcy Level 1

                      Thanks Yellow, But i have a progress bar component in mxml not an actionscript.  i used skin component and filling the color into the skin component using color = {hostComponent.runtimeColor} same. but he colors are overrride and showing black color instaed of showing green, yellow and red.

                       

                      This is not working. is there any other solution. if you want to look into the code i'll share you.

                       

                      Thanks

                      Ravi