6 Replies Latest reply on Mar 6, 2013 12:06 PM by 1909sanjay

    Spark theme vs Halo theme


      Hi - I tried the following in one of my mxml files in Flex SDK4.
      <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" dropShadowEnabled="true" dropShadowColor="#EBE6E6"
           backgroundColor="#E8E5E5" width="280" alpha="1" borderColor="#8d8d8d" borderThickness="1" borderStyle="solid" cornerRadius="8" creationComplete="setPopMsg(),fireEvent()" >


      It gave an error "The style 'borderThickness' is only supported by type 'mx.containers.Canvas' with the theme(s) 'halo'."


      Should we use only Spark theme with Flex 4? What is the difference between Spark and Halo themes?  which is good? Also what is the equivalent of setting borderThickness in spark theme?

        • 1. Re: Spark theme vs Halo theme
          joan_lafferty Adobe Employee

          The Spark theme is the default theme for Flex 4. Halo theme was the default theme for Flex 3. Each of these themes will support different styles. So, it is up to you which theme you want to use depending on the look and feel that you are going for in your application. There is no equivalent for the Halo theme's borderThickness in the Spark theme. In general, the Halo theme has a lot more 'out-of-the-box' styles for components and containers. However, using custom skins is much easier if your application uses the Spark theme.


          If you look at the ASDocs for each of the component classes, the styles should have a "theme" listed where it tells you whether that style is supported on Halo, Spark or both. The other theme that comes with the Flex 4 SDK is the Wireframe theme which doesn't support any styles.


          Lastly, if you want to use the Spark theme, you can consider changing your Canvas component to a Spark BorderContainer which contains the borderWeight style that will do what you want.



          • 2. Re: Spark theme vs Halo theme
            MageshR Level 1


            • 3. Re: Spark theme vs Halo theme
              Ansury Level 3




              Spark seems to fall short in some areas for quite a few use-cases.  Hopefully (unless Spark is improved) the continued value of Halo will be realized by Adobe and they will cease putting deprecated-like warning messages on Halo components.  Unless Adobe plans on removing Halo entirely at some point, there is no reason (that I've been informed of) to discourage people from using it when your sponsors "just don't really care" too much about a custom look and feel.  (Think enterprise/work environments, not consumer/retail.)


              Spark isn't 'ready for prime time' (in terms of replacing Halo) since it's missing quite a bit (DataGrid and AdvDG) and the thought of combining possibly deprecated components with very different newer components leaves a bad taste.


              I've yet to find any kind of official info from Adobe on Halo deprecation and it's future...




              • 4. Re: Spark theme vs Halo theme
                pollymath Level 1

                I aggree with Ansury Spark is very imcomplete - No Progress Bar for heaven sake! However it is clearly the way forward. The skinning mechanism is far more flexible (although we lack a good tool for slick editing workflow ) Mixing  Spark and Halo is a major pain in several areas firstly in terms of caperpbillty changes between similar content then in terms of adjusting the UI.


                We need a road map for Spark and we need it sooner rather than later - it is the sort of thing that puts days on a project!


                my 2¢



                • 5. Re: Spark theme vs Halo theme

                  Now that most of Halo theme which we used do it by CSS is no longer valid, also if a application is using "Halo" theme then the application can't be simple changed to "Spark" theme withput considerable change to UI look and feel. Also simple thing like TitleWindow close button is now part of skinning if using "Spark" theme, This is no longer a property of s:TitleWindow unlike mx:TitleWindow, similarly header color  was simple in mx:Panel but in s:Panel we have to do a  programatic skining. I am not sure why Adobe decided to "hide" CSS style for all the component.


                  Anybody has any insight into ? It is much more difficult to change theme dynamically.


                  Also changing the default color of mx:ProgressBar with "Halo" was so easy but with mx:ProgressBar with "Spark" theme, we have write a custom skin just for the progress bar.



                  • 6. Re: Spark theme vs Halo theme

                    Flex 4 by default comes with spark theme


                    but if you want to use halo theme along with spark theme


                    1. In Flash Builder 4, select Project > Properties from the main menu.
                    2. Select Flex Compiler from the left menu.
                    3. In the Additional compiler arguments text field, add the following argument:



                    "+=" is very important as you need to have both spark and halo