网站地图
【www.gdgbn.com--报表/图形】
一、计算机中显示的图形一般可以分为两大类——矢量图和位图。
矢量图(vector):使用直线和曲线来描述图形，这些图形的元素是一些点、线、矩形、多边形、圆和弧线等等，它们都是通过数学公式计算获得的。众所周知Flash就是一款矢量动画制作软件。在AS中使用的填色(beginFill)，画线(lineTo)等命令都是基于对矢量图的操作。
位图(Bitmap):一般是用于照片品质的图像处理，是由许多像小方块一样的像素组成的图形。简单地说，位图就是以无数的色彩点组成的图案。位图(Bitmap)也就是我们今天要介绍的。
二者比较:
1.矢量图可以无限放大，而且不会失真； 而位图会失真。
2.位图由像素组成而矢量图由矢量线组成。
3.位图可以表现的色彩比较多；而矢量图则相对较少。
4.矢量图体积小，但比较消耗计算资源；位图则比较消耗内存资源，但对计算资源消耗小。
二、BitmapData类的概念
BitmapData类可用于在文档中创建可任意调整大小的透明或不透明位图图像，并且可以在运行时以各种方式对它们进行处理。可以把
BitmapData对象看成一个特殊的数组，专门用来存储位图的像素点阵信息。如果一个位图大小是100*100，那么BitmapData中就好比一
个存储在一个100*100的二维数组，对应存储这10000像素的颜色值。
三、BitmapData类的使用
import flash.display.BitmapData;
//导入BitmapData类
var bm = new
BitmapData(width,height,transparent,fillcolor);
//实例化
四、BitmapData构造函数
public BitmapData(width, height, [transparent], [fillColor])
width(宽):位图数据的宽度(像素)；
height(高): 位图数据的高度(像素)；
[transparent(透明度)]:
是否支持每个像素具有不同的透明度；
[fillcolor（添充色）]:
用于填充位图图像区域。默认为0xFFFFFFFF(白色)
*[中括号]表示可选参数
例如(创建一个100*100的位图数据):
import flash.display.BitmapData;
var bm:BitmapData = new
BitmapData(100,100,false,0xffff00)
五、BitmapData.draw()方法
Draw()方法简单地理解为:复制像素到BitmapData对象中。
例如：在主场景有一个影片剪辑，实例名为"pic"
import flash.display.BitmapData;
var bm:BitmapData = new BitmapData(100, 100);
bm.draw(pic);
//bm复制pic的像素
_root.createEmptyMovieClip("mc", 10);
mc._x = mc._y=150;
mc.attachBitmap(bm,
1);
//用mc加载位图数据bm，深度为1。
*注意:位图在影片剪辑(pic)中的位置：
在使用draw()方法复制像素时，永远是从mc的(0,0)点开始取。
所以小于(0,0)位置的像素都不会被取到
应正确放置位图在影片剪辑中的位置（注册点在左上(0,0)）
六、Rectangle
类
所以介绍Rectangle
类是因为它常与BitmapData类配合使用。
1.作用:在BitmapData类中用于定义位图图像大小和位置的矩形。
2.Rectangle 类的使用
import
flash.geom.Rectangle;
public Rectangle(x, y, width, height)
x - 矩形左上角的 x 坐标。
y - 矩形左上角的 y 坐标。
width - 矩形的宽度，以像素为单位。
height - 矩形的高度，以像素为单位。
例如(一个100*100的矩形):
import flash.geom.Rectangle;
myRect = new Rectangle(0,0,100,100);
好啦，说了这么多理论知识，都是为我们的实例做铺垫的，下面就开始动手操作吧。
实例1:放大镜效果[BitmapData.
copyPixels()]
思路:1.点击图片后，从点击处复制一块(100*80)像素；
2.把复制出来的像素(bm2)加载入mc中，并放大mc。
步骤一：
在主场景中放入一位图，保存为影片剪辑，实例名为"pic"，放入舞台中；
注意:该位图在pic中的注册点应为左上(0,0)，以确保正确显示。
步骤二:
加入AS代码：
import
flash.display.BitmapData;
import flash.geom.Rectangle;
var bm1:BitmapData = new BitmapData(pic._width, pic._height);
bm1.draw(pic);
//创建一个与图片大小相同的位图数据类，并把pic所有像素复制进去
pic.onMouseDown =
function() {
var bm2:BitmapData = new BitmapData(100, 80, true, 0);
bm2.copyPixels(bm1, new Rectangle(_xmouse,
_ymouse, 100, 80), new Point(0,
0));
//从bm1中复制一块像素到bm2,像素起点是鼠标点击的处，大小为100*80
_root.createEmptyMovieClip("mc", 10);
mc.attachBitmap(bm2,
1);
//显示bm2中的位图
mc._x = _xmouse;
mc._y = _ymouse;
mc._xscale =
mc._yscale=150;
//放大mc
};
_root.onMouseUp = function()
{
mc.removeMovieClip();
};
实例2:卷动图效果[BitmapData.
copyPixels()]
思路:1.把图片纵向切为num条，并为每条取像素；
2.创建num个影片剪辑，分别存放每条像素；
3.设置每个影片剪辑的X坐标；Y坐标一块比一块高；
4.结合Tween类使每个条都从天上落下。
步骤一：
在主场景中放入一位图，保存为影片剪辑，实例名为"pic"，放入舞台中；
注意:该位图在pic中的注册点应为左上(0,0)，以确保正确显示。
步骤二:
加入AS代码：
import
flash.display.BitmapData;
import flash.geom.Rectangle;
import mx.transitions.Tween;
import mx.transitions.easing.*;
var num = 80;
//把图分成80份
var pW =
pic._width/num;
//确定每份的宽度为
var
pH =
pic._height;
//因为切成竖条形所以高度不变
var
bm1:BitmapData = new BitmapData(pic._width, pic._height);
bm1.draw(pic);
pic._visible = false;
for (i=0; i
var bm2:BitmapData = new BitmapData(pW,
pH);
bm2.copyPixels(bm1, new
Rectangle(i*pW, 0, pW, pH), new Point(0,
0));
//用i变量*每块宽度，确定取像素的位置
var
p:MovieClip = _root.createEmptyMovieClip("mc"+i, i);
p.attachBitmap(bm2,
this.getNextHighestDepth());
p._x =
i*pW;
//排好X坐标
p._y
=
-i*pH/5;
//把Y坐标置到舞台上面去,一块比一块高
new Tween(p,
"_y", Bounce.easeOut, p._y, 0, (i/10+1),
true);
//------------------试替换代码看看效果-------------------
//new Tween(p, "_y", Back.easeInOut, p._y, 0,
(i/10+1), true);
//new Tween(p, "_y", Strong.easeIn, p._y, 0,
(i/10+1), true);
//new Tween(p, "_y", Elastic.easeOut, p._y, 0,
(i/10+1), true)
}
实例3:位图填充[BitmapData.
beginBitmapFill()]
思路:
1.用loadBitmap("id")加载位图，注意:这是个静态方法;
2.创建一个MC，绘出一个与舞台同样大小的矩形，并进行填充.
步骤一：
任意导入一张位图，在库中右击该位图->链接->标识符为"pic"
步骤二:
加入AS代码：
import
flash.display.BitmapData;
var bm:BitmapData = BitmapData.loadBitmap("pic");
//根据屏幕的大小来绘制绘画区域,用以beginBitmapFill来添充
_root.createEmptyMovieClip("MC",
10);
with (MC) {
beginBitmapFill(bm);
moveTo(0,
0);
lineTo(Stage.width, 0);
lineTo(Stage.width, Stage.height);
lineTo(0, Stage.height);
lineTo(0, 0);
endFill();
}
实例4:位图切片[BitmapData.
beginBitmapFill()]
思路:
1.点击到原图上，进行画圈，并在圈中填充位图；
2.点击在切片上，进行拖动。
步骤一：
在主场景中放入一位图，保存为影片剪辑，实例名为”pic”，放入舞台中；
注意:该位图在pic中的注册点应为左上(0,0)，以确保正确显示。
步骤二:
加入AS代码：
import
flash.display.BitmapData;
var bm:BitmapData = new BitmapData(pic._width, pic._height);
bm.draw(pic);
var draw:Boolean = false;
pic.onPress = function() {
if (mc.hitTest(_xmouse, _ymouse, true)) {
mc.startDrag();
//如果鼠标在mc上，开始拖动它
} else {
draw = true;
mc =
_root.createEmptyMovieClip("mc", 1);
mc.lineStyle(2,
0xFF0000);
mc.beginBitmapFill(bm);
mc.moveTo(_xmouse-this._x,
_ymouse-this._y);
//移动起点到此
}
};
pic.onMouseMove = function() {
if (draw) {
mc.lineTo(_xmouse-this._x,
_ymouse-this._y);
//如果draw状态为真，移动鼠标就draw
}
};
pic.onMouseUp = function() {
if (draw) {
draw = false;
mc.endFill();
//填充结束
} else {
mc.stopDrag();
}
};
关于BitmapData类的应用还有很多很多，一句两句还说不完，今后再做介绍。
最后共享一些网络上的相关资料：
(闪吧):
flash 8 BitmapData类的应用
Flash8平铺网页背景
webstudio(万博思图)：
Flash8 BitmapData