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:
-
import com.actionsnippet.qbox.*;
-
/*
-
0
-
/ \
-
0_0 0
-
| |
-
0-0
-
*/
-
var sim:QuickBox2D = new QuickBox2D(this);
-
sim.createStageWalls();
-
// define the contour of your poly
-
// no limits as long as it doesn't cross over
-
// itself
-
sim.addPoly({x:10, y:5, points:[0.5,0,
-
1, 1,
-
1, 2,
-
0.5, 2,
-
0.5, 1,
-
0,1,
-
0.5,0],
-
wireframe:false});
-
sim.addCircle({x:11, y:10});
-
sim.start();
-
sim.mouseDrag();
This snippet takes xml and builds a multi-tiered navigation based on how nodes are nested etc...:
So that something like this:
XML:
-
var menu:XML=<nav>
-
<element label="one">
-
<element label="a" />
-
<element label="b" />
-
<element label="c" />
-
</element>
-
<element label="two">
-
<element label="three">
-
<element label="aa">
-
<element label="zevan" />
-
</element>
-
<element label="bb" />
-
<element label="cc" />
-
</element>
-
</element>
-
</nav>;
Turns into an expandable and collapsible menu that looks like this:
Here is the timeline code:
Actionscript:
-
var menu:XML=<nav>
-
<element label="one">
-
<element label="a" />
-
<element label="b" />
-
<element label="c" />
-
</element>
-
<element label="two">
-
<element label="three">
-
<element label="aa">
-
<element label="zevan" />
-
</element>
-
<element label="bb" />
-
<element label="cc" />
-
</element>
-
</element>
-
</nav>;
-
-
var elements:Array = new Array();
-
setupMenu();
-
-
function setupMenu():void {
-
parse(menu);
-
// hide child elements
-
for (var i:int = 0; i<elements.length; i++) {
-
var mc:MovieClip = elements[i];
-
if (mc.parents != 1) {
-
removeChild(mc);
-
}
-
}
-
arrangeY();
-
}
-
-
function parse(m:XML):void {
-
for each (var d:XML in m.children()) {
-
makeBtn(d, numParents(d));
-
parse(d);
-
}
-
}
-
-
function makeBtn(d:XML, offsetX:int):void {
-
var btn:MovieClip = new MovieClip();
-
btn.x = offsetX * 20;
-
btn.y = numChildren * 20;
-
btn.data = d;
-
btn.parents = offsetX;
-
btn.value = d.@label;
-
-
var txt:TextField = new TextField();
-
txt.text = d.@label;
-
txt.selectable = false;
-
txt.border = true;
-
txt.width = 100;
-
txt.mouseEnabled = false;
-
txt.height = 19;
-
btn.addChild(txt);
-
btn.buttonMode= true;
-
addChild(btn);
-
-
// store references to btn
-
elements.push(btn);
-
elements[d.parent().@label+"_"+d.@label] = btn
-
-
btn.addEventListener(MouseEvent.CLICK, onClick);
-
}
-
-
function onClick(evt:MouseEvent):void {
-
showHide(MovieClip(evt.currentTarget));
-
arrangeY();
-
trace(evt.currentTarget.value);
-
}
-
-
function showHide(btn:MovieClip, forceHide:Boolean=false):void {
-
for each (var d:XML in btn.data.children()) {
-
var mc:MovieClip = elements[btn.data.@label+"_"+d.@label];
-
if (contains(mc)) {
-
removeChild(mc);
-
showHide(mc, true);
-
} else if (forceHide == false) {
-
addChild(mc);
-
}
-
}
-
}
-
-
function arrangeY():void {
-
var inc:Number = 0;
-
for (var i:int = 0; i<elements.length; i++) {
-
if (contains(elements[i])) {
-
elements[i].y = inc * 20;
-
inc++;
-
}
-
}
-
}
-
-
function numParents(e:XML):int {
-
var num:int = 0;
-
while (e.parent()!= null) {
-
num++;
-
e = e.parent();
-
}
-
return num;
-
}
This is one of those snippets I've had laying around but never got around to posting. Next time I need to do a multi-tiered nav I'll wrap it up into a nice class (the wondeful class was done just by using my script that auto-converts timeline code to doc class code).
By Zevan | February 28, 2010
So... If you still want to see quizzes/snippets posted frequently here... post a comment... because I need to know that people still want quizzes and snippets in order to keep working on this blog.
If not enough people respond in the comments I will slowly migrate back to my shapevent blog :
http://shapevent.com/sketchbook/
I would like 20+ comments on this blog post in order to motiviate me to keep writing quizzes and posting snippets... otherwise I will only post when an idea comes to mind.
The idea behind this blog has always been 15-30 minutes a day on a snippet or quiz. I did this for a little over a year straight resulting in about 400 posts :
http://actionsnippet.com/?page_id=549
This blog will definitely not die... especially when cs5 is released, but I want to get feedback to get an idea of how many readers this blog actually has.... so please post a comment if you'd like me to keep up the 15-30 mins a day on quizzes and snippets.
Thanks,
Z!
[EDIT - wow thanks for all the kind remarks and constructive crits. I really needed to see that this blog was actually useful for more than just me. I'll post a new snippet first thing tomorrow!. Thanks very much to everyone who commented
so far]
By Zevan | February 22, 2010
I've had many requests to add a donate button to this site, finally added one today....