第16章 Flex 4.0增强用户界面设计.pdfVIP

第16 章 增强用户界面设计 第 16 章 CHAPTER 增强用户界面设计 在设计应用程序模型时，默认的组件界面往往不能满足用户的要求。Flex 4.0 组件支持 自定义界面。从广义上讲，美化界面不仅包括组件静态外观，也包括组件的动态效果。本章 将为读者讲解Flex 4.0 中如何自定义效果美化界面。 16.1 自定义事件效果 自定义事件效果是指当组件的一个事件被触发，且这个事件允许有效果时，这个事件就可 以应用自定义的效果。在Flex 里这种效果触发器叫做“Behaviors ”。例如，按钮组件中在按下事 件时发生一种放大效果。本节将介绍如何自定义事件效果和Flex 4.0 中常用效果组件的介绍。 组件中一般都有许多效果触发器（Behaviors ）。例如，按钮组件中有MouseDownEffect 、 MouseOverEffect 、MouseOutEffect 等效果触发器。用户可以为这些事件添加自定义效果。其 语法如下： 组件 效果触发器={效果} 特定的组件都有其特殊的效果事件。在 MXML 编辑器的代码模式下编写组件时，经常 弹出代码提示，如图16-1 所示。 图16-1 代码提示 其中， 表示组件的属性， 表示组件的方法， 表示组件的效果触发器。Flex 4.0 中 提供了许多效果组件，如mx:WipeRight 、mx:WipeLeft等。其语法如下： 效果类 id=效果类id / 以下代码当按钮按下时，按钮组件从左向右显示。 ?xml version=1.0 encoding=utf-8? s:Application xmlns:fx=/mxml/2009 xmlns:s=library:///flex/spark xmlns:mx=library:///flex/halo 187 Flex 4.0 RIA 开发详解（第2 版） minWidth=1024 minHeight=768 fx:Declarations s:Wipe id=myWL direction=right duration=1000/ /fx:Declarations s:Button id=myButton mouseDownEffect={myWL} / /s:Application 每个特定的效果组件都有其用法和属性。本程序中s:Wipe组件的效果是擦除显示。其 中direction 属性表示运动的方向，duration 属性表示效果持续时间，单位为毫秒。 16.2 Spark 组件库的效果组件 相比较之前的Flex 3.0 ，在Flex 4.0 的Spark 组件库中，新增加了很多丰富的效果组件， 如表16-1 所示。 表 16-1 ActionScript 3.0 常用效果组件 类 名 效果说明 Wipe 擦拭效果 Rotate 旋转效果 Move 移动效果 Resize 改变大小效果 Fade 逐渐显示效果 Animate 各种效果组件都有各自独特的属性。定义效果组件的属性就可以制作出满足用户要求的 效果。 16.2.1 擦拭效果组件 Wipe Wipe 组件实现的是从上、下、左、右不同方向切换显示效果