Coordy is a light Actionscript 3 layout framework which offers a simple way to organize DisplayObjects into various different 2d and 3d layouts. The layouts are light, powerful and virtual organizers that simply manage x/y/z coordinates of DisplayObjects - meaning your objects are not tightly bound to any specific layout.

Update (December 1, 2009)

coordy 0.9.9 is officially released. All sorts of changes have been made which could potentially cause problems with any code using 0.9.1 or lower. I will be writing up some documentation on changes in the latest version, until then, you can check out all the fun new stuff here.

Update (November 15, 2009)

coordy just went through a huge rewrite and is quite different in many ways. I have updated the source in SVN, but the ZIP download still offers up the 0.9.1 version. The examples and documentation have been updated in the SVN repo if you want to give it a try. I will be posting extensive notes on the changes and how to best use the library in the days to come.

Update (August 20, 2009)

coordy 0.9.1 was just committed and available to use. Layouts in coordy 0.9.1 now have the ability to export their layout properties as either a JSON string or an XML object. Have a look at the documentation for more details.

Getting Started

Get to know this framework by checking out some examples and the library's documentation. The examples provided give a sense of the basic mechanisms and process for setting up layouts, updating layouts and managing multiple layouts. Source code to the examples are also available on the examples page. I suggest checking out the source via SVN as that will be updated much more frequently than the static zip.

How Does It Work?

The basic explanation of how coordy works is once a DisplayObject is added to a layout, a node instance is created which points to the DisplayObject. The node is the link between the layout and DisplayObject. The node contains all the coordinate information for that DisplayObject, so that even if a DisplayObject is moved, the coordinate information for it persists due to its corresponding node. This is why the DisplayObject can belong to an infinite amount of layouts, because the layout merely handles its created node objects which, in turn, have a link to the DisplayObject.

Layouts are merely abstract organizers, they do not need to be added/removed from the stage. Nonetheless, they have tweenable properties such as x, y, z, width, height, depth etc. When a display property such as width is altered, the layout adjusts all the cells and the nodes’s links to fit in the layout’s new dimension. This allows you to “tween” a layout even though it does not truly exist on the stage.

Layouts will also adapt when nodes/DislpayObjects are removed from the layout. This allows simple motion-based layout management capabilities.

What Type of Layouts Does coordy Have?

Here's the full list, there should be more to come in the near future.

2d Layouts

1. Ellipse - Distributes nodes in a simple ellipse
2. Flow - Attempts to fit all nodes within the bounds of the layout's target
3. Grid - Distributes nodes in a basic 2d grid
4. HorizontalLine - Distributes nodes in a horizontal line
5. Lattice - Similar to a grid, but more flexible and feature-rich
6. Scatter - Distributes nodes randomly
7. Snapshot - Records the x,y coordinates of all nodes
8. Stack - Distributes nodes in an ordered stack
9. VerticalLine - Distributes nodes in a vertical line
10. Wave - Distributes nodes in a wave (i.e. sine, cosine, etc.)

3d Layouts

1. Ellipse3d - Distributes nodes in a 3d ellipse (good for carousels)
2. Grid3d - Distributes nodes in a 3d grid
3. Scatter3d - Distributes nodes randomly in all three axes
4. Snapshot3d - Records the x,y,z coordinates of all nodes
5. Spheroid3d - Distributes nodes in a spheroid
6. Stack3d - Distributes nodes in an ordered 3d stack
7. Wave3d - Distributes nodes in a 3d wave (i.e. sine, cosine, etc.)
8. WaveEllipse3d - Still in testing, does funky stuff

Want To Contribute?

This project could use some fresh eyeballs and brain matter. Drop me a line if you would like to contribute to future versions of this library.