Archive

Posts Tagged ‘tweener’

Exploring a Papervision3D class – MovieAssetParticleMaterial

December 12th, 2008
Comments Off

Hi All!

Not to long ago, I decided to go on a reconnaissance mission and plunged into the Papervison3D classes. I decided to read up on a class a week and just devour it ans learn as much about it as I could. I didn’t get the chance to do that until now. Here’s the first class : MovieAssetParticleMaterial and below is an example of what you can do with it.

The MovieAssetParticleMaterial is the material used for the Particle class which in turn is added to an instance of the Particles class using its “addParticle” method. I know that may have sounded a bit confusing, but here’s the break down. In the code for the example, I created 150 particles in a loop and add each particle to an array for later use:

for(var a:Number = 0; a<Particles3D.PARTICLE_COUNT; a++){
    var particleMaterial:MovieAssetParticleMaterial = new MovieAssetParticleMaterial("orb", true);
    particleMaterial.smooth = true;
   
    var particles3D:Particles = new Particles("particles_"+a);
    var particle:Particle = new Particle(particleMaterial, 2.5);
   
    particles3D.addParticle(particle);
    container3D.addChild(particles3D);
   
    arrParticles.push(particles3D);
}

After you have your particles set up, you would need some sort of 3D shape to map them to. Start off with something as simple as a sphere:

sphere = new Sphere(new WireframeMaterial(0x000000), 200, 15, 10);

Notice that all we did was create an instance of it, we really never added it to the scene. That’s because all we need is the vertice coordinates of the sphere in order to map the particles to them. We alreay have all our particles in an array, now we need to get all the vertices for the sphere in an array. Luckily, that is a very simple task:

var vertices:Array = sphere.geometry.vertices;

Now all we need to do is place a particle on each vertice by means of a loop and a little help from Tweener as so:

var vertices:Array = sphere.geometry.vertices;
activeVertices = vertices.length;
selectedShape = sphere;
for(var a:Number = 0; a<activeVertices; a++){
    Tweener.addTween(arrParticles[a], {x:vertices[a].x,
                           y:vertices[a].y,
                           z:vertices[a].z,
                           time:2,
                           transition:"easeInStrong"});
}

Thats pretty much it! I’m sure there’s loads of really cool stuff that can be done with 3D particles. Below is the full code for the example above. Enjoy!

package
{
    import caurina.transitions.Tweener;
   
    import flash.events.Event;
   
    import org.papervision3d.core.geom.Particles;
    import org.papervision3d.core.geom.renderables.Particle;
    import org.papervision3d.materials.WireframeMaterial;
    import org.papervision3d.materials.special.MovieAssetParticleMaterial;
    import org.papervision3d.objects.DisplayObject3D;
    import org.papervision3d.objects.primitives.Cylinder;
    import org.papervision3d.objects.primitives.Sphere;
    import org.papervision3d.view.BasicView;

    public class Particles3D extends BasicView
    {
        private static const PARTICLE_COUNT:uint = 150;
        private var sphere:Sphere;
        private var cylinder:Cylinder;
        private var container3D:DisplayObject3D;
        private var selectedShape:DisplayObject3D;
        private var arrParticles:Array;
        private var activeVertices:Number;
       
        public function Particles3D()
        {
            super();
            createParticles();
            createObjects3D();
            mapParticlesToSphere();
            startRendering();
        }
       
        private function createParticles():void
        {
            container3D = new DisplayObject3D();
            arrParticles = [];
           
            for(var a:Number = 0; a<Particles3D.PARTICLE_COUNT; a++){
                var particleMaterial:MovieAssetParticleMaterial = new MovieAssetParticleMaterial("orb", true);
                particleMaterial.smooth = true;
               
                var particles3D:Particles = new Particles("particles_"+a);
                var particle:Particle = new Particle(particleMaterial, 2.5);
               
                particles3D.addParticle(particle);
                container3D.addChild(particles3D);
               
                arrParticles.push(particles3D);
            }
           
            scene.addChild(container3D);
        }
       
        private function createObjects3D():void
        {
            sphere = new Sphere(new WireframeMaterial(0x000000), 200, 15, 10);
            cylinder = new Cylinder(new WireframeMaterial(0x000000), 60, 840, 10, 10);
        }
       
        private function mapParticlesToSphere():void
        {
            var vertices:Array = sphere.geometry.vertices;
            activeVertices = vertices.length;
            selectedShape = sphere;
            for(var a:Number = 0; a<activeVertices; a++){
                Tweener.addTween(arrParticles[a], {x:vertices[a].x,
                                                   y:vertices[a].y,
                                                   z:vertices[a].z,
                                                   time:2,
                                                   transition:"easeInStrong"});
            }
            Tweener.addTween(arrParticles[a], {time:4, onComplete:mapParticlesToCylinder});
        }
       
        private function mapParticlesToCylinder():void
        {
            var vertices:Array = cylinder.geometry.vertices;
            activeVertices = vertices.length;
            selectedShape = cylinder
            for(var a:Number = 0; a<activeVertices; a++){
                Tweener.addTween(arrParticles[a], {x:vertices[a].x,
                                                   y:vertices[a].y,
                                                   z:vertices[a].z,
                                                   time:2,
                                                   transition:"easeInStrong"});
            }
            Tweener.addTween(arrParticles[a], {time:4, onComplete:mapParticlesToSphere});
        }
       
        private function hideUnusedParticles():void
        {
            for (var a:Number = 0; a < Particles3D.PARTICLE_COUNT; a++) {
                if (a < selectedShape.geometry.vertices.length) {
                    arrParticles[a].visible = true;
                } else {
                    arrParticles[a].visible = false;
                }
            }
        }
       
        override protected function onRenderTick(event:Event=null):void
        {
            super.onRenderTick(event);
            container3D.yaw(.5);
            container3D.roll(.5);
            hideUnusedParticles();
        }      
       
    }
}
;

Experiment, Lab , ,