views:

39

answers:

1

I've been checking out Cappuccino and Atlas lately, and they seem to have abstracted relative and absolute positioning away into something that just "works". I was wondering for those familiar with the project - how did they do this?

I've always thought that relative and absolute positioning is kind of an obscure way of thinking about positioning elements, so I'm really curious about this.

Any help or resources I could check out would be fantastic!

+3  A: 

Cappuccino uses the Cocoa views model. In regular HTML the focus is on the layout of text, which is why you get things such as 'floats' to allow you to stick one block of text in another.

In Cappuccino, the positioning and sizing of objects is more desktop like. You position your widgets in a hierarchy of 'views' with fixed coordinates, and 'anchor' them to one or more sides of the screen (or the parent view).

It's like in Cocoa so just take a look at how it's described in the Interface Builder:

http://developer.apple.com/library/mac/#documentation/DeveloperTools/Conceptual/IB_UserGuide/Layout/Layout.html%23//apple_ref/doc/uid/TP40005344-CH19-SW9

The springs and struts in the autosizing control define the selected view’s relationship to its parent frame. A spring causes the view to resize itself proportionally based on the width or height of its superview. A strut causes the view to maintain a fixed distance between itself and its superview along the given edge.

Of course, under the hood it all comes down to regular absolute positioning with JavaScript to execute the resizing model.

Alexander Ljungberg