Particle Effects - Bitmap trails

[TheLostGuru]

Well I've searched... and searched... and yet I still know that someone else is going to have searched once and found what I want. But anyways, I am interested in learning a lot about particle effects (I think that's what they're called), and getting into at least Flash 8. All that I have messed around with right now is trying to create a bitmap trail, but I don't really understand any of it. I have looked at several fla's, but have been unable to get any of it to work. Where do I get started? Are there tutorials on this type of thing? Thanks for any help, I'm willing to learn, just don't know where to start.

[ImprisonedPride]

If you're talking about that big thread here a few weeks ago and another about the awesome flame trails, and finally another with effects like the Geometry Wars clone; I think we're both in the same boat. I want to learn about this too.

[tonypa]

To make easy bitmap trail follow these steps:

*create bitmap that will cover whole stage area
*create your moving object
*move the object and use DRAW method to draw the object at its current position on the bitmap
*run enterframe loop that will fade off entire bitmap using colorTransform

[VENGEANCE MX]

http://www.birchlabs.co.uk/BMPTrails.zip

Hopefully this will be of some help?

[rje]

There are a few ways. Some have already been mentioned. Each has advantages/disadvantages depending upon what your doing. I wrote a AS3 particle engine that:

- has its own Sprite layer in the movie
- each particle is an individual bitmap
- basic physics model with external influences on the particle, for example you can define a wind vector that affects the particles.
- linked list for fast addition removal of particles

http://home.planet.nl/%7Eborst595/ParticleEngine.swf
(F1,F2 & F3 for different effects, Left/Right cursor wind, Space toggle rendering (lets you see how much time is spent just on processing)

One disadvantage of this way is sheer number of bitmaps objects - however, they are all created on startup and cached.

[Sauceofallevils]

Do you mean similar to what I have?
http://northernmost.org/cosmos/Cosmos%20v1.8.html

It is a really neat effect, I never discovered how to do it myself, but I think I now comprehend the basic principle of it.

[tomsamson]

to rje: nice, though i wonder what slows it down so much, with a bitmapdata based approach one can handle several 10k particles at high fps if the particles are only pixels and still over a k if its bigger images with alpha in em, see:
www.stimunationgames.com/labs/particles/sparkles

[Sauceofallevils]

Wow, that sparkle effect is neat!

[tomsamson]

cheers

(and yeah, i like the look of your trail, too )

[rje]

@all - there are some nice examples here - just shows how much variation you can create!

@tomsamson

its not to bad. Its written this way because I need a very general particle system that could be used for anything on screen. Smoke, fire, trails, explosions, wind, water. Each particle is general in the cache. There could be 20 or so particle emitters on screen at once all using the same cache. Due to the size of the levels I'm working with, I couldn't afford a single bitmap to draw to. It can support about 1000 active particles without to much CPU on the latest flash player.

You can see this particle engine in action inside a general game engine here:

http://home.planet.nl/%7Eborst595/Exile.html

[tomsamson]

agreed
its pretty sweet to see all coming and running together and yup,it runs nicely smooth,too

[alillm]

Hey rje, I like your game, great style .

Also nice particles Tom!

Ali

[TheLostGuru]

awesome stuff guys. This is exactly what I'm talking about. I do have a few specific questions. What do these things do?

-ColorTransform (1, 1, 1, fade, 0, 0, 0, 0); (what do each of the numbers do?)
-Matrix ()
-BitmapData (stageW, stageH, true, 0x00000000);
-attachBitmap (myBmp, 0);
-myBmp.draw (mc)
-myBmp.colorTransform (myBmp.rectangle, myColT);

Basically from what I understand, you create a bitmap. You add that bitmap to a movieclip. You draw things to that movieclip and then you continually fade that movieclip. Is my thinking correct? If so, how many movieclips can I draw to the bitmap?

Where can I go to learn about filters and such, like blurring and other cool special effects?

Tonypa - I'm actually using one of your example fla's
Vengeance MX- I've actually looked at your fla before, but thanks for the file again.

[tonypa]

You can draw unlimited amount of movie clips on same bitmap, each of them is "drawn" like taking screenshot of the movie clip and pasting it over the same bitmap. The drawing only affects pixels in bitmap, the size and stuff never changes. Thats why its so good, in old days you made trails by creating lots of copies from same movie clip with different alpha meaning you got lots and lots of objects on screen, by using bitmap even if you got hundreds of objects moving around all their trails still use one single bitmap.

[VENGEANCE MX]

awesome stuff guys. This is exactly what I'm talking about. I do have a few specific questions. What do these things do?

-ColorTransform (1, 1, 1, fade, 0, 0, 0, 0); (what do each of the numbers do?)
-Matrix ()
-BitmapData (stageW, stageH, true, 0x00000000);
-attachBitmap (myBmp, 0);
-myBmp.draw (mc)
-myBmp.colorTransform (myBmp.rectangle, myColT);

Vengeance MX- I've actually looked at your fla before, but thanks for the file again.

I didn't make that fla.

I believe the first four parameters are coefficients for the various colour channels. 1, 1, and 1 for R, G, and B will make the colour stay the same, and the alpha channel will be multiplied by the variable fade. The next four parameters are what we increment the colour values in each of those four channels by - and we don't want to do that, so we leave them as 0.

Matrix is just an object that creates a matrix. It's just maths. Like a bi-dimensional array (Wikipedia it).

The BitmapData line just creates a BitmapData object... check the AS Reference panel to find more about that.

AttachBitmap() draws our BitmapData onto the stage.

The draw() line draws our fadey movie clip into our BitmapData.

Finally, the colorTransform() applies our ColorTransform object to the BitmapData.

[ImprisonedPride]

ColorTransform (flash.geom.ColorTransform)
Object
|
+-flash.geom.ColorTransform

public class ColorTransform
extends Object

The ColorTransform class lets you mathematically adjust all of the color values in a movie clip. The color adjustment function or color transformation can be applied to all four channels: red, green, blue, and alpha transparency.

When a ColorTransform object is applied to a movie clip, a new value for each color channel is calculated like this:

New red value = (old red value * redMultiplier) + redOffset
New green value = (old green value * greenMultiplier) + greenOffset
New blue value = (old blue value * blueMultiplier) + blueOffset
New alpha value = (old alpha value * alphaMultiplier) + alphaOffset
If any of the color channel values is greater than 255 after the calculation, it is set to 255. If it is less than 0, it is set to 0.

You must use the new ColorTransform() constructor to create a ColorTransform object before you can call the methods of the ColorTransform object.

Color transformations do not apply to the background color of a movie clip (such as a loaded SWF object). They apply only to graphics and symbols that are attached to the movie clip.

Availability: ActionScript 1.0; Flash Player 8

Usage:

import flash.geom.ColorTransform;

var clrTrans = new ColorTransform();
trace(clrTrans) // (redMultiplier=1, greenMultiplier=1, blueMultiplier=1, alphaMultiplier=1, redOffset=0, greenOffset=0, blueOffset=0, alphaOffset=0) 

[Sauceofallevils]

rje, your jet pack guy game looks great! I'm trying to make a a separate version of my game where you can fly around in every direction, and scroll through large areas like you did, for my battle mode. The maps will range from small to large, hopefully I can finish doing this, you obviously got the method down. I also like your particle effects very neat! God work rje, I look forward to your future works.