After an extremely long wait, the Layout Organizers I began working on so long ago has finally been released as a full-fledged library named coordy. The code and documentation has finally reached a level of maturity where I feel comfortable offering it up to the public. The code is MIT licensed and begging to be used.
Update: All coordy updates will now be published at the coordy project page.
Background
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.
Some Reasons You May Like coordy
You don’t need Flex
While these layout organizers will work in the Flex framework, you do not need Flex to reap the benefits of this code.
Items controlled by layouts are not bound to any component
DisplayObjects are not tightly bound to layouts. They can come and go as they please.
Items can belong to infinite layouts
DisplayObjects can belong to as many layouts as one desires since they are merely abstract controllers.
Layouts are light
These organizers have far less features than Flex containers by design. Because of this, the footprint is much smaller.
Get Started
If you are interested in simply getting the code and digging in, here is everything that you need to get started.
Examples
To the right are some examples of what coordy can do and how you do it. These examples are extremely simple, but they give you the general process of setting up a layout to updating layout properties, to managing multiple layouts.
For a more thorough breakdown of the framework’s functionality and features, look through the documentation
An example of the three different methods of updating a layout using the Ellipse3d layout
Click anywhere in the SWF to randomize the layout.
An example of how to update the properties layouts using the the Wave layout
Click anywhere in the SWF to randomize the layout.
An example of basic layout property tweening using the Wave3d layout
Click anywhere in the SWF to randomize the layout.
An example of how to individually tween the items within a layout using the Scatter layout
Click anywhere in the SWF to randomize the layout.
An example on basic layout management and swapping using the Stack layout, VerticalLine layout and HorizontalLine layout
Click the buttons in the SWF to switch layouts.
Contribute
The release of this library was a long and overly-excruciating experience. At this point, I feel the library needs some fresh eyes and some unique fingers coding on this project. If you are interested, please drop me a line.
The Discussion
22 Comments on “Introducing coordy – An Actionscript 3 Layout Framework”flashape
4.08.2009 9:59 amexcellent….stuff like this makes me want to ditch Flex. And that’s a good thing.
nui
4.08.2009 1:54 pmamazing… cant wait to try this out… keep up the inpsiring works!
sk
4.08.2009 8:22 pmGreat Work.
Down the Foxhole - Coordy AS3 Layout Framework
5.08.2009 1:22 am[...] a brand new AS3 Framework on the block and it’s called Coordy. The Framework is available under a MIT License and was created by P.J. Onori, also known as [...]
Coordy AS3 Layout Framework | Hot Trends 2 Tweet
5.08.2009 2:01 am[...] a brand new AS3 Framework on the block and it’s called Coordy. The Framework is available under a MIT License and was created by P.J. Onori, also known as [...]
Martin Lindelöf
5.08.2009 5:56 amnice work ! I can see this getting handy when displaying image galleries etc on sites! sweet. And also the comment love concept is nice , I might join you up on it!
btw I’m linking your site from my blogroll.
rh
5.08.2009 7:05 amgreat thing!!!
does this work with fp9 or fp10 only. get some errors while compiling the examples from googlecode?
somerandomdude
5.08.2009 7:13 amflashape, nui and sk – Thanks so much for the kind words – please give me feedback when you have some available.
martin – Hey thanks man! I hope it works well for you.
rh – Due to the addition of the 3d layouts, it will only work with Flash Player 10. Although, just remove the com.somerandomdude.coordy.layouts.threedee and com.somerandomdude.coordy.helpers packages and that should do the trick.
Ricardo
7.08.2009 4:39 pmAmazing … I´m new to as3 but … there´s a way to create a circle layout of objects from random positions using tweens ?
jexchen » Blog Archive » Flash?Flex?????????
8.08.2009 10:27 am[...] http://somerandomdude.com/articles/technology/coordy/ [...]
Lido Venice
10.08.2009 12:25 amVery good worg. I will keep on checking this page for updates. Down with flex!!!
ui
10.08.2009 11:15 pmBookmarked !!! Thanks a lot !!!
Saad
11.08.2009 7:22 amAwesome work !
And your website rocks ! Very good looking
andreb
17.08.2009 10:32 amGreat and usefull thanks…but i have a question!
Is it possible with a Lattice layout to make a tween that enlarges an object and the other ones adapt to its position?
thanks in advance :P
regards
somerandomdude
17.08.2009 11:25 amandreb – I’m sorry, this library does not handle situations like that unfortunately. What you could do though is use the Lattice layout to position your items’ initial coordinates and then use a helper class that handles such a case.
Coordy [Flash]: 2d and 3d Layout framework for organizing DisplayObjects in Flash | CreativeApplications.Net
19.08.2009 1:49 am[...] 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. [...]
andreb
20.08.2009 7:50 amthanks for the answer :) allready done that…no i just want a simple thing that i have allready made it work but now i dont remember how :( How can i shift the last colum of a lattice to the first position? and the same for rows..i think is a simple thing!
thanks again :)
Rahul
8.09.2009 2:52 amThis framework is awesome.
I am using it currently to put text on a semi-circular arc. The problem I am facing is that I am not able to create a semi-circular arc shape. I tried with various wave functions but was not able to get it. Any idea how I can do it?
jadd
10.11.2009 9:32 amHi and thanks,
it’s a nice library and seems very well done. One thing a simple example of grid layout, with pagination.
kevin
24.11.2009 4:02 pmHi, this looks awesome! I was wondering what the most efficient way to target an element within a layout would be.
AS3???? | RIA?????
27.12.2009 6:36 am[...] http://somerandomdude.com/articles/technology/coordy/ [...]
Michael Gregor
29.12.2009 10:41 amP.J.,
Excellent work here. Kudos to you. I cant wait to be able to use something like this.
Cheers,
MG