在ActionScript 3.0中，可以创建位图图像，还可以把外部的位图图像加载到Flash Player中。使用位图类，可以处理位图的像素和杂点。通过滤镜类，还可以增加位图的各种滤镜效果。
19.1 位图类
常用的有关位图的类有三个：Bitmap类、BitmapData类和BitmapDataChannel类。Bitmap类用来显示位图图像，BitmapData类用来处理位图，BitmapDataChannel类是个枚举值，表示使用的通道。
19.1.1 Bitmap类
Bitmap类表示位图图像的显示对象。可以使用Bitmap类的构造函数创建图像，也可以使用Loader类加载外部图像。Bitmap类常用的属性如表19.1所示。
表19.1 Bitmap类常用的属性
| 属 性 | 说 明 |
| bitmapData | 被引用的BitmapData对象 |
| pixelSnapping | 控制Bitmap对象是否贴紧至最近的像素 |
| smoothing | 控制在缩放时是否对位图进行平滑处理 |
19.1.2 BitmapData类
BitmapData类用来处理Bitmap对象的数据。BitmapData类可以在程序运行时，任意调整位图的大小、透明度、像素等。BitmapData类常用的属性如表19.2所示，常用的方法如表19.3所示。
表19.2 BitmapData类常用的属性
| 属 性 | 说 明 |
| height | 位图图像的高度 |
| rect | 定义位图图像大小和位置的矩形 |
| transparent | 定义位图图像是否支持每个像素具有不同的透明度 |
| width | 位图图像的宽度 |
表19.3 BitmapData对象常用的方法
| 方 法 | 说 明 |
| applyFilter | 取得一个源图像和一个滤镜对象，并生成过滤的图像 |
| clone | 返回一个新的BitmapData对象，它是对原始实例的克隆，包含与原始实例所含位图完全相同的副本 |
| colorTransform | 使用ColorTransform对象调整位图图像的指定区域中的颜色值 |
| compare | 比较两个BitmapData对象 |
| copyChannel | 将数据从另一个BitmapData对象或当前BitmapData对象的一个通道传输到当前BitmapData对象的某个通道中 |
| copyPixels | 为没有拉伸、旋转或色彩效果的图像之间的像素处理提供一个快速例程 |
| dispose | 释放用来存储BitmapData对象的内存 |
| draw | 使用Flash Player矢量渲染器在位图图像上绘制source显示对象 |
| fillRect | 使用指定的ARGB颜色填充一个矩形像素区域 |
| floodFill | 对图像执行倾倒填充操作，从（x, y）坐标开始，填充一种特定的颜色 |
| generateFilterRect | 已知BitmapData对象、源矩形和滤镜对象，确定applyFilter()方法调用所影响的目标矩形 |
| getColorBoundsRect | 确定矩形区域是将位图图像中指定颜色的所有像素完全包括起来（如果将findColor参数设置为true），还是将不包括指定颜色的所有像素完全包括起来（如果将findColor参数设置为false） |
| getPixel | 返回一个整数，它表示BitmapData对象中在特定点（x, y） 处的RGB 像素值 |
| getPixel32 | 返回一个ARGB颜色值，它包含Alpha通道数据和RGB数据 |
| getPixels | 从像素数据的矩形区域生成一个字节数组 |
| hitTest | 在一个位图图像与一个点、矩形或其他位图图像之间执行像素级的点击检测 |
| lock | 锁定图像，以使引用BitmapData对象的任何对象（如Bitmap对象）在此BitmapData对象更改时不会更新 |
| merge | 对每个通道执行从源图像向目标图像的混合 |
| noise | 使用表示随机杂点的像素填充图像 |
| paletteMap | 重新映射一个具有最多四组调色板数据（每个通道一组）的图像中的颜色通道值 |
| perlinNoise | 生成Perlin杂点图像 |
| pixelDissolve | 执行源图像到目标图像的像素溶解，或使用同一图像执行像素溶解 |
| scroll | 按某一（x, y）像素量滚动图像 |
| setPixel | 设置BitmapData对象的单个像素 |
| setPixel32 | 设置BitmapData对象单个像素的颜色和Alpha透明度值 |
| setPixels | 将字节数组转换为像素数据的矩形区域 |
| threshold | 根据指定的阈值测试图像中的像素值，并将通过测试的像素设置为新的颜色值 |
| unlock | 解除锁定图像，以使引用BitmapData对象的任何对象（如Bitmap对象）在此BitmapData对象更改时更新 |
19.1.3 创建位图类
通常情况下，Bitmap类和BitmapData类是结合在一起使用的。Bitmap类的构造函数的语法格式如下所示：
Bitmap(bitmapData:BitmapData = null, pixelSnapping:String = "auto", smoothing:Boolean = false)
其各个参数的说明如下。
— bitmapData：被引用的BitmapData对象。
— pixelSnapping：默认值为auto，表示Bitmap对象是否贴紧至最近的像素。
— smoothing：默认值为false，表示在缩放时是否对位图进行平滑处理。
BitmapData类的构造函数的语法格式如下所示：
BitmapData(width:int, height:int, transparent:Boolean = true, fillColor:uint = 0xFFFFFFFF)
其各个参数的说明如下。
— width：位图图像的宽度，以像素为单位。
— height：位图图像的高度，以像素为单位。
— transparent：指定位图图像是否支持每个像素具有不同的透明度。
— fillColor：用于填充位图图像区域的32位ARGB颜色值。
下面的示例使用两个位图类，创建一个矩形，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample(
)
{
// 创建BitmapData类
var bitmap:BitmapData = new BitmapData(400, 300, true, 0x500066FF);
// 创建Bitmap类
var image:Bitmap = new Bitmap(bitmap);
// 设置显示位置
image.x = 90;
image.y = 50;
// 增加到舞台
addChild(image);
}
}
}
编译代码并运行，结果如图19.1所示。
图19.1 创建位图类
19.1.4 加载外部图像
除了在内部创建位图之外，还可以加载外部的图像到位图中。加载外部的图像，需要用到Loader对象。通过Loader对象的load()方法，可以加载外部的URL。下面的示例使用Loader对象，加载外部图像到位图中，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Loader;
import flash.events.Event;
import flash.net.URLRequest;
import flash.display.Bitmap;
import flash.display.BitmapData;
public class BitmapExample extends Sprite
{
private var loader:Loader = new Loader();
/********************
* 构造函数
* */
public function BitmapExample()
{
// 侦听数据加载
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);
// 外部图像URL
loader.load(new URLRequest("Bitmap.jpg"));
}
/********************
* 加载外部图像到位图
* */
public function onComplete(event:Event):void
{
// 创建位图
var image:Bitmap = Bitmap(loader.content);
var bitmap:BitmapData = image.bitmapData;
addChild(image);
// 设置
image.x = 20;
image.y = 30;
}
}
}
编译代码并运行，结果如图19.2所示。
图19.2 加载外部图像
19.2 像素的处理
在BitmapData类中，包含了一组用于像素处理的方法。使用这些方法可以处理单个像素，还可以处理像素数组。
19.2.1 处理单个像素
处理单个像素用到的方法包括：getPixel()、getPixel32()、setPixel()和setPixel32()。
1．getPixel()方法
getPixel()方法表示在指定的点获取位图的RGB像素。此方法有两个参数，分别是指定点的横坐标和纵坐标。其语法格式如下所示：
getPixel(x:int, y:int):uint
参数的详细说明如下。
— x：指定点的横坐标。
— y：指定点的纵坐标。
下面的示例使用getPixel()方法获取点（1,1）的RGB像素值，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData类
var bitmap:BitmapData = new BitmapData(400, 300, false, 0xCC66FF);
// 设置像素
var i:uint = bitmap.getPixel(1, 1);
// 输出获取的像素
trace(i.toString(16));
}
}
}
编译代码并运行，输出的效果如图19.3所示。
图19.3 使用getPixel()方法处理单个像素
2．getPixel32()方法
getPixel32()方法与getPixel()方法类似，区别是getPixel32()方法返回一个ARGB的像素值。其中返回值包含了透明度的值。其语法格式如下所示：
getPixel32(x:int, y:int):uint
参数的详细说明如下。
— x：指定点的横坐标。
— y：指定点的纵坐标。
下面的示例使用getPixel32()方法，返回指定点的像素值，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData类
var bitmap:BitmapData = new BitmapData(400, 300, true, 0x50CC66FF);
// 设置像素
var i:uint = bitmap.getPixel32(1, 1);
// 输出获取的像素
trace(i.toString(16));
}
}
}
编译代码并运行，输出的结果如图19.4所示。
图19.4 使用getPixel32()方法处理单个像素
3．setPixel()方法
setPixel()方法用来设置BitmapData对象的单个像素。此方法有三个参数，前两个参数表示要设置单个像素的点，第三个参数color表示生成的像素RGB颜色。其语法格式如下所示：
setPixel(x:int, y:int, color:uint):void
参数的详细说明如下所示：
— x：像素值会更改的像素的x位置。
— y：像素值会更改的像素的y位置。
— color：生成的像素的RGB颜色。
下面的示例使用setPixel()方法，循环设置某些点的像素的RGB颜色，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData类
var bitmap:BitmapData = new BitmapData(400, 300, false, 0x000066FF);
// 设置像素
for(var i:uint = 0; i < 300; i++)
{
bitmap.setPixel(20, i, 0xFFFFFF);
bitmap.setPixel(80, i, 0x000000);
bitmap.setPixel(160, i, 0x00CC00);
}
// 创建Bitmap类
var image:Bitmap = new Bitmap(bitmap);
// 设置显示位置
image.x = 90;
image.y = 50;
// 增加到舞台
addChild(image);
}
}
}
编译代码并运行，结果如图19.5所示。
图19.5 setPixel()方法处理单个像素
4．setPixel32()方法
setPixel32()方法与setPixel()方法类似，不同的是，setPixel32()方法是设置ARGB（其中A表示透明度）的像素值。此方法的前两个参数与setPixel()方法相同，最后一个参数表示生成的像素的ARGB颜色。其语法格式如下所示：
setPixel32(x:int, y:int, color:uint):void
参数的详细说明如下所示：
— x：像素值会更改的像素的x位置。
— y：像素值会更改的像素的y位置。
— color：生成的像素的ARGB颜色。
下面的示例使用setPixel32()方法，循环设置某些点的像素值，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData类
var bitmap:BitmapData = new BitmapData(400, 300, true, 0x700066FF);
// 设置像素
for(var i:uint = 0; i < 300; i++)
{
bitmap.setPixel32(20, i, 0x20FF0000);
bitmap.setPixel32(21, i, 0x40FF0000);
bitmap.setPixel32(22, i, 0x60FF0000);
bitmap.setPixel32(23, i, 0x80FF0000);
bitmap.setPixel32(24, i, 0x00FF0000);
}
// 创建Bitmap类
var image:Bitmap = new Bitmap(bitmap);
// 设置显示位置
image.x = 90;
image.y = 50;
// 增加到舞台
addChild(image);
}
}
}
编译代码并运行，结果如图19.6所示。
图19.6 使用setPixel32()方法处理单个像素
19.2.2 处理多个像素
ActionScript 3.0除了能处理单个像素外，还能处理多个像素。处理多个像素，一般是与字节数组有关的，把字节数组与像素的矩形区域相互转换。与处理多个元素有关的方法有两个：getPixels()和setPixels()。
1．getPixels()方法
getPixels()方法将像素的矩形区域转换为一个字节数组并返回。getPixels()方法有一个参数，表示当前BitmapData对象中的一个矩形区域。其语法格式如下所示：
getPixels(rect:Rectangle):ByteArray
下面的示例使用getPixels()方法获取矩形区域的像素值，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.geom.Rectangle;
import flash.utils.ByteArray;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData类
var bitmap:BitmapData = new BitmapData(400, 300, true, 0x700066FF);
var bounds:Rectangle = new Rectangle(0, 0,bitmap.width, bitmap.height);
var pixels:ByteArray = bitmap.getPixels(bounds);
trace("像素数组的长度" + pixels.length);
trace("以下是取几个元素的值：");
trace(pixels[0]);
trace(pixels[4]);
trace(pixels[6]);
trace(pixels[10]);
}
}
}
编译代码并运行，输出的结果如图19.7所示。
图19.7 使用getPixels()方法处理多个像素
2．setPixels()方法
setPixels()方法将字节数组转换为像素的矩形区域。其语法格式如下所示：
setPixels(rect:Rectangle, inputByteArray:ByteArray):void
参数说明如下。
— rect：指定BitmapData对象的矩形区域。
— inputByteArray：一个字节数组对象，由要在矩形区域中使用的32位未经过相乘的像素值组成。
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.geom.Rectangle;
import flash.utils.ByteArray;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData对象
var bmd1:BitmapData = new BitmapData(200, 200, true, 0xFFCCCCCC);
var bmd2:BitmapData = new BitmapData(200, 200, true, 0xFFFF0000);
// 创建获取像素的矩形区域
var rect:Rectangle = new Rectangle(20, 20, 150, 150);
var bytes:ByteArray = bmd1.getPixels(rect);
// 设置像素
bytes.position = 0;
bmd2.setPixels(rect, bytes);
// 创建Bitmap对象
var bm1:Bitmap = new Bitmap(bmd1);
addChild(bm1);
var bm2:Bitmap = new Bitmap(bmd2);
addChild(bm2);
// 设置位置
bm1.x = 50;
bm1.y = 100;
bm2.x = 260;
bm2.y = 100;
}
}
}
编译代码并运行，结果如图19.8所示。
图19.8 使用setPixels()方法处理多个像素
19.3 位图的复制
位图复制就是从一个图像赋值数据到另一个图像。在BitmapData类中，提供了位图之间复制的方法。复制位图有4种方法：clone()、copyPixels()、copyChannel()和draw()。
19.3.1 clone()方法
clone()方法是对原始实例的克隆，包含与原始实例所含位图完全相同的副本。其语法格式如下所示：
clone():BitmapData
下面的示例使用clone()方法，复制位图，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.geom.Rectangle;
import flash.utils.ByteArray;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData对象
var bmd1:BitmapData = new BitmapData(200, 200, true, 0xFFCCCCCC);
// 复制bmd1
var bmd2:BitmapData = bmd1.clone();
// 创建Bitmap对象
var bm1:Bitmap = new Bitmap(bmd1);
addChild(bm1);
var bm2:Bitmap = new Bitmap(bmd2);
addChild(bm2);
// 设置位置
bm1.x = 50;
bm1.y = 100;
bm2.x = 260;
bm2.y = 100;
}
}
}
编译代码并运行，结果如图19.9所示。
图19.9 使用clone()方法复制位图
19.3.2 copyPixels()方法
copyPixels()方法是在目标BitmapData对象的目标点将源图像的矩形区域复制为同样大小的矩形区域。其语法格式如下所示：
copyPixels(sourceBitmapData:BitmapData, sourceRect:Rectangle, destPoint:Point, alphaBitmapData:BitmapData = null, alphaPoint:Point = null, mergeAlpha:Boolean = false):void
其中参数有6个，详细说明如下。
— sourceBitmapData：源位图。
— sourceRect：要剪切的位图的矩形区域。
— destPoint：表示将在其中放置新像素的矩形区域的左上角。
— alphaBitmapData：第二个Alpha BitmapData对象源。
— alphaPoint：Alpha BitmapData对象源中与sourceRect参数的左上角对应的点。
— mergeAlpha：与设置Alpha通道相关。
下面的示例使用copyPixels()方法复制位图，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.geom.Rectangle;
import flash.geom.Point;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData对象
var bmd1:BitmapData = new BitmapData(200, 200, true, 0xFFCCCCCC);
var bmd2:BitmapData = new BitmapData(200, 200, false, 0x00009900);
// 复制bmd1像素
var rect:Rectangle = new Rectangle(0, 0, 120, 120);
var pt:Point = new Point(10, 10);
bmd2.copyPixels(bmd1, rect, pt);
// 创建Bitmap对象
var bm1:Bitmap = new Bitmap(bmd1);
addChild(bm1);
var bm2:Bitmap = new Bitmap(bmd2);
addChild(bm2);
// 设置位置
bm1.x = 50;
bm1.y = 100;
bm2.x = 260;
bm2.y = 100;
}
}
}
编译代码并运行，结果如图19.10所示。
图19.10 使用copyPixels()方法复制位图
19.3.3 copyChannel()方法
copyChannel()方法表示将数据从另一个BitmapData对象的一个通道传输到当前 BitmapData对象的某个通道中。其语法格式如下所示：
copyChannel(sourceBitmapData:BitmapData, sourceRect:Rectangle, destPoint:Point, sourceChannel:uint, destChannel:uint):void
其参数有5个，详细的说明如下。
— sourceBitmapData：源位图。
— sourceRect：要复制的源位图中的矩形区域。
— destPoint：表示将要在其中放置新通道数据的矩形区域的左上角。
— sourceChannel：源通道。
— destChannel：目标通道。
下面的示例使用copyChannel()方法复制位图，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.BitmapDataChannel;
import flash.geom.Rectangle;
import flash.geom.Point;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData对象
var bmd1:BitmapData = new BitmapData(200, 200, true, 0xFFCCCCCC);
var bmd2:BitmapData = new BitmapData(200, 200, false, 0x00009900);
// 复制bmd1像素
var rect:Rectangle = new Rectangle(0, 0, 120, 120);
var pt:Point = new Point(10, 10);
bmd2.copyChannel(bmd1, rect, pt,
BitmapDataChannel.BLUE, BitmapDataChannel.RED);
// 创建Bitmap对象
var bm1:Bitmap = new Bitmap(bmd1);
addChild(bm1);
var bm2:Bitmap = new Bitmap(bmd2);
addChild(bm2);
// 设置位置
bm1.x = 50;
bm1.y = 100;
bm2.x = 260;
bm2.y = 100;
}
}
}
编译代码并运行，结果如图19.11所示。
图19.11 使用copyChannel()方法复制位图
19.3.4 draw()方法
draw()方法使用Flash Player矢量渲染器绘制显示对象。在绘制的时候可以使用Matrix对象，把位图进行缩放、旋转等转换。其语法格式如下所示：
draw(source:IBitmapDrawable, matrix:Matrix = null, colorTransform:ColorTransform = null, blendMode:String = null, clipRect:Rectangle = null, smoothing:Boolean = false):void
其参数有6个，详细的说明如下。
— source：源位图。
— matrix：Matrix对象，用于位图的转换。
— colorTransform：ColorTransform对象，用于调整位图的颜色值。
— blendMode：指定要应用于所生成位图的混合模式。
— clipRect：定义要绘制的源对象的区域。
— smoothing：定义是否平滑处理显示对象。
下面的示例使用draw()方法复制源位图，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.BitmapDataChannel;
import flash.geom.Matrix;
import flash.geom.Rectangle;
import flash.geom.Point;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData对象
var bmd1:BitmapData = new BitmapData(200, 200, true, 0xFFCCCCCC);
var bmd2:BitmapData = new BitmapData(200, 200, false, 0x00009900);
// 复制bmd1像素
var rect:Rectangle = new Rectangle(0, 0, 120, 120);
var pt:Point = new Point(10, 10);
bmd2.draw(bmd1, new Matrix(1,2,1,0,1,2), null, null, rect, true);
// 创建Bitmap对象
var bm1:Bitmap = new Bitmap(bmd1);
addChild(bm1);
var bm2:Bitmap = new Bitmap(bmd2);
addChild(bm2);
// 设置位置
bm1.x = 50;
bm1.y = 100;
bm2.x = 260;
bm2.y = 100;
}
}
}
编译代码并运行，结果如图19.12所示。
图19.12 使用draw()方法复制位图
19.4 使用杂点
杂点效果可以看做是未调谐的电视屏幕的静态外观，就是所谓的“雪花”效果。杂点效果一般应用于背景图。直接用代码生成的效果的性能，比从外部引用图像要好。使用杂点有两种方法noise()和perlinNoise()。
19.4.1 noise()方法
noise()方法作用是使用随机杂点的像素来填充图像。其语法格式如下所示：
noise(randomSeed:int, low:uint = 0, high:uint = 255, channelOptions:uint = 7, grayScale:Boolean = false):void
其参数有5个，详细的说明如下。
— randomSeed：表示使用的随机种子数。
— low：要为每个通道生成的最低值（0到255）。
— high：要为每个通道生成的最高值（0到255）。
— channelOptions：BitmapDataChannel对象的静态属性值，表示颜色通道。
— grayScale：是否设置为灰度图像。
下面的示例使用noise()方法生成杂点图像，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.BitmapDataChannel;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData对象
var bmd1:BitmapData = new BitmapData(200, 200, true, 0xFFCCCCCC);
var bmd2:BitmapData = new BitmapData(200, 200, false, 0x00009900);
// 处理杂点
var seed:int = int(Math.random() * int.MAX_VALUE);
bmd1.noise(seed, 0, 0xFF, BitmapDataChannel.RED, false);
bmd2.noise(seed, 0, 0xFF, BitmapDataChannel.GREEN, true);
// 创建Bitmap对象
var bm1:Bitmap = new Bitmap(bmd1);
addChild(bm1);
var bm2:Bitmap = new Bitmap(bmd2);
addChild(bm2);
// 设置位置
bm1.x = 50;
bm1.y = 100;
bm2.x = 260;
bm2.y = 100;
}
}
}
编译代码并运行，结果如图19.13所示。
图19.13 使用noise()方法绘制杂点
19.4.2 perlinNoise ()方法
perlinNoise()方法作用是生成Perlin杂点图像。 Perlin杂点是将多组杂点数据与不同级别的细节组合在一起，通常被称为“杂点的碎片总和”。Perlin杂点通常用于模拟自然风光，比如木材纹理、云彩或山脉等。其语法格式如下所示：
perlinNoise(baseX:Number, baseY:Number, numOctaves:uint, randomSeed:int, stitch:Boolean, fractalNoise:Boolean, channelOptions:uint = 7, grayScale:Boolean = false, offsets:Array = null):void
参数的详细说明如下。
— baseX：X方向上使用的频率。
— baseY：Y方向上使用的频率。
— numOctaves：要组合以创建此杂点的octave函数或各个杂点函数的数目。
— randomSeed：使用的随机种子数。
— stitch：平滑图像的转变边缘以创建无缝的纹理。
— fractalNoise：生成碎片杂点或者湍流。
— channelOptions：BitmapDataChannel对象的值。
— grayScale：灰度图像。
— offsets：偏移量。
下面的示例使用perlinNoise()方法生成Perlin杂点图像，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.BitmapDataChannel;
public class BitmapExample extends Sprite
{
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData对象
var bmd1:BitmapData = new BitmapData(200, 200, true, 0xFFCCCCCC);
var bmd2:BitmapData = new BitmapData(200, 200, false, 0x00009900);
// 处理杂点
var seed:Number = Math.floor(Math.random() * 10);
var channels:uint = BitmapDataChannel.RED | BitmapDataChannel.BLUE;
bmd1.perlinNoise(100, 80, 6, seed, false, true, channels, false, null);
channels = BitmapDataChannel.GREEN | BitmapDataChannel.ALPHA;
bmd2.perlinNoise(50, 90, 7, seed, false, true, channels, false, null);
// 创建Bitmap对象
var bm1:Bitmap = new Bitmap(bmd1);
addChild(bm1);
var bm2:Bitmap = new Bitmap(bmd2);
addChild(bm2);
// 设置位置
bm1.x = 50;
bm1.y = 100;
bm2.x = 260;
bm2.y = 100;
}
}
}
编译代码并运行，结果如图19.14所示。
图19.14 使用perlinNoise ()方法绘制杂点
19.5 滚动位图
位图 的移动在实际应用中较为广泛，比如电子地图。在BitmapData类中，也提供了相应的方法，来使位图移动。scroll()方法是表示将图像按照一个 定量的像素进行滚动，而滚动区域之外的边缘区域保持不变。scroll()方法有两个参数分别表示定量像素的横坐标和纵坐标。其语法格式如下所示：
scroll(x:int, y:int):void
下面的示例使用scroll()方法滚动位图，代码如下所示：
package
{
import flash.display.Sprite;
import flash.display.Loader;
import flash.events.Event;
import flash.net.URLRequest;
import flash.display.Bitmap;
import flash.display.BitmapData;
public class BitmapExample extends Sprite
{
private var loader:Loader = new Loader();
private var bitmap:BitmapData;
/********************
* 构造函数
* */
public function BitmapExample()
{
// 侦听数据加载
loader.contentLoaderInfo.addEventListener(Event.COMPLETE,
onComplete);
// 外部图像URL
loader.load(new URLRequest("scroll.jpg"));
}
/********************
* 加载外部图像到位图
* */
public function onComplete(event:Event):void
{
// 创建位图
var image:Bitmap = Bitmap(loader.content);
bitmap = image.bitmapData;
addChild(image);
// 加载完成，开始滚动位图
addEventListener(Event.ENTER_FRAME, scrollBitmap);
}
/********************
* 滚动位图
* */
function scrollBitmap(event:Event):void
{
bitmap.scroll(-1, -1);
}
}
}
编译代码并运行，结果如图19.15所示。
图19.15 滚动位图
19.6 位图之间的切换
在实 际中经常遇到图像之间的切换，比如相册浏览，动态图片广告等。图像之间有很多种切换方式，其中在BitmapData类中就提供了一种位图切换的方法。 pixelDissolve()方法是像素溶解的位图切换效果。其中使用randomSeed值可以生成随机像素溶解。其语法格式如下所示：
pixelDissolve(sourceBitmapData:BitmapData, sourceRect:Rectangle, destPoint: Point, randomSeed:int = 0, numPixels:int = 0, fillColor:uint = 0):int
其参数有6个，详细的说明如下。
— sourceBitmapData：切换的BitmapData对象。
— sourceRect：位图的矩形区域。
— destPoint：目标图像中与源矩形的左上角对应的点。
— randomSeed：用于开始像素溶解的随机种子。
— numPixels：像素值。
— fillColor：填充其源值等于目标值的像素。
下面的示例使用pixelDissolve()方法，实现位图之间的切换，代码如下所示：
package
{
import flash.display.BitmapData;
import flash.display.Bitmap;
import flash.geom.Point;
import flash.geom.Rectangle;
import flash.utils.Timer;
import flash.events.TimerEvent;
import flash.display.Sprite;
public class BitmapExample extends Sprite
{
private var bmd:BitmapData;
private var tim:Timer;
/********************
* 构造函数
* */
public function BitmapExample()
{
// 创建BitmapData对象
bmd = new BitmapData(300, 180, false, 0x00CCCCCC);
var bitmap:Bitmap = new Bitmap(bmd);
addChild(bitmap);
// 设置
bitmap.x = 80;
bitmap.y = 100;
// 创建定时器
tim = new Timer(20);
tim.start();
tim.addEventListener(TimerEvent.TIMER, timerHandler);
}
/********************
* 定时器
* */
function timerHandler(event:TimerEvent):void
{
var randomNum:Number = Math.floor(Math.random() * int.MAX_VALUE);
// 切换
dissolve(randomNum);
}
/********************
* 切换
* */
function dissolve(randomNum:Number):void
{
// 切换
var rect:Rectangle = bmd.rect;
var pt:Point = new Point(0, 0);
var numberOfPixels:uint = 300;
var red:uint = 0x00FF0000;
bmd.pixelDissolve(bmd, rect, pt, randomNum, numberOfPixels, red);
// 切换的区域
var grayRegion:Rectangle = bmd.getColorBoundsRect(0xFFFFFFFF, 0x00CCCCCC, true);
if(grayRegion.width == 0 && grayRegion.height == 0 )
{
tim.stop();
}
}
}
}
编译代码并运行，结果如图19.16所示。
图19.16 位图之间的切换
19.7 位图应用滤镜
在位图中增加滤镜的效果，似乎是一些图像处理软件（如Adobe Photoshop、Adobe Fireworks）应该做的事情。但是在ActionScript 3.0中，单独包含了滤镜类，开发人员可以通过这些类，实现和那些图像处理软件同样的滤镜效果。
19.7.1 滤镜类
滤镜类位于flash.filters包中。这些滤镜类可以显示很多视觉效果，比如模糊、浮雕、发光和投影等。滤镜类如表19.4所示。
表19.4 后缀运算符
| 类 | 说 明 |
| BlurFilter | 模糊视觉效果 |
| ConvolutionFilter | 矩阵盘绕滤镜效果 |
| DisplacementMapFilter | 对象置换 |
| DropShadowFilter | 投影效果 |
| GlowFilter | 发光效果 |
| GradientBevelFilter | 渐变斜角效果 |
| GradientGlowFilter | 渐变发光效果 |
19.7.2 投影
使用DropShadowFilter类可使对象显示投影效果。其属性如表19.5所示。
表19.5 DropShadowFilter类的属性
| 属 性 | 说 明 |
| alpha | 阴影颜色的Alpha透明度值 |
| angle | 阴影的角度 |
| blurX | 水平模糊量 |
| blurY | 垂直模糊量 |
| color | 阴影的颜色 |
| distance | 阴影的偏移距离，以像素为单位 |
| hideObject | 表示是否隐藏对象 |
| inner | 表示阴影是否为内侧阴影 |
| knockout | 应用挖空效果 （true），这将有效地使对象的填色变为透明，并显示文档的背景颜色 |
| quality | 应用滤镜的次数 |
| strength | 印记或跨页的强度 |
DropShadowFilter类的构造函数的表达式如下所示：
public function DropShadowFilter(distance:Number = 4.0, angle:Number = 45, color:uint = 0, alpha:Number = 1.0, blurX:Number = 4.0, blurY:Number = 4.0, strength:Number = 1.0, quality:int = 1, inner:Boolean = false, knockout:Boolean = false, hideObject:Boolean = false)
下面的示例说明如何使用DropShadowFilter类对位图应用投影效果，代码如下所示：
package
{
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.Sprite;
import flash.filters.DropShadowFilter;
public class FilterExample extends Sprite
{
/********************
* 构造函数
* */
public function FilterExample()
{
// 创建 bitmapData 对象并将它呈现在屏幕上
var bitmapData:BitmapData = new BitmapData (200,200,false, 0xFF009900);
var displayObject:Bitmap = new Bitmap(bitmapData);
addChild(displayObject);
// 设置位置
displayObject.x = 130;
displayObject.y = 80;
// 创建 DropShadowFilter 实例。
var dropShadow:DropShadowFilter = new DropShadowFilter();
// 创建滤镜数组，通过将滤镜作为参数传递给 Array() 构造函数，
// 将该滤镜添加到数组中。
var filtersArray:Array = new Array(dropShadow);
// 将滤镜数组分配给显示对象以便应用滤镜。
displayObject.filters = filtersArray;
}
}
}
编译代码并运行，结果如图19.17所示。
图19.17 投影效果
19.7.3 发光
使用GlowFilter类可实现显示对象的发光效果。其属性如表19.6所示。
表19.6 GlowFilter类的属性
| 属 性 | 说 明 |
| alpha | 颜色的Alpha透明度值 |
| blurX | 水平模糊量 |
| blurY | 垂直模糊量 |
| color | 光晕颜色 |
| inner | 指定发光是否为内侧发光 |
| knockout | 应用挖空效果 （true） |
| quality | 应用滤镜的次数 |
| strength | 印记或跨页的强度 |
GlowFilter类的构造函数的表达式如下所示：
public function GlowFilter(color:uint = 0xFF0000, alpha:Number = 1.0, blurX:Number = 6.0, blurY:Number = 6.0, strength:Number = 2, quality:int = 1, inner:Boolean = false, knockout:Boolean = false)
下面的示例说明如何使用GlowFilter类对位图应用发光效果，代码如下所示：
package
{
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.Sprite;
import flash.filters.GlowFilter;
public class FilterExample extends Sprite
{
/********************
* 构造函数
* */
public function FilterExample()
{
// 创建 bitmapData 对象并将它呈现在屏幕上
var bitmapData:BitmapData = new BitmapData (200,200,false, 0xFF009900);
var displayObject:Bitmap = new Bitmap(bitmapData);
addChild(displayObject);
// 设置位置
displayObject.x = 130;
displayObject.y = 80;
// 创建滤镜实例。
var glowFilter:GlowFilter = new GlowFilter(0x0000FF);
// 创建滤镜数组，通过将滤镜作为参数传递给 Array() 构造函数，
// 将该滤镜添加到数组中。
var filtersArray:Array = new Array(glowFilter);
// 将滤镜数组分配给显示对象以便应用滤镜。
displayObject.filters = filtersArray;
}
}
}
编译代码并运行，结果如图19.18所示。
图19.18 发光效果
19.7.4 浮雕
使用GradientBevelFilter类可以实现显示对象的浮雕效果。其属性如表19.7所示。
表19.7 GradientBevelFilter类的属性
| 属 性 | 说 明 |
| alpha | colors数组中对应颜色的Alpha透明度值的数组 |
| angle | 角度 |
| blurX | 水平模糊量 |
| blurY | 垂直模糊量 |
| colors | 渐变中使用的RGB十六进制颜色值数组 |
| distance | 偏移距离 |
| knockout | 应用挖空效果（true） |
| quality | 应用滤镜的次数 |
| ratios | 对应于colors数组中颜色的一组颜色分布比率 |
| strength | 印记或跨页的强度 |
| type | 斜角效果的放置 |
GradientBevelFilter类的构造函数的表达式如下所示：
public function GradientBevelFilter(distance:Number = 4.0, angle:Number = 45, colors:Array = null, alphas:Array = null, ratios:Array = null, blurX:Number = 4.0, blurY:Number = 4.0, strength:Number = 1, quality:int = 1, type:String = "inner", knockout:Boolean = false)
下面的示例说明如何使用GradientBevelFilter类对位图应用浮雕效果，代码如下所示：
package
{
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.filters.BitmapFilterQuality;
import flash.filters.BitmapFilterType;
import flash.display.Sprite;
import flash.filters.GradientBevelFilter;
public class FilterExample extends Sprite
{
/********************
* 构造函数
* */
public function FilterExample()
{
// 创建 bitmapData 对象并将它呈现在屏幕上
var bitmapData:BitmapData = new BitmapData(200,200,false, 0xFF009900);
var displayObject:Bitmap = new Bitmap(bitmapData);
addChild(displayObject);
// 设置位置
displayObject.x = 130;
displayObject.y = 80;
// 创建滤镜实例。
var bgColor:uint = 0xCCCCCC;
var size:uint = 80;
var offset:uint = 50;
var distance:Number = 5;
var angleInDegrees:Number = 225; // opposite 45 degrees
var colors:Array = [0xFFFFFF, 0xCCCCCC, 0x000000];
var alphas:Array = [1, 0, 1];
var ratios:Array = [0, 128, 255];
var blurX:Number = 8;
var blurY:Number = 8;
var strength:Number = 2;
var quality:Number = BitmapFilterQuality.HIGH
var type:String = BitmapFilterType.INNER;
var knockout:Boolean = true;
vargradientBevelFilter:GradientBevelFilter=newGradientBevelFilter(
distance,
angleInDegrees,
colors,
alphas,
ratios,
blurX,
blurY,
strength,
quality,
type,
knockout);
// 创建滤镜数组，通过将滤镜作为参数传递给 Array() 构造函数，
// 将该滤镜添加到数组中。
var filtersArray:Array = new Array(gradientBevelFilter);
// 将滤镜数组分配给显示对象以便应用滤镜。
displayObject.filters = filtersArray;
}
}
}
编译代码并运行，结果如图19.19所示。
图19.19 浮雕效果
19.7.5 渐变发光
使用GradientGlowFilter类可实现显示对象的渐变发光效果。其属性如表19.8所示。
表19.8 GradientGlowFilter类的属性
| 属 性 | 说 明 |
| alpha | colors数组中对应颜色的Alpha透明度值的数组 |
| angle | 角度 |
| blurX | 水平模糊量 |
| blurY | 垂直模糊量 |
| colors | 渐变中使用的RGB十六进制颜色值数组 |
| distance | 偏移距离 |
| knockout | 应用挖空效果（true） |
| quality | 应用滤镜的次数 |
续表
| 属 性 | 说 明 |
| ratios | 对应于colors数组中颜色的一组颜色分布比率 |
| strength | 印记或跨页的强度 |
| type | 斜角效果的放置 |
GradientGlowFilter类的构造函数的表达式如下所示：
public function GradientGlowFilter(distance:Number = 4.0, angle:Number = 45, colors:Array = null, alphas:Array = null, ratios:Array = null, blurX:Number = 4.0, blurY:Number = 4.0, strength:Number = 1, quality:int = 1, type:String = "inner", knockout:Boolean = false)
下面的示例说明如何使用GradientGlowFilter类对位图应用渐变发光效果，代码如下所示：
package
{
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.filters.BitmapFilterQuality;
import flash.filters.BitmapFilterType;
import flash.display.Sprite;
import flash.filters.GradientGlowFilter ;
public class FilterExample extends Sprite
{
/********************
* 构造函数
* */
public function FilterExample()
{
// 创建 bitmapData 对象并将它呈现在屏幕上
var bitmapData:BitmapData = new BitmapData(200,200,false, 0x0000FF);
var displayObject:Bitmap = new Bitmap(bitmapData);
addChild(displayObject);
// 设置位置
displayObject.x = 130;
displayObject.y = 80;
// 创建滤镜实例
var distance:Number = 0;
var angleInDegrees:Number = 45;
var colors:Array = [0xFFFFFF, 0xFF0000, 0xFFFF00, 0x0000FF];
var alphas:Array = [0, 1, 1, 1];
var ratios:Array = [0, 63, 126, 255];
var blurX:Number = 50;
var blurY:Number = 50;
var strength:Number = 3.5;
var quality:Number = BitmapFilterQuality.HIGH;
var type:String = BitmapFilterType.OUTER;
var knockout:Boolean = false;
var gradientBevelFilter:GradientGlowFilter = new GradientGlowFilter (
distance, angleInDegrees, colors, alphas, ratios,
blurX, blurY, strength, quality, type, knockout);
// 创建滤镜数组，将滤镜作为参数传递给 Array() 构造函数
// 将该滤镜添加到数组中
var filtersArray:Array = new Array(gradientBevelFilter);
// 将滤镜数组分配给显示对象以便应用滤镜
displayObject.filters = filtersArray;
}
}
}
编译代码并运行，结果如图19.20所示。
图19.20 渐变发光效果
19.7.6 模糊
使用BlurFilter类可实现显示对象的模糊效果。其属性如表19.9所示。
表19.9 BlurFilter类的属性
| 属 性 | 说 明 |
| blurX | 水平模糊量 |
| blurY | 垂直模糊量 |
| quality | 应用滤镜的次数 |
BlurFilter类的构造函数的表达式如下所示：
public function BlurFilter(blurX:Number = 4.0, blurY:Number = 4.0, quality:int = 1)
下面的示例说明如何使用BlurFilter类对位图应用模糊效果，代码如下所示：
package
{
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.filters.BitmapFilterQuality;
import flash.filters.BitmapFilterType;
import flash.display.Sprite;
import flash.filters.BlurFilter;
public class FilterExample extends Sprite
{
/********************
* 构造函数
* */
public function FilterExample()
{
// 创建 bitmapData 对象并将它呈现在屏幕上
var bitmapData:BitmapData = new BitmapData(200,200,false,0x0000FF);
var displayObject:Bitmap = new Bitmap(bitmapData);
addChild(displayObject);
// 设置位置
displayObject.x = 130;
displayObject.y = 80;
// 创建滤镜实例
var blurX:Number = 30;
var blurY:Number = 30;
var gradientBevelFilter:BlurFilter = new BlurFilter(blurX, blurY,
BitmapFilterQuality.HIGH);
// 创建滤镜数组，将滤镜作为参数传递给 Array() 构造函数
// 将该滤镜添加到数组中
var filtersArray:Array = new Array(gradientBevelFilter);
// 将滤镜数组分配给显示对象以便应用滤镜
displayObject.filters = filtersArray;
}
}
}
编译代码并运行，结果如图19.21所示。
图19.21 模糊效果
扫一扫
626
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
