FLASH AS外部加载图片 AS2.0 AS3.0

AS2.0中有MovieClip和全局中有loadMovie函数可以动态加载图片,但是这不是异步加载,而且没法知道图片大小。在AS3.0中,有Loader类来实现从外部载入swf和各种图片。

FLASH AS外部加载图片 AS2.0 AS3.0

效果如下,载入的过程中会有进度条提示,载入完成过后可以根据图片的尺寸进行缩放,按比例的缩小放在400×300的方框中,居中显示

AS代码

progress.visible = false;

btnSubmit.addEventListener(MouseEvent.CLICK,btnSubmitClickHandler);

function btnSubmitClickHandler(e:MouseEvent) {

loadPicture(ddlUrl.value);

}

var loader:Loader;

function loadPicture(url:String) {

if(loader == null){

loader = new Loader();

}else{

loader.unload();

txtAlert.text = "";

}

loader.contentLoaderInfo.addEventListener(Event.COMPLETE,completeHd);

loader.contentLoaderInfo.addEventListener("ioError",errorHd);

var request:URLRequest = new URLRequest(url);

var context:LoaderContext = new LoaderContext(true);

loader.load(request,context);

progress.visible = true;

}

var maxHeight:int = container.height;

var maxWidth:int = container.width;

function completeHd(e:Event) {

txtAlert.text = "* Load success!";

var pic:Bitmap = loader.content as Bitmap;

pic.smoothing = true;

var currentWidth:int = loader.width;

var currentHeight:int = loader.height;

if(currentWidth > maxWidth){

currentWidth = maxWidth;

currentHeight = currentWidth/loader.width * loader.height;

}

if(currentHeight > maxHeight){

currentHeight = maxHeight;

currentWidth = currentHeight/loader.height * loader.width;

}

loader.content.width = currentWidth;

loader.content.height = currentHeight;

loader.x = (maxWidth - currentWidth)/2;

loader.y = (maxHeight - currentHeight)/2;

container.addChild(loader);

progress.visible = false;

}

function errorHd(e:Event){

progress.visible = false;

txtAlert.text = "* Url is invalid, Please try again for another url!";

}

关键在于对Loader类的使用,Loader具有contentLoaderInfo属性,此属性是一个LoaderInfo类的实例,用来控制加载外部资源的进度,因此就可以在contentLoaderInfo上注册各种事件,这里只用了Complete事件,用于加载完成时调用。

Loader还具有content属性,Loader实例本身就是一个可视对象,content也是一个可视对象,如果加载的地址是一个图片的话,content是一个Bitmap对象,所以可以通过转型来使得载入的图片在缩小的时候消除锯齿,将Bitmap的smoothing属性设置为true即可。

////////////////////////////////////////////////////////////////////////方式二

_root.createEmptyMovieClip("图MC", 1);

//创建一个MC来装加载进来的图片

var 下载 = new MovieClipLoader();

//创建一个下载类

下载.loadClip("//mypcera.com/star/u1/2006/12/09/20061209173421176351.jpg", 图MC);

//下载图片到MC。

//这样就完成了外部加载图片,如果想知道加载图片的详细信息,就要侦听加载的过程

/////////////////////////////////////////////////////////////

//怎么知道图片开始下载呢?用这个方法onLoadStart,开始下载后会告诉你!

侦听 = new Object();

侦听.onLoadStart = function() {

trace("图片已经开始下载");

};

/////////////////////////////////////////////////////

///怎么知道图片已经下载完成呢?用onLoadInit或onLoadComplete,下载完成告诉你!

侦听.onLoadInit = function() {

trace("图片已经下载完成");

};

///我想知道下载的进度呢?用onLoadProgress,下载多少告诉你!

侦听.onLoadProgress = function(mc:MovieClip, bytesLoaded:Number, bytesTotal:Number) {

trace("下载进度="+bytesLoaded/bytesTotal*100)+"%";

};

/////////////////////////////////////////////////////////

侦听.onLoadComplete = function() {

trace("这个和onLoadInit一样是图片下载完成后使用");

trace("区别是onLoadInit加载完成SWF后会初试化SWF加载进来的数据");

trace("而onLoadComplete不会初试化");

};

下载.addListener(侦听);

//侦听出错的方法onLoadError这个自己看看吧!!

////////////////////////////////////////////////////////////////////////////////////////方式三

1.建立一个文件夹,名称随意,这里以flash命名;在此文件夹中建立一个名为“img”的文件夹,用来存放图片,图片名称1.jpg,2.jpg.....

2.在img文件夹中新建名为info的文本文件,在其中输入num=x,x为文件夹中的图片数量,比方说num=6,num=12等等。

3.在flash中新建400x300的fla文档,保存在flash文件夹下。

4.在flash中建立两个层,分别名为"as","btn"。在btn层中建立两个按钮,位置自取,实例名为backBtn,forwardBtn.

5.as层中代码如下.

//初始化函数

function init() {

loadVar();

//载入变量

this.createEmptyMovieClip("emptyMc", 1);

//创建一个空影片剪辑用来存放图片

i = 1;

loadJpg(emptyMc, i);

//程序第一次运行时载入第一张图片

}

//载入变量函数

function loadVar() {

loadVariablesNum("img/"+"info.txt", 0);

//从文本文件中载入变量Num

this.onEnterFrame = function() {

if (Num) {

delete this.onEnterFrame;

}

//变量如果载入,删除onEnterFrame函数

};

//用onEnterFrame函数判断变量是否载入

}

//加载图片的函数,把图片加载到影片剪辑mc中,i表示图片序号

function loadJpg(mc, i) {

mc.loadMovie("img/"+i+".jpg");

//把图片加载到影片剪辑mc中

this.onEnterFrame = function() {

if (mc._width) {

delete this.onEnterFrame;

mc.imgMove();

//图片过渡效果

setBtn(backBtn, 1);

/*设置后退按钮,当显示第一张图片时,后退按钮的透明为50,不可用,其他情况按钮正常*/

setBtn(forwardBtn, num);

/*设置前进按钮,当显示最后一张图片时,后退按钮的透明为50,不可用,其他情况按钮正常*/

}

};

}

//设置控制函数,obj为按钮实例名,n代表图片的序号

function setBtn(obj, n) {

if (i == n) {

obj._alpha = 50;

obj.enabled = false;

//如果图片的当前序号为n,设置按钮的透明度为50,按钮不可用

} else {

obj._alpha = 100;

obj.enabled = true;

//如果图片的当前序号不为n,设置按钮的透明度为100,按钮可用

}

}

//图片过渡效果函数

MovieClip.prototype.imgMove = function() {

var mc = this;

//定义一个影片剪辑类型变量

mc._x = (400-mc._width)/2;

mc._y = (300-mc._height)/2;

//图片在新场景中居中分布,场景大小为400x300

mc._alpha = 0;

mc.onEnterFrame = function() {

mc._alpha += (100-mc._alpha)/10;

//图片透明度递增

if (mc._alpha>=95) {

delete mc.onEnterFrame;

}

};

};

init();

//调用初始化函数

backBtn.onRelease = function() {

i -= 1;

//变量-1

loadJpg(emptyMc, i);

};

//释放后退按钮执行动作

forwardBtn.onRelease = function() {

i += 1;

//变量+1

loadJpg(emptyMc, i);

};

//释放前进按钮执行动作