Relative Positioning

var size:Array = [1, 1.5, .5, 1, .4, 1, 1, 1, .2, 1.1]
var boxes:Array = new Array();
var spacing:Number = 4;
var container:Sprite = Sprite(addChild(new Sprite()));
container.x = container.y = 100;

for (var i:int = 0; i<size.length; i++){
	var box:Sprite = makeBox();
	var prev:int = i - 1;
	box.scaleX= box.scaleY = size[i];
	if (i == 0){
		box.y = 10;
	}else{
		// here's the trick
		// if you animate the height property you need to do this again and again:
		box.y = boxes[prev].y + boxes[prev].height/2+ box.height/2 + spacing
	}
	boxes.push(box);
}

function makeBox():Sprite{
	var box:Sprite = Sprite(container.addChild(new Sprite()));
	with (box.graphics) beginFill(0xFF0000), drawRect(-50,-10, 100, 20);
	return box;
}

Sometimes you need to position a bunch of Sprites or MovieClips that are different sizes – and you want to keep the spacing between them the same. This snippet shows a simple example of this.

For more info you could also do this tutorial that I wrote on learningactionscript3.com

Leave a Reply

Your email address will not be published. Required fields are marked *