8.16.在载入图像时显示自定义引导
8.16.1. 问题
我需要在一个图像装载时显示定制的动画。
8.16.2. 解决办法
创建一个定制的图形，并且从Image 对象装载图像是监听ProgressEvent.PROGRESS 事件。
8.16.3. 讨论
当使用Image 组件时有两种方法来显示图像： 你能在MXML 中设置Image 类的source 属性，或者通过一个URL 地址来装载并使用img.load 方法：
在你装载图像前，然而，你需要附加一个事件监听器来确保每一个ProgressEvent 都被控制。
在progress 方法中，这是处理ProgressEvent.PROGRESS 事件，一个UIComponent 被使用Image 的bytesLoaded 属性重绘。
我需要在一个图像装载时显示定制的动画。
8.16.2. 解决办法
创建一个定制的图形，并且从Image 对象装载图像是监听ProgressEvent.PROGRESS 事件。
8.16.3. 讨论
当使用Image 组件时有两种方法来显示图像： 你能在MXML 中设置Image 类的source 属性，或者通过一个URL 地址来装载并使用img.load 方法：
+展开
-ActionScript
img.load("http://thefactoryfactory.com/beach.jpg");
在你装载图像前，然而，你需要附加一个事件监听器来确保每一个ProgressEvent 都被控制。
+展开
-ActionScript
img.addEventListener(ProgressEvent.PROGRESS, progress);
在progress 方法中，这是处理ProgressEvent.PROGRESS 事件，一个UIComponent 被使用Image 的bytesLoaded 属性重绘。
+展开
-XML
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"
creationComplete="loadImage()">
<mx:Script>
<![CDATA[
private var m:Matrix;
private function loadImage():void {
var m:Matrix = new Matrix();
m.createGradientBox(450, 40);
img.addEventListener(ProgressEvent.PROGRESS,
progress);
img.load("http://thefactoryfactory.com/beach.jpg");
}
private function progress(event:Event):void{
grid.graphics.clear();
grid.graphics.beginGradientFill(""linear", [0x0000ff,
0xffffff], [1, 1], [0x00, 0xff], m);
grid.graphics.drawRect(0, 0, (img.bytesLoaded /
img.bytesTotal) * 300, 40);
grid.graphics.endFill();
}
]]>
</mx:Script>
<mx:Canvas id="grid" height="40" width="300"/>
<mx:Image id="img" y="40"/>
</mx:Canvas>
creationComplete="loadImage()">
<mx:Script>
<![CDATA[
private var m:Matrix;
private function loadImage():void {
var m:Matrix = new Matrix();
m.createGradientBox(450, 40);
img.addEventListener(ProgressEvent.PROGRESS,
progress);
img.load("http://thefactoryfactory.com/beach.jpg");
}
private function progress(event:Event):void{
grid.graphics.clear();
grid.graphics.beginGradientFill(""linear", [0x0000ff,
0xffffff], [1, 1], [0x00, 0xff], m);
grid.graphics.drawRect(0, 0, (img.bytesLoaded /
img.bytesTotal) * 300, 40);
grid.graphics.endFill();
}
]]>
</mx:Script>
<mx:Canvas id="grid" height="40" width="300"/>
<mx:Image id="img" y="40"/>
</mx:Canvas>
加支付宝好友偷能量挖...
