Categories
General Speaking

Flash Sparkler

Just a quick post to show off one of the new effects that was in my recent FlashBelt session on particles.

[kml_flashembed movie=”/wp-content/uploads/manual/2007/sparkler.swf” width=”445″ height=”280″ FVERSION=”9″ /]

I’m really pleased how this one came out, it’s a combination of a little spark particle and a smoke effect, although the smoke looks a little more like retinal burn. Which is fine by me 🙂

It looks like there’s a kind of motion blur as the particles fly out, but all I’m doing is actually rotating the lozenge shaped spark particle to match the direction the particle is moving in. The way we calculate the angle of the direction of movement uses pythagorus’ theorum – it’s the same way that we calculate the angle of a right-angled triangle.

clip.rotation = Math.atan2(velocityY, velocityX);

Except of course that this will return the value in radians and we need degrees. And we do that by multiplying by 180/PI:

clip.rotation = Math.atan2(velocityY, velocityX) * 180 / Math.PI;

Source is in my earlier FlashBelt post.

12 replies on “Flash Sparkler”

Is there any way you could easily explain to an AS3 illiterate person how to modify particles52.fla to obtain this sparkler effect you have? I love that thing…thanks!

I’ve decided I’m going to try harder to reply to comments on my blog 🙂

Mawkus – there are some AS2 examples here from the original particles session here //www.sebleedelisle.com/?p=4

The only difference with the sparkler effect is that the particle image is rotated in the direction it’s travelling. Look at the AS3 particle class and see if you can copy the maths bit into AS2. You may find that you don’t get the performance that you need in AS2 though.

Good luck!

Seb

Hey Seb,

Is there anyway you could supply me with the source files for this same exact sparkler effect? I have CS3 so I have AS3 as well. I would be more than happy to give you credit for the effect. It’s for an intro animation for a website. Let me know what you think. Thanks!

Hey Seb,

I found the exact sparkler effect I was looking for in the files you provided. I have one more question. I am trying to move this effect as an external .swf in an empty movie clip in another .fla file. So far it loads fine but the effect stays in one position. I noticed in your code that the coordinates are defined to one spot. Is there anyway to remove/edit that coding to where I could control its movement? Thanks!

hey mawkus,

yeah you can just change the x and y position to anything you want! It’s in the constructor for the particles i think. Good luck!

Seb

Thanks for the response again Seb. But I don’t just want to move the position of the effect. I actually want the sparkler effect to move on a path, say over 20 frames in the timeline from left to right on the stage. Can I do omit the AS that has the x/y coordinates in the sparkler file so that I can move the effect in an empty movie clip in another flash file? Thanks.

hey mawkus

I’m not sure what you mean when you say that you want the effect in “another flash file”. There are many ways to move the position of the sparkler over 20 frames, the easiest way would be to store an x position in a variable, increment it every frame, and use that value for the x position of the sparkler. I hope this helps.

kindest

Seb

When I say “another flash file” I mean I am trying to move the sparkler.swf with an empty movie clip in a new Flash (.fla) file. Is there an easy way to move the sparkler over 20 frames with the movie clip method?

I am afraid I don’t know Flash and AS enough to store an x position in a variable to move the sparkler, which you suggested in the previous post. If it’s easy and you have time, could you explain further in detail?

Thanks Seb!

-Mawkus

Hi Mawkus,

yeah I think it may be a little complicated to teach you all of that in the comments on my blog 🙂

I would definitely recommend Keith Peter’s book, Actionscript 3 animation, which is a great introduction to creating cool effects in code.

Good luck!

Seb

Comments are closed.