4 Replies Latest reply: Aug 5, 2012 12:36 AM by DBarranca RSS

    Text colors and autoThemeColorChange

    MSSDedalus Community Member

      Creating an extension for CS6 I'm using

       

      CSInterface.instance.autoThemeColorChange = true;

       

      at start and it looks nice but I have a problem with:

       

      Alert messages and my own popup windows: the background is almost white and text gray, really hard to read.

       

      Text in the status bar: docs are telling that statusBar and statusText are skin parts but I can't find how to change them. I could only set the blend mode to screen to make it lighter.

       

      Thanks in advance for any help

        • 1. Re: Text colors and autoThemeColorChange
          DBarranca Community Member

          Hi,

          I'm afraid you have to change them manually.

          First you should listen for:

           

          CSInterface.instance.addEventListener(AppReskinEvent.APPLICATION_RESKIN, eventHandler);

           

          then, having defined previously these vars:

           

          public var hostEnv:HostEnvironment;

          public var eSkin:AppSkinInfo;

           

          you set a eventHandler that:

           

          hostEnv = CSInterface.instance.hostEnvironment;

          eSkin = hostEnv.appSkinInfo;

           

          so that eSkin contains valuable information (please see the EB doc in the Programmers Guide - Customizing the User Interface).

           

          styleManager.getStyleDeclaration("mx.controls.Alert").setStyle("backgroundColor", UIColor2Hex(model.eSkin.panelBackgroundColor));

           

          where the UIColor2Hex() is a function I made to transform a UIColor into Hex, as follows:

           

          function UIColor2Hex(rgb:UIColor):String {

                                        var red:uint = rgb.color.red;

                                        var green:uint = rgb.color.green;

                                        var blue:uint = rgb.color.blue;

           

                                        var intVal:int = red << 16 | green << 8 | blue;

                                        var hexVal:String = "#" + intVal.toString(16);

           

                                        return hexVal;

                              }

           

          So you should be able to set the Alert's background color to match the panel's color. The same applies for Fonts, etc (use a conditional to find out if you're on a dark or light theme - as far as I know there's no actual "flag", you have to test it yourself against panel's properties).

           

          Using .getStyleDeclaration() and .setStyle() you'll be able to style pretty much everything you need in order to provide a consistent look throughout your extension.

           

          Regards,

           

          Davide

          www.davidebarranca.com

           

          =========

          UPDATE: it seems the Forum's editor puts random whitespaces in the code, please remove them if you copy&paste ;-)

          • 2. Re: Text colors and autoThemeColorChange
            MSSDedalus Community Member

            Thanks, this has been of great help. 

             

            It seems that the first time the extension is launched no AppReskinEvent happens and therefore I have to include also the changes in my init function.

             

            I'm still working in the status bar but alert messages and windows look fine now.

            • 3. Re: Text colors and autoThemeColorChange
              DBarranca Community Member

              Yes, you're right - I forgot to mention that, when the application is launched, you need to check what is the current theme and reskin your components accordingly.

              Glad to have been of some help! ;-)

              Davide

              • 4. Re: Text colors and autoThemeColorChange
                DBarranca Community Member

                It seems that for Photoshop there's another, effective way (via ActionManager code) to get the interface color as string: "DarkGray", "MediumGray", "LightGray", "Original".

                You can find the code in ps-scripts forum here.

                 

                Davide