?
Solved

Preload Images that are loaded dynamically

Posted on 2008-06-14
13
Medium Priority
?
479 Views
Last Modified: 2012-05-05
I have a flash 8 web site that uses an empty movie clip to load in external images. Problem is that some of the images are large. Any ideas on how to "preload" or show the loading progress until the image shows.
0
Comment
Question by:beretta819
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 7
  • 5
13 Comments
 
LVL 43

Expert Comment

by:Rob
ID: 21787932
sure use the MovieClipLoader class

var mcl:MovieClipLoader = new MovieClipLoader();

var mclListener:Object = new Object();

mclListener.onLoadProgress(mc:MoveClip, loadedBytes:Number, totalBytes:Number) {
// show progress here
}

mclListener.onLoadInit(mc:MovieClip) {
// now show the image
}
0
 
LVL 1

Expert Comment

by:ChrisKitching
ID: 21789128
And if you want to use a progress bar, create a movieclip of the progress bar in it's completly done position, give it an instance name of "bar", and alter the code tagit posted to this:
var mcl:MovieClipLoader = new MovieClipLoader();
 
var mclListener:Object = new Object();
 
mclListener.onLoadProgress(mc:MoveClip, loadedBytes:Number, totalBytes:Number) {
    bar._xscale = loadedBytes/(totalBytes/100)
}
 
mclListener.onLoadInit(mc:MovieClip) {
// now show the image
}

Open in new window

0
 
LVL 1

Author Comment

by:beretta819
ID: 21803960
Tagit / Chris
Using the code I get the following error, and I don't know enough of actionscript syntax to fix it.

**Error** Scene=Scene 1, layer=actions, frame=19:Line 5: ')' or ',' expected
     mclListener.onLoadProgress(mc:MoveClip, loadedBytes:Number, totalBytes:Number) {
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 1

Expert Comment

by:ChrisKitching
ID: 21803996
Gosh, that was remarkable stupid of me.sorry, let me try that again...
var mcl:MovieClipLoader = new MovieClipLoader();
 
var mclListener:Object = new Object();
 
mclListener.onLoadProgress = function(mc:MoveClip, loadedBytes:Number, totalBytes:Number) {
    bar._xscale = loadedBytes/(totalBytes/100)
}
 
mclListener.onLoadInit = function(mc:MovieClip) {
// now show the image
}

Open in new window

0
 
LVL 1

Author Comment

by:beretta819
ID: 21804261
Actually the error was mc:Moveclip (missing the i in Movie).
But I created a MC with a rectangle with instance name bar, and it doesn't work. The bar is always there and always full.
0
 
LVL 1

Author Comment

by:beretta819
ID: 21804628
You were right... It needed Function also.
So to make this easier (i think) the site is www.etmiranda.com. on the photos page I have the button thumbnails that when clicked load an external jpg into an empty movieclip (instance name:  imgContainer) in the black photo area on the right.  Do I have to reference the imgContainer name to make this work?
0
 
LVL 1

Accepted Solution

by:
ChrisKitching earned 400 total points
ID: 21805442
Ugh.. sorry man, i'm half asleep over here. I started with the code that other guy posted, which in fact doesn't work :p.
Let's start again with a script more likley to do the trick XD.

Many apologies for my sheer stupidity in this case.
var mcl:MovieClipLoader = new MovieClipLoader();
 
var mclListener:Object = new Object();
 
mclListener.onLoadProgress = function(mc:MovieClip, loadedBytes:Number, totalBytes:Number) {
    bar._xscale = loadedBytes/(totalBytes/100)
}
 
mclListener.onLoadInit = function(mc:MovieClip) {
// now show the image
}
mcl.addListener(mclListener);
mcl.loadClip("SomeJPG.jpg", imgContainer);

Open in new window

0
 
LVL 1

Author Comment

by:beretta819
ID: 21833324
Sorry it took so long to get back...
So the code works, but I am having trouble applying it to all of the different thumbnail buttons so all the images are preloaded.
0
 
LVL 1

Author Comment

by:beretta819
ID: 21833369
Nevermind.... I got it to work.

Thank you for all the help. I up'ed the points.
0
 
LVL 1

Author Comment

by:beretta819
ID: 21833467
Dang it... Spoke to soon. How do I make the "bar" not visible after the image is loaded
0
 
LVL 1

Expert Comment

by:ChrisKitching
ID: 21837340
Easy enough.
var mcl:MovieClipLoader = new MovieClipLoader();
 
var mclListener:Object = new Object();
 
mclListener.onLoadProgress = function(mc:MovieClip, loadedBytes:Number, totalBytes:Number) {
    bar._xscale = loadedBytes/(totalBytes/100)
}
mclListener.onLoadComplete = function(target_mc:MovieClip, httpStatus:Number):Void {
    bar._visible = false;
}
 
mcl.addListener(mclListener);
mcl.loadClip("SomeJPG.jpg", imgContainer);

Open in new window

0
 
LVL 1

Author Comment

by:beretta819
ID: 21837916
Again... Thank you for your help. I think I am done now.
0
 
LVL 1

Expert Comment

by:ChrisKitching
ID: 21838045
Drop me a mail at  christopherkitching@hotmail.com if you need anything else.
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Here are some practices and techniques that can be adopted into your Flash/Flex application development process. Note: Not all "performance tips" provide an immediately-recognizable benefit.   This article does not include timing validation data,…
The last time I worked with Flash and Socket connections was in AS1. A recent project required flash connecting to a Socket, and sending receiving information - we figured it would be easy enough - we all know about the socket policy documents and c…
The goal of the tutorial is to teach the user how to how to load their YouTube profile onto Flash Media Live Encoder.
The goal of the tutorial is to teach the user how to select which audio input to use. Once you have an audio input plugged into the laptop or computer, you will go into the audio input settings and choose which audio input you want to use.
Suggested Courses

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question