1、Flex之特效详解此文除了特效接口，触发，后面还有相关特效的详解代码本文和大家重点讨论一下Flex特效，Flex的行为机制使得开发者可以很方便地为应用程序添加动画效果，从而使用户界面更加丰富多彩。本文将介绍如何在Flex应用程序中创建行为及动画效果。Flex特效讲解Flex的行为机制使得开发者可以很方便地为应用程序添加动画效果，从而使用户界面更加丰富多彩。本章将介绍如何在Flex应用程序中创建行为及动画效果。1.什么是Flex行为Flex中的行为（Behavior）是由触发器（Trigger）和效果（Effect）组合而成。当用户在界面中进行某项操作时，如单击某个按钮，触发器会被激活，从而使目
2、标组件发生某些视觉或听觉上的变化，例如播放一段逐渐显示的动画或发出声响等。触发器可以由用户操作触发，也可以由程序触发，一个触发器可以对应多个效果。1.1触发器与效果触发器的使用非常简单，可以作为MXML标记中的一个属性，也可以在标记中调用，或者在ActionScript中用setStyle()和getStyle()方法调用。触发器的名称为triggerEvent名称+“Effect”后缀。按照这种名称约定，mouseDown事件的触发器名称为mouseDownEffect。Flex中提供的触发器名称包括以下几种。laddedEffect：当组件添加到容器中时触发。lcreationComple
3、teEffect：组件创建完毕时触发。lfocusInEffect：组件获得焦点时触发。lfocusOutEffect：组件失去焦点时触发。lhideEffect：当组件的visible属性更改为false时触发。lmouseDownEffect：按下鼠标时触发。lmouseUpEffect：释放鼠标时触发。lmoveEffect：组件移动时触发。lremovedEffect：组件被移除时触发。lresizeEffect：组件改变大小时触发。lrollOutEffect：鼠标从组件上移开时触发。lrollOverEffect：鼠标移动到组件上时触发。lshowEffect：组件的visible
4、属性更改为true时触发。Flex的动画效果由一个工厂类（Factory）和一个实例类（Instance）构成。工厂类用来处理事件、控制动画，它的名称就是效果的名称，如Zoom。通常我们在应用程序中创建一个工厂类的实例，设置必要的参数，然后将该实例与触发器关联。实例类则用来实现动画效果，当触发器被触发或调用play()方法时，工厂类创建一个实例类的实例来播放所需效果，执行结束后，该实例会被销毁，如果一个效果对应多个目标对象，每一个目标对象都会有一个自己的实例。实例类的命名规则为效果名+Instance。如之前定义的工厂类名为Zoom，那么实例类名就是ZoomInstance。Effect的这种
5、机制，是设计模式中工厂模式的一种应用，效果执行的时候，运行的不是Zoom，而是ZoomInstance。下面的图9-1分别表现了工厂类和实例类的层级关系。Effect类是一个抽象基类，是定义所有效果的基本工厂类。EffectInstance类是定义所有效果实例子类的基类。在应用程序中不会创建Effect类本身的实例，而是创建一个子类的实例，如Mask或Tween。图9-1工厂类与实例类2. mx.effectsmx.effects接口接口说明IAbstractEffectIAbstractEffect 接口用于指示某个属性或参数必须属于类型 Effect，但实际不实现 IEffect 接口的任
6、何 API。IEffectIEffect 接口定义所有 Flex 效果的基本接口。IEffectInstanceIEffectInstance 接口代表在目标上播放的效果实例。IEffectTargetHostIEffectTargetHost 接口定义允许您访问数据效果的基于目标 list 控件的接口。类类说明AddChildActionAddChildAction 类定义对应于视图状态定义的 AddChild 属性的动作效果。AddItemActionAddItemAction 类定义确定项目渲染器何时显示在控件中的动作效果，该动作效果针对添加到基于列表的控件（如 List 或 TileL
7、ist）的项目或替换控件中现有项目的项目。AnimatePropertyAnimateProperty 效果可为组件的属性或样式设置动画效果。Blur通过 Blur 效果，您可以对组件应用模糊视觉效果。CompositeEffectCompositeEffect 类是 Parallel 类和 Sequence 类的父类，这两个类定义 和 MXML 标签。DefaultListEffectDefaultListEffect 类可定义当数据提供程序中的数据发生更改时应用于 List 控件的项目渲染器的默认效果。DefaultTileListEffectDefaultTileListEffect 类
8、定义当数据提供程序中的数据发生更改时，应用于 TileList 控件的项目渲染器的默认效果。Dissolve将组件的动画效果设置为从透明到不透明，或从不透明到透明。EffectEffect 类是一个抽象基类，用于定义所有 Flex 效果的基本功能。EffectInstanceEffectInstance 类代表在目标上播放的效果实例。EffectManagerEffectManager 类侦听由 Flex 应用程序中的对象调度的事件，如 show 和 move 事件。EffectTargetFilterEffectTargetFilter 类定义每个效果目标上的每个过渡效果执行的自定义滤镜。F
9、ade淡入淡出效果可设置组件的 alpha 属性的动画效果（从透明到不透明或从不透明到透明）。Glow通过 Glow 效果，您可以对组件应用视觉 glow 效果。IrisIris 效果通过扩展或收缩集中在目标上的矩形遮罩为效果目标设置动画。MaskEffectMaskEffect 类是所有设置遮罩动画的效果的抽象基类，如划出效果和 Iris 效果。MoveMove 效果在指定的时间间隔内随时间更改组件的位置。ParallelParallel 效果同时播放多个子效果。PausePause 效果在对效果进行排序时很有用。RemoveChildActionRemoveChildAction 类可定义
10、与视图状态定义的 RemoveChild 属性对应的动作效果。RemoveItemActionRemoveItemAction 可定义一个动作效果，用于确定何时由于从基于列表的控件（如 List 或 TileList）中删除了某个项目的项目渲染器，或某个项目被添加到控件中的新项目取代，其项目渲染器从控件中消失。ResizeResize 效果在指定的时间间隔更改组件的宽度或高度，或同时更改这两者。RotateRotate 效果可围绕指定的点旋转组件。SequenceSequence 效果以子效果的添加顺序依次播放多个子效果。SetPropertyActionSetPropertyAction 类
11、可定义与视图状态定义的 SetProperty 属性相对应的动作效果。SetStyleActionSetStyleAction 类定义对应于视图状态定义的 SetStyle 属性的动画效果。SoundEffectSoundEffect 类用于播放 MP3 音频文件。TweenTween 类定义一个补间，此补间是于某个时段内在目标对象上执行的属性动画。TweenEffectTweenEffect 类是基于 Tween 对象的所有效果的 superclass。UnconstrainItemActionUnconstrainItemAction 类可定义一个动作效果，在数据效果定义中将使用此效果暂时
12、停止通过父级控件的布局算法定位项目渲染器。WipeDownWipeDown 类定义条形向下擦除效果。WipeLeftWipeLeft 类可定义条形向左擦除效果。WipeRightWipeRight 类定义条形向右擦除效果。WipeUpWipeUp 类定义线条向上划出的效果。ZoomZoom 效果放大或缩小中心点上的对象。mx.effects.easing类类说明BackBack 类可以定义三个缓动函数，以使用 Flex 效果类实现运动。BounceBounce 类可以定义三个缓动函数，以便使用 Flex 效果类实现回弹运动。CircularCircular 类可以定义三个缓动函数，以使用 Fl
13、ex 效果类实现 circular 运动。CubicCubic 类可以定义三个缓动函数，以便使用 Flex 效果类实现运动。ElasticElastc 类可以定义三个缓动函数，以便使用 Flex 效果类实现运动，其中的运动由按指数方式衰减的正弦波来定义。ExponentialExponential 类可以定义三个缓动函数，以便使用 Flex 效果类实现运动，其中的运动由按指数方式衰减的正弦波来定义。LinearLinear 类可以定义缓动函数，以便使用 Flex 效果类实现线性运动。QuadraticQuadratic 类可以定义三个缓动函数，以使用 Flex 效果类实现 quadratic
14、运动。QuarticQuartic 类可以定义三个缓动函数，以使用 Flex 效果类实现运动。QuinticQuintic 类可以定义三个缓动函数，以便使用 Flex 效果类实现运动。SineSine 类可以定义三个缓动函数，以便使用 Flex 效果类实现运动，其中的运动由正弦波定义。mx.effects.effectClasses类类说明ActionEffectInstanceActionEffectInstance 类是所有操作效果实例类的 superclass。AddChildActionInstanceAddChildActionInstance 类用于实现 AddChildActio
15、n 效果的实例类。AddItemActionInstanceAddItemActionInstance 类用于实现 AddItemAction 效果的实例类。AnimatePropertyInstanceAnimatePropertyInstance 类用于实现 AnimateProperty 效果的实例类。BlurInstanceBlurInstance 类用于实现 Blur 效果的实例类。CompositeEffectInstanceCompositeEffectInstance 类用于实现 CompositeEffect 类的实例类。DissolveInstanceDissolveIns
16、tance 类用于实现 Dissolve 效果的实例类。FadeInstanceFadeInstance 类用于实现 Fade 效果的实例类。GlowInstanceGlowInstance 类用于实现 Glow 效果的实例类。IrisInstanceIrisInstance 类用于实现 Iris 效果的实例类。MaskEffectInstanceMaskEffectInstance 类是一个抽象基类，用于实现 MaskEffect 类的实例类。MoveInstanceMoveInstance 类用于实现 Move 效果的实例类。ParallelInstanceParallelInstance
17、 类用于实现 Parallel 效果的实例类。PauseInstancePauseInstance 类用于实现 Pause 效果的实例类。PropertyChangesPropertyChanges 类用于为过渡的目标组件中的一组属性定义开始值和结束值。RemoveChildActionInstanceRemoveChildActionInstance 类用于实现 RemoveChildAction 效果的实例类。RemoveItemActionInstanceRemoveItemActionInstance 类用于实现 RemoveChildAction 效果的实例类。ResizeInsta
18、nceResizeInstance 类用于实现 Resize 效果的实例类。RotateInstanceRotateInstance 类用于实现 Rotate 效果的实例类。SequenceInstanceSequenceInstance 类用于实现 Sequence 效果的实例类。SetPropertyActionInstanceSetPropertyActionInstance 类用于实现 SetPropertyAction 效果的实例类。SetStyleActionInstanceSetStyleActionInstance 类用于实现 SetStyleAction 效果的实例类。Sou
19、ndEffectInstanceSoundEffectInstance 类用于实现 SoundEffect 效果的实例类。TweenEffectInstanceTweenEffectInstance 类用于实现 TweenEffect 的实例类。UnconstrainItemActionInstanceUnconstrainItemActionInstance 类用于实现 UnconstrainItemAction 效果的实例类。WipeDownInstanceWipeDownInstance 类用于实现 WipeDown 效果的实例类。WipeLeftInstanceWipeLeftInst
20、ance 类用于实现 WipeLeft 效果的实例类。WipeRightInstanceWipeRightInstance 类用于实现 WipeRight 效果的实例类。WipeUpInstanceWipeUpInstance 类用于实现 WipeUp 效果的实例类。ZoomInstanceZoomInstance 类用于实现 Zoom 效果的实例类。1.2简单效果组件 Flex中提供了丰富的效果组件。由于效果是一种根据时间渐变的过程，因此所有效果都具有duration属性，用来设置播放时间（以毫秒为单 位）。也可以通过设置repeatCount属性和repeatDelay属性，来分别控制效果
21、播放的次数和重复播放效果的时间间隔（以毫秒为单位）。如 果希望在触发器被触发后，延迟一段时间调用效果，可以使用startDelay属性。 1）Flex特效之AnimateProperty动画效果 AnimateProperty是用来为组件的属性或样式设置动画的效果。我们可以通过其property属性设定目标对象上需要设置动画效果的属 性，然后设置fromValue属性和toValue属性，为效果提供属性的起始值和结束值。例如下面的代码使用mouseDownEffect触发器， 当单击图片时，触发AnimateProperty效果，在1秒钟内，Image对象的scaleX属性由1变为2，被横向拉
22、伸。代码如下： 如果希望通过样式设置效果，可以将isStyle属性设置为ture，然后通过setStyle()方法设置目标对象的样式，从而达到设置效果的目的。2）Flex特效之Blur模糊效果 Blur是一种模糊效果。该效果使用了flash.filters.BlurFilter滤镜，如果对某个组件应用了Blur效果，就不能再对该组 件应用BlurFilter滤镜，也无法再次应用Blur效果。下面的代码通过Image对象的mouseDownEffect触发器触发Blur效果， 在1秒钟内，Image对象将逐渐变得模糊。代码如下： 3）Flex特效之Dissolve溶解效果Dissolve是一种溶
23、解效果。当效果开始播放时，将创建一个不透明的矩形，这个矩形悬浮在目标组件的上方，它的颜色由 Dissolve.color属性设置，此时透明度为“1.0-Dissolve.alphaFrom”。随着效果的播放，该矩形的alpha属性将从 (1.0-alphaFrom)逐渐变为“1.0alphaTo”，直到效果播放完成，矩形被销毁。如果目标对象是一个容器，那么Dissolve效果将应用于容器内部的内容区域。 下面的代码使用一个CheckBox对象设置Image的visible属性，通过hideEffect和showEffect触发器分别触发各自的Dissolve效果： 4）Flex特效之Fade淡
24、入淡出效果 Fade是一种淡入淡出效果，它通过设置组件的alpha属性来实现动画效果。当使用showEffect或hideEffect触发器设置 Fade效果时，如果省略了alphaFrom和alphaTo属性的值，那么在showEffect触发器上目标对象的透明度将从0变化到目标的当前 alpha值，而在hideEffect触发器上则会从当前的alpha值变化到0。如果要对字体使用Fade效果，必须使用嵌入字体。 下面的代码使用一个CheckBox对象设置Image的visible属性，通过hideEffect和showEffect触发器分别触发各自的Fade效果： 5）Flex特效之Glo
25、w发光效果 Glow是一种发光效果，该效果使用了flash.filters.GlowFilter滤镜类。如果对某个组件应用了Glow效果，就不能对该组 件应用GlowFilter滤镜，也无法再次应用Glow效果。下面的代码通过Image对象的mouseDownEffect触发器触发Glow效果： 6）Flex特效之Iris虹效果 Iris效果通过扩展或收缩集中在目标上的矩形遮罩为效果目标设置动画。该效果可以从目标的中心放大遮罩来显示目标，也可以向中心收缩遮罩来隐藏目 标。下面的代码使用一个CheckBox对象设置Image的visible属性，通过hideEffect和showEffect触发器分别触发各自的 Iris效果： 7）Flex特效之Move移动效果 Move效果用来实现移动动画。在给定时间内，组件的位置会随时间变化而变化。使用该效果通常需要用到以下几个属性。 xFrom和yFrom属性用来指定初始位置。
