The Flex Drop Shadow

Shadows are all the rage right now in user interfaces - Vista and Leapard both have shadows underneath opened dialogs. They provide a really quick way to give your flat application the feeling of depth. Apparently the makers of Flex knew this, since they made adding shadows to pretty much anything very easy. By the end of this tutorial you'll know how to add drop shadows to Flex components and how to configure their appearance.
The first thing you need to know about shadows is that they have a lot of options. To help you decide what options you want for your drop shadows, I threw together a little Flex app that lets you adjust the appearance of shadows in real-time. Just drag around the sliders in the application below and the result will appear immediately on the right.
If you're done playing around, let's look at how to create some shadows. I'm going to first show you how to add drop shadows using MXML then we'll look at how to add them using ActionScript.
Adding Drop Shadows using MXMLFor the first example, here's the simplest way to add a drop shadow. In this example, the shadow will be using all of the default options.