Particle Trail

[Sarah-Brown]

Hi,

I'm making an animation where I need to have a sparkly trail following an object. At first I was animating it, but I realised it would probably look and run better using actionscripted sparkles...

I've looked for various tutorials and found this one (attached) which looks pretty much the way I want my sparkles to look, but it trails the mouse.
Is it possible to change this script to make the sparkles follow a movie clip intance instead of the mouse position and still keep the nice trail effects?

Thanks in advance for any help you can offer!

[blanius]

Swap the _mouseX and _mouseY for movieClipName._x and movieClipName._y and it should work.

[Sarah-Brown]

Thanks for the help...it doesn't quite have the desired effect...

I guess the best way to describe what I need to do is, to be able to animate an movieclip object on the stage and have a "pixie dust" effect trailing behind it.

Unfortunatley my brain can't cope with code! Man, I wish I knew how to do this stuff, it's doing my head in now! :)

If any of you kind souls want to point me in the right direction, I'd appreciate it greatly! (Just remember you have to explain things to me in the manner that you'd use to explain actionscripting to your ageing grandmother!)

http://www.domesticadesign.com/animtest/anim.html
This is a little taster of my animation...see I can draw quite nice pictures, even if I can't code!

Pleeeease help me, I don't want to have to draw each individual particle of bloody pixie dust hehe

...and relax :)

[blanius]

How about you put a pixie dust movie clip within your object movieclip.

[Sarah-Brown]

Aye, I guess that's what I'll end up having to do, just thought actionscript could 'animate' particles better and more smoothly than I'll be able to! :)

[Quixx]

Hi,
The following code will attach a movie clip with the Linkage Identifier "spark" to the screen at the position the Movie Clip with the instance name "bug" is. The "spark" MC's will fall and pick up speed as they drop. Once they go beyond 400 pixels (y axis) they get removed from the Stage.


mSpark = function () {
this._x += this.xspeed;
this._y += this.yspeed += 0.2;
this._xscale = this._yscale += 1;
if (this._y>=400) {
removeMovieClip(this);
}
};
onEnterFrame = function () {
var level:Number = _root.getNextHighestDepth();
var s:MovieClip = _root.attachMovie("spark", "s"+level, level);
s._x = bug._x-(random(20)-10);
s._y = bug._y-(random(20)-10);
s._xscale = s._yscale=60;
s.xspeed = (random(10)-5)*0.25;
s.yspeed = 0;
s.onEnterFrame = mSpark;
};

[Sarah-Brown]

Aww wow, thank you so much for your help and the easy to understand explanation Quixx!

Unfortunately, I'm still using Flash MX and I wasn't able to open your attached file. I just tried using the code in the way you explained in mx and it doesn't seem to be working properly (although I've not been able to see what yours looked like of course :)
It attaches a 'spark' to the movie clip 'bug' which seems to be doing some small random jiggling movements (that's a technical term!), but it's only attaching the one spark and there wasn't any falling, dropping or picking up speed...
Is the code that you gave specific to mx2004?

Anyways, if you're able to help further that would be very cool, but I don't wan't to be a complete pain in the bum and I really appreciate what you've already done, thanks!

[Quixx]

Hi,

Yes, the code I posted has syntax specific to Flash MX 2004 pro. I've changed the syntax below so it will work for Flash MX. Have a look...

(Changes are colored in red)

mSpark = function () {
this._x += this.xspeed;
this._y += this.yspeed += 0.2;
this._xscale = this._yscale += 1;
if (this._y>=400) {
removeMovieClip(this);
}
};
var level = 0;
onEnterFrame = function () {
level++;
var s = _root.attachMovie("spark", "s"+level, level);
s._x = bug._x-(random(20)-10);
s._y = bug._y-(random(20)-10);
s._xscale = s._yscale=60;
s.xspeed = (random(10)-5)*0.25;
s.yspeed = 0;
s.onEnterFrame = mSpark;
};

[Quixx]

Hello again,

Sorry for the double post, but I figured this might need it. It occured to me that you would probably like to turn the sparks on and off again depending on what's happening during your movie (a slight oversight :)). So I made the example a bit more flexible in terms of use. First I'll show you the code, then explain briefly (since I have heavily commented the code in the attachment)...

Okay, so here's the code (no comments here for the sake of posting):
_global.mSpark = function() {
this._x += this.xspeed;
this._y += this.yspeed += 0.2;
this._xscale = this._yscale += 1;
if (this._y>=400) {
removeMovieClip(this);
}
};
var level = 0;
_global.sFun = function(wc) {
level++;
var s = _root.attachMovie("spark", "s"+level, level);
s._x = wc._x-(random(20)-10);
s._y = wc._y-(random(20)-10);
s._xscale = s._yscale=60;
s.xspeed = (random(10)-5)*0.25;
s.yspeed = 0;
s.onEnterFrame = mSpark;
};
_global.startSpark = function(wc, hf) {
sInt = setInterval(function () {
sFun(wc);
}, hf);
};
_global.stopSpark = function() {
clearInterval(sInt);
};
startSpark(bug, 40);
...and here's how to use it:


Copy and paste the code above onto the actions panel of the first frame of the Stage.
On the frame you wish your sparks to start falling from the target MC, write: startSpark(targetMC, howFast), where "targetMC" is the MC name, and "howFast" is a number (my example above used an MC I called "bug" at a speed of 40, so it would look like: startSpark(bug, 40)).
Now should you wish to stop the sparks, just place the following code: stopSpark(), on the frame you'd like to stop them.


And that's it.

[Sarah-Brown]

You are an absolute star, that's exactly what I needed, perfect! And your explanations are fantastic too!
A massive big thank you to you :hug:

I'd like to give you credit, if you have a web address message it to me and I'll be sure to link you up :)

Yeeehar!

[Quixx]

I'd like to give you credit, if you have a web address message it to me and I'll be sure to link you up :)


I appreciate it, but no thanks are necessary. I benefit from working on the code as much as you benefit from using/learning from it, as I will often think of new ways to code myself. For example, this code marks the first time I have ever used _global. While I was always aware of the code, I never really thought of a time where I myself would need to use it. But now I do :cool:.

[whispers]

Quixx- very nice..

couple questions:

1.) I noticed after few seconds..the "bug" disappears..and comes back witht he "ability" to follow the mouse..

did I miss somethign from the code above?? LOL

thanks

[Quixx]

did I miss somethign from the code above?? LOL
thanks

Hi Whispers,

Yes. The code above only pertains to what is needed to add the spark trail. If you download the attachment and check out the actions panel for the very last frame, you'll find the following code that allows the bug to start following the mouse. I separated the code from the rest, because I felt putting it on the first frame may cause some confusion for anyone trying to understand the spark trail code.


bug.onEnterFrame = function() {
bug._x += (_xmouse-bug._x)/4;
bug._y += (_ymouse-bug._y)/4;
};

The disappearing/reappearing trick was just an animation. But it wouldn't be impossible to achieve using actionScript.