image loader fade

[dips045]

Hi

I am loading eternal images into a moviclip:

          function loadImage(url:String):void {

                    imageLoader = new Loader();

                    imageLoader.load(new URLRequest(url));

                    imageLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, imageLoading);

                    imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoaded);

          }

          loadImage("images/" + image + ".jpg");

          function imageLoading(e:ProgressEvent) {

                    loading_mc.play();

                    var percent:int=e.bytesLoaded/e.bytesTotal*100;

                    loaderStatus.text="LOADING";

          }

          function imageLoaded(e:Event):void {

                    if (image_mc.loadedImage) {

  image_mc.removeChild( image_mc.loadedImage );

                    }

image_mc.loadedImage=imageLoader;

                    image_mc.addChild(imageLoader);

                    loading_mc.gotoAndPlay(1);

                    loaderStatus.text=" ";

          }

I'm having trouble fading in each image. Can anyone help?

[Nabren]

Add an ENTER_FRAME listener and modify the alpha of your image_mc from 0 to 1 depending on the rate you want it to fade in after it loads.

[dips045]

can you give me an example please? Everytime I've tried to add a fade to the movieclip, it fades in just the once and not everytime an image is loaded.

Many thanks

[Nabren · Accepted solution]

function imageLoaded(e:Event):void {

          if (image_mc.loadedImage) {

                    image_mc.removeChild( image_mc.loadedImage );

          }

          image_mc.loadedImage=imageLoader;

          image_mc.addChild(imageLoader);

          loading_mc.gotoAndPlay(1);

          loaderStatus.text=" ";

          // Fade in

          image_mc.alpha = 0;

          image_mc.addEventListener(Event.ENTER_FRAME, fadeIn);

}

function fadeIn(e:Event):void

{

          var fadeTarget:DispayObject = e.target as DisplayObject;

          fadeTarget.alpha += 0.05;

          if (fadeTarget.alpha >= 1)

          {

                    fadeTarget.alpha = 1;

                    fadeTarget.removeEventListener(Event.ENTER_FRAME, fadeIn);

          }

}

[dips045]

Thanks so much for the code.

I am getting an error with this line

var fadeTarget:DispayObject=e.target as DisplayObject;

1046: Type was not found or was not a compile-time constant: DispayObject..

How can I solve this?

Thanks again

[Nabren]

If you ever get a type error that means you are not importing the class. An easy way to do this with Flash Builder is to place your cursor at the end of the type and press Control + Space and then choose the right one if it gives you multiple options.

[dips045]

Many thanks for your help!!!!

I have another question - relating to this so I haven't posted another question. Hope you don't mind helping again!?

What is the best way to unload the imageloader?

I don't want to get rid of it.

If the image loader loads a specific image, I want to clear another movieclip, but not remove it.

I end up removing it, so when I need to load the movieclip with the image again - it can't find it!

Hope that makes sense?

[Nabren]

Just save it in a dictionary for later retrieval by a key you can predict:

var imageLoaders:Dictionary = new Dictionary();

function loadImage(url:String):void {

          imageLoader = new Loader();

          imageLoader.load(new URLRequest(url));

          imageLoader.contentLoaderInfo.addEventListener(ProgressEven t.PROGRESS, imageLoading);

          imageLoader.contentLoaderInfo.addEventListener(Event.COMPLE TE, imageLoaded);

          // Save for later use

          imageLoaders[url] = imageLoader;

}

and then you would just check imageLoaders[url] and if that isn't null that is where your Loader will be.

[dips045]

Thank you Nabren!

[dips045]

Hi again Nabren, I've come across another issue and was wondering if you could shed some light?

The movieclip that fades in, is resized on the next frame.

After adding the fadein fuction, the image shows up as the normal size.

I want to resize and postiton the movieclip but it doesn't happen with the fadein function.

Why is this?

Thanks for your help again