Tag Archives: QuickBox2D

QuickBox2D Editor

When I first created QuickBox2D I simultaneously developed a simple editor to aid in the creation of complex simulations. The result is very alpha and should be used cautiously. There is no UI, it is entirely key controlled. It generates actionscript files that can be copy and pasted into working simulations. It also has a preview mode for previewing simulations as you develop them. This is by no means a full featured editor, there is a good deal of work to be done on it. I am releasing the code as a simple zip for people who would like to develop it further. If there is enough interest I’ll create some kind of code repositiory, but for now I’m just releasing the below zip.

Take a look at the editor

Download the Source

I may post further instructions for the editor in the future… Remember to save your work frequently and to create new versions for every change that you make to a file.

Suggested Features:
Simple GUI
Base64 encoding for get string

Known Issues:
Making joints that don’t touch things can break the preview app.

Posted in QuickBox2D | Also tagged , , , | 24 Comments

QuickBox2D Editor 2B Released

I’ll be releasing the QuickBox2D on googlecode in the near future based on the response to yesterdays post.

Posted in QuickBox2D | Also tagged , , , | 15 Comments

To release or not to release…

So I have a QuickBox2D editor that I’ve had since the earliest version of QuickBox2D. It is really pretty buggy and imperfect. I’m wondering if I should release it even though it’s really buggy… my main issue is I won’t be able to guarantee that it is a safe editor to use for real projects.

Thoughts? Should I release it anyway?

Posted in QuickBox2D | Also tagged | 13 Comments

Polygon Problems

Lots of people have mentioned that they have problems with QuickBox2D Polygons. The simple solution is not to use the verts 2d array (which is more like how Box2D does polys). So when in doubt about polygons, simply use the points array which will nearly always work as long as the contour you define does not cross over itself. Here is a simple example on wonderfl:

Also... polygons are covered extensively in part two of the tutorial over at active tuts... more on that later.

Here is the timeline code:

Actionscript:
  1. import com.actionsnippet.qbox.*;
  2.             /*
  3.                0
  4.               / \
  5.              0_0 0
  6.                | |
  7.                0-0
  8.             */
  9.             var sim:QuickBox2D = new QuickBox2D(this);
  10.             sim.createStageWalls();
  11.             // define the contour of your poly
  12.             // no limits as long as it doesn't cross over
  13.             // itself
  14.             sim.addPoly({x:10, y:5, points:[0.5,0,
  15.                                             1, 1,
  16.                                             1, 2,
  17.                                             0.5, 2,
  18.                                             0.5, 1,
  19.                                             0,1,
  20.                                             0.5,0],
  21.                                             wireframe:false});
  22.             sim.addCircle({x:11, y:10});
  23.             sim.start();
  24.             sim.mouseDrag();

Posted in Uncategorized | Also tagged , , | Leave a comment

QuickBox2D Update On the Way

Been meaning to mention that I'm going to release an updated version of QuickBox2D in the next few days... It will have two minor bug fixes, one or two minor new features and will work with the latest version of Box2D...

Posted in Uncategorized | Tagged | 2 Comments

QuickBox2D Mini-Poly Editor

Actionscript:
  1. [SWF(width = 800, height = 600, frameRate = 60)]
  2. import com.actionsnippet.qbox.*;
  3. stage.frameRate = 60;
  4.  
  5. var sim:QuickBox2D = new QuickBox2D(this);
  6.  
  7. sim.createStageWalls();
  8.  
  9. sim.start();
  10.  
  11. var output:TextField = new TextField();
  12. output.text = "Click anywhere to add points to a polygon. Hit any key to test.\n\n";
  13. output.x = output.y = 50;
  14. with(output) width = 300, height = 400, border = true, selectable = true, wordWrap = true, multiline = true;
  15. addChild(output);
  16.  
  17. function display(str:*):void{
  18.     output.appendText(str.toString() + "\n");
  19. }
  20.                                
  21. var points:Array = [];
  22. var poly:Shape = new Shape();
  23. addChild(poly);
  24.  
  25. stage.addEventListener(MouseEvent.CLICK, onClick);
  26. stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyPressed);
  27.  
  28. function onClick(evt:MouseEvent):void {
  29.     if (points.length == 0){
  30.         poly.graphics.beginFill(0xCCCCCC);
  31.         poly.graphics.lineStyle(1, 0xFF0000);
  32.         poly.graphics.moveTo(mouseX, mouseY);
  33.     }else{
  34.         poly.graphics.lineTo(mouseX, mouseY);
  35.     }
  36.     poly.graphics.drawCircle(mouseX, mouseY, 2);
  37.      
  38.     points.push(mouseX / 30.0, mouseY / 30.0);
  39. }
  40.  
  41. function onKeyPressed(evt:KeyboardEvent):void {
  42.      // average all points
  43.      var avgX:Number=0
  44.      var avgY:Number = 0;
  45.      
  46.      for (var i:int = 0; i<points.length; i+=2){
  47.          avgX += points[i];
  48.          avgY += points[i + 1];
  49.      }
  50.    
  51.      avgX /= points.length/2;
  52.      avgY /=  points.length/2;
  53.      avgX = avgX;
  54.      avgY = avgY;
  55.      
  56.      // subtract averages and fix decimal place
  57.       for (i = 0; i<points.length; i+=2){
  58.           var yp:int = i + 1;
  59.           points[i] -= avgX;
  60.           points[yp] -= avgY;
  61.           points[i] = Number(points[i].toFixed(2));
  62.           points[yp] = Number(points[yp].toFixed(2));
  63.      }
  64.      
  65.      display("points array:");
  66.      display(points);
  67.      
  68.      try{
  69.          var p:QuickObject = sim.addPoly({x:avgX, y:avgY, points:points});
  70.          p.userData.graphics.beginFill(0xFF0000);
  71.          p.userData.graphics.drawCircle(0,0,5);
  72.      }catch(e:*){
  73.         display("Invalid polygon data!");
  74.      }
  75.      
  76.      poly.graphics.clear();
  77.      points = [];
  78. }

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...

Posted in Box2D, QuickBox2D | Also tagged , , , | 26 Comments

QuickBox2D Custom Debug Draw

Actionscript:
  1. import com.actionsnippet.qbox.*;
  2. import Box2D.Dynamics.*
  3.  
  4. stage.frameRate = 60;
  5.  
  6. var sim:QuickBox2D = new QuickBox2D(this, {debug:true});
  7.  
  8. // get at the b2DebugDraw instance
  9. var debug:b2DebugDraw = sim.w.m_debugDraw;
  10. debug.m_drawScale = 30.0;
  11. debug.m_fillAlpha = 0.5;
  12. debug.m_alpha = 0.5;
  13. debug.m_lineThickness = 1.0;
  14. debug.m_drawFlags = 0xFF;
  15.  
  16. sim.createStageWalls();  
  17.  
  18. for (var i:int = 0; i<10; i++){
  19.   sim.addBox({x:3 + i, y:3 + i, width:2, height:0.5});
  20. }
  21. sim.addCircle({x:12, y:5, radius:2});
  22.  
  23. sim.start();
  24. sim.mouseDrag();

Note: This snippet requires the QuickBox2D library

This snippet shows an easy way to get at the settings for Box2D's debug renderer.


Have a look at the swf...

Posted in Uncategorized | Also tagged , , , | 2 Comments

QuickBox2D 1.1 (2 major bug fixes)

Since the release of QuickBox2D 1.0 two bugs were discovered by numerous developers. The first bug was the inability to properly destroy group objects. The second bug was a small memory leak that caused most QuickObjects to remain in memory. Both of these bugs are now resolved.

Download QuickBox2D 1.1

Testing the memory leak. In QuickBox2D 1.0 if you created and destroyed 100s of rigid bodies, the ram would very slowly rise... Sometimes it would get garbage collected, but the memory would never fully be released. I created a simple test to make sure this is fixed in 1.1:

Actionscript:
  1. import com.actionsnippet.qbox.*;
  2.  
  3. var sim:QuickBox2D = new QuickBox2D(this, {debug:false});
  4.  
  5. sim.createStageWalls();
  6.  
  7. var levelParts:Array = [];
  8. const TWO_PI:Number = Math.PI * 2;
  9.  
  10. // destroys and then creates a bunch of rigid bodies
  11. // called every second
  12. buildRandomLevel();
  13. setInterval(buildRandomLevel, 1000);
  14.  
  15. var txt:TextField = TextField(addChild(new TextField()));
  16. txt.x = txt.y = 30;
  17. txt.backgroundColor = 0xFFFFFF;
  18. sim.start();
  19.  
  20. // display amount of ram used, to make sure garbage collection is working
  21. sim.addEventListener(QuickBox2D.STEP, onStep);
  22. function onStep(evt:Event):void{
  23.     txt.text = (System.totalMemory / 100000).toFixed(2) + "mb";
  24. }
  25.  
  26. function buildRandomLevel():void{
  27.     // destroy all rigid bodies
  28.     for (var i:int = 0; i<levelParts.length; i++){
  29.         levelParts[i].destroy();
  30.     }
  31.     levelParts = [];
  32.     // create a bunch of circles and boxes
  33.     for (i = 0; i<16; i++){
  34.         var rad:Number = 0.4 ;
  35.         levelParts.push(sim.addCircle({x:1 + i * rad * 4, y : 2, radius:rad - Math.random()*0.3}));
  36.        
  37.         var rot:Number = Math.random() * TWO_PI;
  38.         levelParts.push(sim.addBox({x:4+Math.random() * i * 2, y:4+Math.random()*i,
  39.                     width:3, height:0.25, angle:rot, density:0}));
  40.     }
  41. }

This snippet creates and destroys a bunch of rigid bodies again and again.... On my macbook 2.6 Ghz intel core duo... the ram runs between 79mb and 112mb. I let it run for 40 minutes and this did not change - it always eventually returned down to 79mb.


Have a look at the swf...

Thanks to all the people who gave feedback that lead to the discover of these bugs.

Posted in Box2D, QuickBox2D, motion, pixel manipulation | Also tagged , , | 25 Comments

QuickBox2D Mini-Machine

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

View Demo...

and here is the source:

Actionscript:
  1. import com.actionsnippet.qbox.*
  2. import Box2D.Collision.Shapes.*;
  3. import Box2D.Common.Math.*;
  4.  
  5. [SWF(width = 800, height = 600, backgroundColor = 0x000000, frameRate = 60)]
  6.  
  7. var sim:QuickBox2D = new QuickBox2D(this, {debug:true});
  8.  
  9. var sw:Number = stage.stageWidth / 30;
  10. var sh:Number = stage.stageHeight / 30;
  11.            
  12. sim.addBox({x:sw / 2, y:sh, width:sw - 3, height:1,  density:.0})
  13. sim.addBox({x:sw / 2, y:0, width:sw - 3, height:1,  density:.0 })
  14. sim.addBox({x:0, y:sh / 2, width:1, height:sh ,  density:.0})  
  15. sim.addBox({x:sw, y:sh / 2, width:1, height:sh,  density:.0})  
  16.  
  17. var slider:QuickObject = sim.addBox({x:3, y:6, width:6, height:0.25, density:0, angle:0.05});
  18. var pusher:QuickObject = sim.addBox({x:15, y:18, width:4, height:4, density:0});
  19.  
  20. sim.setDefault({collideConnected:false, frequencyHz:10});
  21. var anchor:QuickObject = sim.addCircle({x:3, y:2, radius:0.2, density:0});
  22.  
  23. var m0:QuickObject = sim.addBox({x:3, y:5, width:1, height:0.25, fixedRotation:true});
  24.  
  25. var j0:QuickObject = sim.addJoint({type:"distance", a:anchor.body, b:m0.body});
  26.  
  27. var m1:QuickObject = sim.addBox({x:2.5, y:9.5, width:0.25, height:6, fixedRotation:true});
  28. var m2:QuickObject = sim.addBox({x:3.5, y:9.5, width:0.25, height:6, fixedRotation:true});
  29.  
  30. var j1:QuickObject = sim.addJoint({type:"distance", a:m0.body, b:m1.body});
  31. var j2:QuickObject = sim.addJoint({type:"distance", a:m0.body, b:m2.body});
  32. var j3:QuickObject = sim.addJoint({type:"distance", a:m2.body, b:m1.body});
  33.  
  34. var boxes:Array = [];
  35. var boxNum:int = 21;
  36. var index:int = boxNum;
  37. var filter:b2FilterData;
  38. var lookupQuickObject:Dictionary = new Dictionary();
  39. for (var i:int = 0; i<boxNum; i++){
  40.     boxes[i] = sim.addBox({x:3, y:6.3 + i * 0.3, width:0.6, height:0.3,  friction:0.0, allowSleep:false});
  41.     lookupQuickObject[boxes[i].shape] = boxes[i];
  42. }
  43.  
  44. var m3:QuickObject = sim.addBox({x:3, y:12.25 , width:1, height:0.25, allowSleep:false,fixedRotation:true, groupIndex:-1});
  45.  
  46. var j4:QuickObject = sim.addJoint({type:"revolute", a:m1.body, b:m3.body});
  47. var j5:QuickObject = sim.addJoint({type:"revolute", a:m2.body, b:m3.body});
  48.  
  49. var t:Number = Math.PI;
  50. var dropBox:int = 0;
  51. var prevBox:QuickObject;
  52. var resetVec:b2Vec2 = new b2Vec2(0,0);
  53.  
  54. function setGroupIndex(b:QuickObject, index:int):void{
  55.     filter = b.shape.GetFilterData();
  56.     filter.groupIndex = index;
  57.     b.shape.SetFilterData(filter);
  58. }
  59.  
  60. sim.start();
  61. sim.addEventListener(QuickBox2D.STEP, onStep);
  62. function onStep(evt:Event):void{
  63.     dropBox++;
  64.    
  65.     if (dropBox % 80 == 0){
  66.         index--;
  67.         if (index> -1){
  68.             if (prevBox){
  69.                 setGroupIndex(prevBox, 1);
  70.             }
  71.             prevBox = boxes[index]
  72.             setGroupIndex(boxes[index], -1);
  73.             m3.y += 0.05;
  74.         }
  75.     }
  76.    
  77.     if (index <0){
  78.         if (pusher.x> 3.5){
  79.             pusher.x -= 0.05;
  80.         }
  81.     }
  82.     for (var i:int = 0; i<boxNum; i++){
  83.         if (boxes[i].y> 22){
  84.             boxes[i].angle = 0;
  85.             boxes[i].y = -2;
  86.             boxes[i].x = 1;
  87.             boxes[i].body.SetLinearVelocity(resetVec);
  88.         }
  89.     }
  90.    
  91.     if (index> 0){
  92.       anchor.x = 6 + 3 * Math.cos(t);
  93.       t += 0.01;
  94.     }
  95. }

Posted in Box2D, QuickBox2D | Also tagged , , , | 9 Comments

QuickBox2D Joint Skinning

Well... while on the topic of skinning I figured I'd post something I've been meaning to post for awhile. Currently, joint skinning leaves something to be desired in QuickBox2D. This is because I haven't had the need to skin many joints ... and also because with joints like pulley, prismatic, revolute etc... I'm not entirely sure what the best skinning solution even is... For instance, on a pulley you probably don't want three duplicate MovieClips used for the skin. Anyway, early on in my Box2D experimentation I needed distance joint skins so that feature has been around since maybe alpha 108...

It's pretty simple, Check out the demo and code below:

Actionscript:
  1. import com.actionsnippet.qbox.*;
  2.  
  3. [SWF(width = 800, height = 600, backgroundColor = 0xFFFFFF, frameRate=60)]
  4.  
  5. var sim:QuickBox2D = new QuickBox2D(this, {debug:false});
  6.  
  7. sim.createStageWalls({fillColor:0xFFFFFF});
  8.  
  9. var circleA:QuickObject = sim.addCircle({x:3, y:3, radius:1, skin:CircleSkin});
  10. var circleB:QuickObject = sim.addCircle({x:6, y:6, radius:0.5, skin:CircleSkin});
  11.  
  12. sim.addJoint({type:"distance", a:circleA.body, b:circleB.body, skin:JointSkin});
  13.  
  14. sim.start();
  15. sim.mouseDrag();


Check out the swf here...

Download the fla here...

Posted in Box2D, QuickBox2D | Also tagged , , | 11 Comments