Many years ago, I used a video compositing application called Shake. One of my memories of the application was its beautifully soft, almost organic, widget set. I thought I'd have a play with Flex skinning to replicate the look.To create a nice 3D border programmatically, I use Spark Paths to draw four trapezoids which mimic the shape of the mitred parts of a picture frame and act as borders. The top and left borders graduate in colour from the background through near-white to the button face colour. The bottom and right borders also graduate from the background through to the face but through near-black.
A blur to the borders smooths out the colour difference at the corners and gives a nice 3D impression.
When the button is depressed, I swap out the middle gradient colours on the borders to change the effect from an outset button to an inset one. I use an AnimateColor to soften the transition.
View comments