Select Page

Arranging objects in a grid

There are many ways to arrange objects in a grid using ActionScript and some ways of doing this are easier than others. The following way I have found is the easiest.
If you loop through all of your objects using a for(var i…) loop or something similar, you can set the x and y position of each one using only one line of code:

// inside a for(var i:int...) loop
gridObj.x = START_X + (i % COLUMNS) * (PAD_X + gridObj.width);
gridObj.y = START_Y + Math.floor(i / COLUMNS) * (PAD_Y + gridObj.height);

(COLUMNS is the number of required columns, PAD_X and PAD_Y are padding between objects along each axis.)
This uses the modulo (%) operator to determine the remainder of the division of the iterator and the number of columns. This is used for the X position of each object. The y position is calculated the other way, using Math.floor to get the highest exact number of divisions these two numbers will produce.
Note: int() can also be used instead of Math.floor().

Creating a simple Load Indicator / preloader

Here is a handy class to display a simple spinning load indicator / preload animation while your content is loading or transitioning. This demo uses the bit101 minimalcomps to show how flexible and configurable this class is.


Use this demo to set up the style for your project, then hit the “copy” button to copy the configuration to your clipboard.

click to launch


// create
_loadInd = new LoadIndicator(this, 75, 75);

// remove