ColdFusion 8: AJAX UI Vertical and Horizontal Boxes
Tonight I'm blogging again about ColdFusion, AJAX, and the new layout controls in ColdFusion 8. Tonight's entry is once again talking about cflayout and cflayoutarea. This entry will discuss the VBox and HBox type.
Now I have to admit. This feature has me a bit puzzled. First the basic syntax:
<cflayout type="hbox">
That creates a layout where all the things inside it will be positioned horizontally. The opposite of this is the VBox:
<cflayout type="vbox">
Now - I don't know about you - but when I saw this, the first thing I thought of was Flex. Flex has a VBox and HBox, and they are useful for layout out your controls in a particular direction. So for example a set of buttons can be laid out in an HBox.
So the first thing I tried was this:
<cflayout type="hbox">
<p>
Hi
</p>
<p>
Go
</p>
</cflayout>
I thought that maybe the JavaScript code would pick up all the block level elements between the tags and lay them out horizontally. Nope. You can see the result here.
Turns out that the only items you can position with this tag pair are cflayoutarea tags. For example:
<cflayout type="hbox">
<cflayoutarea name="randomlayout">
This is a basic layout.
</cflayoutarea>
<cflayoutarea name="anotherlayout" style="background-color: blue">
The Blue Zone.
</cflayoutarea>
</cflayout>
You can see the result of this here.
So I have to be honest and say... I don't quite get it. If you remember, the border style layout lets us position items in all four compass points and in the middle. I guess if I wanted a bit more control, like perhaps two things on top, I could use a VBox to set it up. Outside of that - I'm a bit unsure of how useful this would be. (Which is ok - I don't expect every ColdFusion tag to be useful to me.)
The docs provide a more fuller example, viewable here. Have folks done anything with this feature yet they care to share?
Comments
I guess the useful part is in the "source" attribute of the cflayoutarea tag. So in addition to the simple layout functionality, you might have shared pieces of UI which could easily be used throughout an application or you might be building the UI at runtime (remembering this is an Ajax feature). I can't really think of a good example of why it would be necessary or why you couldn't do it another way though...
Maybe someone like Peter Bell will find a use for it :) Hehe.
My point is that I can easily add tab staff extc... in a easy way ( see jquery etc...) saving a lof of K of js.
By the other hand I will surely use cflayout to replace frames with a better standard solutions as cflayout looks like.
What I hope is that there will be a great attention to w3c standards ( example: all the div created bu CF8 have a _CF_88888.... class, when a class or name and so on must start with a letter to be validate).
Really hope do not have to choose do not use these features for keeping my pages code clean.
The same for cfwindow type html.....in my source I do not see really nothing o html code....
What you think about??
Andrea
That's from the last blog post and is insane. The ajax file alone was 30kb!
On this one the first css file is 21kb and the 2nd is 60kb! That's also insane.
All of this layout stuff looks like total crap to be avoided. Anyone intelligent would surely prefer his own css file and a little jquery file and plugin that could do a heck of a lot more.
You would definitely not use it on a public facing web site where your target audience would include dial-up users or other users which needed the site to be totally accessible.
So it can go both ways. Just because it exists doesn't mean it's bad... If it suits, use it! If it doesn't suit, don't use it :)
I don't see how they're going to shrink those sizes down much on a final release. Yui was a bad choice I think anyway for quick add-ins. I'm all for some built in js validators and such if you want it and MAYBE some html/css shortcuts but it can't be too well thought out if they're getting sizes like that to start. My site's jquery js is about 26kb with a nice menu and all sorts of onload functions. The "ajax" and "rapid development" hype is what they're after but once you look at it whose going to use it?
>>if you need to create something quick and simple and where the page weights don't matter.
rare, and if for a company lan, they'd do it right, not use these things I'd imagine.
Well, no harm done if not using them anyway :-)