Flex Gumbo中如何通过skinClass样式去掉Spark Panel下拉阴影的例子

接下来的Flex Gumbo中如何通过skinClass样式，去掉Spark Panel下拉阴影。

下面是main.mxml：<?xml version="1.0" encoding="utf-8"?> 

<s:Application name="Spark_Panel_skinClass_dropShadow_test" 

        xmlns:fx="http://ns.adobe.com/mxml/2009" 

        xmlns:s="library://ns.adobe.com/flex/spark"> 

  

    <s:Panel title="Spark Panel title" 

            skinClass="skins.CustomPanelSkin_noDropShadow" 

            width="200" 

            horizontalCenter="0" 

            verticalCenter="0"> 

        <s:VGroup left="20" right="20" top="20" bottom="20"> 

            <s:RichEditableText id="richEditableTxt" 

                    text="The quick brown fox jumps over the lazy dog." 

                    width="100%" 

                    height="100%" /> 

        </s:VGroup> 

    </s:Panel> 

  

</s:Application>

 

下面是CustomFxPanelSkin_noDropShadow.mxml的代码：<?xml version="1.0" encoding="utf-8"?> 

<s:SparkSkin name="CustomPanelSkin_noDropShadow" 

        xmlns:fx="http://ns.adobe.com/mxml/2009" 

        xmlns:s="library://ns.adobe.com/flex/spark" 

        alpha.disabled="0.5"> 

    <s:states> 

        <s:State name="normal" /> 

        <s:State name="disabled" /> 

    </s:states> 

  

    <fx:Metadata> 

    <![CDATA[ 

        [HostComponent("spark.components.Panel")] 

    ]]> 

    </fx:Metadata> 

  

    <fx:Script> 

        /* Define the skin elements that should not be colorized. 

           For panel, border and title backround are skinned, but the content area and title text are not. */ 

        static private const exclusions:Array = ["background", "titleField", "contentGroup"]; 

  

        override public function get colorizeExclusions():Array {return exclusions;} 

  

        /* Define the content fill items that should be colored by the "contentBackgroundColor" style. */ 

        static private const contentFill:Array = ["bgFill"]; 

  

        override public function get contentItems():Array {return contentFill}; 

    </fx:Script> 

  

    <!-- layer 1: border --> 

    <s:Rect left="0" right="0" top="0" bottom="0"> 

        <s:stroke> 

            <s:SolidColorStroke color="0" alpha="0.50" weight="1" /> 

        </s:stroke> 

    </s:Rect> 

  

    <!-- layer 2: background fill --> 

    <!--- Defines the appearance of the PanelSkin class's background. --> 

    <s:Rect id="background" left="1" top="1" right="1" bottom="1"> 

        <s:fill> 

        <!--- Defines the PanelSkin class's background fill. The default color is 0xFFFFFF. --> 

            <s:SolidColor color="0xFFFFFF" id="bgFill" /> 

        </s:fill> 

    </s:Rect> 

  

    <!-- layer 3: title bar fill --> 

    <s:Rect left="1" right="1" top="1" height="30"> 

       <s:fill> 

            <s:LinearGradient rotation="90"> 

                <s:GradientEntry color="0xE2E2E2" /> 

                <s:GradientEntry color="0xD9D9D9" /> 

            </s:LinearGradient> 

       </s:fill> 

    </s:Rect> 

  

    <!-- layer 4: title bar highlight --> 

    <s:Rect left="1" right="1" top="1" height="30"> 

       <s:stroke> 

            <s:LinearGradientStroke rotation="90" weight="1"> 

                <s:GradientEntry color="0xEAEAEA" /> 

                <s:GradientEntry color="0xD9D9D9" /> 

            </s:LinearGradientStroke> 

       </s:stroke> 

    </s:Rect> 

    <s:Rect left="1" right="1" top="31" height="1"> 

        <s:fill> 

            <s:SolidColor color="0xC0C0C0" /> 

        </s:fill> 

    </s:Rect> 

  

    <!-- layer 5: text --> 

    <!--- Defines the appearance of the PanelSkin class's title bar. --> 

    <s:SimpleText id="titleField" lineBreak="explicit" 

             left="10" right="4" top="2" height="30" 

             verticalAlign="middle" fontWeight="bold" /> 

  

    <s:Group id="contentGroup" 

            left="1" right="1" top="32" bottom="1" /> 

  

</s:SparkSkin>