第09章节使用图片-滑块-.pptVIP

9.1 使用图片 如果需要在页面中显示图片，可以使用Flex的图片控件（Image Control），如图所示。Flex的图片组件支持常用的图片格式，包括GIF、JPEG、PNG、SVG和SWF格式。 9.1.1 图片来源 在图片控件中，支持3种图片来源：本地文件、远程文件和内置文件。 1.本地文件 本地文件即Flex运行的本地文件目录中的图片。使用这类图片时，可以使用完整的文件地址，或者相对文件地址，例如图9.1的图片位于C盘的Documents and Settings\user\My Documents\My Pictures中，则图片地址为C:\Documents and Settings\user\My Documents\My Pictures\a.jpg。 2.远程文件 远程文件指不在本地文件系统上的文件。在Flex中，可以通过HTTP协议获得远程机器上的图片资源。例如:8080/flex/source/a.jpg。 3.内置文件 内置文件指加载在页面中的文件。应用文件编译后，图片做为页面SWF的一部分内容。与上面2种图片来源不同，使用内置文件，可以更快的获得图片，从而更迅速的显示页面。内置文件有自己的标识符“@Embed”。例如：@Embed(source=logo.jpg)指向与应用文件同级目录下logo.jpg。 9.1.2 创建图片控件 图片控件的标签为mx:Image。图片控件的主要属性为图片的地址，即source属性。在使用图片控件时，只需在需要的地方插入mx:Image，设置source属性即可。 mx:Panel title=图片控件例子 width=149 horizontalAlign=center mx:Image x=174 y=136 source=file:///C|/Documents and Settings/hj/My Documents/My Pictures/0001140010.gif /mx:Image /mx:Panel 上面的代码使用的是本地文件模式。 9.2 使用滑块 滑块控件（Slider Control）提供了一种动态选择数值的方式，如图所示。在google提供的地图功能中，常可以见到缩放地图大小的滑块，通过拖动滑块改变地图的大小。 9.2.1 滑块控件标签 滑块控件分为2种：水平滑块控件（HSlider Conrtrol）和垂直滑块控件（VSlider Control）。水平滑块控件对应的MXML标签为mx:HSlider。垂直滑块控件对应的为mx:VSlider，由于二者基本类似，这里以水平滑块为例介绍控件的属性。 在水平滑块控件中，坐标的显示、控件的标签名称等都是依靠控件的属性定义的。水平滑块的常用属性如表所示。 9.2.2 滑块控件的事件 在用户拖动滑块选择相应的数值时，滑块控件会发生的相应的事件。根据用户的操作，控件发生的事件如下所示。 change：当用户拖动滑块，滑块所指数值发生改变时发生的事件。当livingDragging属性为true时，用户拖动滑块，随着数值的不断改变，不断地触发该事件，为false时，只有滑块停止时才发生该事件。 thumbDrag：当用户拖动滑块时发生该事件。该事件总是与thumbPress一起发生的。 thumbPress：当用户鼠标单击滑块，滑块呈被单击状态时发生该事件。用户只有单击滑块才可以拖动滑块。 thumbRelease：当thumbPress事件发生后，用户松开鼠标，滑块成未单击状态时，触发该事件。 上述所有事件的事件对象类型均为mx.events.SliderEvent。 9.2.3 创建滑块控件 创建滑块控件时，首先要根据页面需求，在垂直滑块和水平滑块控件中选择合适的控件。确定滑块控件的类型后，使用mx:HSlider或者mx:VSlider标签，在界面合适的位置插入滑块。最后根据实际的要求定义滑块相应的属性和事件处理。 下面以垂直滑块控件为例，利用上一节的图片控件介绍如何创建滑块控件。图为利用滑块控件缩放图片的例子，该图是最初图片没有缩放的状态，在拖动滑块后，放大图片如图所示。 9.3 播放视频 视频文件在网络上流行很久了。在很多网站中，都有播放视频的功能，例如播放新闻、电影预告等。在Flex中同样提供了视频控件（VideoDisplay Control）播放图像和声音。视频控件如图中按钮上面的显示区域所示。 9.3.1 视频控件标签 视频控件对应的MXML标签为mx:VideoDisplay，该控件的常用属性如表所示。 9.3.2 视频控件的事件 在影片下载完毕、播放状态改变以及其他时，控件都会触发相应的事件，如下所示。 close：但影片下载完毕或者