Post on 25-Jun-2015
Flash Particle Systemleonskywalker@163.com
1.Overview
A particle system usually consists of
3 parts.*
*Typical Implementation
Emitter Particle
Physics
Emitter
This is an emitter
What an emitter do:
1.emit particles.2.controls how to emit particles.
(birthrate, velocity, direction..etc).
3.holds a zone to generate particles. (can be a point, textfield or any bitmapdata using alpha mask..etc)
Uniform
Directional
Point
TextField
Particle
Particle is What is a particle?
1.What you just see(the little blocks).
2.Basic units of a particle system.
3.Usually in (really) large number.
4.Does not necessarily be small.
This is particle.
This is particle.
This is also particle!
Physics
Physics system controls the motion of every particle.
v GP( x , y )
f
aSome high-
school Physics!
Even more advanced physics
• Mutual Gravity
Even more advanced physics
Turbulence
2.Implement
Emitter Particle
Physics
Global Environmental Variables
• Gravity• Air Resistence Factor• Wind
Concrete calculation is in each particle’s loop.
Physics calculations
Emitter Particle
Physics
ParticleAttributes*
• Position• Velocity (speed and direction)• Color• Lifetime• Age• Shape• Size• Transparency
*By Siggraph
ParticleAttributes
• Position• Velocity (speed and direction)• Color• Lifetime• Age• Shape• Size• Transparency
Value Object
• Velocity• Lifetime• Age
• Position• Transparency• Color• Shape• Size
ItemRenderer
• Position• Mass• Update()
Pseudo codefunction update(){
age++;if(age > lifetime){
dispose();return;
}…calculateAcceleration(SpeedX,SpeedY);updatePosition(acceleration,oldX,oldY);…draw();
}
Uses global physics variables
Emitter Particle
Physics
• Generate and dispose particles.
• Interacting with mouse position(if needed).
• Update particles’ attributes(position, rotation, alpha..etc.).
We can put it in Emitter class
We need one major loop to
particle = new Particle() n timesn = number per frame = birthrate / frameratesetInitialAttribute(particle);
ENTER_FRAME
foreach particle in particlesArrayparticle.update();
A very basic particle system
3.Optimize
• large amount of objects are being generated.
• at the same time large amount of objects are marked for GC.
Facts #1:
Try using Object Pool.
Object Pool
Emitter
particles
Create
Trying to find an instance
Destroy
recycling to pool
create
if(pool.length >0){return pool.pop();
}else{return new Particle();
}
destroy particle.initialize();pool.push(particle);
• large amount of objects are being displayed at the same time.
Facts #2:
Try using BitmapData.
Value Object
• Velocity• Lifetime• Age
• Position• Transparency• Color• Shape• Size
ItemRenderer
• Position• Mass• Update()
Value Object
• Velocity• Lifetime• Age
• Position• Transparency• Color• Shape• Size
ItemRenderer
• Position• Mass• Update()
BitmapCanvas
Value Object
• Velocity• Lifetime• Age
ItemRenderer
• Position• Mass• Update()
BitmapCanvas
• Transparency• Color• Shape
pointbitmapdata.lock()foreach particle in particleArray
bitmapdata.setpixel32()bitmapdata.unlock();
sprite bitmapdata.draw(source,matrix, colorTransform)
bitmap Bitmapdata.copyPixels()
(No rotation and scale)
•More memory usage (compared to cacheAsBitmap=false)
•Drastic performance boostBecause we manually overrode the process of native displaying, bypassed the native rasterize engine
More speed means more effects available.
Glowing trails
Depth of Field
Advanced glow and motion blur
4.Real world use
We are looking
forward to see
your works!
Some popular open source particle enginesYou can start building your works today
http://flintparticles.org/
http://code.google.com/p/stardust-particle-engine/
Plugin StructureProvides more flexibility
addInitializer(new Color(color));
addInitializer(new Position(new SinglePoint(320, 480)));
addInitializer(new Velocity(bitmapZone));
addInitializer(new Life(new UniformRandom(120, 30)));
Initialize
var gravity:Gravity = new Gravity();
gravity.addField(new UniformField(0, 0.1));
addAction(gravity);
addAction(new Age());
addAction(new DeathLife());
addAction(new Move());
addAction(new AlphaCurve(0, 60));
Particle Behavior:
• http://mrdoob.com/lab/pv3d/dof/06/
• http://co.youa.baidu.com/content/promo/100shops7/index.html
Examples used in previous slides:
Thank you!
leonskywalker@163.comMar 2010
Q&A