{"id":253,"date":"2009-04-14T19:58:54","date_gmt":"2009-04-15T02:58:54","guid":{"rendered":"https:\/\/actionsnippet.com\/?p=1166"},"modified":"2009-04-14T19:58:54","modified_gmt":"2009-04-15T02:58:54","slug":"relative-positioning","status":"publish","type":"post","link":"https:\/\/actionsnippet.com\/?p=253","title":{"rendered":"Relative Positioning"},"content":{"rendered":"<pre class=\"brush: as3; title: ; notranslate\" title=\"\">\r\nvar size:Array = &#x5B;1, 1.5, .5, 1, .4, 1, 1, 1, .2, 1.1]\r\nvar boxes:Array = new Array();\r\nvar spacing:Number = 4;\r\nvar container:Sprite = Sprite(addChild(new Sprite()));\r\ncontainer.x = container.y = 100;\r\n\r\nfor (var i:int = 0; i&lt;size.length; i++){\r\n\tvar box:Sprite = makeBox();\r\n\tvar prev:int = i - 1;\r\n\tbox.scaleX= box.scaleY = size&#x5B;i];\r\n\tif (i == 0){\r\n\t\tbox.y = 10;\r\n\t}else{\r\n\t\t\/\/ here&#039;s the trick\r\n\t\t\/\/ if you animate the height property you need to do this again and again:\r\n\t\tbox.y = boxes&#x5B;prev].y + boxes&#x5B;prev].height\/2+ box.height\/2 + spacing\r\n\t}\r\n\tboxes.push(box);\r\n}\r\n\r\nfunction makeBox():Sprite{\r\n\tvar box:Sprite = Sprite(container.addChild(new Sprite()));\r\n\twith (box.graphics) beginFill(0xFF0000), drawRect(-50,-10, 100, 20);\r\n\treturn box;\r\n}\r\n<\/pre>\n<p>Sometimes you need to position a bunch of Sprites or MovieClips that are different sizes &#8211; and you want to keep the spacing between them the same. This snippet shows a simple example of this.<\/p>\n<p>For more info you could also do <a href=\"http:\/\/www.learningactionscript3.com\/2008\/05\/13\/the-power-of-relative-positioning\/\">this tutorial that I wrote on learningactionscript3.com<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>var size:Array = &#x5B;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&lt;size.length; i++){ var box:Sprite = makeBox(); var prev:int = i &#8211; 1; box.scaleX= box.scaleY = size&#x5B;i]; if (i [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[94,98],"tags":[3,4],"class_list":["post-253","post","type-post","status-publish","format-standard","hentry","category-misc","category-ui","tag-actionscript","tag-flash"],"_links":{"self":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/253","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=253"}],"version-history":[{"count":0,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/253\/revisions"}],"wp:attachment":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=253"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=253"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=253"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}