Preloader for multiple external images

[Greasegirl]

Hi,

    I'm currently trying to solve this issue.

I'm creating a 360 turn by importing .png files into each movie clip. I wanted the preloader bar to increase in size as each one loads.

Once the preloader is completed on frame one, I have it go and stop on frame 2, but there is a blank screen for a view seconds. I think the images were still loading after the preloader was completed.

I have tried the fucntion getBytesTotal and getBytesLoaded, but did not work too well.

here is the sample of the code:

this.onEnterFrame =function()

{

preloader._alpha=100;  //Preloader

done=0;

t=0;

for (i=0;i<24;i++)

{

this["CAR_BASE_"+(i+1)].loadMovie("img/car_"+(i+1)+".png");

completed=((i+1)/24)*100;

preloader._xscale=completed;

}

if(completed==100){

gotoAndStop(2);

preloader._alpha=0;

this.onEnterFrame=null;

}

}

[kglad]

your code isn't preloading anything.  it's just checking the progress of your for-loop and that's not helpful.

you should not use a for-loop to load your images but load them sequentially.  you should also use the moviecliploader class to load your images and use its listeners onLoadProgress method.

[Greasegirl]

How would i load them sequentially? Isn't what this for loop is doing? I'm loading in particular number of images of a car at different angles to create a 360 turn.

How would I use the movieClipLoader class for loading all of the images at once?

Thanks in advance.

[kglad]

no, you won't load sequentially using a for-loop.

for example, you can't determine which image will load first and which will load last and, in general, you can't determine the order in which they load.

to load sequentially, use something like:

var mcl:MovieClipLoader=new MovieClipLoader();

var lo:Object=new Object();

lo.onLoadInit=function(target:MovieClip){

i++;

if(i<24){

loadF();

} else {

preloader._alpha=0;

gotoAndStop(2);

}

}

lo.onLoadProgress=function(target:MovieClip,bl:Number,bt:Number){

preloader._xscale = i/24+bl/(bt*24);

}

mcl.addEventListener(lo);

preloader._alpha=100;  //Preloader

var i:Number=0;

loadF();

function loadF(){

mcl.loadClip("img/car_"+(i+1)+".png",this["CAR_BASE_"+(i+1)]);

}

[Greasegirl]

Thank you for the help.

I'm having one issue with the code.

mcl.addEventListener(lo);

I'm getting a compiler error that says "There is no method with the name 'addEventListener'".

Thanks,

[Greasegirl]

I figured it out.

it suppose to be

          mcl.addListener(lo);

Thanks for the help again...

[kglad · Accepted solution]

you're welcome.

[Greasegirl]

In addition to loading in the intial images for the car, I have button listeners that are used to add the different accessories. Each part is also made of a series of images, to show the rotation. I'm trying to apply the preloader that I used to preaload the car images.

I have already predefined a function on the first frame that creates a new movieclip and attach it to a container and adds a car part, which loads in the different angle images into new movieclips.

here is the sample code from the first frame:

var partMovieClip:MovieClipLoader = new MovieClipLoader();

var part_lo:Object = new Object ();

var q:Number = 0;

partMovieClip.addListener(part_lo);

part_lo.onLoadProgress =function (targetMC,bl:Number,bt:Number){

preloader._xscale=((q/24)+bl/(bt*24))*100;

}

function addCarPart(part,level){

    movieClip_part_level=24*level;

  trace("CURRENT VIEW:"+current);

getPart="img/img2/"+sku+"/"+part+"_"+current+".png";

q++;

PART_HOLDER.createEmptyMovieClip(part+"_CLIP_"+q,movieClip_part_level+q);

partMovieClip.loadClip(getPart,PART_HOLDER[part+"_CLIP_"+q]);

return partName;

}

On the Second Frame I am calling the function with one of the buttons:

addButton1.onPress = function(){

Single_PART_LIST[0] = new Array();

Single_PART_LIST[0][0]=addCarPart("wheel",1);

Single_PART_LIST[0][1]=1;

}

[kglad]

i see numerous problems with that code.  is any part of it working?

[Greasegirl]

No, it doesn't work.

I wanted to know how to go about this because I want to keep addCarPart(part,level) function somewhat as it is. It has to return the part name to an array. I am not sure on how to incorporate the onLoadInit and onLoadProgress when addCarPart(part,level) is called by a button. I wanted to create another MovieClipLoader object that is separate from the one used for the initial loading of the car frames.

Here is what I tried to attempt:

I was thinking of inserting partMovieClip.addListener(part_lo) within the addCarPart(part,level). I am unsure of how to use or where to exactly place the onLoadInit() function to loop through createEmptyMovieClip and the clipload.

I have another movieclip on another layer in the timeline called Part_HOLDER and I'm creating a new empty movie clip through each loop and loads in the image a different image of the angle of the carpart.

var partMovieClip:MovieClipLoader = new MovieClipLoader();

var part_lo:Object = new Object ();

var q:Number = 0;

part_lo.onLoadProgress =function (targetMC,bl:Number,bt:Number){

            preloader._xscale=((q/24)+bl/(bt*24))*100;

}

function addCarPart(part,level){

    movieClip_part_level=24*level;

            getPart="img/img2/"+part+"/"+part+"_"+current+".png";

            partMovieClip.addListener(part_lo);   //movie clip listener

            Part_HOLDER.createEmptyMovieClip(part+"_CLIP_"+q,movieClip_part_level+current); //Createn ewMovie Clips for each Accessory PART

            partMovieClip.loadClip(getPart,Part_HOLDER[part+"_CLIP_"+q]);

return part;  //return PART name

}//end addart

here is the button listener:

addButton1.onPress = function(){

    Single_Part_LIST[0] = new Array();
    Single_Part_LIST[0][0]=addCarPart("roof_rack",1);
    Single_Part_LIST[0][1]=1;

}

[kglad]

for each part there is a sequence of images you want to load, correct?  what determines the number of images for each part?

[Greasegirl]

I have a sequence of images that is already predefined.... It's similiar to loading the car sequenses. I have a few buttons. Each button adds in one part. When it's pressed, the preloader so read in a sequence of 24 sequences of the same part.

I tried a few things before this post.

In Frame 1:

part_lo.onLoadInit = function(targetMC){
       preloader._alpha=100;
    q++;     //---> This counter determines the number of images that will load into each new Movie Clip
   
    if(q<24){
       
        addCarPart(part_name_temp,part_level_temp);

k++;
        
    }
   
    else
    {
        preloader._alpha=0;   
   
}
}

//the MAIN addCarPart function

function addCarPart(part,level){
   
    movieClip_part_level=24*level;
   
    getPart="img/img2/"+part+"/"+part+"_"+current+".png";
   
   
           
    Part_HOLDER.createEmptyMovieClip(part+"_CLIP_"+q,movieClip_part_level+current); //CreatenewMovie Clips for each Accessory SKU
    partMovieClip.loadClip(getPart,Part_HOLDER[part+"_CLIP_"+q]);    //Loading the sequences of ONE part
    Single_Part_LIST = new Array();
        Single_Part_LIST[0]=part;     //Storing the name of each part
         Single_Part_LIST[1]=level;   //storing the level number of each part

}

In Frame two I have the first button with the following code. I want this button to activate the addListener, but I don't think it is activating at all because I do not see anything appearing when I run the flash file. Is there another method of doing this?

addButton1.onRelease = function(){  //FIRST PART
   part_name_temp="roof_rack";
   part_level_temp=1;
  partMovieClip.addListener(part_lo);
   
}

[kglad]

when a button is clicked you want to store the target movieclips used to load the images into an array?

[Greasegirl]

It seems to be working.

I have used this to call the part_lo object when the button is pressed

part_lo.onLoadInit(partMovieClip.addListener(part_lo));   ---> this seems to work unless there is another way of doing this?

also found issues with my counters that happened when I was changing the code around.

[Greasegirl]

I'm currently having issues trying to preload external images in which the names are pre assigned to an array.

I am passing a string with delimiters, ex: m_parts = "cargotop|bike_rack|wheel|";

I then save it to an array : multiple_parts=m_parts.split("|");

I have two function addCarPart() which adds a single part at a time and MultipleParts(), which adds the car parts all at once. I tried using the same preloader as I did for the addCarPart(). What seems to be happening is that only the last element of the multiple_parts array is being loaded onto a movie clip.

[kglad]

you're trying to preload a group of carparts and multipleparts?

[Greasegirl]

Yes... I created another button listener to load multiple parts at once.

_global.multiple_parts = [],[]    --> this is my array of part names, which I will use to link to the external png files

m_parts = "cargotop|bike_rack|wheel";  --> a string of part names separated by "I"

multiple_parts=m_parts.split("|");    -->the array will contain a list of each name from the string

I'm trying to make it somehow loop through the onLoadPorgress function. I had the parts load, but the progress bar either does not show, or the bars runs too quickly, which shows a time delay between the progress bar and when the multiple parts load onto the car.

I need a clarification how the onLoadProgress is actually called in.

Thanks in advance,