{"id":197,"date":"2009-02-21T00:00:05","date_gmt":"2009-02-21T07:00:05","guid":{"rendered":"https:\/\/actionsnippet.com\/?p=824"},"modified":"2009-02-21T00:00:05","modified_gmt":"2009-02-21T07:00:05","slug":"snap-to-grid","status":"publish","type":"post","link":"https:\/\/actionsnippet.com\/?p=197","title":{"rendered":"Snap to Grid"},"content":{"rendered":"<pre class=\"brush: as3; title: ; notranslate\" title=\"\">\r\n&#x5B;SWF(width = 600, height = 400)]\r\n\r\n\/\/ draw the same grid as yesterday\r\nvar tileSize:int = 40;\r\nvar cols:int = stage.stageWidth \/ tileSize;\r\nvar rows:int = stage.stageHeight \/ tileSize;\r\nvar grid:Sprite = Sprite(addChild(new Sprite()));\r\ngrid.graphics.lineStyle(0,0x000000);\r\nvar i:int = 0;\r\nfor (i = 1; i&lt;cols; i++){\r\n\tvar posX:Number = i * tileSize\r\n\tgrid.graphics.moveTo(posX, 0);\r\n\tgrid.graphics.lineTo(posX, stage.stageHeight);\r\n}\r\nfor (i = 1; i&lt;rows; i++){\r\n\tvar posY:Number = i * tileSize\r\n\tgrid.graphics.moveTo(0, posY);\r\n\tgrid.graphics.lineTo(stage.stageWidth, posY);\r\n}\r\n\r\n\/\/\r\n\/\/ -- add a circle that snaps to the grid when dragged\r\n\/\/\r\nvar circle:Sprite = Sprite(addChild(new Sprite()));\r\nwith (circle.graphics) beginFill(0xFF0000), drawCircle(0,0,10);\r\ncircle.x = circle.y =  tileSize * 3;\r\ncircle.buttonMode = true;\r\n\r\ncircle.addEventListener(MouseEvent.MOUSE_DOWN, onDown);\r\nfunction onDown(evt:MouseEvent):void {\r\n\taddEventListener(Event.ENTER_FRAME, onRunSnapping);\r\n}\r\n\r\nfunction onRunSnapping(evt:Event):void {\r\n\tcircle.x =  Math.round(mouseX \/ tileSize) * tileSize;\r\n\tcircle.y =  Math.round(mouseY \/ tileSize) * tileSize;\r\n}\r\n\r\nstage.addEventListener(MouseEvent.MOUSE_UP, onUp);\r\nfunction onUp(evt:MouseEvent):void {\r\n\tremoveEventListener(Event.ENTER_FRAME, onRunSnapping);\r\n}\r\n<\/pre>\n<p>This builds on yesterdays post by adding a draggable red circle that snaps to the grid. This is the real trick:<\/p>\n<pre class=\"brush: as3; title: ; notranslate\" title=\"\">\r\ncircle.x =  Math.round(mouseX \/ tileSize) * tileSize;\r\ncircle.y =  Math.round(mouseY \/ tileSize) * tileSize;\r\n<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>&#x5B;SWF(width = 600, height = 400)] \/\/ draw the same grid as yesterday var tileSize:int = 40; var cols:int = stage.stageWidth \/ tileSize; var rows:int = stage.stageHeight \/ tileSize; var grid:Sprite = Sprite(addChild(new Sprite())); grid.graphics.lineStyle(0,0&#215;000000); var i:int = 0; for (i = 1; i&lt;cols; i++){ var posX:Number = i * tileSize grid.graphics.moveTo(posX, 0); grid.graphics.lineTo(posX, stage.stageHeight); [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[33,13,98],"tags":[3,4],"class_list":["post-197","post","type-post","status-publish","format-standard","hentry","category-graphics","category-motion","category-ui","tag-actionscript","tag-flash"],"_links":{"self":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/197","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=197"}],"version-history":[{"count":0,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/197\/revisions"}],"wp:attachment":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=197"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=197"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=197"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}