Box2D collisions rendered in 3D with Away3D

Did you ever wonder what would be possible if you could merge a 2D physics engine with a 3D engine?

Roger Engelbert from Done With Computers, apart from having a blog with awesome posts (really! have a look!), tried to use Away3D to render Box2D collisions.

You will see the result by yourself.

« Here I’ll show you another way to build 3D collisions using 2D logic, by combining the Box2D engine with 3D rendering of elements. For this example, you must think of games where the 3D Y axis is not relevant (no change in altitude.)

In the game you can push the blue blocks, the larger one is harder to push around. And you cannot push the green cylinder. And when you shoot you a have nice recoil effect.

Here is the Box2D version of the “game”:

Use arrows to move, and space bar to shoot.

And here is the code for this version:

package  
{  
    import Box2D.Collision.Shapes.*;  
    import Box2D.Collision.b2AABB;  
    import Box2D.Common.Math.*;  
    import Box2D.Dynamics.*;  
      
    import flash.display.DisplayObjectContainer;  
    import flash.display.Sprite;  
    import flash.events.Event;  
    import flash.events.KeyboardEvent;  
    import flash.geom.*;  
    import flash.utils.Timer;  
      
    [SWF(width="800", height="600", backgroundColor="0x000000", frameRate="30")]  
    public class Box2Dto3D extends Sprite  
    {  
        private static const Y_DIR:int = 1;  
        private var _moveLeft:Boolean = false;  
        private var _moveRight:Boolean = false;  
        private var _moveUp:Boolean = false;  
        private var _moveDown:Boolean = false;  
          
        //box2D stuff  
        private var _world:b2World;  
        private var _player:b2Body;  
        private var _block1:b2Body;  
        private var _block2:b2Body;  
        private var speed:Number = 5;  
          
          
        private var player_rec:Rectangle = new Rectangle(0,0,50,50);  
        private var block1_rec:Rectangle = new Rectangle(-100,-100,80,80);  
        private var block2_rec:Rectangle = new Rectangle(-200,100,200,100);  
          
        private var shoot_timer:Timer = new Timer(500,1);  
        private var bullets:Vector.;  
          
          
          
        public function Box2Dto3D()  
        {  
            x = 400;  
            y = 300;  
              
            bullets = new Vector.();  
              
            createScene();  
              
            stage.addEventListener(KeyboardEvent.KEY_DOWN, onKey_Down, false, 0, true);  
            stage.addEventListener(KeyboardEvent.KEY_UP, onKey_Up, false, 0, true);  
            addEventListener(Event.ENTER_FRAME, onLoop, false, 0, true);  
        }  
          
        private function createScene ():void {  
  
            _world = new b2World(new b2Vec2(0,0),true);  
            var contactListener:BulletCollisionListener = new BulletCollisionListener();  
            _world.SetContactListener(contactListener);  
              
            //set up debug draw  
            var debugDraw:b2DebugDraw = new b2DebugDraw();  
            var container:Sprite = new Sprite();  
            addChild(container);  
            debugDraw.SetSprite(container);  
            debugDraw.SetDrawScale(30);  
            debugDraw.SetFlags(b2DebugDraw.e_shapeBit|b2DebugDraw.e_jointBit);  
            debugDraw.SetFillAlpha(0.5);  
              
              
            //create player  
            var bodyDef:b2BodyDef = createBoxDef(player_rec);  
            bodyDef.type = b2Body.b2_dynamicBody;  
            bodyDef.allowSleep = false;  
            var bodyFixture:b2FixtureDef = createBoxFixture(player_rec);  
              
            _player = _world.CreateBody(bodyDef);  
            _player.CreateFixture(bodyFixture);  
              
            var data:Object = {};  
            data.type = "block";  
              
            //create obstacles  
            //block 1  
            bodyDef = createBoxDef(block1_rec);  
            bodyDef.type = b2Body.b2_dynamicBody;  
            bodyDef.linearDamping = 20;  
            bodyFixture = createBoxFixture(block1_rec);  
            bodyFixture.density = 0.5;  
            bodyFixture.friction = 1;  
              
            _block1 = _world.CreateBody(bodyDef);  
            _block1.CreateFixture(bodyFixture);  
            _block1.SetUserData(data);  
              
            //block 2  
            bodyDef = createBoxDef(block2_rec);  
            bodyDef.type = b2Body.b2_dynamicBody;  
            bodyDef.linearDamping = 20;  
            bodyFixture = createBoxFixture(block2_rec);  
            bodyFixture.density = 100;  
            bodyFixture.friction = 1;  
              
            _block2 = _world.CreateBody(bodyDef);  
            _block2.CreateFixture(bodyFixture);  
            _block2.SetUserData(data);  
              
            //fixed pillar  
            bodyDef = new b2BodyDef();  
            bodyDef.position.Set(p2m(100), p2m(40));  
            bodyDef.type = b2Body.b2_staticBody;  
            var bodyShape:b2CircleShape = new b2CircleShape();  
            bodyShape.SetRadius (p2m(20));  
            bodyFixture = new b2FixtureDef();  
            bodyFixture.shape = bodyShape;  
            bodyFixture.density = 1;  
              
            var pillar:b2Body = _world.CreateBody(bodyDef);  
            pillar.CreateFixture(bodyFixture);  
            pillar.SetUserData(data);  
              
              
            _world.SetDebugDraw(debugDraw);  
              
        }  
          
        private function shoot ():void {  
            if (shoot_timer.running) return;  
              
            //create particle  
            var bodyDef:b2BodyDef = new b2BodyDef();  
            var pPos:b2Vec2 = _player.GetPosition();  
            var angle:Number = _player.GetAngle()  + Y_DIR*Math.PI/2;  
            pPos.x -= p2m(10)*Math.cos(angle);  
            pPos.y -= p2m(10)*Math.sin(angle);  
              
            bodyDef.position.Set(pPos.x, pPos.y);  
              
            bodyDef.type = b2Body.b2_dynamicBody;  
            bodyDef.angularDamping = 10;  
              
            var bodyShape:b2CircleShape = new b2CircleShape();  
            bodyShape.SetRadius (p2m(10));  
            var bodyFixture:b2FixtureDef = new b2FixtureDef();  
            bodyFixture.shape = bodyShape;  
            bodyFixture.density = 0;  
            bodyFixture.restitution = 0;  
              
            var bulletData:Object = {};  
            bulletData.type = "bullet";  
            bulletData.hit = false;  
              
            var bullet:b2Body = _world.CreateBody(bodyDef);  
            bullet.CreateFixture(bodyFixture);  
            bullet.SetUserData(bulletData);  
            bullet.SetLinearVelocity(new b2Vec2(-10*Math.cos(angle),-10*Math.sin(angle)));  
              
            bullets.push(bullet);  
              
            //shoot_timer.reset();  
            shoot_timer.start();  
        }  
          
        private function p2m(pixel:Number):Number {  
            return pixel/30;  
        }  
          
        private function m2p(m:Number):Number {  
            return m * 30;  
        }  
          
          
        private function updateBody ():void {  
              
            _player.SetLinearVelocity(new b2Vec2(0,0));  
              
              
            if (_moveLeft) _player.SetAngle( _player.GetAngle() - Y_DIR*0.1);  
            if (_moveRight) _player.SetAngle( _player.GetAngle() + Y_DIR*0.1);  
              
            var angle:Number = _player.GetAngle() + Math.PI/2;  
            var playerVelocity:b2Vec2 = _player.GetLinearVelocity();  
                  
            if (_moveUp ) {  
                playerVelocity.x -= Y_DIR*speed*Math.cos(angle);  
                playerVelocity.y -= Y_DIR*speed*Math.sin(angle);  
                  
            }  
            if (_moveDown ) {  
                playerVelocity.x += Y_DIR*speed*Math.cos(angle);  
                playerVelocity.y += Y_DIR*speed*Math.sin(angle);      
            }  
              
        }  
          
      
        ///////////////////////////// EVENTS ///////////////////////////////////////  
        private function onKey_Up (event:KeyboardEvent):void {  
              
            switch (event.keyCode) {  
                case 38:  
                    //UP KEY is up  
                    _moveUp = false;  
                    break;  
                case 39:  
                    //RIGHT KEY is up  
                    _moveRight = false;  
                    break;  
                case 37:  
                    //LEFT Key is up  
                    _moveLeft = false;  
                    break;  
                case 40:  
                    //DOWN KEY is up  
                    _moveDown = false;  
                    break;  
                case 32:  
                    //SPACE Bar is up  
                    shoot();  
                    break;  
            }  
        }  
        private function onKey_Down (event:KeyboardEvent):void {  
          
            switch (event.keyCode) {  
                case 38:  
                    //UP KEY is down  
                    _moveUp = true;   
                    break;  
                case 39:  
                    //RIGHT KEY is down  
                    _moveRight = true;  
                  
                    break;  
                case 37:  
                    //LEFT Key is down  
                    _moveLeft = true;  
                      
                    break;  
                case 40:  
                    //DOWN KEY is down  
                    _moveDown = true;  
                    break;  
                case 32:  
                    //SPACE BAR is down  
                    break;  
                  
            }  
        }  
          
        private function onLoop (event:Event):void {  
            updateBody();  
              
            _world.Step(1/30,10,10);  
            _world.DrawDebugData();  
              
            for (var i:int = bullets.length-1; i >= 0; i--) {  
                if (bullets[i].GetUserData().hit == true) {  
                        _world.DestroyBody(bullets[i]);  
                        bullets.splice(i,1);  
                        break;  
                }  
            }  
        }  
          
        private function createBoxDef (rec:Rectangle):b2BodyDef {  
            var bodyDef:b2BodyDef = new b2BodyDef();  
            bodyDef.position.Set(p2m(rec.x + rec.width/2), p2m(rec.y + rec.height/2));  
            bodyDef.type = b2Body.b2_staticBody;  
            bodyDef.angularDamping = 10;  
            return bodyDef;  
        }  
          
          
        private function createBoxFixture (rec:Rectangle):b2FixtureDef {  
            var bodyShape:b2PolygonShape = new b2PolygonShape();  
            bodyShape.SetAsBox (p2m(rec.width/2), p2m(rec.height/2));  
            var bodyFixture:b2FixtureDef = new b2FixtureDef();  
            bodyFixture.shape = bodyShape;  
            bodyFixture.density = 1;  
            bodyFixture.restitution = 0;  
            return bodyFixture;  
        }  
          
    }  
}

And the collision object for the sake of completeness:

package {
	import Box2D.Dynamics.Contacts.b2Contact;
	import Box2D.Dynamics.b2ContactListener;

	public class BulletCollisionListener extends b2ContactListener {
		public function BulletCollisionListener() {
			super();
		}

		override public function BeginContact(contact:b2Contact):void {

			if (contact.GetFixtureA().GetBody().GetUserData()) {
				if (contact.GetFixtureA().GetBody().GetUserData().type == "bullet" &&  
				                        contact.GetFixtureB().GetBody().GetUserData().type == "block") {
					contact.GetFixtureA().GetBody().GetUserData().hit=true;

				}
			}

			if (contact.GetFixtureB().GetBody().GetUserData()) {
				if ( contact.GetFixtureB().GetBody().GetUserData().type == "bullet" &&  
				                        contact.GetFixtureA().GetBody().GetUserData().type == "block") {

					contact.GetFixtureB().GetBody().GetUserData().hit=true;

				}
			}
		}
	}
}

Now in 3D I use the same Box2D code but I add 3D primitives. Here is the code:

import away3d.cameras.*;  
    import away3d.containers.*;  
    import away3d.core.base.Object3D;  
    import away3d.lights.*;  
    import away3d.materials.*;  
    import away3d.primitives.*;  
      
    import flash.display.BitmapData;  
    import flash.display.DisplayObjectContainer;  
    import flash.display.Sprite;  
    import flash.events.Event;  
    import flash.events.KeyboardEvent;  
    import flash.geom.*;  
    import flash.utils.Timer;  
      
    [SWF(width="800", height="600", backgroundColor="0x444444", frameRate="30")]  
    public class Box3D extends Sprite {  
          
        //in case I need to adjust the change in Y direction  
        private static const Y_DIR:int = -1;  
        private var _moveLeft:Boolean = false;  
        private var _moveRight:Boolean = false;  
        private var _moveUp:Boolean = false;  
        private var _moveDown:Boolean = false;  
          
        //box2D stuff  
        private var _world:b2World;  
        private var _b2player:b2Body;  
        private var _b2block1:b2Body;  
        private var _b2block2:b2Body;  
        private var speed:Number = 5;  
          
        private var player_rec:Rectangle = new Rectangle(0,0,50,50);  
        private var block1_rec:Rectangle = new Rectangle(-100,100,80,80);  
        private var block2_rec:Rectangle = new Rectangle(-200,-200,200,100);  
          
        //away3D stuff  
        private var _view:View3D;  
        private var _player:Cube;  
        private var _block1:Cube;  
        private var _block2:Cube;  
        private var _container:ObjectContainer3D;  
        private var camera:TargetCamera3D;  
          
        private var shoot_timer:Timer = new Timer(500,1);  
        private var b2bullets:Vector.;  
          
          
        public function Box3D() {  
            x = 400;  
            y = 300;  
            createScene();  
              
            b2bullets = new Vector.();  
              
            stage.addEventListener(KeyboardEvent.KEY_DOWN, onKey_Down, false, 0, true);  
            stage.addEventListener(KeyboardEvent.KEY_UP, onKey_Up, false, 0, true);  
            addEventListener(Event.ENTER_FRAME, onLoop, false, 0, true);  
        }  
          
        private function createScene ():void {  
            createBox2DWorld();  
            createAway3DView();  
        }  
          
        private function createBox2DWorld():void {  
              
            _world = new b2World(new b2Vec2(0,0),true);  
            var contactListener:BulletCollisionListener = new BulletCollisionListener();  
            _world.SetContactListener(contactListener);  
              
              
            //create player  
            var bodyDef:b2BodyDef = createBoxDef(player_rec);  
            bodyDef.type = b2Body.b2_dynamicBody;  
            bodyDef.allowSleep = false;  
            var bodyFixture:b2FixtureDef = createBoxFixture(player_rec);  
              
            _b2player = _world.CreateBody(bodyDef);  
            _b2player.CreateFixture(bodyFixture);  
              
            var data:Object = {};  
            data.type = "block";  
              
            //create obstacles  
            //block 1  
            bodyDef = createBoxDef(block1_rec);  
            bodyDef.type = b2Body.b2_dynamicBody;  
            bodyDef.linearDamping = 20;  
            bodyFixture = createBoxFixture(block1_rec);  
            bodyFixture.density = 0.5;  
            bodyFixture.friction = 1;  
              
            _b2block1 = _world.CreateBody(bodyDef);  
            _b2block1.CreateFixture(bodyFixture);  
            _b2block1.SetUserData(data);  
              
              
            //block 2  
            bodyDef = createBoxDef(block2_rec);  
            bodyDef.type = b2Body.b2_dynamicBody;  
            bodyDef.linearDamping = 20;  
            bodyFixture = createBoxFixture(block2_rec);  
            bodyFixture.density = 10;  
            bodyFixture.friction = 1;  
              
            _b2block2 = _world.CreateBody(bodyDef);  
            _b2block2.CreateFixture(bodyFixture);  
            _b2block2.SetUserData(data);  
              
            //fixed pillar  
            bodyDef = new b2BodyDef();  
            bodyDef.position.Set(p2m(100), p2m(40));  
            bodyDef.type = b2Body.b2_staticBody;  
            var bodyShape:b2CircleShape = new b2CircleShape();  
            bodyShape.SetRadius (p2m(20));  
            bodyFixture = new b2FixtureDef();  
            bodyFixture.shape = bodyShape;  
            bodyFixture.density = 1;  
              
            var pillar:b2Body = _world.CreateBody(bodyDef);  
            pillar.CreateFixture(bodyFixture);  
            pillar.SetUserData(data);  
              
              
        }  
        private function createAway3DView ():void {  
            _container = new ObjectContainer3D();  
              
            var scene:Scene3D = new Scene3D();  
              
            camera = new TargetCamera3D();  
            camera.z = -1200;  
              
            _view = new View3D({scene:scene, camera:camera});  
            addChild(_view);  
              
            var light : PointLight3D = new PointLight3D();   
            light.position = new Vector3D(500,0,-500);  
            light.color = 0xFFFFFF;   
            light.diffuse = 0.7;  
            light.brightness = 2;  
            _view.scene.addLight(light);  
              
            //var material:WireColorMaterial = new WireColorMaterial(0xFF9900,{wireColor:0x000000});  
            var material:ShadingColorMaterial = new ShadingColorMaterial();   
            material.ambient = 0xFF9900;   
            material.diffuse = 0xFF9900;   
            material.specular = 0xFF9900;  
              
              
            var plane:Plane = new Plane({material:new WireColorMaterial(0x666666,{wireColor:0x666666}), width:1000,height:1000});  
            plane.bothsides = true;  
            plane.rotationX = 90;  
            plane.segmentsW = plane.segmentsH = 4;  
            plane.z = 200;  
            plane.y = 200;  
            plane.x = 30;  
            plane.ownCanvas = true;  
            _view.scene.addChild(plane);  
            _container.ownCanvas = true;  
              
            _player = new Cube({material:material, width:player_rec.width,height:player_rec.width,depth:player_rec.width});  
            _player.z = 25;  
            _player.x = player_rec.x;  
            _player.y = player_rec.y;  
            //create a 'face' for the cube, so player knows what is the front side  
            _player.cubeMaterials.bottom=new WireColorMaterial(0xFF3399,{wireColor:0x222222});  
            //use own canvas to help with z sorting       
            //_player.ownCanvas = true;  
            _container.addChild(_player);  
              
            material = new ShadingColorMaterial();   
            material.ambient = 0x0099FF;   
            material.diffuse = 0x0099FF;   
            material.specular = 0x0099FF;  
              
            _block1 = new Cube({material:material, width:block1_rec.width,height:block1_rec.width,depth:block1_rec.width});  
            _block1.z = 40;  
            _block1.x = block1_rec.x;  
            _block1.y = block1_rec.y;  
            _block1.segmentsD = 2;  
            _block1.segmentsH = 2;  
            _block1.segmentsW = 2;  
              
            _container.addChild(_block1);  
              
              
            _block2 = new Cube({material:material, width:block2_rec.width,height:block2_rec.height,depth:200});  
            _block2.z = 100;  
            _block2.x = block2_rec.x;  
            _block2.y = block2_rec.y;  
            _block2.segmentsD = 4;  
            _block2.segmentsH = 4;  
            _block2.segmentsW = 4;  
            _container.addChild(_block2);  
              
            material = new ShadingColorMaterial();   
            material.ambient = 0x66FF00;   
            material.diffuse = 0x66FF00;   
            material.specular = 0x66FF00;  
              
            var pillar:Cylinder = new Cylinder({material:material, radius:20, height: 60});  
            pillar.rotationX = 90;  
            /* 
            remember that the origin of an object is at its center: 
            so the z of every object is changed so that they are all "lying on the floor"  
            */  
            pillar.z = 30;  
            pillar.x = Y_DIR*100;  
            pillar.y = Y_DIR*40;  
            _container.addChild(pillar);  
              
              
            //rotate the view to add 3D feel and match the one from the 2D version   
            _container.rotationZ = -180;  
            _container.rotationX = -180;  
            _view.scene.rotationX = -45;  
              
            camera.target = _player;  
            _view.scene.addChild(_container);  
              
        }  
          
        private function shoot ():void {  
            if (shoot_timer.running) return;  
              
            //create particle in box2D  
            var bodyDef:b2BodyDef = new b2BodyDef();  
            var pPos:b2Vec2 = _b2player.GetPosition();  
            var angle:Number = _b2player.GetAngle() + Math.PI/2;  
            pPos.x -= p2m(10)*Math.cos(angle);  
            pPos.y -= p2m(10)*Math.sin(angle);  
              
            bodyDef.position.Set(pPos.x, pPos.y);  
              
            bodyDef.type = b2Body.b2_dynamicBody;  
            bodyDef.angularDamping = 10;  
              
            var bodyShape:b2CircleShape = new b2CircleShape();  
            bodyShape.SetRadius (p2m(10));  
            var bodyFixture:b2FixtureDef = new b2FixtureDef();  
            bodyFixture.shape = bodyShape;  
            bodyFixture.density = 0;  
            bodyFixture.restitution = 0;  
              
              
            var bullet:b2Body = _world.CreateBody(bodyDef);  
            bullet.CreateFixture(bodyFixture);  
            bullet.SetLinearVelocity(new b2Vec2(-10*Math.cos(angle),-10*Math.sin(angle)));  
              
              
            //create sprite3D  
            var sphere : Sphere = new Sphere({segmentsW:4,segmentsH:2, material:new WireColorMaterial(0xFF3399,{wireColor:0x222222}), radius:10 });  
            sphere.z = 35;  
            sphere.x = m2p(pPos.x);  
            sphere.y = m2p(pPos.y);  
            _container.addChild(sphere);  
              
            var bulletData:Object = {};  
            bulletData.type = "bullet";  
            bulletData.hit = false;  
            bulletData.sphere = sphere;  
            bullet.SetUserData(bulletData);  
              
            b2bullets.push(bullet);  
            shoot_timer.start();  
        }  
          
          
        private function p2m(pixel:Number):Number {  
            return pixel/30;  
        }  
          
        private function m2p(m:Number):Number {  
            return m * 30;  
        }  
          
        private function updateBody ():void {  
              
              
            _b2player.SetLinearVelocity(new b2Vec2(0,0));  
              
              
            if (_moveLeft) _b2player.SetAngle( _b2player.GetAngle() - 0.05);  
            if (_moveRight) _b2player.SetAngle( _b2player.GetAngle() + 0.05);  
              
            var angle:Number = _b2player.GetAngle() + Math.PI/2;  
            var playerVelocity:b2Vec2 = _b2player.GetLinearVelocity();  
              
            if (_moveUp ) {  
                playerVelocity.x -= speed*Math.cos(angle);  
                playerVelocity.y -= speed*Math.sin(angle);  
                  
            }  
            if (_moveDown ) {  
                playerVelocity.x += speed*Math.cos(angle);  
                playerVelocity.y += speed*Math.sin(angle);    
            }  
              
        }  
        ///////////////////////////// EVENTS ///////////////////////////////////////  
        private function onKey_Up (event:KeyboardEvent):void {  
              
            switch (event.keyCode) {  
                case 38:  
                    //UP KEY is up  
                    _moveUp = false;  
                    break;  
                case 39:  
                    //RIGHT KEY is up  
                    _moveRight = false;  
                    break;  
                case 37:  
                    //LEFT Key is up  
                    _moveLeft = false;  
                    break;  
                case 40:  
                    //DOWN KEY is up  
                    _moveDown = false;  
                    break;  
                case 32:  
                    //SPACE Bar is up  
                    shoot();  
                    break;  
            }  
        }  
        private function onKey_Down (event:KeyboardEvent):void {  
              
            switch (event.keyCode) {  
                case 38:  
                    //UP KEY is down  
                    _moveUp = true;   
                    break;  
                case 39:  
                    //RIGHT KEY is down  
                    _moveRight = true;  
                      
                    break;  
                case 37:  
                    //LEFT Key is down  
                    _moveLeft = true;  
                      
                    break;  
                case 40:  
                    //DOWN KEY is down  
                    _moveDown = true;  
                    break;  
                case 32:  
                    //SPACE BAR is down  
                    break;  
                  
            }  
        }  
          
        private function onLoop (event:Event):void {  
            updateBody();  
              
            _world.Step(1/30,10,10);  
              
            transformObject(_b2player, _player);  
            transformObject(_b2block1, _block1);  
            transformObject(_b2block2, _block2);  
              
            if (b2bullets) {  
                for (var i:int = b2bullets.length-1; i >= 0; i--) {  
                    transformObject(b2bullets[i], b2bullets[i].GetUserData().sphere);  
                    if (b2bullets[i].GetUserData().hit == true) {  
                        _container.removeChild(b2bullets[i].GetUserData().sphere);  
                        _world.DestroyBody(b2bullets[i]);  
                        b2bullets.splice(i,1);  
                        break;  
                    }  
                }  
            }  
              
            _view.render();  
              
        }  
        private function transformObject (original:b2Body, threeD:Object3D):void {  
            var position:b2Vec2 = original.GetPosition();  
            var angle:Number = original.GetAngle() * 180 / Math.PI ;  
              
            threeD.x = Y_DIR*m2p(position.x);  
            threeD.y = Y_DIR*m2p(position.y);  
            threeD.rotationZ = angle;  
        }  
          
        private function createBoxDef (rec:Rectangle):b2BodyDef {  
            var bodyDef:b2BodyDef = new b2BodyDef();  
            bodyDef.position.Set(p2m(rec.x + rec.width/2), p2m(rec.y + rec.height/2));  
            bodyDef.type = b2Body.b2_staticBody;  
            bodyDef.angularDamping = 10;  
            return bodyDef;  
        }  
          
          
        private function createBoxFixture (rec:Rectangle):b2FixtureDef {  
            var bodyShape:b2PolygonShape = new b2PolygonShape();  
            bodyShape.SetAsBox (p2m(rec.width/2), p2m(rec.height/2));  
            var bodyFixture:b2FixtureDef = new b2FixtureDef();  
            bodyFixture.shape = bodyShape;  
            bodyFixture.density = 1;  
            bodyFixture.restitution = 0;  
            return bodyFixture;  
        }         
          
    }  
}

And this is the result:

Use arrows to move, and space bar to shoot.

The code could be a lot cleaner and shorter if I’d used multiple classes, but I thought the example would be easier to understand if I used only one class.

One tip which I think is important would be to add some space between objects upon collision, in other words, make the collision area be slightly larger than the actual object. This will help with Z sorting. Sometimes in this example here, when you collide the player box with the blue boxes you can see the face segments get jagged and blink.

And the extra distance could be easily countered with a simple bump map in case it looks weird.

The problem of file size is however a big one. Box2D and Away3D are very heavy loads unfortunately. I’ll try to post the same code but with JigLib and see how that goes.

But I hope this helps with any ideas for 3D games you might have. I’ve seen race games using this engine, and third person shooters. They might seem very simple, but the number of fun games one could create with these simple ideas is amazing. And who says 3D has to be complicated!

Of course, uneven terrain in 3D can be a bitch…

Next I’ll do some line collision in 3D. »

Get the most popular Phaser 3 book

Through 202 pages, 32 source code examples and an Android Studio project you will learn how to build cross platform HTML5 games and create a complete game along the way.

Get the book

215 GAME PROTOTYPES EXPLAINED WITH SOURCE CODE
// 1+2=3
// 100 rounds
// 10000000
// 2 Cars
// 2048
// A Blocky Christmas
// A Jumping Block
// A Life of Logic
// Angry Birds
// Angry Birds Space
// Artillery
// Astro-PANIC!
// Avoider
// Back to Square One
// Ball Game
// Ball vs Ball
// Ball: Revamped
// Balloon Invasion
// BallPusher
// Ballz
// Bar Balance
// Bejeweled
// Biggification
// Block it
// Blockage
// Bloons
// Boids
// Bombuzal
// Boom Dots
// Bouncing Ball
// Bouncing Ball 2
// Bouncy Light
// BoxHead
// Breakout
// Bricks
// Bubble Chaos
// Bubbles 2
// Card Game
// Castle Ramble
// Chronotron
// Circle Chain
// Circle Path
// Circle Race
// Circular endless runner
// Cirplosion
// CLOCKS - The Game
// Color Hit
// Color Jump
// ColorFill
// Columns
// Concentration
// Crossy Road
// Crush the Castle
// Cube Jump
// CubesOut
// Dash N Blast
// Dashy Panda
// Deflection
// Diamond Digger Saga
// Don't touch the spikes
// Dots
// Down The Mountain
// Drag and Match
// Draw Game
// Drop Wizard
// DROP'd
// Dudeski
// Dungeon Raid
// Educational Game
// Elasticity
// Endless Runner
// Erase Box
// Eskiv
// Farm Heroes Saga
// Filler
// Flappy Bird
// Fling
// Flipping Legend
// Floaty Light
// Fuse Ballz
// GearTaker
// Gem Sweeper
// Globe
// Goat Rider
// Gold Miner
// Grindstone
// GuessNext
// Helicopter
// Hero Emblems
// Hero Slide
// Hexagonal Tiles
// HookPod
// Hop Hop Hop Underwater
// Horizontal Endless Runner
// Hundreds
// Hungry Hero
// Hurry it's Christmas
// InkTd
// Iromeku
// Jet Set Willy
// Jigsaw Game
// Knife Hit
// Knightfall
// Legends of Runeterra
// Lep's World
// Line Rider
// Lumines
// Magick
// MagOrMin
// Mass Attack
// Math Game
// Maze
// Meeblings
// Memdot
// Metro Siberia Underground
// Mike Dangers
// Mikey Hooks
// Nano War
// Nodes
// o:anquan
// One Button Game
// One Tap RPG
// Ononmin
// Pacco
// Perfect Square!
// Perfectionism
// Phyballs
// Pixel Purge
// PixelField
// Planet Revenge
// Plants Vs Zombies
// Platform
// Platform game
// Plus+Plus
// Pocket Snap
// Poker
// Pool
// Pop the Lock
// Pop to Save
// Poux
// Pudi
// Pumpkin Story
// Puppet Bird
// Pyramids of Ra
// qomp
// Quick Switch
// Racing
// Radical
// Rebuild Chile
// Renju
// Rise Above
// Risky Road
// Roguelike
// Roly Poly
// Run Around
// Rush Hour
// SameGame
// SamePhysics
// Save the Totem
// Security
// Serious Scramblers
// Shrink it
// Sling
// Slingy
// Snowflakes
// Sokoban
// Space Checkers
// Space is Key
// Spellfall
// Spinny Gun
// Splitter
// Spring Ninja
// Sproing
// Stabilize!
// Stack
// Stairs
// Stick Hero
// String Avoider
// Stringy
// Sudoku
// Super Mario Bros
// Surfingers
// Survival Horror
// Talesworth Adventure
// Tetris
// The Impossible Line
// The Moops - Combos of Joy
// The Next Arrow
// Threes
// Tic Tac Toe
// Timberman
// Tiny Wings
// Tipsy Tower
// Toony
// Totem Destroyer
// Tower Defense
// Trick Shot
// Tunnelball
// Turn
// Turnellio
// TwinSpin
// vvvvvv
// Warp Shift
// Way of an Idea
// Whack a Creep
// Wheel of Fortune
// Where's my Water
// Wish Upon a Star
// Word Game
// Wordle
// Worms
// Yanga
// Yeah Bunny
// Zhed
// zNumbers