Flex3为开发人员提供了多种基本的特效控件,每种特效控件对应一种或多种显示效果,把这些控件进行有机配合,可以形成丰富的感官效果,大大提高用户体验。
在Flex3中实现特效的原理比较简单,主要涉及三个步骤:
一、确定控件的触发器
每种控件都预定义有一组属性,用于表示该控件在某类事件发生之后随之表现出来的特效,这些属性称为“触发器”。要为某个控件添加特效,第一步必须要确定是为该控件的哪种事件添加特效,即确定选用哪一种触发器。
二、定义特效类控件
确定触发器之后,就要确定究竟要表现出何种特效。由于特效的载体是具体的特效类组件,所以第二步要做的就是定义好特效类控件,可以定义单个的特效类控件,也可以通过顺序和并行两种方式组合多个特效类控件。
三、关联触发器和特效类控件
第三步把触发器指向定义好的特效类控件。可以采用Flex3的数据绑定技术,即把定义好的特效类控件作为触发器属性的值,也可以通过ActionScript函数进行关联,前者的触发器名称一般有Effect后缀,而后者一般没有。这样,设置完成后,当出现触发器所定义的事件时,将触发出某种特效。
下面以控件为例进行简单说明:
在上述代码中,我们要为Canvas控件添加Move特效。所表现出来的效果:在Canvas上单击鼠标左键,则Canvas上的Image将相应地移动。
第一步要先确定“触发器”,在此例子中,我们要求单击鼠标后出现特效,所以“触发器”选定为Canvas中的mouseDown。第二步定义特效类控件,在这里定义的是Move特效类,即代码中的<mx:Move id="myMove" target="{img}"/>。第三步关联触发器和特效类控件,在这里使用的是ActionScript函数private function moveImage():void。然后把对此函数的调用作为mouseDown属性的值。