-
function nest(top:DisplayObjectContainer, structure:Array):void{
-
var p:DisplayObjectContainer;
-
var key:String;
-
for (var i:int = 0; i<structure.length; i++){
-
if (structure[i] is DisplayObjectContainer){
-
p = structure[i];
-
if (!p.parent){
-
top.addChild(p);
-
}
-
i++;
-
if (structure[i] is Array){
-
var child:DisplayObject;
-
for (var j:int= 0; j<structure[i].length; j++){
-
var val:* = structure[i][j];
-
if (val is DisplayObject){
-
child = val;
-
p.addChild(child);
-
}else{
-
for (key in val){
-
child[key] = val[key];
-
}
-
}
-
}
-
}else{
-
trace("error, expecting Array");
-
break;
-
}
-
}else{
-
trace("error, expecting DisplayObjectContainer (Sprite or MovieClip)");
-
break;
-
}
-
}
-
}
-
-
// create some filler graphics
-
var window:Sprite = createWindow();
-
window.x = 10;
-
window.y = 10;
-
-
var c0:Sprite = createCircle();
-
var c1:Sprite = createCircle();
-
var c2:Sprite = createCircle();
-
var c3:Sprite = createCircle();
-
var c4:Sprite = createCircle(0xEFEFEF);
-
-
var box:Sprite = createBox(60, 50);
-
-
-
var txt:TextField = new TextField();
-
txt.text = "HI THERE";
-
-
// test out the function....
-
nest(this, [window, [ c0, {x:100, y:100, scaleX:.5, scaleY:.5},
-
c1, {x:120, y:100, scaleX:.6, scaleY:.6},
-
c2, {x:140, y:100, scaleX:.7, scaleY:.7},
-
c3, {x:160, y:100, scaleX:.8, scaleY:.8},
-
box, {x:10, y:10} ],
-
box, [ txt, c4,{x :30, y:30} ] ]);
-
-
-
// just some quick functions to create filler graphics
-
-
function createBox(w:Number, h:Number):Sprite{
-
var s:Sprite = new Sprite();
-
with(s.graphics) beginFill(0x666666), drawRect(0,0, w, h);
-
return s;
-
}
-
function createWindow():Sprite{
-
var s:Sprite = new Sprite();
-
with(s.graphics) beginFill(0xCCCCCC), drawRect(0,0,300,300);
-
return s;
-
}
-
function createCircle(col:uint = 0xFF0000):Sprite{
-
var s:Sprite = new Sprite();
-
with(s.graphics) beginFill(col), drawCircle(0,0,10);
-
return s;
-
}
The above uses a function called nest(). nest() is sort of like a superAddChild() function... it is meant to do the same thing as addChild, but with any number of parents and children.
I'm actually not very happy with this function, it was fun to write... but the 2D-Array/Object format is kind of odd looking (see line 53). So for at least the next day or two I'm going to try and think of the best format for a function that could do any number of addChild() calls with any number of children or parents. I realized that I also want to be able to set the properties of any of the children... so one solution might be an xml argument... something like:
-
<window>
-
<c0 x="100" y="100" />
-
<c1 x="200" y="100" />
-
<c2 x="300" y="100" />
-
<box x="400" y="100" alpha=".5">
-
<c3 x="10" y="10" />
-
</box>
-
</window>
That's easy enough to do... it would be nice to think of something more minimalistic, but I think XML is much easier to read than JSON style Object syntax...
It's actually interesting to try and think of minimalistic ways to represent tree structures... check out this failed attempt:
-
p(window);
-
__(c0, {x:100, y:100});
-
__(c1, {x:100, y:100});
-
__(c2, {x:100, y:100});
-
-
p(__(box, {x:100, y:100}));
-
__(txt, c4, {x:30, y:30});
After writing the above... a few hours later I thought of this:
-
propOrder("x", "y", "scaleX", "scaleY", "alpha");
-
-
bigInit(this, [window, [info, 10, 10,
-
about, 20, 10,
-
contact, 30, 10,
-
box, 40, 10, 2, 2, .5],
-
box, [txt0, 10, 10 * off(),
-
txt1, 10, 10 * off(),
-
txt2, 10, 10 * off(),
-
txt3, 10, 10 * off()],
-
border]);
I think that's pretty close to what I was imagining in terms of simplicity.. the off() function would return an incremental offset... so call it once and it's 0, call it again and it's 1 etc... still not completely happy with this, but it's getting there...
Any additional thoughts on this topic will be in tomorrows post I think.