Resize XML gallery with AS3

Question

Hi,

I'm developing a project in AS3 for commercial purposes and study too.

This time I'm developing an image gallery with XML and AS3 and I have a doubt with resizing the stage and change the x position of my pictures.

With this code below I can resize the pictures, but I can't change their x values.

Could anyone helpe-me with a light on this breaking-head situation?

Thanx a lot!

The code I'm using:

import flash.display.StageScaleMode;
import flash.display.StageAlign;

stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;


var container_mc:MovieClip;

var my_images:XMLList;
var my_total:Number;

var my_thumb_width:Number;
var my_thumb_height:Number;

var x_counter:Number = 0;



var myXMLLoader:URLLoader = new URLLoader();
myXMLLoader.load(new URLRequest("xml/snfashion_xml.xml"));
myXMLLoader.addEventListener(Event.COMPLETE, processXML);

function processXML(e:Event):void {
var myXML:XML = new XML(e.target.data);

my_images = myXML.IMAGE;
my_total = my_images.length();

createContainer();
callThumbs();

myXMLLoader.removeEventListener(Event.COMPLETE, processXML);
myXMLLoader = null;
}

function createContainer():void {
container_mc = new MovieClip();
container_mc.x = 0;
container_mc.y = 0;
addChild(container_mc);
}

function callThumbs():void {
for (var i:Number = 0; i < my_total; i++) {

 var thumb_url = my_images[i].@THUMB;

 var thumb_loader = new Loader();
 thumb_loader.load(new URLRequest(thumb_url));
 thumb_loader.contentLoaderInfo.addEventListener(Event.COMPLETE, thumbLoaded);

 thumb_loader.name = i;

 thumb_loader.x = ((stage.stageHeight-80)*0.451428)*(x_counter);
 thumb_loader.y = 0;

 if (x_counter < my_total) {
  x_counter++;
 } 
}
}

function thumbLoaded(e:Event):void {
var my_thumb:Loader = Loader(e.target.loader);
container_mc.addChild(my_thumb);
my_thumb.contentLoaderInfo.removeEventListener(Event.COMPLETE, thumbLoaded);

my_thumb.width = (stage.stageHeight-80)*0.4571428;
my_thumb.height = stage.stageHeight-80;




function thumbLoadedResize (e:Event):void
 {
  trace("STAGE HAS BEEN RESIZED");

  my_thumb.width = (stage.stageHeight-80)*0.4571428;
  my_thumb.height = stage.stageHeight-80;

 }

 stage.addEventListener(Event.RESIZE, thumbLoadedResize);

}

I tried to call stage resize functions at thumb_loader and my_thumb but it did not worked, in spit of not generating error messages.

Answer 1

On the face of it it looks like you might have a race condition somewhere. Its hard to follow the code because its kind of a spaghetti, but there is one obvious problem: you start loading the thumbnails and only then setup the loader's coordinates. Its quite possible that the thumbnail's COMPLETE event is fired before or during the setup and that messes things up.

Here are a few things to try:

• Setup the loader, including adding it to the container before you execute load().

• don't define a function inside another function unless you use anonymous functions:

  Bad:

  function abc() { trace('abc'); } object.addEventLisenter("event",abc);

  Good:

  object.addEventListener("event", function() { trace('abc'); });

• There is not much point in removing an event listener from an event that fires only once and had already done so. Nor is there much point in nullifying variables - either the garbage collector will handle them or it won't, that extra lines is just unneeded verbosity.