One of the coolest things about the SproutCore property system is the unknownProperty() handler.  This method is called on your object whenever someone tries to get or set a property that is undefined.  Normally, this method does not do much, but you can use it to implement all sorts of exotic behaviors with just a tiny bit of code if you like.  This is how SC.Controller objects work, for examples.

The latest bit of magic made possible by unknownProperty is the style properties just added to SC.View in trunk.  Now you can directly get or set most CSS properties on your view just by adding “style” to the property name.  For example, if you want to set the background color, you could do:

myView.set(’styleBackgroundColor’, ‘red’);

Likewise, if you want to get the left setting, you could do:

myView.get(’styleLeft’);

Certain properties, notably those ending in “Left”, “Right”, “Top”, “Bottom”, “Width” and “Height” will be automatically converted to integers (we assume pixel measurements for now).  Most other values are passed through directly.

These properties can help make your code easier to read today and they will become very useful for the new animation system in the future.

Remarkably, all of these properties were added with about 10-lines of code thanks to unknownProperty(). If you want to see how some of this magic works for yourself, checkout the code in SC.View.

Tags: New Features //