This blog will be discontinued here at wordpress and will be moved to blogger, so please update your feed to:

http://www.gamedevjuice.blogspot.com/

Cheers.

Martin.

www.gotapi.com

I wanted to share this incredibly useful web site. No matter in what language you program this site is the equivalent to a Victorinox Swiss army pocket knife for a programmer. GotApi is a web language reference for a lot of languages and APIs. This is the supported stuff:

In some cases in a project, we need to use striped sprites, it means an an animation of bitmaps which has their frames arranged in rows or columns like the examples below:

Sometimes the output of some graphic tools are this kind of sprite, for example this explosion generator: http://www.geocities.com/starlinesinc Actionscript do not brings anything built-in to handle this kind of sprites what I called Bitmap MovieClip, so I created a handy class to handle this situations where we need want to create an animation from an array of frames on an image.
The result is something like this:

The use of this class is very simple and is not too different from using a regular MovieClip, in fact the class IS a MovieClip, BitmapMovieClip inherits from the MovieClip class and can be treated like that.

public function TestMClip()
{

         mBmpClip = new BitmapMovieClip( new explode(), 4,4);

         this.addChild( mBmpClip );
         mBmpClip.frameDelay = 40 ;
         mBmpClip.loopTimes = 0 ;
         mBmpClip.play();

         mBmpClipB = new BitmapMovieClip( new orb(), 1,5);
         mBmpClipB.y = 150 ;
         this.addChild( mBmpClipB );
         mBmpClipB.frameDelay = 100 ;
         mBmpClipB.loopTimes = 0 ;
         mBmpClipB.play();
}

The constructor receive three parameters. The first is the Bitmap with the frames of the animation, the second and third are rows and column respectively it means how many rows and columns the animation has, for example in our first example shown previously our explosion has four rows and four columns, while the second animations has only one row and five columns.
The frameDelay property is a measure of time in miliseconds, is the time what the frame will be shown before to switch to the next animation frame.
The loopTimes property is the number of times what the animation will be played, if this is zero the loop will be for ever.
The play method must be called to start running the animation. And thats it.
You can find the source of this sample and the BitmapMovieClip class here.

Finally after a long wait I got a Nintedo DS.

I also bought a R4, so after a long season of gaming I will start to diving into the nuts and bolts of DS game programming.

The collision detection in Papervision3D is not a big deal. Is easy to detect collision between two DisplayObject3D for that task PV3D provide us with two methods

public function hitTestPoint( x:Number, y:Number, z:Number ):Boolean

public function hitTestObject( obj:DisplayObject3D,multiplier:Number=1 ):Boolean

The first method is to test if the current DisplayObject3D is hitting a point in the scene and the second one is to detect if the current object is hitting another DisplayObject3D in the scene.
This is quite similar to the display architecture used by flash and its DisplayObject the difference is when we have a main DisplayObject3D with other objects 3D as childs.
In that case we would be tempted to use hitTestObject assuming that the collision test will be tested using the parent DisplayObject3D and their childs but that is wrong.

Lets suppose that we have a parent DisplayObject3D A on our Scene and inside that object we have a Collada mesh object which has been added to A at initialization time. Inside the main loop I’d like to test if my object A is hitting another DisplayObject3D called B which has and sphere object as child.
To do this I use something like this:

if( A.hitTestObject(B) )
{
	trace("hit");
}

This would never do what we expected to do. The hit test between A and B will never return true. Let’s see why. The main reason is that the hit test of a DisplayObject3D do not take in consideration their childs, it only use the geometry of current object and the geometry of the object received as parameter.
When I say geometry I am referring to the “geometry” member of the class DisplayObject3D which its is GeometryObject3D.
From the PV3D documentation:”When different objects share the same geometry, they become instances. They are the same object, displayed multiple times. Changing the shape of this object changes the shape of all of its instances.
Instancing an object saves system memory, and is useful to display an object multiple times while maintaining its shape.
For example, you could create armies and forests full of duplicate objects without needing the memory to handle that much actual geometry. Each instance has its own transform node so it can have its own position, rotation, and scaling.”When we create an empty DisplayObject3D in this way:

private var mContA:DisplayObject3D = new DisplayObject3D();

The geometry of the mContA is set to null so when the hit test is made there is no geometry object to test if the two objects are colliding.
One possible solution is assign to the geometry of the parent the geometry of the child what you want to be used when the hiTestObject is called.
Other solution is evaluate your collision using dummy DisplayObject3D attached to the object what you want to test collision, so when you call hitTestObject you do it on the dummy object for example an sphere or a plane.
A third possible solution is use the following function what I made using the PV3D code for hitTestObject but I just add two extra arguments, geometries. So you give the parents DisplayObject3D as parameter and the geometries of their childs what will be used in the hit test.
You can find a sample source code of this case here.

A few weeks ago I made some modifications to the Zeus Lab particle system for Actionscript made by Josh Tynjala . The Josh’s particle system is neat, simple and if you combine the particle system with the use of filter you can obtain beautiful visual effects. I wanted to continue using it while experimenting with Papervision, the only problem is that it is 2D, so I made the port of the particle system to make it usable in a 3D environment, the result was some kind of distribution of the particle system because I didn’t touch the 2D code I only extended to be usable with the display architecture and classes in PV3D.

In the following example I will explain how to use it combined with the Effects branch to obtain something like this:

Let’s see how this is done:

The first we need is a ParticleSystem3D:

pSys = new ParticleSystem3D(this.stage);
pSys.spawnRate = 4;
pSys.particleClass = SimpleParticle3D ;
pSys.start();

ParticleSystem3D receive the stage for parameter, which is used to add a listener to the ENTER_FRAME Event.
The SpawnRate is the rate of spawn particles, this means that if this value is higher you obtain more particles spawned per second.
The particleClass property is the class or data type used by the particle system there are two types of particles for this tutorial, I used SimpleParticle3D only, the other type of particle BillBoardParticle3D is a billboard but I can’t make it work with the Effect branch yet. With the particleClass property set, the ParticleSystem3D knows which particle should create when we start it.
Finally we should start the particle system so we call its method start.

mScene.addChild(this.pSys);
this.pSys.addEventListener( ParticleEvent.INITIALIZE_PARTICLE, initializeParticle);
this.pSys.addEventListener(ParticleEvent.UPDATE_PARTICLE, updateWaterParticle);

After initialize the particle system we must add it to the scene, ParticleSystem3D is a DisplayObject3D. We also add event listeners for the events INITIALIZE and UPDATE_PARTICLE. The INITIALIZE Event of a particle is dispatched once when the particle is created the first time and the UPDATE_PARTICLE event is dispatched every time what the particle is updated, it means in every frame. There is a third particle event that you can listen and is not used here it is DESTROY_PARTICLE, this event is dispatched when the life time of the particle ends.The following section of code do the effect tricks:

// Create a bitmap effect layer
mBfx = new BitmapEffectLayer(400, 400);
// Add a blur effect to the layer.
mBfx.addEffect(new BitmapLayerEffect(new BlurFilter(5, 5, 4)));
// add the effect layer to the viewport
mViewport.addRenderLayer(mBfx);
// Create a draw command for the visual effect
mBfx.drawCommand = new BitmapDrawCommand(null, new ColorTransform(0.3, 0.8, 0.6, 1), BlendMode.ADD);
// Set the blend mode of the effect layer
mBfx.drawLayer.blendMode = BlendMode.OVERLAY;
// Set a little scroll in y for the effect layer.
mBfx.setScroll(0,-0.5);

RenderLayerManager.getInstance().sortMode = RenderLayerSortMode.Z_SORT;

I will not explain what is done here because is beyond the scope of this tutorial, if you want to understand what happens here see the Andy Zupko Tutorial here.

private function initializeParticle(event:ParticleEvent):void
{
 var particle:SimpleParticle3D = event.particle as SimpleParticle3D;
 particle.renderLayer = mBfx ;

	particle.size = 1.5;
 particle.lifetime = 2000;

	particle.position = new Number3D(0, Math.random() * this.stage.stageHeight / 8,0);

	var width:Number = this.stage.stageWidth / 100;
 particle.velocity = new Number3D(Math.random() * width - width / 2, this.stage.stageHeight / 8,Math.random() * width - width / 2);
}

This is the method added as listener of the initialize event for a particle. In this function we set the initial values for the render layer, the size, life time, position and velocity of the particle.

private function updateParticle(event:ParticleEvent):void
{
 var particle:SimpleParticle3D = event.particle as SimpleParticle3D;
 var age:Number = getTimer() - particle.spawnTime;

	particle.size = particle.size + 0.05;

	var vX:Number = particle.spawnVelocity.x;
 if(age / particle.lifetime >= 0.25)
 {
 	vX = particle.spawnVelocity.x * 6;
 }

	var vZ:Number =  particle.velocity.z ;
 if(age / particle.lifetime >= 0.25)
 {
 	vZ = particle.spawnVelocity.z * 8;
 }

	var vY:Number =  particle.velocity.y - 5;

	particle.velocity = new Number3D(vX, vY, vZ); 

}

And this is the Update function for every particle update, in this function we change the particle velocity to obtain some kind of fountain effect and thats it.You can find the source code of the example here. And you can download Zeus Particles 3D version release here.

Sources:http://blog.zupko.info/?p=76http://www.zeuslabs.us/2006/05/09/introduction-to-particle-systems-using-actionscript-3/

Update: You can find a release of the particle system for PV3D 1.7  here .

I’ve been playing around lately with Papervision3D 2.0 which still in alpha yet. But this new version has a lot of new cool features one of the new features are shaders. So make things look like this:

PV3D has differents shaded materials to obtain different visual effects one of these shaded material can be used to make Bump mapping.
Bump mapping. From wikipedia:

“Bump mapping is a computer graphics technique where at each pixel, a perturbation to the surface normal of the object being rendered is looked up in a heightmap and applied before the illumination calculation is done (see, for instance, Phong shading). The result is a richer, more detailed surface representation that more closely resembles the details inherent in the natural world.”

For example the surface of an orange. For this we need two textures one is the normal texture of the object and the second is the bumpmap, see the image below:

Sphere without bump mapping.

The bump map that is applied to the image below.
And the result is:

Enough introduction let’s do this on Papervision.
To do this on PV3D I used a Mars example luckily I found a bump map of Mars in google image.

[SWF(width="600", height="400", backgroundColor="#000000")]
    public class bumpmaptest extends Sprite
    {
        private var mViewport:Viewport3D ;
        private var mRenderEngine:BasicRenderEngine ;
        private var mScene:Scene3D ;

        private var mCamera:WASDCamera ;
        private var mPlanet:Sphere ;

        [Embed (source="MarsMap.jpg")]
        private var mMapClass:Class ;
        private var mMapImage:Bitmap = new mMapClass();

        [Embed (source="MarsBumpMap.jpg")]
        private var mMarsBumpmapClass:Class
        private var mBumpMapImage:Bitmap = new mMarsBumpmapClass();

        public function bumpmaptest()
        {
            // Create the viewport for the scene
            mViewport = new Viewport3D();
            // We Add the viewport
            addChild( mViewport );
            // Create the render engine.
            mRenderEngine = new BasicRenderEngine();
            // Create scene.
            mScene = new Scene3D();
            //I create a wasd camera so we can navigate the scene
            // using WASD and mouse drag-and-drop
            mCamera = new WASDCamera(stage);
            // set the camera focus.
            mCamera.focus = 1000 ;
	    mCamera.z = -2000 ;

            // To create shadows we need lights.
            var pointLight:PointLight3D = new PointLight3D(true);
            // we place the light.
            pointLight.moveUp(50);
            pointLight.moveRight(50);

            var fMat:BitmapMaterial = new BitmapMaterial( mMapImage.bitmapData );
            var fMatBump:BitmapMaterial = new BitmapMaterial( mBumpMapImage.bitmapData );

            var marsShader:PhongShader = new PhongShader(pointLight, 0xFFFFFF,0×303030,20, fMatBump.bitmap, fMat.bitmap);
            var fMatShaded:ShadedMaterial = new ShadedMaterial(fMat,marsShader);

            mPlanet = new Sphere(fMatShaded,250,16,16);

            mScene.addChild( mPlanet );

            stage.addEventListener(Event.ENTER_FRAME, Loop);

        }

        public function Loop( pEv:Event ):void
        {

            mPlanet.yaw( 0.25 ) ;

            mRenderEngine.renderScene( mScene, mCamera, mViewport );    

        }

    }

First we need to BitmapMaterial, one for the Mars Texture and other for the Mars bump map. The Bitmap material receive the bitmapData of the image.

var fMat:BitmapMaterial = new BitmapMaterial( mMapImage.bitmapData );
var fMatBump:BitmapMaterial = new BitmapMaterial( mBumpMapImage.bitmapData );

After this we need a PhongShader, the PhongShader constructor receives:
PhongShader( our previously created pointLight, the light color, the ambient color, the bumpMap bitmapData, the texture bitmapData or specularMap ) .

var marsShader:PhongShader = new PhongShader(pointLight, 0xFFFFFF,0x303030,20, fMatBump.bitmap, fMat.bitmap);

Once we have the phong shader we simply need a shader material. We use the BitmapMaterial for mars and the PhongShader convined to create a ShadedMaterial.
ShadedMaterial( Mars bitmapMaterial, and our marsShader a phong shader in this case).

var fMatShaded:ShadedMaterial = new ShadedMaterial(fMat,marsShader);

After create the ShadedMaterial you can use it wherever you want, in this case I use it on a sphere, but this can be used on loaded models too.

mPlanet = new Sphere(fMatShaded,250,16,16);
mScene.addChild( mPlanet );

You may find the source code of this example here.

This post is a list of tips and tricks for tunning performance in Actionscript 3. Keep in mind the following quote while reading this:

“Premature Optimization is the root of all evil.” - Hoare and Knuth

1.- Type Everything.
Every variable declaration, every function return value, loop counter, every function parameter must be typed. Avoid things like this:

var foo ;

var foo2:Object ;

var foo:* ;

Typing optimizes the bytecode.2.- Avoid implicit types conversion of numeric types. This means:

var foo:int = 10 ;

Math.sqrt( foo );

That is an implicit conversion, square root function receive a Number for parameters. Sometimes just using Number is more efficient.3.- If you are going to access a property, variable, or a function value more than a few times, store that value in a local var:

var person:Person;

if (person.firstName == “Matt” || person.firstName == “Ted” ||

person.firstName == “Alex”)...

var fname:String = person.firstName;

if (fname == “Matt” || fname == “Ted” || fname == “Alex”)

Imagine if that query is in a loop, every dot represents a lookup
Other example of the same, maybe less trivial:

for(var k:int=0; k<    testArray.length; k++)
{
	trace(testArray[i]);
}

Here we are calling the length of the array in every loop, we can change it for something like this:

var l:int = testArray.length;

for(var i:int=0; i<    l; i++)
{
	trace(testArray[i]);
}

In the second case we are calling testarray.length just once for all the iterations.4.- Use int for index array instead of Number. The array indexing is faster with ints.5.- Avoid variable declaration inside loops, if you have something like this:

for(var j:int=0; j<    1000000; j++)

{

var loopvar:Number = Math.random();

}

Change it for this:

var loopvar:Number = Math.random();

for(var j:int=0; j<    1000000; j++)

{

loopvar = Math.random() ;

}

Make your var declaration outside the loops.6.- Cast instances, while reading from Array.
The Actionscript array can store any type of data, so before you call a method or access a property of an instance inside the array, don’t do it directly from the array, first store the instance in a typed variable.
Instead of this:

testArray[i].x

Do this:

var auxPoint:Point ;
auxPoint = testArray[i] as Point ;

This other option is valid, but I made a test and the previous way using the “as” operator is faster than this:

var auxPoint:Point ;
auxPoint = Point( testArray[i] ) ;

7.- Bit operation are faster than normal operators.
If you have intensive math operations like this:

var val1:int = 4 * 2;
var val2:int = 4 * 4;
var val3:int = 4 / 2;
var val4:int = 4 / 4 ;

Can be changed for:

var val1:int = 4 << 1;
var val2:int = 4 << 2;
var val3:int = 4 >> 1;
var val4:int = 4 >> 2;

7.- Watch your Listeners.
“A game sprite subscribes to its own enterFrame event. In every frame it moves, the application performs some calculations to determine its proximity to other game elements. In ActionScript 3.0, even after you remove the sprite from the display list and null all references to it, the application continues to run that code in every frame until it is removed by garbage collection. You must remember to explicitly remove the enterFrame listener when the sprite is removed.”
If you don’t remember to remove the listener of this sprite you will be leaking memory.
You have to solutions available. The first one is remember to remove your listeners when you have done to use them, so reference to the object is eliminated and the garbage collector can take it in the next sweep.
The second is use weak reference when you register your event listeners. A weak reference is one that is not counted by the Garbage Collector to decide if that object must be collected. This means that if the only reference remaining to an object are weak the object will be marked for collection anyway and that piece of memory will be freed.
We can do this with the function addEventListener, the fifth parameter is a flag called useWeakReference by default is in false, you should set it to true:

stage.addEventListener(Event.ENTER_FRAME, YourLoopFunction,false,0,true);

This is an example with all values set by default except the useWeakReference, the last parameter set to true.Sources:
Matt Chotin’s presentation at http://www.adobe.com/devnet/flex/articles/as3_tuning.html

Rozengain’s blog : http://rozengain.com/?postid=35

Andre Michelle’s blog: http://blog.andre-michelle.com/2005/as3-optimations-suggestions

Daniel Hai’s Blog: http://www.danielhai.com/blog/?p=55

http://www.adobe.com/devnet/flashplayer/articles/resource_management.html