SubscribeIn my previous post, I explained how to create nice gradients using Degrafa’s CSSSkin. Once again, CSSSkin is one of the very powerful, yet overlooked function of the Degrafa framework (look at this, or that for those who would still doubt it). But it has in my opinion a limitation: it works almost only for containers (Canvas, Panel, List, etc). But as it stands by default in the latest version (Beta 3.1), it doesn’t work for buttons (Button, ButtonBar and the like). When it comes to the define CSS tags like upSkin, downSkin, selectedOverSkin, etc, there’s no choice but to use tailor made classes extending GraphicBorderSkin like in this example. But actually, there’s a rather easy way to use CSSSkin defined in a CSS file only, by simply extending CSSSkin.
Degrafa: nice and easy gradients with CSSSkin
Degrafa is a fantastic tool and has become for the past few months a core component of all my developments at Tailgate Technologies. Still, some very powerful tools among Degrafa Framework seem to be a bit underused by most users (at least most bloggers). I’m thinking here of Advanced CSS with CSSSkin class. Or at least, there rather is a relative lack of examples and documentations on how to use it. You can still find on Degrafa’s website Ben Stuki’s example along with Juan Sanchez’ one, but when you try and watch the screencast tutorials you unfortunately end up hitting dead ends. One thing in particular took me a significant while to figure out: how to set elaborate gradients (for a background color for example), so I thought that sharing my discoveries (and improvements in a further post) might be useful to some of you.
If you want to see my LinkedIn profile, click on this button:
