Flash CS5通过XMl动态加载外部图片

互联网2017-07-27

  首先我们新建一个空白的Flash文件。

[AS3编程教学]如何通过xml加载外部图片

  我们新建4个注册点在左上角的影片剪辑,填充色未50%黑色,最好大小都不相同,给四个容器

 

  分别取名字为mc0,mc1,mc2,mc3,并且写出他们要加载的图片内容名字,以便于我们明显地观察加载是否按照既定的顺序进行:

 

  如图所示,我们打算加在四张动物图片进来,所以要先找四张动物图片到硬盘某个位置存好。为了方便起见,我就放在fla本地目录下,这个过程自己完成,大小不限。

 

[AS3编程教学]如何通过xml加载外部图片
[AS3编程教学]如何通过xml加载外部图片

  下面我们写一个xml文件,用来保存四张图片信息,我们稍后就是通过读取这个xml文件,解析得到其中的图片数据,然后通过其中的图片路径加载进来到四个容器中。xml如下:

  

  

pic/1.jpg

pic/2.jpg

pic/3.jpg

pic/4.jpg

  

  

  我们把图片保存在fla文件所在位置的pic目录下。

[AS3编程教学]如何通过xml加载外部图片

  接下来我们放一个按钮在舞台上,上面有“加载”两个字,取实例名未btnLoad:

[AS3编程教学]如何通过xml加载外部图片

  接下来我们写一个加载函数:loadPic(path:String,cup:Sprite,index:int):void,就如这个函数名和参数所示,功能就是把path路径的图片加载到cup容器中去,index是加载顺序编号,在连续的加载过程中,这个编号往往是很有用的:

  //加载图片到容器中

  function loadPic(path:String,cup:Sprite,index:int):void

  {

  var mLoader:Loader = new Loader();

  mLoader.name = "loader" + index;

  mLoader.load(new URLRequest(path));

  mLoader.contentLoaderInfo.addEventListener(Event.COMPLETE,completeLoad);

  }

  function completeLoad(e:Event):void {

  var targetLoader:Loader = e.target.loader as Loader;

  var index:int =int(targetLoader.name.slice(6));

  var getPic:Bitmap = Bitmap(targetLoader.content);

  var curentCup:Sprite = this["mc" + index] as Sprite;

  getPic.width = curentCup.width;

  getPic.height = curentCup.height;

  curentCup.addChild(getPic);

  }

  我们给mLoader一个name属性,作用是在后面判断到底加载的是哪个容器。

[AS3编程教学]如何通过xml加载外部图片

  然后我们写加载解析xml文件数据的函数如下:

  //加载xml数据

  function loadXMLData(path:String):void

  {

  var xLoader:URLLoader = new URLLoader();

  xLoader.addEventListener(Event.COMPLETE,completeLoadData);

  xLoader.load(new URLRequest(path));

  }

  function completeLoadData(e:Event):void

  {

  var mXML:XML = XML(e.target.data);

  var len:int = int(mXML.pic.@amount);

  for(var i:int = 0;i

  {

  var mPath:String = mXML.pic.path[i];

  loadPic(mPath,this["mc"+i],i);

  }

  }

  4个图片的路径在读取出来的时候便同时加载了图片

[AS3编程教学]如何通过xml加载外部图片

  最后我们给按钮btnLoad加上加载图片的功能,按钮来衔接完成读取xml数据和图片加载的功能。

  addMouseEvent();

  function addMouseEvent():void

  {

  btnLoad.addEventListener(MouseEvent.CLICK,loadPicInfo);

  }

  function loadPicInfo(e:MouseEvent):void

  {

  loadXMLData("picData.xml");

  }

  单击按钮,便发现四张图加载进来,并且充满了四个容器:)

  制作完毕!

 

[AS3编程教学]如何通过xml加载外部图片