Flex3 - 阴影滤镜DropShadowFilter示例大全
作者:hangge | 2015-02-27 10:21
使用DropShadowFilter阴影滤镜可以很方便的给元件,图片添加阴影。下面通过不同的参数设置下阴影的效果,演示阴影滤镜的使用,效果图如下:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" backgroundColor="0xffffff" layout="absolute"
minWidth="955" minHeight="600" fontSize="12">
<mx:Script>
<![CDATA[
[Binabel]
private var filter1:DropShadowFilter = new DropShadowFilter(5,0,0,0.6,32,32);
[Binabel]
private var filter2:DropShadowFilter = new DropShadowFilter(3,45,0,0.6);
[Binabel]
private var filter3:DropShadowFilter = new DropShadowFilter(1, 45, 0x000000, 0.5, 0, 0);
[Binabel]
private var filter4:DropShadowFilter = new DropShadowFilter(2,45,0,.3,2,2,1,1);
[Binabel]
private var filter5:DropShadowFilter = new DropShadowFilter(0,0,0,0.3,14,14);
]]>
</mx:Script>
<mx:VBox x="50" y ="50" verticalGap="24">
<mx:Button label="blank" width="142" height="68" />
<mx:Button label="filter1" width="142" height="72" filters="{[filter1]}"/>
<mx:Button label="filter2" width="142" height="72" filters="{[filter2]}"/>
<mx:Button label="filter3" width="142" height="72" filters="{[filter3]}"/>
<mx:Button label="filter4" width="142" height="72" filters="{[filter4]}"/>
<mx:Button label="filter5" width="142" height="72" filters="{[filter5]}"/>
</mx:VBox>
<mx:VBox x="250" y ="50" verticalGap="24">
<mx:Canvas width="142" height="72" backgroundColor="0xffffff" borderStyle="solid" />
<mx:Canvas width="142" height="72" backgroundColor="0xffffff" borderStyle="solid"
filters="{[filter1]}"/>
<mx:Canvas width="142" height="72" backgroundColor="0xffffff" borderStyle="solid"
filters="{[filter2]}"/>
<mx:Canvas width="142" height="72" backgroundColor="0xffffff" borderStyle="solid"
filters="{[filter3]}"/>
<mx:Canvas width="142" height="72" backgroundColor="0xffffff" borderStyle="solid"
filters="{[filter4]}"/>
<mx:Canvas width="142" height="72" backgroundColor="0xffffff" borderStyle="solid"
filters="{[filter5]}"/>
</mx:VBox>
<mx:VBox x="450" y ="50" verticalGap="20">
<mx:Image source="./page_bg.png"/>
<mx:Image source="./page_bg.png" filters="{[filter1]}"/>
<mx:Image source="./page_bg.png" filters="{[filter2]}"/>
<mx:Image source="./page_bg.png" filters="{[filter3]}"/>
<mx:Image source="./page_bg.png" filters="{[filter4]}"/>
<mx:Image source="./page_bg.png" filters="{[filter5]}"/>
</mx:VBox>
</mx:Application>
全部评论(0)