3 Replies Latest reply on Aug 17, 2011 11:40 AM by Flex harUI

    registerColorName and using CSS

    screenname00100126514235

      I have created this application:

       

      <?xml version="1.0" encoding="utf-8"?>
      <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
                        xmlns:s="library://ns.adobe.com/flex/spark" 
                        xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
                        initialize="onInitialize(event)"
                        creationComplete="onCreationComplete(event)">
           <fx:Style source="../style/style.css" />
      
           <fx:Script>
                <![CDATA[
                     import mx.events.FlexEvent;
                     
                     protected function onInitialize(event:FlexEvent):void
                     {
                          styleManager.registerColorName("mycolor01",0xff00ff);
                          styleManager.styleDeclarationsChanged();
                     }
                     
                     protected function onCreationComplete(event:FlexEvent):void
                     {
                          label1.setStyle("color", styleManager.getColorName("mycolor01"));
                     }
                     
                ]]>
           </fx:Script>
           <s:VGroup>
                <s:Label id="label1" text="Color testing 1" />
                <s:Label id="label2" text="Color testing 2" />          
           </s:VGroup>
      </s:Application>
      

       

      and the .css I'm including looks like this:

       

      /* CSS file */
      @namespace s "library://ns.adobe.com/flex/spark";
      @namespace mx "library://ns.adobe.com/flex/mx";
      
      s|Label#label1, s|Label#label2 
      {
           color: mycolor01;
      }
      

       

      What I'm trying to accomplish is that I can register a new colorname "mycolor01" and use it in the CSS file. Unfortunately this example doesn't work. I can apply the color late by calling label1.setStyle(..) but I don't want to do that for all my styles.

       

      Does anyone know a way to make this work ?

        • 1. Re: registerColorName and using CSS
          Flex harUI Adobe Employee

          Why isn't mycolor01 in quotes?

          • 2. Re: registerColorName and using CSS
            screenname00100126514235 Level 1

            That is probably the formatting of this forum:

             

             

            <?xml version="1.0" encoding="utf-8"?>
            <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
                              xmlns:s="library://ns.adobe.com/flex/spark" 
                              xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
                              initialize="onInitialize(event)"
                              creationComplete="onCreationComplete(event)">
                 <fx:Style source="../style/style.css" />
            
                 <fx:Script>
                      <![CDATA[
                           import mx.events.FlexEvent;
            
                           protected function onInitialize(event:FlexEvent):void
                           {
                                styleManager.registerColorName("mycolor01",0xff00ff);
                                styleManager.styleDeclarationsChanged();
                           }
            
                           protected function onCreationComplete(event:FlexEvent):void
                           {
                                label1.setStyle("color", styleManager.getColorName("mycolor01"));
                           }
            
                      ]]>
                 </fx:Script>
                 <s:VGroup>
                      <s:Label id="label1" text="Color testing 1" />
                      <s:Label id="label2" text="Color testing 2" />          
                 </s:VGroup>
            </s:Application>
            
            • 3. Re: registerColorName and using CSS
              Flex harUI Adobe Employee

              Looks like new colornames in .css files isn't supported.

               

              Best you can do is sweep the selectors and replace the string value, or

              override getStyle on some components to pass the results through

              getColorName