Flash显示编程-ActionScript从入门到精通教程(六

时间:2017-04-25 09:17:10 ActionScript 我要投稿

Flash显示编程-ActionScript从入门到精通教程(六)

  ActionScript是Flash显示编程的基础,要想学好编程就需要学好ActionScript,那么要如何去学好呢?下面是阳光网整理的ActionScript从入门到精通教程

  Flash显示编程-ActionScript从入门到精通教程(六)

  ActionScript3.0中的显示编程用于处理出现在Adobe Flash Player 9的舞台上的元素。 本

  章介绍了有关处理屏幕元素的一些基本概念。

  每个应用程序都有一个由显示对象构成的层次结构,这个结构称为 “显示列表” 。

  显示列表包含应用程序中的所有可视元素。

  显示元素属于下列一个或多个组:

  ActionScript从入门到精通教程一:舞台

  舞台是包括显示对象的基础容器。每个应用程序都有一个 Stage 对象,其中包含所有的

  屏幕显示对象。舞台是顶级容器。

  每个 SWF 文件都有一个主类。当 Flash Player 在 HTML 页中打开 SWF 文件时, Flash Player 将调用该类的构造函数,所创

  建的实例(始终是一种显示对象)将添加为 Stage 对象的子级。

  SWF 文件的主类始终扩展Sprite类。

  【重要术语:阳光大学生网提示:这些术语是显示编程最必须的基础】

  Alpha:表示颜色中的透明度 (更准确地说,是不透明度)的颜色值。例如, Alpha 通道值为 60% 的颜色只显示其最大强度的 60%,即只有 40% 是透明的。

  位图图形 (Bitmap graphic):在计算机中定义为彩色像素网格(行和列)的图形。通常,位图图形包括数码照片和类似图像。

  混合模式 (Blending mode):指定两个重叠图像的内容应如何进行交互。通常,一个图像上面的另一个不透明图像会遮盖住下面的图像,因此根本看不到该图像;但是,不同的混合模式会导致图像颜色以不同方式混合在一起,因此,生成的内容是两个图像的某种组合形式。

  显示列表 (Display list):由 Flash Player 呈现为可见屏幕内容的显示对象的层次结构。舞台是显示列表的根,附加到舞台或其子级之一上的所有显示对象构成了显示列表 (即使并未实际呈现该对象,例如,如果它位于舞台边界以外) 。

  显示对象 (Display object):在 Flash Player 中表示某种类型的可视内容的对象。显示列表中只能包含显示对象,所有显示对象类是 DisplayObject 类的子类。

  显示对象容器 (Display object container):一种特殊类型的显示对象,除了(通常)具有其自己的可视表示形式以外,它还可以包含子显示对象。

  SWF 文件的主类 (Main class of the SWF file):为 SWF 文件中最外面的显示对象定义行为的类,从概念上讲,它是 SWF 文件本身的类。例如,在 Flash 创作环境中创建的 SWF 具有一个 “主时间轴”,它包含所有其它的时间轴; SWF 文件的主类是指将主时间轴作为其实例的类。

  蒙版 (Masking):一种将图像的某些部分隐藏起来 (或者相反,只允许显示图像的某些部分)的技术。图像的隐藏部分将变为透明,因此,将显示其下面的内容。此术语与画家的遮蔽胶带非常相似,遮蔽胶带用于防止将颜料喷到某些区域上。

  舞台 (Stage):一个可视容器,它是 SWF 文件中的所有可视内容的基础或背景。

  变形 (Transformation):对图形的可视特性进行的调整,如旋转对象、改变其缩放比例、倾斜或扭曲其形状或者改变其颜色。

  矢量图形 (Vector graphic):在计算机中定义为使用特定特性 (如粗细、长度、大小、角度以及位置)绘制的线条和形状的图形。

  ActionScript从入门到精通教程二:核心显示类

  该图说明了显示对象类的类继承。请注意,其中某些类,尤其是 StaticText、 TextField和

  Video 类,不在 flash.display 包中,但它们仍然是从 DisplayObject 类继承的。

  Bitmap — 使用 Bitmap 类可定义从外部文件加载或通过 ActionScript 呈现的位图对

  象。可以通过 Loader 类从外部文件加载位图。可以加载 GIF、JPG 或 PNG 文件。还

  可以创建包含自定义数据的 BitmapData 对象,然后创建使用该数据的 Bitmap 对象。可

  以使用 BitmapData 类的方法来更改位图,无论这些位图是加载的还是在 ActionScript

  中创建的。

  Loader — 使用 Loader 类可加载外部资源 (SWF 文件或图形) 。

  Shape — 使用 Shape 类可创建矢量图形,如矩形、直线、圆等。

  SimpleButton 对象是Flash按钮元件的ActionScript表示形式。SimpleButton 实例有3个按钮状态:弹起、按下和指针经过。

  Sprite — Sprite对象可以包含它自己的图形,还可以包含子显示对象。 (Sprite 类用于扩展 DisplayObjectContainer 类) 。

  MovieClip — MovieClip 对象是在 Flash 创作工具中创建的 ActionScript 形式的影片

  剪辑元件。实际上,MovieClip与Sprite对象类似,不同的是它还有一个时间轴。

  TextField 类包括在flash.text包中,它是用于文本显示和输入的显示对象。

  Video类包括在 flash.media包中,它是用于显示视频文件的显示对象。

  Stage类用于扩展DisplayObjectContainer类。有一个应用程序的Stage实例,该实例位于显示列表层次结构的顶部。

  ActionScript从入门到精通教程三:创建显示对象的子类

  import flash.display.*;

  private class CustomCircle extends Shape

  {

  var xPos:Number;

  var yPos:Number;

  var radius:Number;

  var color:uint;

  public function CustomCircle(xInput:Number,

  yInput:Number,

  rInput:Number,

  colorInput:uint)

  {

  xPos = xInput;

  yPos = yInput;

  radius = rInput;

  color = colorInput;

  this.graphics.beginFill(color);

  this.graphics.drawCircle(xPos, yPos, radius);

  }

  }

  DisplayObject 类的属性和方法

  所有显示对象都是 DisplayObject 类的子类,同样它们还会继承 DisplayObject 类的属性

  和方法。继承的属性是适用于所有显示对象的基本属性。例如,每个显示对象都有 x 属性和

  y 属性,用于指定对象在显示对象容器中的位置。

  在显示列表中添加显示对象

  实例化显示对象时,在将显示对象实例添加到显示列表上的显示对象容器之前,显示对象不

  会出现屏幕上(即在舞台上)。 例如,在下面的代码中,如果省略了最后一行代码,则myText

  TextField对象不可见。在最后一行代码中,this关键字必须引用已添加到显示列表中的显示对象容器。

  import flash.display.*;

  import flash.text.TextField;

  var myText:TextField = new TextField();

  myText.text = "Buenos dias.";

  this.addChild(myText);

  当在舞台上添加任何可视元素时,该元素会成为 Stage 对象的“子级” 。应用程序中加载的

  第一个 SWF 文件(例如,HTML 页中嵌入的文件)会自动添加为 Stage 的子级。它可以

  是扩展 Sprite 类的任何类型的对象。

  使用 addChildAt() 方法可以调整这些显示对象在容器中的分层。例如,请考虑使用以下

  ActionScript从入门到精通教程四:代码:

  ball_A = new Ball(0xFFCC00, "a");

  ball_A.name = "ball_A";

  ball_A.x = 20;

  ball_A.y = 20;

  container.addChild(ball_A);

  ball_B = new Ball(0xFFCC00, "b");

  ball_B.name = "ball_B";

  ball_B.x = 70;

  ball_B.y = 20;

  container.addChild(ball_B);

  ball_C = new Ball(0xFFCC00, "c");

  ball_C.name = "ball_C";

  ball_C.x = 40;

  ball_C.y = 60;

  container.addChildAt(ball_C, 1);

  执行此代码后,显示对象在 container DisplayObjectContainer 对象中的定位如下所示。

  请注意对象的分层。

  要重新将对象定位到显示列表的顶部, 只需重新将其添加到列表中。 例如,在前面的代码后,

  要将 ball_A 移到堆栈的顶部,请使用下面的代码行:

  container.addChild(ball_A);

  此代码可有效地将 ball_A 从它在 container 的显示列表中的位置删除,然后将它重新添加

  到列表的顶部,最终的结果是将它移到堆栈的顶部。

  可以使用 getChildAt() 方法来验证显示对象的图层顺序。getChildAt() 方法根据您向容

  器传递的索引编号返回容器的子对象。例如,下面的代码显示 container

  DisplayObjectContainer 对象的子级列表中不同位置的显示对象的名称:

  trace(container.getChildAt(0).name); // ball_A

  trace(container.getChildAt(1).name); // ball_C

  trace(container.getChildAt(2).name); // ball_B

  ActionScript从入门到精通教程五:控制舞台缩放比例

  StageScaleMode.EXACT_FIT 按比例缩放 SWF。

  StageScaleMode.SHOW_ALL 确定是否显示边框 (就像在标准电视上观看宽屏电影时显

  示的黑条) 。

  StageScaleMode.NO_BORDER 确定是否可以部分裁切内容。

  处理全屏模式

  使用全屏模式可令 SWF 填充查看器的整个显示器,没有任何边框、菜单栏等。Stage 类的

  displayState 属性用于切换 SWF 的全屏模式。可以将 displayState 属性设置为由

  flash.display.StageDisplayState 类中的常量定义的其中一个值。要打开全屏模式,请将

  displayState 设置为 StageDisplayState.FULL_SCREEN:

  // mySprite 是一个 Sprite 实例,已添加到显示列表中

  mySprite.stage.displayState = StageDisplayState.FULL_SCREEN;

  要退出全屏模式,请将 displayState 属性设置为 StageDisplayState.NORMAL:

  mySprite.stage.displayState = StageDisplayState.NORMAL;

  此外,用户可以通过将焦点切换到其它窗口或使用以下组合键之一来选择退出全屏模式:

  Esc(所有平台) 、Ctrl-W (Windows)、Command-W (Mac) 或 Alt-F4 (Windows)。

  全屏模式的舞台缩放行为与正常模式下的相同;缩放比例由 Stage 类的 scaleMode 属性控制。

  通常,如果将 scaleMode 属性设置为 StageScaleMode.NO_SCALE,则 Stage 的 stageWidth 和

  stageHeight 属性将发生更改,以反映由 SWF 占用的屏幕区域的大小 (在本例中为整个

  屏幕)。

  打开或关闭全屏模式时,可以使用 Stage 类的 fullScreen 事件来检测和响应。例如,进入

  或退出全屏模式时,您可能需要重新定位、添加或删除屏幕中的项目,如本例中所示:

  import flash.events.FullScreenEvent;

  function fullScreenRedraw(event:FullScreenEvent):void

  {

  if (event.fullScreen)

  {

  // 删除输入文本字段。

  // 添加关闭全屏模式的按钮。

  }

  else

  {

  // 重新添加输入文本字段。

  // 删除关闭全屏模式的按钮。

  }

  }

  mySprite.stage.addEventListener(FullScreenEvent.FULL_SCREEN,

  fullScreenRedraw);

  正如此代码所示,fullScreen 事件的事件对象是 flash.events.FullScreenEvent 类的实例,

  它包含指示是启用 (true) 还是禁用 (false) 全屏模式的 fullScreen 属性。

  在 ActionScript 中处理全屏模式时,需要记住以下注意事项:

  只能通过 ActionScript 响应鼠标单击 (包括右键单击)或按键才能启动全屏模式。

  对于有多个显示器的用户,SWF 内容将展开且只填充一个显示器。Flash Player 使用度

  量信息来确定哪个显示器包含 SWF 的最大部分内容,然后使用该显示器提供全屏模式。

  对于 HTML 页中嵌入的 SWF 文件,嵌入 Flash Player 的 HTML 代码必须包括名为

  allowFullScreen 且值为 true 的 param 标签和 embed 属性,如下所示:

  ...

  

  如果要在网页中使用 JavaScript 来生成 SWF 嵌入标签,则必须更改 JavaScript 以添加

  allowFullScreen param 标签和属性。例如,如果 HTML 页使用 AC_FL_RunContent()

  函数(由 Flex Builder 和 Flash 生成的 HTML 页使用),则应在该函数调用中添加

  allowFullScreen 参数,如下所示:

  AC_FL_RunContent(

  ...

  'allowFullScreen','true',

  ...

  ); //end AC code

  这不适用于在独立 Flash Player 中运行的 SWF 文件。

  在全屏模式下将禁用所有与键盘有关的 ActionScript,如 Te x tFi e ld 实例中的键盘事件

  和文本输入。用于关闭全屏模式的键盘快捷键除外。

  选择DisplayObject子类

  如果有多个可供选择的选项,处理显示对象时要作出的一个重要决策是:每个显示对象的用

  途是什么。 以下原则可以帮助您作出决策。 无论是需要类实例,还是选择要创建的类的基类,

  都可以应用这些建议:

  如果不需要可作为其它显示对象的容器的对象(即只需要用作独立屏幕元素的对象) ,请

  根据使用目的选择 DisplayObject 或 InteractiveObject 两个子类中的一个:

  用于显示位图图像的 Bitmap。

  用于添加文本的 TextField。

  用于显示视频的 Video。

  ■ 用于绘制屏幕内容的 “画布”的 Shape。特别是,如果要创建用于在屏幕上绘制形

  状的实例,而且该实例不是其它显示对象的容器,则使用 Shape 比使用 Sprite 或

  MovieClip 有明显的性能优势。

  ■ 用于 Flash 具体创作项的 MorphShape、StaticText 或 SimpleButton。 (无法以编

  程方式创建这些类的实例,但可以通过创建这些数据类型的变量来引用使用 Flash 创

  作程序创建的项目。 )

  ■ 如果需要使用变量来引用主舞台,请使用 Stage 类作为其数据类型。

  ■ 如果需要容器来加载外部 SWF 文件或图像文件,请使用 Loader 实例。加载的内容将作为

  Loader 实例的子级添加到显示列表中。其数据类型将取决于加载内容的性质,如下所示:

  ■ 加载的图像将是 Bitmap 实例。

  ■ 使用 ActionScript 3.0 编写的已加载 SWF 文件将是 Sprite 或 MovieClip 实例

  (或这些类的子类的实例,由内容创建者指定) 。

  ■ 使用 ActionScript 1.0 或 ActionScript 2.0 编写的已加载 SWF 文件将是

  AVM1Movie 实例。

  ■ 如果需要将一个对象用作其它显示对象的容器(无论是否还要使用 ActionScript 在显示

  对象上进行绘制) ,请选择其中一个 DisplayObjectContainer 子类:

  ■ 如果对象是只使用 ActionScript 创建的,或者如果对象作为只使用 ActionScript 创

  建和处理的自定义显示对象的基类,请选择 Sprite。

  ■ 如果要通过创建变量来引用在 Flash 创作工具中创建的影片剪辑元件,请选择 MovieClip。

  如果要创建的类与 Flash 库中的影片剪辑元件关联,请选择其中一个

  DisplayObjectContainer 子类作为该类的基类:

  如果关联的影片剪辑元件在多个帧上有内容,请选择MovieClip

  如果关联的影片剪辑元件仅在第一帧上有内容,请选择Sprite

  ActionScript从入门到精通教程六:处理显示对象

  显示对象,都会有许多的操作,例如,可以在屏幕上确定所有显示对象的位置、前后移动显示对象的堆叠顺序、缩放或旋转显示对象等。

  由于所有显示对象都从它们共有的基类 (DisplayObject)继承了此功能,因此无论是要处理 Te xtFi e ld 实例、Video 实例、Shape 实例还是其它任何

  显示对象,此功能的行为都相同。

  改变位置

  对任何显示对象进行的最基本操作是确定显示对象在屏幕上的位置。要设置显示对象的位

  置,请更改对象的 x 和 y 属性。

  myShape.x = 17;

  myShape.y = 212;

  显示对象定位系统将舞台视为一个笛卡尔坐标系(带有水平 x 轴和垂直 y 轴的常见网格系

  统) 。坐标系的原点(x 和 y 轴相交的 0,0 坐标)位于舞台的左上角。从原点开始,x 轴的

  值向右为正,向左为负,而 y 轴的值向下为正,向上为负(与典型的图形系统相反)。例如,

  通过前面的代码行可以将对象 myShape 移到 x 轴坐标 17(原点向右 17 个像素)和 y 轴坐

  标 212(原点向下 212 个像素) 。

  默认情况下,当使用 ActionScript 创建显示对象时,x 和 y 属性均设置为 0,从而可将对象

  放在其父内容的左上角

  // 创建 Sprite,确定的位置为 x:200 和 y:200。

  var mySprite:Sprite = new Sprite();

  mySprite.x = 200;

  mySprite.y = 200;

  this.addChild(mySprite);

  // 在 Sprite 的 0,0 坐标处绘制一个点作为参考。

  mySprite.graphics.lineStyle(1, 0x000000);

  mySprite.graphics.beginFill(0x000000);

  mySprite.graphics.moveTo(0, 0);

  mySprite.graphics.lineTo(1, 0);

  mySprite.graphics.lineTo(1, 1);

  mySprite.graphics.lineTo(0, 1);

  mySprite.graphics.endFill();

  // 创建圆 Shape 实例。

  var circle:Shape = new Shape();

  mySprite.addChild(circle);

  // 在 Shape 中绘制半径为 50 且中心点的 x 和 y 坐标均为 50 的圆。

  circle.graphics.lineStyle(1, 0x000000);

  circle.graphics.beginFill(0xff0000);

  circle.graphics.drawCircle(50, 50, 50);

  circle.graphics.endFill();

  // 移动 Shape,使其左上角位于舞台的 0, 0 坐标处。

  var stagePoint:Point = new Point(0, 0);

  var targetPoint:Point = mySprite.globalToLocal(stagePoint);

  circle.x = targetPoint.x;

  circle.y = targetPoint.y;

  同样,可以使用 DisplayObject 类的 localToGlobal() 方法将本地坐标转换为舞台坐标。

  下面的代码(摘自前面的示例)用于创建两个显示对象(圆和正方形)的拖放交互组件。只

  要在任一个显示对象上按下鼠标按键,该显示对象就会移到舞台显示列表的顶部,所以拖动

  的项目始终出现在顶部。

  import flash.display.DisplayObject;

  import flash.events.MouseEvent;

  var offsetX:Number;

  var offsetY:Number;

  var draggedObject:DisplayObject;

  // 按下鼠标按键时会调用此函数。

  function startDragging(event:MouseEvent):void

  {

  // 记住正在拖动的对象

  draggedObject = DisplayObject(event.target);

  // 记录按下鼠标按键时光标的位置

  // 与按下鼠标按键时拖动的对象的 x, y 坐标

  // 之间的差异 (偏移量)。

  offsetX = event.stageX - draggedObject.x;

  offsetY = event.stageY - draggedObject.y;

  // 将所选对象移到显示列表的顶部

  stage.addChild(draggedObject);

  // 通知 Flash Player 开始侦听 mouseMove 事件。

  stage.addEventListener(MouseEvent.MOUSE_MOVE, dragObject);

  }

  // 松开鼠标按键时会调用此函数。

  function stopDragging(event:MouseEvent):void

  {

  // 通知 Flash Player 停止侦听 mouseMove 事件。

  stage.removeEventListener(MouseEvent.MOUSE_MOVE, dragObject);

  }

  // 只要按下鼠标按键,

  // 每次移动鼠标时都会调用此函数。

  function dragObject(event:MouseEvent):void

  {

  // 将拖动的对象移到光标的位置,从而保持

  // 光标的位置和拖动的对象的位置

  // 之间的偏移量。

  draggedObject.x = event.stageX - offsetX;

  draggedObject.y = event.stageY - offsetY;

  // 指示 Flash Player 在此事件后刷新屏幕。

  event.updateAfterEvent();

  }

  circle.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);

  circle.addEventListener(MouseEvent.MOUSE_UP, stopDragging);

  square.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);

  square.addEventListener(MouseEvent.MOUSE_UP, stopDragging);

  平移和滚动显示对象

  scrollRect 属性是 Rectangle 类的实例, Rectangle 类包括将矩形区域定义为单个对象所

  需的有关值。最初定义显示对象的可查看区域时,请创建一个新的 Rectangle 实例并为该实

  例分配显示对象的 scrollRect 属性。

  例如,下面的代码定义了名为 bigText 的 Te x tFi e ld 对象的'可查看区域,该对象因太高而不

  能适合 SWF 文件的边界。单击名为 up 和 down 的两个按钮时,它们调用的函数通过修改

  scrollRect Rectangle 实例的 y 属性而使 Te x tFi e l d 对象的内容向上或向下滚动。

  import flash.events.MouseEvent;

  import flash.geom.Rectangle;

  // 定义 TextField 实例的最初可查看区域:

  // 左:0,上:0,宽度:TextField 的宽度,高度:350 个像素。

  bigText.scrollRect = new Rectangle(0, 0, bigText.width, 350);

  // 将 TextField 作为位图缓存以提高性能。

  bigText.cacheAsBitmap = true;

  // 单击 “向上”按钮时调用

  function scrollUp(event:MouseEvent):void

  {

  // 访问当前滚动矩形。

  var rect:Rectangle = bigText.scrollRect;

  // 将矩形的 y 值减小 20,

  // 从而使矩形有效下移 20 个像素。

  rect.y -= 20;

  // 将矩形重新分配给 TextField 以 “应用”更改。

  bigText.scrollRect = rect;

  }

  // 单击 “向下”按钮时调用

  function scrollDown(event:MouseEvent):void

  {

  // 访问当前滚动矩形。

  var rect:Rectangle = bigText.scrollRect;

  // 将矩形的 y 值增加 20,

  // 从而使矩形有效上移 20 个像素。

  rect.y += 20;

  // 将矩形重新分配给 TextField 以 “应用”更改。

  bigText.scrollRect = rect;

  }

  up.addEventListener(MouseEvent.CLICK, scrollUp);

  down.addEventListener(MouseEvent.CLICK, scrollDown);

  正如本示例所示,使用显示对象的 scrollRect 属性时,最好指定 Flash Player 应使用

  cacheAsBitmap 属性将显示对象的内容作为位图来缓存。如果这样做了,每次滚动显示对象

  时,Flash Player 就不必重绘显示对象的整个内容,而可以改为使用缓存的位图将所需部分

  直接呈现到屏幕上。

  处理大小和缩放对象

  您可以采用两种方法来测量和处理显示对象的大小:使用尺寸属性(width 和 height)或

  缩放属性 (scaleX 和 scaleY) 。

  每个显示对象都有 width 属性和 height 属性,它们最初设置为对象的大小,以像素为单

  位。您可以通过读取这些属性的值来确定显示对象的大小。还可以指定新值来更改对象的大

  小,如下所示:

  // 调整显示对象的大小。

  square.width = 420;

  square.height = 420;

  // 确定圆显示对象的半径。

  var radius:Number = circle.width / 2;

  应用混合模式

  应用混合模式

  混合模式涉及将一个图像(基图像)的颜色与另一个图像(混合图像)的颜色进行组合来生

  成第三个图像,结果图像是实际在屏幕上显示的图像。图像中的每个像素值都与另一个图像

  的对应像素值一起处理的,以便为结果图像中的相同位置生成像素值。

  每个显示对象都有 blendMode 属性, 可以将其设置为下列混合模式之一。 以下是在 BlendMode

  类中定义的常量。此外,还可以使用 String 值(在括号中) ,这些值是常量的实际值。

  ■ BlendMode.ADD ("add"):通常用于创建两个图像之间的动画变亮模糊效果。

  ■ BlendMode.ALPHA ("alpha"):通常用于在背景上应用前景的透明度。

  ■ BlendMode.DARKEN ("darken"):通常用于重叠类型。

  ■ BlendMode.DIFFERENCE ("difference"):通常用于创建更多变动的颜色。

  ■ BlendMode.ERASE ("erase"):通常用于使用前景 Alpha 剪掉 (擦除)背景的一部分。

  ■ BlendMode.HARDLIGHT ("hardlight"):通常用于创建阴影效果。

  ■ BlendMode.INVERT ("invert"):用于反转背景。

  ■ BlendMode.LAYER ("layer"):用于强制为特定显示对象的预构成创建临时缓冲区。

  ■ BlendMode.LIGHTEN ("lighten"):通常用于重叠类型。

  ■ BlendMode.MULTIPLY ("multiply"):通常用于创建阴影和深度效果。

  ■ BlendMode.NORMAL ("normal"):用于指定混合图像的像素值覆盖基本图像的像素值。

  ■ BlendMode.OVERLAY ("overlay"):通常用于创建阴影效果。

  ■ BlendMode.SCREEN ("screen"):通常用于创建亮点和镜头眩光。

  ■ BlendMode.SUBTRACT ("subtract"):通常用于创建两个图像之间的动画变暗模糊效果。

  调整 DisplayObject 颜色

  可以使用 ColorTransform 类的方法 (flash.geom.ColorTransform) 来调整显示对象的颜

  色。每个显示对象都有 transform 属性(它是 Tr ans f o rm 类的实例),还包含有关应用到

  显示对象的各种变形的信息 (如旋转、缩放或位置的更改等) 。除了有关几何变形的信息之

  外,Tr an s f orm 类还包括 colorTransform 属性,它是 ColorTransform 类的实例,并提供

  访问来对显示对象进行颜色调整。要访问显示对象的颜色转换信息,可以使用如下代码:

  var colorInfo:ColorTransform = myDisplayObject.transform.colorTransform;

  创建 ColorTransform 实例后,可以通过读取其属性值来查明已应用了哪些颜色转换,也可

  以通过设置这些值来更改显示对象的颜色。要在进行任何更改后更新显示对象,必须将

  ColorTransform 实例重新分配给 transform.colorTransform 属性。

  var colorInfo:ColorTransform = my DisplayObject.transform.colorTransform;

  // 此处进行某些颜色转换。

  // 提交更改。

  myDisplayObject.transform.colorTransform = colorInfo;

  使用代码设置颜色值

  ColorTransform 类的 color 属性可用于为显示对象分配具体的红、 绿、蓝 (RGB) 颜色值。

  在下面的示例中,当用户单击名为 blueBtn 的按钮时,将使用 color 属性将名为 square 的

  显示对象的颜色更改为蓝色:

  // square 是舞台上的一个显示对象。

  // blueBtn、 redBtn、 greenBtn 和 blackBtn 是舞台上的按钮。

  import flash.events.MouseEvent;

  import flash.geom.ColorTransform;

  // 访问与 square 关联的 ColorTransform 实例。

  var colorInfo:ColorTransform = square.transform.colorTransform;

  // 单击 blueBtn 时会调用此函数。

  function makeBlue(event:MouseEvent):void

  {

  // 设置 ColorTransform 对象的颜色。

  colorInfo.color = 0x003399;

  // 将更改应用于显示对象

  square.transform.colorTransform = colorInfo;

  }

  blueBtn.addEventListener(MouseEvent.CLICK, makeBlue);

  请注意,使用 color 属性更改显示对象的颜色时,将会完全更改整个对象的颜色,无论该对

  象以前是否有多种颜色。例如,如果某个显示对象包含一个顶部有黑色文本的绿色圆,将该

  对象的关联 ColorTransform 实例的 color 属性设置为红色阴影时,会使整个对象(圆和

  文本)变为红色 (因此无法再将文本与对象的其余部分区分开来) 。

  下面的代码加载一个 JPEG 图像并为其应用颜色转换, 当鼠标指针沿 x 轴和 y 轴移动时,将

  调整红色和绿色通道值。在本例中,由于未指定偏移值,因此屏幕上显示的每个颜色通道的

  颜色值将表示图像中原始颜色值的一个百分比,这意味着任何给定像素上显示的大部分红色

  或绿色都是该像素上红色或绿色的原始效果。

  import flash.display.Loader;

  import flash.events.MouseEvent;

  import flash.geom.Transform;

  import flash.geom.ColorTransform;

  import flash.net.URLRequest;

  // 将图像加载到舞台上。

  var loader:Loader = new Loader();

  var url:URLRequest = new URLRequest("http://www.helpexamples.com/flash/

  images/image1.jpg");

  loader.load(url);

  this.addChild(loader);

  // 当鼠标移过加载的图像时会调用此函数。

  function adjustColor(event:MouseEvent):void

  {

  // 访问 Loader 的 ColorTransform 对象 (包含图像)

  var colorTransformer:ColorTransform = loader.transform.colorTransform;

  // 根据鼠标位置设置红色和绿色乘数。

  // 红色值的范围从 0%(无红色)(当光标位于左侧时)

  // 到 100% 红色 (正常图像外观)(当光标位于右侧时)。

  // 这同样适用于绿色通道,不同的是它由

  // y 轴中鼠标的位置控制。

  colorTransformer.redMultiplier = (loader.mouseX / loader.width) * 1;

  colorTransformer.greenMultiplier = (loader.mouseY / loader.height) * 1;

  // 将更改应用到显示对象。

  loader.transform.colorTransform = colorTransformer;

  }

  loader.addEventListener(MouseEvent.MOUSE_MOVE, adjustColor);

  旋转对象

  使用 rotation 属性可以旋转显示对象。可以通过读取此值来了解是否旋转了某个对象,如

  果要旋转该对象,可以将此属性设置为一个数字 (以度为单位) ,表示要应用于该对象的旋

  转量。例如,下面的代码行将名为 square 的对象旋转 45 度 (一整周旋转的 1/8):

  square.rotation = 45;

  淡化对象

  可以通过控制显示对象的透明度来使显示对象部分透明 (或完全透明) ,也可以通过更改透

  明度来使对象淡入或淡出。DisplayObject 类的 alpha 属性用于定义显示对象的透明度(更

  确切地说是不透明度)。可以将 alpha 属性设置为介于 0 和 1 之间的任何值,其中 0 表示

  完全透明, 1 表示完全不透明。例如,当使用鼠标单击名为 myBall 的对象时,下面的代码

  行将使该对象变得部分 (50%) 透明:

  function fadeBall(event:MouseEvent):void

  {

  myBall.alpha = .5;

  }

  myBall.addEventListener(MouseEvent.CLICK, fadeBall);

  还可以使用通过 ColorTransform 类提供的颜色调整来更改显示对象的透明度。

  遮罩显示对象

  可以通过将一个显示对象用作遮罩来创建一个孔洞,透过该孔洞使另一个显示对象的内容

  可见。

  定义遮罩

  要指明一个显示对象将是另一个显示对象的遮罩, 请将遮罩对象设置为被遮罩的显示对象的

  mask 属性:

  // 使对象 maskSprite 成为对象 mySprite 的遮罩。

  mySprite.mask = maskSprite;

  被遮罩的显示对象显示在用作遮罩的显示对象的全部不透明区域之内。

  例如,下面的代码将

  创建一个包含 100 x 100 个像素的红色正方形的 Shape 实例和一个包含半径为 25 个像素

  的蓝色圆的 Sprite 实例。单击圆时,它被设置为正方形的遮罩,所以显示的正方形部分只是

  由圆完整部分覆盖的那一部分。换句话说,只有红色圆可见。

  // 以下代码假设它正在显示对象容器

  //(如 MovieClip 或 Sprite 实例)中运行。

  import flash.display.Shape;

  // 绘制正方形并将其添加到显示列表中。

  var square:Shape = new Shape();

  square.graphics.lineStyle(1, 0x000000);

  square.graphics.beginFill(0xff0000);

  square.graphics.drawRect(0, 0, 100, 100);

  square.graphics.endFill();

  this.addChild(square);

  // 绘制圆并将其添加到显示列表中。

  var circle:Sprite = new Sprite();

  circle.graphics.lineStyle(1, 0x000000);

  circle.graphics.beginFill(0x0000ff);

  circle.graphics.drawCircle(25, 25, 25);

  circle.graphics.endFill();

  this.addChild(circle);

  function maskSquare(event:MouseEvent):void

  {

  square.mask = circle;

  circle.removeEventListener(MouseEvent.CLICK, maskSquare);

  }

  circle.addEventListener(MouseEvent.CLICK, maskSquare);

  在下面的示例中,将在舞台上创建一个名为 circle 的圆 Sprite 实例。当用户单击圆时,脚

  本动画序列开始,从而使 circle 淡化 (其 alpha 属性值减少) ,直到完全透明:

  import flash.display.Sprite;

  import flash.events.Event;

  import flash.events.MouseEvent;

  // 绘制圆并将其添加到显示列表中

  var circle:Sprite = new Sprite();

  circle.graphics.beginFill(0x990000);

  circle.graphics.drawCircle(50, 50, 50);

  circle.graphics.endFill();

  addChild(circle);

  // 此动画开始后,每一帧都会调用此函数。

  // 此函数进行的更改

  //(每一帧都会更新屏幕)将导致产生动画效果。

  function fadeCircle(event:Event):void

  {

  circle.alpha -= .05;

  if (circle.alpha <= 0)

  {

  circle.removeEventListener(Event.ENTER_FRAME, fadeCircle);

  }

  }

  function startAnimation(event:MouseEvent):void

  {

  circle.addEventListener(Event.ENTER_FRAME, fadeCircle);

  }

  circle.addEventListener(MouseEvent.CLICK, startAnimation);

  当用户单击圆时,将函数 fadeCircle() 订阅为 enterFrame 事件的侦听器,这意味着每一

  帧都会开始调用一次该函数。通过更改 circle 的 alpha 属性,该函数会淡化圆,因此对于

  每个帧,圆的 alpha 一次减少 .05 (5%) ,并且更新屏幕。最后,当 alpha 值为 0(circle

  完全透明)时,fadeCircle() 函数作为事件侦听器将被删除,从而结束动画。

  以上代码还可用来创建动画运动而不是淡化。通过用不同属性替换函数中表示 enterFrame

  事件侦听器的 alpha,就可获得该属性的动画效果。例如,将以下行

  circle.alpha -= .05;

  更改为以下代码

  circle.x += 5;

  将获得 x 属性的动画效果,从而使圆在舞台上移到右侧。当到达需要的 x 坐标时,通过更改

  结束动画的条件就可结束动画 (即取消订阅 enterFrame 侦听器) 。

  加载显示对象

  Loader 对象用于将 SWF 文件和图形文件加载到应用程序中。 Loader 类是

  DisplayObjectContainer 类的子类。 Loader 对象在其显示列表中只能包含一个子显示对

  象,该显示对象表示它加载的 SWF 或图形文件。如下面的代码所示,在显示列表中添加

  Loader 对象时,还可以在加载后将加载的子显示对象添加到显示列表中:

  var pictLdr:Loader = new Loader();

  var pictURL:String = "banana.jpg"

  var pictURLReq:URLRequest = new URLRequest(pictURL);

  pictLdr.load(pictURLReq);

  this.addChild(pictLdr);

  加载 SWF 文件或图像后,即可将加载的显示对象移到另一个显示对象容器中,例如本示例

  中的 container DisplayObjectContainer 对象:

  import flash.display.*;

  import flash.net.URLRequest;

  import flash.events.Event;

  var container:Sprite = new Sprite();

  addChild(container);

  var pictLdr:Loader = new Loader();

  var pictURL:String = "banana.jpg"

  var pictURLReq:URLRequest = new URLRequest(pictURL);

  pictLdr.load(pictURLReq);

  pictLdr.contentLoaderInfo.addEventListener(Event.COMPLETE, imgLoaded);

  function imgLoaded(event:Event):void

  {

  container.addChild(pictLdr.content);

  }

  监视加载进度

  文件开始加载后,就创建了 LoaderInfo 对象。LoaderInfo 对象用于提供加载进度、加载者

  和被加载者的 URL、媒体的字节总数及媒体的标称高度和宽度等信息。LoaderInfo 对象还

  调度用于监视加载进度的事件。

【Flash显示编程-ActionScript从入门到精通教程(六)】相关文章:

1.ActionScript从入门到高手教程全集(六) 事件处理

2.学做西餐从入门到精通的教程

3.Flash ActionScript3.0快速入门教程

4.Flash ActionScript3.0入门教程全集

5.Powerpoint 2010视频教程「PPT从入门到精通」

6.ActionScript从入门到高手教程全集(四)错误处理

7.ActionScript从入门到高手教程全集(七)几何相关的类

8.「Flash ActionScript3.0经典入门教程」-全九集-ActionScript教