Let's use much of what we've covered in this chapter to two applied examples. In the first exercise, we'll create the graphical elements of a basic color picker. Then we'll create a custom button class that can serve as a lightweight, code-only alternative to components.
Let's start by creating a slightly more complex display object that uses two gradients, alpha values, and a matrix rotation. We'll build the display portion of a simple color picker, a bit like the one seen in Flash's Color Mixer panel. In the next chapter, we'll show you how to retrieve values from the picker using your mouse.
The picker will contain two separate pieces: a color spectrum in vertical blended stripes, and a transparent-to-black gradient overlay, as seen in Figure 8-12. The overlay will allow you to vary how much black is added to a color.
Figure 8-12. A color picker
Creating the two layered gradients for the picker requires the same code with only minor variance in some of the settings. So, it makes sense to define a function to handle the work without a lot of repetition. This way, we can vary the parameters sent to the function and create multiple gradients with the same code. Our custom function accepts parameters for the size of the drawing canvas to be created (the picker will be square, so only one value will be used for width and height), arrays for colors, ...