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>
转载注明:来自www.flexjs.cn