Hello box2D – part 1

In programming the Hello world is probably the first you will ever make in a new language.
In the box2D wiki you can find a “Hello world” in box2DFlash style: AS3: Hello Box2D.

Easy as it should be … or is it?
This is not the “Hello world” I expected, so I’ll post one that helps you more on your way.

Hello_Box2D

source: Hello_Box2D

Lets start with a Flash document width 640px, height 480px, backgroundColor=”#000000″ and a framerate 60.
And add a document class: HelloWorld.
Save this .fla (for example HelloWorldBox2d.fla).

Now get your favorite code-editor (I suggest FlashDevelop) and create that document class, name it HelloWorld.as:
[as]
package {

import flash.display.Sprite;
import flash.events.Event;
// Classes used in this example
import Box2D.Dynamics.*;
import Box2D.Collision.*;
import Box2D.Collision.Shapes.*;
import Box2D.Common.Math.*;

public class HelloWorld extends Sprite{

// constructor
public function HelloWorld() {
trace( “HelloWorld.HelloWorld” );
}

} // end class

} // end package
[/as]
and save it next to the HelloWorldBox2d.fla.

You can see that I already add the import needed for Box2D.

The last thing you need to do is download the box2D classes: http://sourceforge.net/projects/box2dflash
Extract the zip file and copy the folder box2d next to the HelloWorldBox2d.fla and the HelloWorld.as

And now you are set…

Creating_a_World

Every Box2D program begins with the creation of a world object. This is the physics hub that manages memory, objects, and simulation.

source: Creating_a_World

The next piece of code can be placed in the constructor (public function HelloWorld() )
[as]
// Creat world AABB
var worldAABB:b2AABB = new b2AABB();
worldAABB.lowerBound.Set(-100.0, -100.0);
worldAABB.upperBound.Set(100.0, 100.0);

// Define the gravity vector
var gravity:b2Vec2 = new b2Vec2 (0.0, -10.0);

// Allow bodies to sleep
var doSleep:Boolean = true;

// Construct a world object
var world:b2World = new b2World(worldAABB, gravity, doSleep);
[/as]

Creating_a_Ground_Box

source: Creating_a_Ground_Box

[as]
var groundBodyDef:b2BodyDef = new b2BodyDef();
groundBodyDef.position.Set(0.0, -10.0);

var groundBody:b2Body = world.CreateBody(groundBodyDef);

var groundShapeDef:b2PolygonDef = new b2PolygonDef();
groundShapeDef.SetAsBox(50.0, 10.0);

groundBody.CreateShape(groundShapeDef);
[/as]

Creating_a_Dynamic_Body

We can use the same technique to create a dynamic body. The main difference, besides dimensions, is that we must establish the dynamic body’s mass properties.

source: Creating_a_Dynamic_Body

[as]
var bodyDef:b2BodyDef = new b2BodyDef();
bodyDef.position.Set(0.0, 4.0);
var body:b2Body = world.CreateBody(bodyDef);

var shapeDef:b2PolygonDef = new b2PolygonDef();
shapeDef.SetAsBox(1.0, 1.0);
shapeDef.density = 1.0;
shapeDef.friction = 0.3;
body.CreateShape(shapeDef);
body.SetMassFromShapes();
[/as]

Simulating_the_World

So we have initialized the ground box and a dynamic box. Now we are ready to set Newton loose to do his thing. We just have a couple more issues to consider.

source: Simulating_the_World
[as]
var timeStep:Number = 1.0 / 60.0;
var iterations:Number = 10;

for (var i:Number = 0; i < 60; ++i) { world.Step(timeStep, iterations); var position:b2Vec2 = body.GetPosition(); var angle:Number = body.GetAngle(); trace(position.x +','+ position.y +','+ angle); } [/as]

End result

The document class (HelloWorld.as) will look like this:

[as]
package {

import flash.display.Sprite;
// Box2D Classes used in this “Hello world”
import Box2D.Dynamics.*;
import Box2D.Collision.*;
import Box2D.Collision.Shapes.*;
import Box2D.Common.Math.*;

public class HelloWorld2 extends Sprite {

// constructor
public function HelloWorld() {
trace( “HelloWorld.HelloWorld” );

////////////////////////////////////////////////////////////////////////////////////////////////////
// http://www.box2d.org/wiki/index.php?title=Manual/AS3#Creating_a_World
////////////////////////////////////////////////////////////////////////////////////////////////////
// Create world AABB
var worldAABB:b2AABB = new b2AABB();
worldAABB.lowerBound.Set(-100.0, -100.0);
worldAABB.upperBound.Set(100.0, 100.0);

// Define the gravity vector
var gravity:b2Vec2 = new b2Vec2 (0.0, -10.0);

// Allow bodies to sleep
var doSleep:Boolean = true;

// Construct a world object
var world:b2World = new b2World(worldAABB, gravity, doSleep);

////////////////////////////////////////////////////////////////////////////////////////////////////
// http://www.box2d.org/wiki/index.php?title=Manual/AS3#Creating_a_Ground_Box
////////////////////////////////////////////////////////////////////////////////////////////////////
var groundBodyDef:b2BodyDef = new b2BodyDef();
groundBodyDef.position.Set(0.0, -10.0);

var groundBody:b2Body = world.CreateBody(groundBodyDef);

var groundShapeDef:b2PolygonDef = new b2PolygonDef();
groundShapeDef.SetAsBox(50.0, 10.0);

groundBody.CreateShape(groundShapeDef);

////////////////////////////////////////////////////////////////////////////////////////////////////
// http://www.box2d.org/wiki/index.php?title=Manual/AS3#Creating_a_Dynamic_Body
////////////////////////////////////////////////////////////////////////////////////////////////////
var bodyDef:b2BodyDef = new b2BodyDef();
bodyDef.position.Set(0.0, 4.0);
var body:b2Body = world.CreateBody(bodyDef);

var shapeDef:b2PolygonDef = new b2PolygonDef();
shapeDef.SetAsBox(1.0, 1.0);
shapeDef.density = 1.0;
shapeDef.friction = 0.3;
body.CreateShape(shapeDef);
body.SetMassFromShapes();

////////////////////////////////////////////////////////////////////////////////////////////////////
// http://www.box2d.org/wiki/index.php?title=Manual/AS3#Simulating_the_World_.28of_Box2D.29
////////////////////////////////////////////////////////////////////////////////////////////////////
var timeStep:Number = 1.0 / 60.0;
var iterations:Number = 10;

for (var i:Number = 0; i < 60; ++i) { world.Step(timeStep, iterations); var position:b2Vec2 = body.GetPosition(); var angle:Number = body.GetAngle(); trace(position.x +','+ position.y +','+ angle); } } } // end class } // end package [/as] So all you need to do is CTRL+ENTER. Nice effect isn't it? No? Only some numbers in the output panel? Yeah I know that was not very useful... So next post will be a better/improved version of the Hello world box2D style >> read Hello box2d – part 2