image placed in the skin mxml displayed darkened

sidneykelvin

I created a skin mxml in Viewer for Flex and placed an image in the title bar. the image was found darkened.
Reference please found attached a clip of the display I get.

What have I done wrong?

Thanks in advance.

In the skin.mxml
........
                <!-- layer 3: text -->
                <!--- @copy spark.components.Panel#titleDisplay -->
    <s:HGroup>
     <s:BitmapImage id="panelIcon" source="@Embed(source='../../assets/images/cedd/logo.jpg')"
                                                                  left="5" width="40"/>
     <s:Label id="titleDisplay" maxDisplayedLines="1"
        left="9" right="36" top="1" bottom="0" minHeight="30"
        verticalAlign="middle" fontWeight="bold" />
    </s:HGroup>
.........

dimmed image.jpg

hosted_editing.JPG

RobertScheitlin__GISP

Sidney,

   Your panelIcon has to added to the colorize exclusions array:

/* Define the skin elements that should not be colorized.          For panel, border and title background are skinned, but the content area, background, border, and title text are not. */         static private const exclusions:Array = ["background", "titleDisplay", "contentGroup", "controlBarGroup", "border", "panelIcon"];                      /* exclusions before Flex 4.5 for backwards-compatibility purposes */         static private const exclusions_4_0:Array = ["background", "titleDisplay", "contentGroup", "controlBarGroup", "panelIcon"];