[SWF(width = 800, height = 600, frameRate = 60)]
import com.actionsnippet.qbox.*;
stage.frameRate = 60;

var sim:QuickBox2D = new QuickBox2D(this);

sim.createStageWalls();

sim.start();

var output:TextField = new TextField();
output.text = "Click anywhere to add points to a polygon. Hit any key to test.nn";
output.x = output.y = 50;
with(output) width = 300, height = 400, border = true, selectable = true, wordWrap = true, multiline = true;
addChild(output);

function display(str:*):void{
	output.appendText(str.toString() + "n");
}
								
var points:Array = [];
var poly:Shape = new Shape();
addChild(poly);

stage.addEventListener(MouseEvent.CLICK, onClick);
stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyPressed);

function onClick(evt:MouseEvent):void {
	if (points.length == 0){
		poly.graphics.beginFill(0xCCCCCC);
		poly.graphics.lineStyle(1, 0xFF0000);
		poly.graphics.moveTo(mouseX, mouseY);
	}else{
		poly.graphics.lineTo(mouseX, mouseY);
	}
	poly.graphics.drawCircle(mouseX, mouseY, 2);
	 
	points.push(mouseX / 30.0, mouseY / 30.0);
}

function onKeyPressed(evt:KeyboardEvent):void {
	 // average all points
	 var avgX:Number=0
	 var avgY:Number = 0;
	 
	 for (var i:int = 0; i<points.length; i+=2){
	     avgX += points[i];
		 avgY += points[i + 1];
	 }
	
	 avgX /= points.length/2;
	 avgY /=  points.length/2;
	 avgX = avgX;
	 avgY = avgY;
	 
	 // subtract averages and fix decimal place
	  for (i = 0; i<points.length; i+=2){
		  var yp:int = i + 1;
	      points[i] -= avgX;
		  points[yp] -= avgY;
		  points[i] = Number(points[i].toFixed(2));
		  points[yp] = Number(points[yp].toFixed(2));
	 }
	 
	 display("points array:");
	 display(points);
	 
	 try{
		 var p:QuickObject = sim.addPoly({x:avgX, y:avgY, points:points});
		 p.userData.graphics.beginFill(0xFF0000);
		 p.userData.graphics.drawCircle(0,0,5);
	 }catch(e:*){
		display("Invalid polygon data!"); 
	 }
	 
	 poly.graphics.clear();
	 points = [];
}

This snippet shows the basic concepts needed to go about creating a polygon editor for QuickBox2D. I have an unreleased editor that I use for my QuickBox2D projects, at some point I may release it… but for now I figured I’d post this extremely simplified version for people to expand on.

Have a look at the swf here…

Since this is a rather large snippet check out this demo first:

View Demo…

and here is the source:

import com.actionsnippet.qbox.*
import Box2D.Collision.Shapes.*;
import Box2D.Common.Math.*;

[SWF(width = 800, height = 600, backgroundColor = 0x000000, frameRate = 60)]

var sim:QuickBox2D = new QuickBox2D(this, {debug:true});
 
var sw:Number = stage.stageWidth / 30;
var sh:Number = stage.stageHeight / 30;
			
sim.addBox({x:sw / 2, y:sh, width:sw - 3, height:1,  density:.0})
sim.addBox({x:sw / 2, y:0, width:sw - 3, height:1,  density:.0 })
sim.addBox({x:0, y:sh / 2, width:1, height:sh ,  density:.0})  
sim.addBox({x:sw, y:sh / 2, width:1, height:sh,  density:.0})  

var slider:QuickObject = sim.addBox({x:3, y:6, width:6, height:0.25, density:0, angle:0.05});
var pusher:QuickObject = sim.addBox({x:15, y:18, width:4, height:4, density:0});

sim.setDefault({collideConnected:false, frequencyHz:10});
var anchor:QuickObject = sim.addCircle({x:3, y:2, radius:0.2, density:0});

var m0:QuickObject = sim.addBox({x:3, y:5, width:1, height:0.25, fixedRotation:true});

var j0:QuickObject = sim.addJoint({type:"distance", a:anchor.body, b:m0.body});

var m1:QuickObject = sim.addBox({x:2.5, y:9.5, width:0.25, height:6, fixedRotation:true});
var m2:QuickObject = sim.addBox({x:3.5, y:9.5, width:0.25, height:6, fixedRotation:true});

var j1:QuickObject = sim.addJoint({type:"distance", a:m0.body, b:m1.body});
var j2:QuickObject = sim.addJoint({type:"distance", a:m0.body, b:m2.body});
var j3:QuickObject = sim.addJoint({type:"distance", a:m2.body, b:m1.body});

var boxes:Array = [];
var boxNum:int = 21;
var index:int = boxNum;
var filter:b2FilterData;
var lookupQuickObject:Dictionary = new Dictionary();
for (var i:int = 0; i<boxNum; i++){
	boxes[i] = sim.addBox({x:3, y:6.3 + i * 0.3, width:0.6, height:0.3,  friction:0.0, allowSleep:false});
	lookupQuickObject[boxes[i].shape] = boxes[i];
}

var m3:QuickObject = sim.addBox({x:3, y:12.25 , width:1, height:0.25, allowSleep:false,fixedRotation:true, groupIndex:-1});

var j4:QuickObject = sim.addJoint({type:"revolute", a:m1.body, b:m3.body});
var j5:QuickObject = sim.addJoint({type:"revolute", a:m2.body, b:m3.body});

var t:Number = Math.PI;
var dropBox:int = 0;
var prevBox:QuickObject;
var resetVec:b2Vec2 = new b2Vec2(0,0);

function setGroupIndex(b:QuickObject, index:int):void{
	filter = b.shape.GetFilterData();
	filter.groupIndex = index;
	b.shape.SetFilterData(filter);
}

sim.start();
sim.addEventListener(QuickBox2D.STEP, onStep);
function onStep(evt:Event):void{
	dropBox++;
	
	if (dropBox % 80 == 0){
		index--;
		if (index > -1){
			if (prevBox){
				setGroupIndex(prevBox, 1);
			}
			prevBox = boxes[index]
			setGroupIndex(boxes[index], -1);
			m3.y += 0.05;
		}
	}
	
	if (index < 0){
		if (pusher.x > 3.5){
			pusher.x -= 0.05;
		}
	}
	for (var i:int = 0; i<boxNum; i++){
		if (boxes[i].y > 22){
			boxes[i].angle = 0;
			boxes[i].y = -2;
			boxes[i].x = 1;
			boxes[i].body.SetLinearVelocity(resetVec);
		}
	}
	
	if (index > 0){
	  anchor.x = 6 + 3 * Math.cos(t);
	  t += 0.01;
	}
}

import com.actionsnippet.qbox.*;
import Box2D.Dynamics.*;
import Box2D.Collision.Shapes.*;
 
[SWF(width = 800, height = 600, backgroundColor = 0x222222, frameRate=60)]

var sim:QuickBox2D = new QuickBox2D(this, {debug:false});

var box:QuickObject = sim.addBox({x:12, y:16, width:3, height:3, density:0 , groupIndex:-1});
var circle:QuickObject = sim.addCircle({x:5, y:3, radius:0.5, groupIndex:-1});

// add another box to show that Box2D is still working
var littleBox:QuickObject = sim.addBox({x:12, y:3, width:1, height:1});

sim.createStageWalls();

sim.start();
sim.mouseDrag();

var filter:b2ContactFilter = new QuickContactFilter();
QuickContactFilter(filter).addGroupIndexCallback(onGroupNeg1, -1);

function onGroupNeg1(a:b2Shape, b:b2Shape):void{
	//trace("group index -1 had a collision");
	box.userData.alpha = 0.5;
	setTimeout(function():void{ box.userData.alpha = 1 }, 200);
}

sim.w.SetContactFilter(filter);

This snippet answers a question from a recent comment. The question was basically: “Can you detect a collision between two rigid bodies that have the same negative groupIndex?”. When you give QuickObjects a negative groupIndex it means that they will not collide with one another. So by default Box2D contacts will not be triggered when these two rigid bodies overlap. In order to determine if these rigid bodies overlap you need to implement a custom b2ContactFilter class. This may sound confusing but its actually very easy. You can take a look at the custom b2ContactFilter class used in this snippet here: QuickContactFilter.as – It’s important to note that QuickContactFilter.as is not yet part of QuickBox2D, so if you want to run this snippet you’ll need to download the .as file.

You can check out the swf here…

import com.actionsnippet.qbox.*;
import Box2D.Common.Math.*;

[SWF(width = 800, height = 600, backgroundColor = 0x222222, frameRate=60)]

var sim:QuickBox2D = new QuickBox2D(this, {debug:false});

sim.createStageWalls();

var cup:QuickObject = sim.addPoly({x:3, y:13, wireframe:false, density:0, 
								   points:[0,0, .5, 0, .5,3,  2,3,  2,0,  2.5,0, 2.5, 3.5, 0, 3.5, 0,0]});
var deleter:QuickObject = sim.addBox({x:4.251, y: 15.9, width:1.5, height:0.25, fillColor:0xFF0000});

// use a distance joint instead of a group since isCurrentContact 
// uses the QuickObject.body property
sim.addJoint({a:cup.body, b:deleter.body, x1:deleter.x, y1:deleter.y+0.5});

var circles:Array = [];
for (var i:int = 0; i<10; i++){
	circles[i] = sim.addCircle({x:8 + i, y:5, radius:0.5});
}
var boxes:Array = [];
for (i = 0; i<10; i++){
	boxes[i] = sim.addBox({x:8.5 + i, y:10, width:0.5, height:0.5});
}

sim.start();
sim.mouseDrag();

var shootVec:b2Vec2 = new b2Vec2(4, -30);

// when circles are dropped in the cup they are destroyed
// when boxes are droppped in the cup their linear velocity is altered
var contacts:QuickContacts = sim.addContactListener();
contacts.addEventListener(QuickContacts.ADD, onAdd);
function onAdd(evt:Event):void{
	for (var i:int = 0; i<circles.length; i++){
		var circ:QuickObject = circles[i];
		if (contacts.isCurrentContact(circ, deleter)){
			// it's ok to destroy QuickObject here because they are only actually
			// destroyed after the timeStep has finished at the end of QuickBox2D's 
			// internal loop
			circ.destroy();
		}
	 } 
	 for (i = 0; i<boxes.length; i++){
		var box:QuickObject = boxes[i];
		if (contacts.isCurrentContact(box, deleter)){
			box.body.SetLinearVelocity(shootVec);
		}
	 }
}

Note: This snippet requires QuickBox2D 1.0 or greater

Here is another example of using QuickBox2D style contacts. In this example there is a cup with a small red box inside of it. When circles are placed inside the cup they are destroyed. When boxes are placed inside the cup they are shot upward.

Have a look at the swf…

A Note About Creation and Destruction

It’s worth noting that in Box2D your not supposed to destroy or create rigid bodies within the listener function for any contact events. QuickBox2D gets around this restriction by flagging the rigid body for destruction and destroying it at the end of QuickBox2D’s internal loop. This is not the case with creation of rigid bodies – if you attempt to create a rigid body within one of these listener functions you will get an error. See QuickBox2D Contacts Part 1 for an example of creating rigid bodies when there is a collision.

import com.actionsnippet.qbox.*;

[SWF(width = 800, height = 600, backgroundColor = 0x000000, frameRate=60)]

var sim:QuickBox2D = new QuickBox2D(this);

sim.createStageWalls();

var boxA:QuickObject = sim.addBox({x:3, y:3, width:2, height:2});
var boxB:QuickObject = sim.addBox({x:3, y:6, width:2, height:2});

// add a few extra circles to show that there are other contacts
// occuring
for (var i:int = 0; i<10; i++){
	sim.addCircle({x:5 + i, y:4, radius:0.1 + Math.random()});
}

sim.start();
sim.mouseDrag();

// when boxA touches boxB change their alpha values to 50%
var contacts:QuickContacts = sim.addContactListener();
contacts.addEventListener(QuickContacts.ADD, onAdd);
contacts.addEventListener(QuickContacts.PERSIST, onPersist);
contacts.addEventListener(QuickContacts.REMOVE, onRemove);
function onAdd(evt:Event):void{
	if(contacts.isCurrentContact(boxA, boxB)){
		boxA.userData.alpha = 0.5;
		boxB.userData.alpha = 0.5;
	}
}
function onPersist(evt:Event):void{
	if(contacts.isCurrentContact(boxA, boxB)){
		boxA.userData.alpha = 0.5;
		boxB.userData.alpha = 0.5;
	}
}
function onRemove(evt:Event):void{
	if(contacts.isCurrentContact(boxA, boxB)){
		boxA.userData.alpha = 1;
		boxB.userData.alpha = 1;
	}
}

Note: This snippet requires QuickBox2D 1.0 or greater

This is another example showing how to make use of QuickBox2D contacts. In this example three contact events are used ADD, PERSIST and REMOVE. When the two boxes are touching their alpha values are set to 50% – otherwise their alpha values are at 100%.

Have a look at the swf…

A Little Detail About the Events

The ADD event is dispatched when a new b2ContactPoint is generated. The PERSIST event is dispatched as long as the b2ContactPoint exists for more than one timeStep – and from what I can tell, is dispatched until the rigid bodies it is associated with go to sleep. The REMOVE event is called when the b2ContactPoint is removed, meaning the rigid bodies that caused the creating of the b2ContactPoint are no longer touching.

You need to be careful with the code that you place inside the listener functions for these events. The reason being that these events are called many many times for every contact point in the simulation.

import com.actionsnippet.qbox.*;
import Box2D.Common.Math.*;

[SWF(width = 800, height = 600, backgroundColor = 0x000000, frameRate=60)]

var sim:QuickBox2D = new QuickBox2D(this, {debug:false, frim:true});

sim.createStageWalls();

var boxA:QuickObject = sim.addBox({x:3, y:3, width:2, height:2, fillColor:0xFF0000});
var boxB:QuickObject = sim.addBox({x:3, y:6, width:2, height:2, fillColor:0xFF0000});

sim.start();
sim.mouseDrag();

// when boxA touches boxB a circle QuickObject is created
var contacts:QuickContacts = sim.addContactListener();
// listen for contact points being added
contacts.addEventListener(QuickContacts.ADD, onAdd);
function onAdd(evt:Event):void{
	// see if this contact event is associated with boxA and boxB
	if(contacts.isCurrentContact(boxA, boxB)){
		// get the location of the collision in world space
		var loc:b2Vec2 = contacts.currentPoint.position;
		// you cannot create new QuickObjects inside this listener function
		// so we just give a 5 ms delay
		setTimeout(sim.addCircle, 5, {x:loc.x, y:loc.y});
	}
}

Note: This snippet requires QuickBox2D 1.0 or greater

I’ve created a few simple examples to show how to use QuickBox2D contact listeners. This is the first one. When two boxes collide circles are added to the simulation at the point of collision.

Have a look at the swf…