Ben Stucki

Meet Degrafa CSS Skinning

There’s been a lot of buzz around the Degrafa Origin release that went out over a month ago, but there was something included that you probably haven’t heard of yet, Degrafa CSS Skinning. If you’re still putting the finishing touches on your submission to the 360Flex API Contest or you just want to get your existing application in the Degrafa Derby, maybe you should take a look. It’s dead simple to use, and it could give your application the edge you need to win.

I’ve included the full MXML (only four lines) of a Flex application below. All of the custom styling you see in the screen shot is controlled using Degrafa CSS.


<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" >
<mx:Style source="assets/style/style.css" />
<mx:Panel title="Degrafa CSS Skinning!" left="20" right="20" top="20" bottom="20" />
</mx:Application>


I’ve found that the first reaction most people have to seeing this demo is that it must be some kind of trick. Maybe we cut the graphics just right to make it look cool in the screen shot or maybe there’s some secret trickery going on in the components? So, for you non-believers we published this sample on samples.degrafa.com. You can resize it all you want, and even check out the source to see the CSS. The second reaction is that we must have seriously hi-jacked the framework in some way. Maybe we have some singletons stashed away or require special compiler setup? Nope. No ugly framework hackery or compiler requirements included. In fact, it’s just a plain old Programmatic Skin. A really awesome, well architected (if I do say so myself) Skin. Of course if you don’t believe me, you could just download the source from google code, and if you’re really feeling curious, check out the recording of my 615Flex User Group Presentation.

Have questions? Want to have an in depth conversation about the simple genius of the IFill interface? Come to 360|Flex Atlanta and stop me in the halls, at a party, or after Juan’s Degrafa Session. That’s what it’s all about. Not going to 360|Flex? Why not? Register here.