`
izuoyan
  • 浏览: 8880483 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

理解Loader、Bitmap和BitmapData对象之间的关系

阅读更多

在Loader对象实例中,被引用图片的位图数据存放在一个Bitmap对象中。 Loader对象将图片作为位图数据进行加载,但随后会将数据存放在一个Bitmap对象中(再次说明,一个Bitmap对象会引用一个 BitmapData对象)。 Bitmap对象实例是Loader对象实例的内容(子元素)。 这个结构的层次看起来像是这样的:Loader对象 > Bitmap对象 > BitmapData对象。

Loader对象现在是图片数据的主要显示对象。被引用图片的信息,例如它的URL或者它加载时使用的任何查询变量,可以使用ActionScript通过Loader对象的contentLoaderInfo属性获取。

注: 在flash.display.LoaderInfo.init事件被派发之前,图片的宽度和高度等属性是 不能被已载入的图片或正在加载图片的loader对象访问的。如果您尝试在addChild()语句之后去获取或者设置宽度或者高度值,您将会获得0值 (属性设置不会起作用),因为从本地或者远程文件系统读取文件需要一定的时间。所以,请在LoaderInfo.init或者 LoaderInfo.complete事件处理器中为已载入的图片设置属性。

下面的例子比前面的例子要复杂得多,但是它表明位图数据是包含在一个Bitmap对象实例中的图片数据(而不是一个图片本身的实例)。 而且,它也表明Bitmap对象实例是Loader对象实例的子对象。 这个示例使用一个单一的Loader对象实例来引用单一图片的位图数据,然后重用这个图片数据在舞台上创建多个Bitmap对象实例。 因此,您可以独立操作每个Bitmap对象实例,并获得更多控制。

注: BitmapData对象实例的改变,例如使用类似BitmapData.setPixel()或者BitmapData.draw()等方法所引起的改变,会反映在每个引用BitmapData对象实例的Bitmap对象实例中。

这个例子简单地对外部图片进行了一次调用。 在数据初始载入之后,Flash Player可以多次重用图片数据。 对图片文件的单一调用比多次调用更加有效,并且这个方法在创建更为复杂的需要重复使用同一个图片文件的Flash应用程序时尤其有用。 下面的示例可以创建多个Loader对象实例以及独立操作每个Loader对象实例,这个例子的目的是演示如何利用Loader、Bitmap和 BitmapData之间的关系来节省内存和加载时间。

具体来说,下面的例子定义了一些用于所提供的代码中的函数的变量。并且为LoaderInfo.complete事件建立了一个监听器。 ldr.load()语句一次性地载入了一个外部图片的位图数据(flowers.jpg)并保存在Loader对象实例中。当load方法完成图片数据 的载入后,Loader对象实例会自动创建一个内部的Bitmap对象来存储和显示已载入的位图数据,并将位图信息保存在它自己的ldr.content 属性中。然而,这个content属性具有DisplayObject的数据类型,因为一个Loader对象可以载入图片和SWF文件。因此,下面的例子 使用一个as操作符来保存图片数据到一个自定义的Bitmap数据类型的bmp变量中。然后,位图数据被用来显示五个独立的Bitmap对象实例,来构成 一个立方体的每个面(除了前面)。

示例

bee_in_a_box.fla示例文件对这个例子进行了说明。 请下载bee_in_a_box.fla并打开该文件。 查看位于时间轴第1帧的代码:


// 为外部图片文件名创建一个变量
var IMAGE_URL:String = new String("flowers.jpg");
// 创建一个loader对象来载入图片数据
var ldr:Loader = new Loader();
// 为每个添加到显示列表的图片实例创建变量,这些图片将形成一个立方体,我们需要5个实例,分别用来作为立方体的各个侧面,除了前面:
var bitmap1:Bitmap; var bitmap2:Bitmap;
var bitmap3:Bitmap; var bitmap4:Bitmap;
var bitmap5:Bitmap;
// 创建一个变量来将bumblebee影片剪辑保存在资源库中。资源库中的影片剪辑被设置为
export for ActionScript(导出为ActionScript) var mybee:bumblebee = new bumblebee();
// 建立一个事件监听器用来在图片数据完全载入之后创建舞台上的图片实例
ldr.contentLoaderInfo.addEventListener(Event.COMPLETE, addSides);
// 从图片文件载入图片数据
ldr.load(new URLRequest(IMAGE_URL));
// 在COMPLETE 事件被发送之后, 开始创建舞台中已导入的图片实例
function addSides(evt:Event):void {
// 使用as操作符将loader数据传输给一个Bitmap对象
var bmp:Bitmap = ldr.content as Bitmap;
// 创建一个位图实例
bitmap1 = new Bitmap(bmp.bitmapData);
// 旋转该实例来创建3D效果
bitmap1.rotationX = 90;
// 将该实例添加到显示列表中
addChild(bitmap1);
bitmap2 = new Bitmap(bmp.bitmapData);
bitmap2.z = 400;
bitmap2.rotationY = 90;
addChild(bitmap2);
bitmap3 = new Bitmap(bmp.bitmapData);
bitmap3.z = 400; addChild(bitmap3);
bitmap4 = new Bitmap(bmp.bitmapData);
bitmap4.z = 0; bitmap4.x = 400;
bitmap4.rotationY = 270;
addChild(bitmap4);
bitmap5 = new Bitmap(bmp.bitmapData);
bitmap5.y = 400;
bitmap5.z = 400;
bitmap5.rotationX = 270;
addChild(bitmap5);
// 现在立方体的侧面完成了,需要添加bumblebee影片剪辑了,请您在立方体侧面完成之后再添加bumblebee影片剪辑,这样它会显示在立方体的前面
addBee();
}
// 这个函数将bumblebee影片剪辑的实例从资源库中添加到显示列表中。
function addBee(): void {
mybee.x = 100; mybee.y = 100; addChild(mybee);
}


通过选择Control(控制) > Test Movie(测试影片)来测试影片。 或按Ctrl + Enter键(Windows)或Command+Return键(Mac OS)来运行SWF文件。

现在,请执行下列步骤:

  • 1.创建一个新的Flash Professional文件(ActionScript3),然后将其保存在包含名为flowers.jpg的位图图片的文件夹中。
  • 2.使用Library弹出式菜单选择bee_in_a_box.fla库。 将bumblebee影片剪辑拖拽到舞台上。 然后,重新设置弹出式菜单以显示当前文件的资源库(请注意bumblebee影片剪辑和相关的资源现在已经在当前文件的资源库的列表中被显示出来了)。 删除舞台上的bumblebee影片剪辑。
  • 3.选择时间轴的第1帧,并且复制前面的代码示例到Script(脚本)窗口中。
  • 4.通过选择Control(控制) > Test Movie(测试影片)或者按Ctrl + Enter键(Windows)或Command+Return键(Mac OS)来测试影片。

结果

要下载源文件和所有的例子,请下载本页面顶部的loading_images_library.zip示例文件。 Flash Professional CS5版本的FLA文件的文件名是以"_CS5"结尾的。

Flash Player播放SWF文件。 五个独立的Bitmap对象实例显示了来自于外部的flowers.jpg文件的数据,以形成立方体的各个面(除了前面)。 然后来源于资源库的bumblebee影片剪辑被加载,并且被显示在盒子的中间位置。


分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics