Solved

Preload Images that are loaded dynamically

Posted on 2008-06-14
13
459 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
  • 7
  • 5
13 Comments
 
LVL 42

Expert Comment

by:Rob Jurd, EE MVE
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
Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

 
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 100 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

Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
SWF won't scale? 4 524
Where to download Acrobat flash offline installer? 2 248
Adobe Presenter not Publishing Slide Theme 17 125
Play RTMP without Flash 3 551
Sometimes you know that one object has a specific child in it, but you can't find the child. This happened to me when I was trying to code some actionScript to make a toolbar work with its embedded buttons.  My partner had created the toolbar usi…
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 set there setting in Adobe Flash Media Live Encoder and YouTube for optimal video and audio quality.
The goal of the tutorial is to teach the user how to select the video input device. Make sure you have an input device that in connected and work and recognized by Adobe Flash Media Live Encoder and select it in the “video input” menu.

825 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