Flex 4中Spark组件利用Skin Class外观设计(6)
FXG中常用的效果滤镜有7个:
GlowFilter(单色发光滤镜)
BlurFilter(模糊滤镜)
DropShadowFilter(阴影滤镜)
BevelFilter(斜角滤镜)
GradientGlowFilter(彩色发光滤镜)
GradientBevelFilter(彩色斜角滤镜)
ColorMatrixFilter(色彩响应矩阵滤镜)
以下是一个简单的例子:
<?xml version="1.0" encoding="utf-8"?><s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"> <fx:Script> <![CDATA[ private const myMatrix:Array = [0.3, 0.59, 0.11, 0, 0, 0.3, 0.59, 0.11, 0, 0, 0.3, 0.59, 0.11, 0, 0, 0, 0, 0, 1, 0]; ]]> </fx:Script> <s:states> <s:State name="disabled" /> <s:State name="normal" /> </s:states> <s:VGroup fontSize="21" fontWeight="bold" color="#FFFFFF" gap="21" horizontalAlign="center"> <s:Group> <s:Label text="Simon_007"/> <s:filters> <!--单色发光滤镜--> <s:GlowFilter blurX="10" blurY="10" quality="3" strength="4" color="#ff7700"/> </s:filters> </s:Group> <s:HGroup gap="21"> <s:Group> <s:Label text="Simon_001"/> <s:filters> <!--模糊滤镜--> <s:BlurFilter blurX="3" blurY="3" quality="5"/> </s:filters> </s:Group> <s:Group> <s:Label text="Simon_002"/> <s:filters> <!--阴影滤镜--> <s:DropShadowFilter blurX="3" blurY="3" quality="3" strength="1" color="#000000" alpha="0.7" angle="70" distance="3"/> </s:filters> </s:Group> <s:Group> <s:Label text="Simon_003"/> <s:filters> <!--斜角滤镜--> <s:BevelFilter blurX="3" blurY="3" quality="5" angle="120" highlightColor="#00ff00" shadowColor="#00ff00"/> </s:filters> </s:Group> </s:HGroup> <s:HGroup gap="21"> <s:Group> <s:Label text="Simon_004"/> <s:filters> <!--彩色发光滤镜--> <s:GradientGlowFilter blurX="10" blurY="10" distance="0" > <s:GradientEntry color="#0000ff" alpha="0"/> <s:GradientEntry color="#0000ff"/> <s:GradientEntry color="#ff0000"/> <s:GradientEntry color="#00ff00"/> <s:GradientEntry color="#000000"/> </s:GradientGlowFilter> </s:filters> </s:Group> <s:Group> <s:Label text="Simon_005"/> <s:filters> <!--彩色斜角滤镜--> <s:GradientBevelFilter blurX="3" blurY="3" angle="120" quality="3"> <s:GradientEntry color="#0000ff"/> <s:GradientEntry color="#ff7700"/> <s:GradientEntry color="#00ff00"/> </s:GradientBevelFilter> </s:filters> </s:Group> <s:Group> <s:Label text="Simon_006" color="#ff0000"/> <s:filters> <!--色彩响应矩阵滤镜--> <!--将红色的 Simon_006 变为黑白--> <s:ColorMatrixFilter matrix="{myMatrix}"/> </s:filters> </s:Group> </s:HGroup> </s:VGroup></s:Skin>