ActionScript for preloaders

[AmEcCs]

ameth

Man i cant understand the differennts kinds of actionscript for proloaders, can sum1 help me with that??

[schorhr]

a) what kind do you want to make
b) why dont you use the newgrounds preloade
c) use the search to find a post with links/tutorials
d) go to flashkit.com

[otacon]

Or just use one of these: http://www.geocities.com/mercloaders/

[byteofthat]

http://www.newgrounds.com/portal/view/39399 that is a realy great tutorial

[Homi-Wan]

If you want a quick fix (doesn't look fancy but does the job) just copy and paste this code. Just put blank keyframes at frames 1 and 2 and paste in the respective code segments here:

// START OF SCRIPT FOR FRAME 1.
var frac = _root.getBytesLoaded() / _root.getBytesTotal();
var colorVal = "0xffffff";
var boxA = this.createEmptyMovieClip("Outline", 3);
boxA.lineStyle(3, colorVal, 100);
boxA.moveTo(20, 20);
boxA.lineTo(120, 20);
boxA.lineTo(120, 40);
boxA.lineTo(20, 40);
boxA.lineTo(20, 20);
var boxB = this.createEmptyMovieClip("Fill", 2);
boxB.lineStyle(0.5, colorVal, 100);
boxB.moveTo(20, 20);
boxB.beginFill(colorVal);
boxB.lineTo(frac * 100 + 20, 20);
boxB.lineTo(frac * 100 + 20, 40);
boxB.lineTo(20, 40);
boxB.lineTo(20, 20);
boxB.endFill();
if (frac == 1) {
Outline.removeMovieClip();
Fill.removeMovieClip();
gotoAndPlay(3);
}
play();
// END OF SCRIPT FOR FRAME 1.

// START OF SCRIPT FOR FRAME 2.
gotoAndPlay(1);
// END OF SCRIPT FOR FRAME 2.

[schorhr]

Why do you create the preloader dynamicly instead of making a few MCs?

[Homi-Wan]

I don't personally... I pretty much made up that code for people using Flash 5 who can't use the newgrounds preloader fla and don't want to learn how to make their own.

[otacon]

You know, that dyninamic preloader must be much easier to use than building it with movie clips and all that stuff.

[schorhr]

Yes, you just copy and paste. But with MCs you can be more creative with less work.

[otacon]

At 8/6/04 06:41 PM, schorhr wrote:

:But with MCs you can be more creative with less work.

Yep. That's another good point. I think the dynamic one is perfect for n00bs.

[schorhr]

Preloader + noobs == multiple chaos threads in forum 2 without clear toppic.

A hit on the head == perfect for n00bs

[AngryAxel]

At 8/6/04 06:41 PM, schorhr wrote: Yes, you just copy and paste. But with MCs you can be more creative with less work.

www.freewebs.com/beta2/BluePreloader.fla
Myeah, That's a modification of the Newgrounds preloader

Special thanx to Joe for doing the Stream button

[ChocolateChipClock]

Here's a little tutorial I made... take a look.

http://www.worms3d.net/ezekiel/TACTICSITE/other/preloader.htm

[Homi-Wan]

Boredom + practicing every ActionScript-related this week =
Improved version of the pure AS preloader:

// ActionScript Preloader (Homi-Wan).
// START OF SCRIPT FOR FRAME 1.
var frac = _root.getBytesLoaded() / _root.getBytesTotal();
// To change the color of the display, substitute
// another hex color code for the ffffff part.
var colorVal = "0xffffff";
var boxA = this.createEmptyMovieClip("Outline", 3);
boxA.lineStyle(3, colorVal, 100);
boxA.moveTo(20, 20);
boxA.lineTo(120, 20);
boxA.lineTo(120, 30);
boxA.lineTo(20, 30);
boxA.lineTo(20, 20);
var boxB = this.createEmptyMovieClip("Fill", 2);
boxB.lineStyle(0.5, colorVal, 100);
boxB.moveTo(20, 20);
boxB.beginFill(colorVal);
boxB.lineTo(frac * 100 + 20, 20);
boxB.lineTo(frac * 100 + 20, 30);
boxB.lineTo(20, 30);
boxB.lineTo(20, 20);
boxB.endFill();
_root.createTextField("loadSign", 4, 17, 32, 80, 20);
loadSign._visible = random(2);
loadSign.text = "LOADING . . .";
loadSign.textColor = colorVal;
if (frac == 1) {
Outline.removeMovieClip();
Fill.removeMovieClip();
loadSign.text = "COMPLETE";
loadSign._visible = true;
var playA = this.createEmptyMovieClip("PressPlay", 5);
playA.lineStyle(0.5, colorVal, 100);
playA.moveTo(105, 37);
playA.beginFill(colorVal);
playA.lineTo(105, 46);
playA.lineTo(115, 41.5);
playA.lineTo(105, 37);
playA.endFill();
}
PressPlay.onPress = function() {
loadSign.removeTextField();
PressPlay.removeMovieClip();
_root.gotoAndPlay(3);
};
play();
// END OF SCRIPT FOR FRAME 1.

// START OF SCRIPT FOR FRAME 2.
gotoAndPlay(1);
// END OF SCRIPT FOR FRAME 2.

And an animted gif to show what the result is! Did I mention the boredom part?

[schorhr]

At 8/6/04 08:26 PM, Homi-Wan wrote: And an animted gif to show what the result is! Did I mention the boredom part?

Yes you did :-)
Why are you so bored?

I think i will use this preloader since its a nice piece of code, plus like the flickering random loading, reminds me of my harddisk led :-)

Oh, by the way, why dont you ad something like

var codeMC = this.createEmptyMovieClip("codebox", -3);

codebox.onEnterFrame = function()
{
if((_root._currentframe<3)&&(_root._currentframe==2)){_root.gotoAndPlay(1);
}
}

or you ad your whole loader function into this.
This way noobs just have to paste into frame one, and dont have to worry about another keyframe :-)

Also you should change the color to aaaaaa instead of ffffff and write

://insert 0x000000 for a black loader. When selecting a color on the left of flash you can see what color has what value at the top of the color selector. Replace the # with 0x, as seen here

so n00bs will somewhat see what is going on.

[Homi-Wan]

Heh, feel free to improve on the code. I gave up on it anyways after I realized that the createEmptyMovieClip commands won't work with Flash 5, which was my motivation to begin with. Those poor noobs with F5 that can't use the NG loader.

Actually I've just been trying to pick up simple AS requests off these boards for practice. I only started reading the ActionScript Definitive Guide a few days ago and I'm like about 1/3 of the way through.

[schorhr]

Well its still a nice piece of code!

[Homi-Wan]

Aw thanks schorhr. Well it turns out I'm still bored so I just went ahead and made it a one frame script. It doesn't get any simplier than this kids! Just insert a single blank keyframe at the start of your movie and paste this in! You can even decorate this frame with graphics to hopefully make it look more lively.

// ActionScript Preloader (Homi-Wan).
// Paste this code into the first frame of your movie.
// Current display color is set to white (ffffff).
// To change the color of the display, substitute
// another hex color code for the ffffff part just below.
// EX: black is 000000, red is ff0000, blue is 0033ff.
// The hex code for any color is displayed in the bottom
// left of the Color Mixer panel (Shift+F9 if not there).
var colorVal = "0xffffff";
// That's all. Don't worry about the rest of the code.
var playA = this.createEmptyMovieClip("PressPlay", 7);
playA.lineStyle(0.5, colorVal, 100);
playA.moveTo(105, 37);
playA.beginFill(colorVal);
playA.lineTo(105, 46);
playA.lineTo(115, 41.5);
playA.lineTo(105, 37);
playA.endFill();
PressPlay._visible = false;
var ctrlA = this.createEmptyMovieClip("Control", 0);
Control.onEnterFrame = function() {
var frac = _root.getBytesLoaded() / _root.getBytesTotal();
var boxA = _root.createEmptyMovieClip("Outline", 4);
boxA.lineStyle(3, colorVal, 100);
boxA.moveTo(20, 20);
boxA.lineTo(120, 20);
boxA.lineTo(120, 30);
boxA.lineTo(20, 30);
boxA.lineTo(20, 20);
var boxB = _root.createEmptyMovieClip("Fill", 3);
boxB.lineStyle(0.5, colorVal, 100);
boxB.moveTo(20, 20);
boxB.beginFill(colorVal);
boxB.lineTo(frac * 100 + 20, 20);
boxB.lineTo(frac * 100 + 20, 30);
boxB.lineTo(20, 30);
boxB.lineTo(20, 20);
boxB.endFill();
_root.createTextField("loadSign", 5, 17, 32, 80, 20);
loadSign.text = "LOADING . . .";
loadSign.textColor = colorVal;
loadSign._visible = random(2);
if (frac == 1) {
Outline.removeMovieClip();
Fill.removeMovieClip();
loadSign.text = "COMPLETE";
loadSign._visible = true;
PressPlay._visible = true;
}
};
PressPlay.onPress = function() {
loadSign.removeTextField();
PressPlay.removeMovieClip();
Control.removeMovieClip();
_root.play();
};
stop();

[schorhr]

At 8/7/04 04:29 AM, Homi-Wan wrote: Aw thanks schorhr. Well it turns out I'm still bored so I just went ahead and made it a one frame script. It doesn't get any simplier than this kids! Just insert a single blank keyframe at the start of your movie and paste this in! You can even decorate this frame with graphics to hopefully make it look more lively.
Cool stuff

This should become the newgrounds preloader :-)
All that is now needed is a tank that is beeing inserted via drawing api :)

[Homi-Wan]

This should become the newgrounds preloader :-)
All that is now needed is a tank that is beeing inserted via drawing api :)

Hehe, I'm not that bored. I'm focusing on AS now as a temporary break from animating. And I'm definately one of the guys that fell asleep in AutoCAD class...

[schorhr]

OK , i tried to post THESE 600 lines of code, and my browser crashed :-)
Click on it and paste into flash.

Its done quickly. but you get the idea :-)

http://www.spamihilator.com/shaw/shawcartoon/test/ng.as

[Homi-Wan]

HAHAHAHA... lol schorhr you mad man. You just had to go and do it. (BTW you're gonna have to tell me how you did that).

Well it would be a shame not to put it to good use so here's the final product:
http://members.shaw.ca/craft-of-war/AS-Preloader.html

[schorhr]

NICE!!!
Make it a bit smaller maybee then it looks better, not so rough! But NICE!!!! This way it looks way better.

Well, make a flash.
FPS 12, but better higher, maybee 16-20, not too high though, since the code will be bigger and your computer needs more resources (ram/speed)

2 buttons.
Codes:
//this button will clear a drawing
on (release) { drawing.removeMovieClip(); foo = new drawAPicture; }

//this button will start the re-draw!
on (release) {
drawing.removeMovieClip();
foo = new redraw;
}

Code for a frame 1:
//(remove the trace if you want to use it as drawing board)

Movieclip.prototype.drawLine = function(){
if (Math.abs(nL.x1 - _root._xmouse) > 1 && Math.abs(nL.y1 - _root._ymouse) > 1){
//insert rest of finction here

this.a++;

//nL for newLine
nL = this.createEmptyMovieClip("line"+this.a,this.a);
nL.lineStyle(3,0x339933,100);
if (this.lineSeg == 1){
this.lineSeg = 0;
nL.x0 = _root._xmouse;
nL.y0 = _root._ymouse;
} else {
nL.x0 = this["line"+(this.a-1)].x1;
nL.y0 = this["line"+(this.a-1)].y1;
}

nL.x1 = _root._xmouse;
nL.y1 = _root._ymouse;

this.newLine();
this.aRec();
}}

Movieclip.prototype.reDrawLine = function(){
this.a++;
if (a > _root.dA.x0.length){
this.onEnterFrame = null;
}
//nL for newLine
nL = this.createEmptyMovieClip("line"+this.a,this.a);
nL.lineStyle(3,0x339933,100);
this.aRead();
this.newLine();
}

Movieclip.prototype.newLine = function(){

trace('nL.moveTo('+nL.x0+','+nL.y0+');nL.lineTo('+nL.x1+','+nL.y1+');');

nL.moveTo(nL.x0,nL.y0);
nL.lineTo(nL.x1,nL.y1);
}

Movieclip.prototype.aRec = function(){
//array recording
_root.dA.x0[this.a] = nL.x0;
_root.dA.y0[this.a] = nL.y0;
_root.dA.x1[this.a] = nL.x1;
_root.dA.y1[this.a] = nL.y1;
}

Movieclip.prototype.aRead = function(){
//array recording
nL.x0 = _root.dA.x0[this.a]
nL.y0 = _root.dA.y0[this.a]
nL.x1 = _root.dA.x1[this.a]
nL.y1 = _root.dA.y1[this.a]
}

//dL for drawListener
dL = new Object;
Mouse.addListener(dL);
dL.onMouseDown = function(){
_root.drawing.lineSeg = 1;
_root.drawing.onEnterFrame = _root.drawing.drawLine;
}
dL.onMouseUp = function(){
_root.drawing.onEnterFrame = null;
}

drawAPicture = function(){
//one array for each coordinate (start and end, x and y)
_root.createEmptyMovieClip("drawing",1);
dA = new Array();
dA.x0 = new Array();
dA.y0 = new Array();
dA.x1 = new Array();
dA.y1 = new Array();
}

redraw = function(){
_root.createEmptyMovieClip("drawing",1);
drawing.onEnterFrame = reDrawLine;
}

foo = new drawAPicture;

[schorhr]

Did you figure it out?

[Homi-Wan]

No i'm kinda getting a headache now since it's 3:30am for me and the location of the tank is way off its center cooridinate making it a little frustrating to get it right in the center relative to the stage height/width...

[Homi-Wan]

Okay, I got it done. I added ease of use variables to the top so anyone can adjust the size and shake/flicker intensity of the logo. My job here is done. I'm going to bed.

Sampler:
http://members.shaw.ca/craft-of-war/AS-Preloader.html

Code:
http://members.shaw.ca/craft-of-war/AS-Preloader.txt

Goodnight.

[schorhr]

Good night :) Great job!

[Liquid-foxxx]

i create my flash using sothink SWF quicker not macromedia and i dont know how to use a pre-loder help please im desperate and how do you paste them codes into frames i dont understand maybe on sothink SWF quicker you cant do this somebody help.

[schorhr]

Either click on the link LOADER in my signature or on STOPMOTION since i have posted another method there.

[etcetera]

Music.
Flashes that are mostly quiet or have only sound effects aren't that great. You should try to add a well looped MP3 in the back or a full length song of some sort. Make sure the music goes wit the animation as well. If its a fight scene add techno music, if its a comedy scene add clown music or something.
Music along with the other things suggested should turn out a good flash.