Flash Source File
Download this flash document preloader.fla



Whenever we make any web content like website or a browser game using Flash, the size of the it may typically range from few hundred KiloBytes(KB) to few MegaBytes(MB).The swf contains a large number of media objects like movie clips,buttons,graphics,sound,videos.When the user is waiting for the page to load,there might be chances that the server is slow or the user connection is slow or the swf might not be loaded completely.In any of these cases the user will see a partially loaded swf which might not play or he might see a blank swf.Confused,he might leave the page.

To avoid this we can include a preloader in Flash,that shows how much of data is loaded and this also does not allow the swf to play until its completely loaded.

In the very first frame,add a text box with the text tool and set its properties to 'dynamic text'.







In the instance name below type its name as number_txt.







Add a layer at the top and name it actionScript.












Place the following code in the frame 1 of actionscript layer.





var current:Number;
var total:Number;
var loaded:Number;
var duration:Number=100;
var loadInterval:Number;

total = _root.getBytesTotal();
loadInterval = setInterval(this,"preloader",duration);

function preloader() {
current = _root.getBytesLoaded();
loaded = Math.round(current/total*100);
_root.number_txt.text=loaded;
if(current>=total){
gotoAndPlay(2);
clearInterval(loadInterval);
}
}

stop();

KeyFrames
_root.getBytesLoaded() returns the number of bytes that are currently loaded into the user's PC.

_root.getBytesTotal() returns the size of the swf.

current/total*100 gives the percentage of the file loaded.

Math.round(value:Number) rounds the value to an integer and returns the value.

Make sure the interval is cleared at the end.

Put some media in the later frames and test your document.

Related Posts
Simulate Download:Bandwidth Profiler

Now that you have created your swf,you want to see how does it actually appear in a web page while being downloaded.Flash has a simulator that avoids the tedious process of testing it by uploading to a server.

We are aware that pressing Ctrl+Enter publishes the swf.The simulate download option is available in the published swf.





We can directly simulate the download by pressing (Ctrl+Enter) twice.

We can adjust the download settings in the published swf's menu
View>Download Settings



There are few default options,however,you can set your own.

A bandwith profiler is also available in the View Menu of the published swf,which shows a very detailed view of the download,also showing the size each frame contains.

Flash provides excellent features for sound and making your application interactive.Sounds can be imported into the flash document and use it multiple times the way you want it.Flash supports .wav and .mp3 formats by default and other formats on having a compression application.Check the remaining formats by searching "Importing Sounds" in the Flash Help.

If you want to add the sound using GUI read the following.If you want to add the sounds using actionscript for more control read importing sound,adding identifier and jump directly to the actionscript at the end.

Importing Sounds

To import a sound into the document library navigate File > Import > Import to Library and select the file.

Adding Identifiers

Identifier is similar to the instance name of a movie clip.We use an identifier to refer the sound.Add identifier by Right-clicking the sound clip in the library panel and select Linkage in the menu.The linkage properties are also found in the properties box Advanced Menu.



In the linkage properties give an identifier name and make sure you have checked the Export for ActionScript and Export for first frame options.This is important for any sound to play.Give an identifier name to the sound.In this case I have named it 'smash'.


Adding Sound to the timeline

Like MovieClips or Buttons,sounds can also simply be dragged into the timeline.When a movie clipped is dragged into an empty frame,we can see a keyframe there.For sounds we see the wave of the sound clip.





Sound clip added this way always plays whenever the first frame of this sound wave is played in the original movie.This type of sound addition is suitable for background music that plays continuously through out the movie.

Add Sound to buttons

Sounds can be added to button instances by editing the button behaviors.Select the button for which the sound is to be added and Navigate to Window>Behaviors or press (Shift + F3) for the behaviours panel to show.Make sure that the button is selected while adding the behavior.We can see that in the Behavior panel too.Click the add behaviour button>Sound>Load Sound from Library.




Give the identifier of the sound to be added and also an instance name for the sound.



And added behaviour looks like this.



While the default behaviour is set to onRelease,we can choose other options too.




We can add sound directly in the button's timeline by dragging it.We can change the behaviour by placing it either in the Up,Over or Down keyframe similar to adding behaviour to the button for onRollOut, onRollOver or onRelease actions respectively.


Add and Control sounds using ActionScript

ActionScript has the Sound class for controlling sounds.We declare a new variable of type Sound.

var myClip:Sound=new Sound();

with the identifier added to the sound clip in the library,we link the identifier to our new sound object

myClip.attachSound("smash");

With this we have added a new Sound object and linked the sound clip to this object myClip.

We have full control of the myClip object with the following properties.

myClip.start() //Starts the sound
myClip.stop() //Stops the sound
myClip.getVolume() //Returns the sound volume level as an integer from 0 to 100
myClip.setVolume(value:Number) //Sets the sound volume level to the specified number
myClip.onSoundComplete= function() //Calls the function when the clip has competed playing

We can also get the attributes of the myClip object with the following.

myClip.duration //Returns the total duration of a sound, in milliseconds
myClip.position //Returns the duration after which the sound started playing.


The following code will start the sound at the beginning and stops when the button is clicked.

var myClip:Sound = new Sound();
myClip.attachSound("smash");
myClip.start() ;
stop_btn.onRelease = function() {
myClip.stop();
}

Hi, I am a blogger and a developer.I develop applications in Flash and I also write tutorials in Flash.You can see all my Flash tutorials here.You can also request me to write a tutorial on any topic you would want.

Most of my tutorials will be actionscript centred.I will keep coming with all the tutorials I can.