Bitmap和BitmapData
2010.5.25 smartblack整理
一、flash.display.Bitmap类及其两个子类
1、继承自DisplayObject,和InteractiveObject平级,所以无法调度鼠标事件,可以使用额外的包装容器(Sprite)来实现侦听。
2、只支持GIF、JPEG、PNG格式,不支持BMP(网上已有解决方法)
3、构造函数: Bitmap(bitmapData:BitmapData = null, pixelSnapping:String = "auto", smoothing:Boolean = false),pixelSnapping是自动紧贴,smoothing是平滑处理
4、Bitmap类的子类mx.core.FlexBitmap:覆盖了toString(),用于指示对象在应用程序的DisplayObject层次结构中所处的位置。
5、FlexBitmap的子类mx.core.BitmapAsset:实现了IFlexAsset、IFlexDisplayObject接口。在FLEX应用程序中,通常不必直接使用此类,MXML编译器会自动生成,比如:
<mx:Image id = “logo” source = “@Embed(source = ‘Logo.gif’)”/>
不过,在AS级别,则可以对图片进行更多的操作(比如使用BitmapData类的一些方法):
[Bindable]
[Embed(source = “Logo.gif”)]
private var logoClass:Class;
var logo:BitmapAsset = BitmapAsset(new logoClass());
logo.bitmapData.noise(4);
<mx:Image id = “logo” source = “{logoClass}”/>
二、flash.display.BitmapData类及常用类方法简介
1、继承自Object,可以看作一个专门用来存储位图像素点阵信息的数组。比如大小100x100的位图,其BitmapData就相当于一个100x100的二维数组,对应存储了10000像素的颜色值。这个颜色值是一个32位的ARGB值,用uint整数类型表示,即alpha 和red green blue 三原色。0xFF669900代表不透明的橙色,其中FF表示16进制的最大数,alpha值的范围也就在0x00-0xFF之间,比如十六进制80就是十进制的128,也就是透明度256的一半。
2、构造函数:BitmapData(width:int, height:int, transparent:Boolean = true,fillColor:unit = 0xFFFFFFFF),width 和 height 参数指定位图的大小,二者的最大值都是 2880 像素。transparent是透明度,设置为false时,颜色值仅使用24位的RGB值,这可以略微提升呈现性能。但需要注意的是,设置为不透明位图后,将无法再更改为透明位图。fillColor是用于填充位图区域的 32 位 ARGB 颜色值,默认为0xFFFFFFFF(纯白色)。
3、像素处理(参考http://www.skill8.net/article.asp?id=15)
处理单个像素:
获取要处理的区域中包含的像素的颜色值。使用 getPixel() 方法可读取这些单个的像素值。
getPixel() 方法从作为参数传递的一组 x, y(像素)坐标中检索 RGB 值。
getPixel32() 返回的值包含表示所选像素的 Alpha 通道(透明度)值的附加数据。
同理设置单个像素:
如果只想更改位图中包含的某个像素的颜色或透明度,则可以使用 setPixel() 或 setPixel32() 方法。若要设置像素的颜色,只需将 x, y 坐标和颜色值传递到这两种方法之一即可。
设置某个区域请使用 getPixels() 方法。此方法从作为参数传递的矩形像素数据区域中生成字节数组。字节数组的每个元素(即像素值)都是无符号的整数(32 位未经相乘的像素值)。
相反,为了更改(或设置)一组像素值,请使用 setPixels() 方法。此方法需要联合使用两个参数(rect 和 inputByteArray)来输出像素数据 (inputByteArray) 的矩形区域 (rect)。
从 inputByteArray 中读取(或写入)数据时,会为数组中的每个像素调用 ByteArray.readUnsignedInt() 方法。如果由于某些原因,inputByteArray 未包含像素数据的整个矩形,则该方法会停止处理该点处的图像数据。
必须记住的是,对于获取和设置像素数据,字节数组需要有 32 位 Alpha、红、绿、蓝 (ARGB) 像素值。
4、像素级别冲突检测
这个有什么用?我有一个对象需要判断是否和PNG图片碰撞,但是PNG图片的边缘是透明的时候,这个就有用了。
BitmapData.hitTest() 方法可以在位图数据和另一个对象或点之间执行像素级别冲突检测。
hitTest(firstPoint:Point, firstAlphaThreshold:uint, secondObject:Object, secondBitmapDataPoint:Point = null, secondAlphaThreshold:uint = 1):Boolean
firstPoint (Point):此参数指在其上执行点击测试的第一个 BitmapData 的左上角的像素位置。
firstAlphaThreshold (uint):此参数指定对于此点击测试视为不透明的最高 Alpha 通道值。
secondObject (Object):此参数表示影响区域。secondObject 对象可以是 Rectangle、Point、Bitmap 或 BitmapData 对象。此对象表示在其上执行冲突检测的点击区域。
secondBitmapDataPoint (Point):此可选参数用于在第二个 BitmapData 对象中定义像素位置。只有当 secondObject 的值为 BitmapData 对象时,才使用此参数。默认值为 null。
secondAlphaThreshold (uint):此可选参数表示在第二个 BitmapData 对象中视为不透明的最高 Alpha 通道值。默认值为 1。只有当 secondObject 是一个 BitmapData 对象且两个 BitmapData 对象都透明时,才使用此参数。
5、applyFilter添加滤镜、fillRect使用指定颜色填充一个矩形像素区域
http://hi.baidu.com/%B0%B5%BA%DA%B2%E0%CE%C0/blog/item/cb78f89bae3558bcc9eaf401.html
6、draw(source:IBitmapDrawable, matrix:Matrix = null, colorTransform:ColorTransform = null, blendMode:String = null, clipRect:Rectangle = null, smoothing:Boolean = false):void
将source对象绘制到BitmapData对象里。其中,DisplayObject和BitmapData类实现了IBitmapDrawable接口。clipRect是对源对象的裁剪,不指定则会绘制整个源对象。另外,注意跨域的问题。
应用:保存图片,保存当前屏幕显示内容等。参考http://wangcheng.iteye.com/blog/129007
7、getColorBoundsRect(mask:uint, color:uint, findColor:Boolean = true):Rectangle
mask:uint一个十六进制值,指定要考虑的 ARGB 颜色的位。通过使用 &(按位 AND)运算符,将颜色值与此十六进制值合并。
color:uint一个十六进制值,指定要匹配(如果 findColor 设置为 true)或不 匹配(如果 findColor 设置为 false)的 ARGB 颜色。
findColor:Boolean (default = true)如果该值设置为 true,则返回图像中颜色值的范围。如果该值设置为 false,则返回图像中不存在此颜色的范围。
应用:获得一个DisplayObject的真实宽高(去除透明部分)
function getRealWH(source:DisplayObject):Rectangle{
copy = new BitmapData(source.width,source.height,false,0xFF0000);
copy.draw(source);
return copy.getColorBoundsRect(0xFFFFFF,0xFF0000,false);
}
具体思路就是,将BitmapData背景设为红色,将source对象draw上去,然后获取非红色部分的边框。
8、同一个BitmapData对象可能被多个Bitmap对象持有,那么一旦BitmapData改变,所有的Bitmap对象都将受到影响,为了避免这种情况,可以用BitmapData对象提供的clone()方法生成当前BitmapData对象的拷贝。
三、Bitmap和BitmapData的综合描述
1、将Bitmap位图对象和BitmapData位图信息分开,是为了让位图呈现操作与Flash Player的内部显示更新例程分隔开来,不会因为连续的绘制导致额外的每帧开销。
2、当应用程序需要将位图图像保存到本地或发送到服务端时, 通常的方法是在发送数据前将图像通过PNG或JPEG编码。如果只是想保存位图图像,只要序列化BitmapData即可,将图像转换为 JPEG/PNG是完全没有必要的。参见[AS3]Bitmap序列化(将BitmapData保存为原生Binary/ByteArray)
地址:http://space.flash8.net/space/?388361/viewspace-468245.html
四、附记
1、位图与矢量图的概念及区别
矢量图(vector):矢量图形是以数学方式生成的几何形状,这些图形的元素是一些点、线、矩形、多边形、圆和弧线等等,它们都是通过数学公式计算获得的。众所周知Flash就是一款矢量动画制作软件。在AS中使用的填充(beginFill),画线(lineTo)等命令都是基于对矢量图的操作。
位图(Bitmap):位图图形也称为光栅图形,由排列为矩形网格形式的小方块(像素)组成。简单地说,位图就是以无数的色彩点组成的图案。 两者比较:
矢量图可以无限放大,而且不会失真; 而位图会失真。
位图由像素组成而矢量图由矢量线组成。
位图可以表现的色彩比较多;而矢量图则相对较少。
矢量图体积小,但比较消耗计算资源;位图则比较消耗内存资源,但对计算资源消耗小。
位图图像用图像的宽度和高度来定义,以像素为量度单位,每个像素包含的位数表示像素包含的颜色数。在使用 RGB 颜色模型的位图图像中,像素由三个字节组成:红、绿和蓝。每个字节包含一个 0 至 255 之间的值。将字节与像素合并时,它们可以产生与艺术混合绘画颜色相似的颜色。例如,一个包含红色字节值 255、绿色字节值 102 和蓝色字节值 0 的像素可以形成明快的橙色。
位图图像的品质由图像分辨率和颜色深度位值共同确定。分辨率与图像中包含的像素数有关。像素数越大,分辨率越高,图像也就越精确。颜色深度又叫色彩位数,与像素可包含的信息量有关。即位图中要用多少个二进制位来表示每个点的颜色,是分辨率的一个重要指标。常用有1位(单色),2位(4色,CGA),4位(16色,VGA),8位(256色),16位(增强色),24位和32位(真彩色)等。色深16位以上的位图还可以根据其中分别表示RGB三原色或CMYK四原色(有的还包括Alpha通道,CMYK四原色指打印颜色)的位数进一步分类 例如,颜色深度值为每像素 16 位的图像无法显示颜色深度为 48 位的图像所具有颜色数。因此,48 位图像与 16 位图像相比,其阴影具有更高的平滑度。
由于位图图形跟分辨率有关,因此不能很好地进行缩放。当放大位图图像时,这一特性显得尤为突出。通常,放大位图有损其细节和品质。
2、三种图形格式说明
Adobe Flash Player 支持GIF、JPG 和 PNG三种位图图像格式 。对于使用GIF和 PNG的位图图像还可以对每个像素添加一个额外的字节——Alpha通道,表示像素的透明度值。
GIF
图形交换格式 (GIF) 最初由 CompuServe 于 1987 年开发,作为一种传送 256 色(8 位颜色)图像的方式。此格式提供较小的文件大小,是基于 Web 的图像的理想格式。受此格式的调色板所限,GIF 图像通常不适用于照片,照片通常需要高度的阴影和颜色渐变。GIF 图像允许产生一位透明度,允许将颜色映射为清晰(或透明)。这可以使网页的背景颜色通过已映射透明度的图像显示出来。
JPEG
由联合图像专家组 (JPEG) 开发,JPEG(通常写成 JPG)图像格式使用有损压缩算法允许24 位颜色深度具有很小的文件大小。有损压缩意味着每次保存图像,都会损失图像品质和数据,但会生成更小的文件大小。由于 JPEG 能够显示数百万计的颜色,因此它是照片的理想格式。控制应用于图像的压缩程度的功能使您能够控制图像品质和文件大小。
PNG
可移植网络图形 (PNG) 格式是作为受专利保护的 GIF 文件格式的开放源替代格式而开发的。PNG 最多支持 64 位颜色深度,允许使用最多 1600 万种颜色。由于 PNG 是一种比较新的格式,因此一些旧版本浏览器不支持 PNG 文件。与 JPG 不同, PNG 使用无损压缩,这意味着保存图像时不会丢失图像数据。PNG 文件还支持 Alpha 透明度,允许使用最多 256 级透明度。
五、参考链接
1、http://hi.baidu.com/voidwizard/blog/item/0d8f23c295c79b5eb219a8da.html
2、[转载]Flash火焰效果讲解-BitmapData应用
地址:http://www.klstudio.com/post/194.html
3、BitmapData的整理http://uh.9ria.com/space-29516-do-blog-id-6898.html