Flash Stuff Here. Move Along…

In the middle of a cool project which is right on the cusp of being designered into oblivion, I discovered a nifty way to make things “snap to” a grid. Copy-and-paste into Flash MX/MX2004.

var gridSize = 20; // size of grid
 var nodeSize = 20; // size of individual nodes
 var nodes = 50; // number of nodes
 var radius = Stage.height/3; // radius of drawn circle
 var centerX = Stage.width/2; // center horizontally
 var centerY = Stage.height/2; // center vertically
 var steps = (Math.PI*2) / nodes; // math stuff
 var i=0;
 this.onEnterFrame = function() {
 if(i < nodes) {
 var m = _root.createEmptyMovieClip("node"+i,i);
 m.lineStyle(0,0x000000,100);
 m.beginFill(0x000000,10);
 m.moveTo(0,0);
 m.lineTo(nodeSize,0);
 m.lineTo(nodeSize,nodeSize);
 m.lineTo(0,nodeSize); m.lineTo(0,0);
 m.endFill();
 var mx = centerX + radius*Math.cos(steps*i); // horizontal snap
 if(mx%gridSize != 0) mx += (Math.floor(gridSize/2) - (mx%gridSize));
 var my = centerY + radius*Math.sin(steps*i); // vetical snap
 if(my%gridSize != 0) my += (Math.floor(gridSize/2) - (my%gridSize));
 m._x = mx;
 m._y = my;
 i++;
 radius += .1;
 } else {
 this.onEnterFrame = null;
 }
 }

It’s the modulus (mx % gridSize) which makes it cool. The Math.floor() which follows could also easily be Math.round() or Math.ceil(), depending on the constraints of the project.

Leave a Reply

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