flex 4.0 滤镜效果.

动态滤镜效果:

flex 4.0 动态滤镜包含在 spark.effects 包中.

滤镜列表:http://help.adobe.com/zh_CN/AS3LCR/Flex_4.0/spark/effects/package-detail.html

动画滤镜定义与调用:

<fx:Declarations> <s:BlurFilter blurX="30" blurY="30" quality="100" />  <s:AnimateFilter id="myFilter" target="{控件}" duration="500" bitmapFilter="{new BlurFilter()}">  <s:SimpleMotionPath property="blurX" valueFrom="30" valueTo="0"/> <s:SimpleMotionPath property="blurY" valueFrom="30" valueTo="0"/> <s:SimpleMotionPath property="quality" valueFrom="0" valueTo="100"/> </s:AnimateFilter> </fx:Declarations> <s:Button x="57" y="261" label="按钮" click="myFilter.play();" id="控件"/>

AnimateFilter 效果可将 mx.filters.IBitmapFilter 实例应用至目标，并使您能够设置各个值之间的滤镜的属性的动画。与对目标的属性进行动画设置的效果不同，AnimateFilter 效果是对应用于目标的滤镜的属性进行动画设置。

能用于此效果的滤镜在 spark.filters 中定义。包。公用滤镜包括 DropShadowFilter、GlowFilter、BlurFilter 和 ShaderFilter。

要定义要设置动画的滤镜的属性，可将 SimpleMotionPath 对象的 Array 传递至 AnimateFilter 效果的 motionPath 属性。每个 SimpleMotionPath 对象都定义滤镜的一个属性、该属性的起始值和该属性的结束值。

其他滤镜直接定义调用.如Fade透明滤镜:

<s:Fade alphaFrom="0.0" alphaTo="1.0" id="fade" target="{控件}" duration="500" /> <s:Button x="57" y="261" label="按钮" click="fade.play()" id="控件"/>

多重效果叠加:

protected function clickHandler(event:MouseEvent,title:TitleWindow):void { PopUpManager.addPopUp(title,this,false); var an:Animate=new Animate(title); an.duration=200; var mo:SimpleMotionPath=new SimpleMotionPath("height",(event.currentTarget as IVisualElement).height,674); var mo1:SimpleMotionPath=new SimpleMotionPath("width",(event.currentTarget as IVisualElement).width,674); var mo2:SimpleMotionPath=new SimpleMotionPath("alpha",0,1); var v:Vector.<MotionPath>=new Vector.<MotionPath>(); v[0]=mo; v[1]=mo1; v[2]=mo2; an.motionPaths=v; an.play(); }

状态过渡效果:

<s:transitions> <s:Transition> <s:Fade alphaFrom="0.0" alphaTo="0.8" duration="2000" target="{绑定控件}" />  </s:Transition> </s:transitions>

缓动类:

Bounce 类实现缓动功能，该功能模拟目标对象上的重力牵引和回弹目标对象

Elastic Elastic 类实现缓动功能，此时目标对象移动是由一个指数衰减正弦波定义的。

Power Power 类通过使用多项式表达式定义缓动功能。

<?xml version="1.0"?>  <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:s="library://ns.adobe.com/flex/spark"> <fx:Script>  </fx:Script> <fx:Declarations> <s:Bounce id="boun" /> <s:Move xBy="100" easer="{boun}" id="move1" target="{panel1}" /> <s:Power exponent="4" id="power" /> <s:Move xBy="200" easer="{power}" id="move2" target="{panel2}" /> </fx:Declarations> <s:Panel id="panel1" x="29" y="33" width="194" height="123" click="panel1_clickHandler(event)"> </s:Panel> <s:Panel id="panel2" x="29" y="208" width="194" height="123" click="panel2_clickHandler(event)"> </s:Panel> </s:Application>

静态滤镜效果:

flex sdk 4.0 静态滤镜效果包含在spark.filters 包中.

具体滤镜列表: http://help.adobe.com/zh_CN/AS3LCR/Flex_4.0/spark/filters/package-detail.html

<s:Button x="190" y="281" label="按钮" > <s:filters> <s:BevelFilter angle="45" distance="4" highlightAlpha="1" highlightColor="0xFFFFFF" shadowAlpha="1" shadowColor="0x000000" type="inner" /> </s:filters> </s:Button> <fx:Script>  </fx:Script>  <s:Button x="269" y="130" label="按钮" id="b1" click="createFilters()">

flex 4.0 滤镜效果.相关推荐

积少成多 Flash(ActionScript 3.0 Flex 3.0) 系列文章索引
[源码下载] 积少成多 Flash(ActionScript 3.0 & Flex 3.0) 系列文章索引作者:webabcd Flash 之 ActionScript 3.0 1.积少成 ...
Adobe Flex 3.0 和 AIR 1.0 正式发布
恰逢搜狐十周年庆典,AIR真的来了.. 来自:http://www.dengjie.com/?p=1236 Adobe Flex 3.0 和 AIR 1.0 正式发布是时候将 Web 应用往桌面上搬 ...
[Flex]Flex 3.0 and Adobe AIR 1.0正式版发布！
Adobe太不厚道了!恩,太不厚道了! Flex 3.0和AIR 1.0的正式已经Released了,但是labs.adobe.com还没有更新(︶︿︶) Flex Builder 3.0足足有424 ...
Flex 2.0 软件及文档下载
Flex 2.0 基于AS 3.0 Flex Builder 2 Plug-in 基于 eclipse3.1 Flex 2.0 Soft Downloads: http://www.adobe.com ...
flash 8或flex 2.0+.net web service做在线大头贴，完善中！
flash中的代码: 在舞台上放上一个视频元件,大小是160×120,名字为mybox.再放一个button按扭,名字为photo_btn,第一桢代码如下: 1 import mx.data.com ...
flex 3.0序列号
1377-4167-7117-9920-1795-1576 1377-4569-7800-6245-2886-1142 1377-4168-1953-1522-6349-2789 1377-4369- ...
[转载]Flex 2.0 实现SWF全屏
要求:FlashPlayer版本为version 9,0,28,0或更高 1:在flex中拖一个Button到场景, 设置: id="mybtn" click="full ...
flex 的三个参数 flex:1 0 auto
flex属性是 flex-grow.flex-shrink.flex-basis三个属性的缩写. flex-grow:定义项目的的放大比例: 默认为0,即即使存在剩余空间,也不会放大: 所有项目的 ...
FLEX AS3.0 百度地图
window xp系统 FlashBuilder4.5 先上百度下载flash api 下载地址http://developer.baidu.com/map/flash.htm 新建一个flex项目 ...

flex 4.0 滤镜效果.

flex 4.0 滤镜效果.相关推荐

最新文章

热门文章