[AS3]对象显示

DisplayObject

调整 DisplayObject 颜色：http://www.58css.cn/news/?506.html

内容摘要：可以使用 ColorTransform 类的方法 (flash.geom.ColorTransform) 来调整显示对象的颜色。每个显示对象都有 transform 属性（它是 Transform 类的实例），还包含有关应用到显示对象的各种变形的信息（如旋转、缩放或位置的更改等）...

可以使用 ColorTransform 类的方法 (flash.geom.ColorTransform) 来调整显示对象的颜色。每个显示对象都有 transform 属性（它是 Transform 类的实例），还包含有关应用到显示对象的各种变形的信息（如旋转、缩放或位置的更改等）。除了有关几何变形的信息之外，Transform 类还包括colorTransform 属性，它是 ColorTransform 类的实例，并提供访问来对显示对象进行颜色调整。要访问显示对象的颜色转换信息，可以使用如下代码：

var colorInfo:ColorTransform = myDisplayObject.transform.colorTransform;

创建 ColorTransform 实例后，可以通过读取其属性值来查明已应用了哪些颜色转换，也可以通过设置这些值来更改显示对象的颜色。要在进行任何更改后更新显示对象，必须将 ColorTransform 实例重新分配给transform.colorTransform 属性。

var colorInfo:ColorTransform = my DisplayObject.transform.colorTransform; 
 
// Make some color transformations here. 
 
// Commit the change. 
myDisplayObject.transform.colorTransform = colorInfo;

使用代码设置颜色值

ColorTransform 类的 color 属性可用于为显示对象分配具体的红、绿、蓝 (RGB) 颜色值。在下面的示例中，当用户单击名为blueBtn 的按钮时，将使用color 属性将名为 square 的显示对象的颜色更改为蓝色：

// square is a display object on the Stage. 
// blueBtn, redBtn, greenBtn, and blackBtn are buttons on the Stage. 
 
import flash.events.MouseEvent; 
import flash.geom.ColorTransform; 
 
// Get access to the ColorTransform instance associated with square. 
var colorInfo:ColorTransform = square.transform.colorTransform; 
 
// This function is called when blueBtn is clicked. 
function makeBlue(event:MouseEvent):void 
{ 
    // Set the color of the ColorTransform object. 
    colorInfo.color = 0x003399; 
    // apply the change to the display object 
    square.transform.colorTransform = colorInfo; 
} 
 
blueBtn.addEventListener(MouseEvent.CLICK, makeBlue);

请注意，使用 color 属性更改显示对象的颜色时，将会完全更改整个对象的颜色，无论该对象以前是否有多种颜色。例如，如果某个显示对象包含一个顶部有黑色文本的绿色圆，将该对象的关联 ColorTransform 实例的color 属性设置为红色阴影时，会使整个对象（圆和文本）变为红色（因此无法再将文本与该对象的其余部分区分开来）。

使用代码更改颜色和亮度效果

假设显示对象有多种颜色（例如，数码照片），但是您不想完全重新调整对象的颜色，只想根据现有颜色来调整显示对象的颜色。这种情况下，ColorTransform 类包括一组可用于进行此类调整的乘数属性和偏移属性。乘数属性的名分别为redMultiplier、greenMultiplier、blueMultiplier 和alphaMultiplier，它们的作用像彩色照片滤镜（或彩色太阳镜）一样，可以增强或削弱显示对象上的某些颜色。偏移属性（redOffset、greenOffset、blueOffset 和 alphaOffset）可用于额外增加对象上某种颜色的值，或用于指定特定颜色可以具有的最小值。

在“属性”检查器上的“颜色”弹出菜单中选择“高级”时，这些乘数和偏移属性与 Flash 创作工具中影片剪辑元件可用的高级颜色设置相同。

下面的代码加载一个 JPEG 图像并为其应用颜色转换，当鼠标指针沿 x 轴和 y 轴移动时，将调整红色和绿色通道值。在本例中，因为未指定偏移值，所以屏幕上显示的每个颜色通道的颜色值将表示图像中原始颜色值的一个百分比，这意味着任何给定像素上显示的大部分红色或绿色都是该像素上红色或绿色的原始效果。

import flash.display.Loader; 
import flash.events.MouseEvent; 
import flash.geom.Transform; 
import flash.geom.ColorTransform; 
import flash.net.URLRequest; 
 
// Load an image onto the Stage. 
var loader:Loader = new Loader(); 
var url:URLRequest = new URLRequest("http://www.helpexamples.com/flash/images/image1.jpg"); 
loader.load(url); 
this.addChild(loader); 
 
// This function is called when the mouse moves over the loaded image. 
function adjustColor(event:MouseEvent):void 
{ 
    // Access the ColorTransform object for the Loader (containing the image) 
    var colorTransformer:ColorTransform = loader.transform.colorTransform; 
     
    // Set the red and green multipliers according to the mouse position. 
    // The red value ranges from 0% (no red) when the cursor is at the left 
    // to 100% red (normal image appearance) when the cursor is at the right. 
    // The same applies to the green channel, except it's controlled by the 
    // position of the mouse in the y axis. 
    colorTransformer.redMultiplier = (loader.mouseX / loader.width) * 1; 
    colorTransformer.greenMultiplier = (loader.mouseY / loader.height) * 1; 
     
    // Apply the changes to the display object. 
    loader.transform.colorTransform = colorTransformer; 
} 
loader.addEventListener(MouseEvent.MOUSE_MOVE, adjustColor);

旋转对象：

内容摘要：使用 rotation 属性可以旋转显示对象。可以通过读取此值来了解是否旋转了某个对象，如果要旋转该对象，可以将此属性设置为一个数字（以度为单位），表示要应用于该对象的旋转量。例如，下面的代码行将名为 square 的对象旋转 45 度（一整周旋转的 1/8）：square.ro...

使用 rotation 属性可以旋转显示对象。可以通过读取此值来了解是否旋转了某个对象，如果要旋转该对象，可以将此属性设置为一个数字（以度为单位），表示要应用于该对象的旋转量。例如，下面的代码行将名为square 的对象旋转 45 度（一整周旋转的 1/8）：

square.rotation = 45;

淡化对象

内容摘要：可以通过控制显示对象的透明度来使显示对象部分透明（或完全透明），也可以通过更改透明度来使对象淡入或淡出。DisplayObject 类的 alpha 属性用于定义显示对象的透明度（更确切地说是不透明度）。可以将 alpha 属性设置为介于 0 和 1 之间的任何值，其中 0 表示...

可以通过控制显示对象的透明度来使显示对象部分透明（或完全透明），也可以通过更改透明度来使对象淡入或淡出。DisplayObject 类的 alpha 属性用于定义显示对象的透明度（更确切地说是不透明度）。可以将alpha 属性设置为介于 0 和 1 之间的任何值，其中 0 表示完全透明，1 表示完全不透明。例如，当使用鼠标单击名为myBall 的对象时，下面的代码行将使该对象变得部分 (50%) 透明：

function fadeBall(event:MouseEvent):void 
{ 
    myBall.alpha = .5; 
} 
myBall.addEventListener(MouseEvent.CLICK, fadeBall);

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

遮罩显示对象

内容摘要：可以通过将一个显示对象用作遮罩来创建一个孔洞，透过该孔洞使另一个显示对象的内容可见。定义遮罩若要指明一个显示对象将是另一个显示对象的遮罩，请将遮罩对象设置为被遮罩的显示对象的 mask 属性：// Make the object maskSprite be a mask for ...

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

定义遮罩

若要指明一个显示对象将是另一个显示对象的遮罩，请将遮罩对象设置为被遮罩的显示对象的 mask 属性：

// Make the object maskSprite be a mask for the object mySprite. 
mySprite.mask = maskSprite;

被遮罩的显示对象显示在用作遮罩的显示对象的全部不透明区域之内。例如，下面的代码将创建一个包含 100 x 100 个像素的红色正方形的 Shape 实例和一个包含半径为 25 个像素的蓝色圆的 Sprite 实例。单击圆时，它被设置为正方形的遮罩，所以显示的正方形部分只是由圆完整部分覆盖的那一部分。换句话说，只有红色圆可见。

// This code assumes it's being run within a display object container 
// such as a MovieClip or Sprite instance. 
 
import flash.display.Shape; 
 
// Draw a square and add it to the display list. 
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); 
 
// Draw a circle and add it to the display list. 
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);

用作遮罩的显示对象可拖动、设置动画，并可动态调整大小，可以在单个遮罩内使用单独的形状。遮罩显示对象不一定需要添加到显示列表中。但是，如果希望在缩放舞台时也缩放遮罩对象，或者如果希望支持用户与遮罩对象的交互（如用户控制的拖动和调整大小），则必须将遮罩对象添加到显示列表中。只要遮罩对象已添加到显示列表中，显示对象的实际 z 索引（从前到后的顺序）就无关紧要了。（除了显示为遮罩对象外，遮罩对象将不会出现在屏幕上。）如果遮罩对象是包含多个帧的一个 MovieClip 实例，则遮罩对象会沿其时间轴播放所有帧，如果没有用作遮罩对象，也会出现同样的情况。通过将mask 属性设置为 null 可以删除遮罩：

// remove the mask from mySprite 
mySprite.mask = null;

不能使用一个遮罩对象来遮罩另一个遮罩对象。不能设置遮罩显示对象的 alpha 属性。只有填充可用于作为遮罩的显示对象中；笔触都会被忽略。

关于遮蔽设备字体

您可以使用显示对象遮罩用设备字体设置的文本。当使用显示对象遮罩用设备字体设置的文本时，遮罩的矩形边框会用作遮罩形状。也就是说，如果为设备字体文本创建了非矩形的显示对象遮罩，则 SWF 文件中显示的遮罩将是遮罩的矩形边框的形状，而不是遮罩本身的形状。

Alpha 通道遮罩

如果遮罩显示对象和被遮罩的显示对象都使用位图缓存，则支持 Alpha 通道遮罩，如下所示：

// maskShape is a Shape instance which includes a gradient fill. 
mySprite.cacheAsBitmap = true; 
maskShape.cacheAsBitmap = true; 
mySprite.mask = maskShape;

例如，Alpha 通道遮罩的一个应用是对遮罩对象使用应用于被遮罩显示对象之外的滤镜。

在下面的示例中，将一个外部图像文件加载到舞台上。该图像（更确切地说，是加载图像的 Loader 实例）将是被遮罩的显示对象。渐变椭圆（中心为纯黑色，边缘淡变为透明）绘制在图像上；这就是 Alpha 遮罩。两个显示对象都打开了位图缓存。椭圆设置为图像的遮罩，然后使其可拖动。

// This code assumes it's being run within a display object container 
// such as a MovieClip or Sprite instance. 
 
import flash.display.GradientType; 
import flash.display.Loader; 
import flash.display.Sprite; 
import flash.geom.Matrix; 
import flash.net.URLRequest; 
 
// Load an image and add it to the display list. 
var loader:Loader = new Loader(); 
var url:URLRequest = new URLRequest("http://www.helpexamples.com/flash/images/image1.jpg"); 
loader.load(url); 
this.addChild(loader); 
 
// Create a Sprite. 
var oval:Sprite = new Sprite(); 
// Draw a gradient oval. 
var colors:Array = [0x000000, 0x000000]; 
var alphas:Array = [1, 0]; 
var ratios:Array = [0, 255]; 
var matrix:Matrix = new Matrix(); 
matrix.createGradientBox(200, 100, 0, -100, -50); 
oval.graphics.beginGradientFill(GradientType.RADIAL, 
                                colors, 
                                alphas, 
                                ratios, 
                                matrix); 
oval.graphics.drawEllipse(-100, -50, 200, 100); 
oval.graphics.endFill(); 
// add the Sprite to the display list 
this.addChild(oval); 
 
// Set cacheAsBitmap = true for both display objects. 
loader.cacheAsBitmap = true; 
oval.cacheAsBitmap = true; 
// Set the oval as the mask for the loader (and its child, the loaded image) 
loader.mask = oval; 
 
// Make the oval draggable. 
oval.startDrag(true);