AS3. How can a global var take a value which appears in a listener Event.COMPLETE

Question

This is my code:

package {
  import flash.display.MovieClip;
  import flash.events.Event;
  import flash.display.Loader;
  import flash.net.URLRequest;
  import flash.display.LoaderInfo;
  import fl.transitions.Tween;
  import fl.transitions.easing.*;
  import flash.display.Sprite;
  import flash.events.MouseEvent;
  import flash.display.DisplayObject;

  import flash.display.BitmapData;
  import flash.display.Bitmap;
  import flash.display.GradientType;
  import flash.sampler.getSize;

public class Miniaturka extends MovieClip {
    
    private var id:String;
    public static var miniWidth:Number = 0;
    private var tween:Tween; 
    private var tryb:Boolean; 
    private var button:Sprite; 
    private var index:Number; 
    private var aktywna:Boolean = false; 
    public var bLoad:Boolean = false; 
    public function Miniaturka(id:String,index:Number):void {
        this.id = id;
        this.index = index;
        tryb = false; 
        var loader:Loader = new Loader();
        loader.load(new URLRequest("images/"+id+"m.jpg"));
        loader.contentLoaderInfo.addEventListener(Event.COMPLETE,nLoadComplete);
    
        this.alpha = 1;
        button = new Sprite();
        button.graphics.beginFill(0x000000,0);
        button.graphics.drawRect(0,0,889,500);
        button.graphics.endFill();
        button.buttonMode = true; 
        addChild(button);

        button.addEventListener(MouseEvent.MOUSE_OVER,onOver);
        button.addEventListener(MouseEvent.MOUSE_OUT,onOut);
        button.addEventListener(MouseEvent.CLICK,onClick);
    }
    
    private function nLoadComplete(event:Event):void {
        
        var loader:Loader = new Loader();
        loader = LoaderInfo(event.target).loader;
        pusty.addChild(loader); 

        ladowanie.visible = false;
        tween = new Tween(pusty,"alpha",Regular.easeOut,0,0.6,2,true); 
        bLoad = true; 
        setStan(false);
        miniWidth = loader.width;       
        pusty.alpha = 0;
    }
    
    private function onOver(event:MouseEvent):void {
        if (!aktywna) { 
            setStan(true);
        }
    }
    private function onOut(event:MouseEvent):void {
        if (!aktywna) {
            setStan(false);
        }
    }
    private function onClick(event:MouseEvent):void {
        aktywuj();
    }
    public function deaktywuj():void { 
        setStan(false); 
        aktywna = false;
    }
    public function aktywuj():void {    
        MovieClip(parent).deaktywuj(); 
        aktywna = true;
        setStan(true); 
        MovieClip(parent.parent).loadBig(id,index); 
    }

    private function setStan(tryb:Boolean):void {
        this.tryb = tryb; 
        if (tryb) { 
            pusty.alpha = 1;
        } else {
            pusty.alpha = 0.6;
        }
    }
  }
}

I want to create a gallery, and this is a code of a class which loads jpg. files with different widths, but the same height.

My problem is that I want to make the public static var miniWidth which takes the value: loader.width in function: nLoadComplete, take that value as a global var, and put it in the line: button.graphics.drawRect(0,0,889,500); so it would look like button.graphics.drawRect(0,0,miniWidth ,500);

This will create a button(rectangle) the same height and width as the loaded jpg. but i can't figure it out... How can I do that?

Answer 1

Wait for the image to load before drawing your shape. In the example below, I've only reprinted the affected functions.

private function Miniaturka(id:String, index:Number):void {
    this.id = id;
    this.index = index;
    tryb = false;
    var loader:Loader = new Loader();
    loader.load(new URLRequest("images/" + id + "m.jpg"));
    loader.contentLoaderInfo.addEventListener(Event.COMPLETE, nLoadComplete);

    this.alpha = 1;
}

private function nLoadComplete(event:Event):void {
    var loader:Loader = new Loader();
    loader = LoaderInfo(event.target).loader;
    pusty.addChild(loader);

    ladowanie.visible = false;
    tween = new Tween(pusty, "alpha", Regular.easeOut, 0, 0.6, 2, true);
    bLoad = true;
    setStan(false);
    miniWidth = loader.width;
    pusty.alpha = 0;

    createBtn();
}

private function createBtn():void {
    button = new Sprite();
    button.graphics.beginFill(0x000000, 0);
    button.graphics.drawRect(0, 0, miniWidth, 500);
    button.graphics.endFill();
    button.buttonMode = true;
    addChild(button);

    button.addEventListener(MouseEvent.MOUSE_OVER, onOver);
    button.addEventListener(MouseEvent.MOUSE_OUT, onOut);
    button.addEventListener(MouseEvent.CLICK, onClick);
}