您好,欢迎来到我要学flash网!登录注册

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

来源:我要学flash网 | 作者:admin | 发表时间:2012-02-04 | 点击:  次

接下来的Flex Gumbo中如何通过skinClass样式,去掉Spark Panel下拉阴影。
下面是main.mxml:
 

  1. <?xml version="1.0" encoding="utf-8"?>   
  2. <s:Application name="Spark_Panel_skinClass_dropShadow_test"   
  3.         xmlns:fx="http://ns.adobe.com/mxml/2009"   
  4.         xmlns:s="library://ns.adobe.com/flash.com/article/flex' target='_blank'>flex/spark">   
  5.     
  6.     <s:Panel title="Spark Panel title"   
  7.             skinClass="skins.CustomPanelSkin_noDropShadow"   
  8.             width="200"   
  9.             horizontalCenter="0"   
  10.             verticalCenter="0">   
  11.         <s:VGroup left="20" right="20" top="20" bottom="20">   
  12.             <s:RichEditableText id="richEditableTxt"   
  13.                     text="The quick brown fox jumps over the lazy dog."   
  14.                     width="100%"   
  15.                     height="100%" />   
  16.         </s:VGroup>   
  17.     </s:Panel>   
  18.     
  19. </s:Application> 

下面是CustomFxPanelSkin_noDropShadow.mxml的代码:
 

  1. <?xml version="1.0" encoding="utf-8"?>   
  2. <s:SparkSkin name="CustomPanelSkin_noDropShadow"   
  3.         xmlns:fx="http://ns.adobe.com/mxml/2009"   
  4.         xmlns:s="library://ns.adobe.com/flash.com/article/flex' target='_blank'>flex/spark"   
  5.         alpha.disabled="0.5">   
  6.     <s:states>   
  7.         <s:State name="normal" />   
  8.         <s:State name="disabled" />   
  9.     </s:states>   
  10.     
  11.     <fx:Metadata>   
  12.     <![CDATA[   
  13.         [HostComponent("spark.components.Panel")]   
  14.     ]]>   
  15.     </fx:Metadata>   
  16.     
  17.     <fx:Script>   
  18.         /* Define the skin elements that should not be colorized.   
  19.            For panel, border and title backround are skinned, but the content area and title text are not. */   
  20.         static private const exclusions:Array = ["background", "titleField", "contentGroup"];   
  21.     
  22.         override public function get colorizeExclusions():Array {return exclusions;}   
  23.     
  24.         /* Define the content fill items that should be colored by the "contentBackgroundColor" style. */   
  25.         static private const contentFill:Array = ["bgFill"];   
  26.     
  27.         override public function get contentItems():Array {return contentFill};   
  28.     </fx:Script>   
  29.     
  30.     <!-- layer 1: border -->   
  31.     <s:Rect left="0" right="0" top="0" bottom="0">   
  32.         <s:stroke>   
  33.             <s:SolidColorStroke color="0" alpha="0.50" weight="1" />   
  34.         </s:stroke>   
  35.     </s:Rect>   
  36.     
  37.     <!-- layer 2: background fill -->   
  38.     <!--- Defines the appearance of the PanelSkin class's background. -->   
  39.     <s:Rect id="background" left="1" top="1" right="1" bottom="1">   
  40.         <s:fill>   
  41.         <!--- Defines the  PanelSkin class's background fill. The default color is 0xFFFFFF. -->   
  42.             <s:SolidColor color="0xFFFFFF" id="bgFill" />   
  43.         </s:fill>   
  44.     </s:Rect>   
  45.     
  46.     <!-- layer 3: title bar fill -->   
  47.     <s:Rect left="1" right="1" top="1" height="30">   
  48.        <s:fill>   
  49.             <s:LinearGradient rotation="90">   
  50.                 <s:GradientEntry color="0xE2E2E2" />   
  51.                 <s:GradientEntry color="0xD9D9D9" />   
  52.             </s:LinearGradient>   
  53.        </s:fill>   
  54.     </s:Rect>   
  55.     
  56.     <!-- layer 4: title bar highlight -->   
  57.     <s:Rect left="1" right="1" top="1" height="30">   
  58.        <s:stroke>   
  59.             <s:LinearGradientStroke rotation="90" weight="1">   
  60.                 <s:GradientEntry color="0xEAEAEA" />   
  61.                 <s:GradientEntry color="0xD9D9D9" />   
  62.             </s:LinearGradientStroke>   
  63.        </s:stroke>   
  64.     </s:Rect>   
  65.     <s:Rect left="1" right="1" top="31" height="1">   
  66.         <s:fill>   
  67.             <s:SolidColor color="0xC0C0C0" />   
  68.         </s:fill>   
  69.     </s:Rect>   
  70.     
  71.     <!-- layer 5: text -->   
  72.     <!--- Defines the appearance of the PanelSkin class's title bar. -->   
  73.     <s:SimpleText id="titleField" lineBreak="explicit"   
  74.              left="10" right="4" top="2" height="30"   
  75.              verticalAlign="middle" fontWeight="bold" />   
  76.     
  77.     <s:Group id="contentGroup"   
  78.             left="1" right="1" top="32" bottom="1" />   
  79.     
  80. </s:SparkSkin> 

 

    顶一下
    (0)
    0%
    踩一下
    (0)
    0%
    本文引用地址:
      最新评论: 共有位网友发表了评论
      发表评论:
    请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
    评价:
    表情:
    用户名: 密码: 验证码: