Programming Flex 3

Chapter 8. Customizing Application Appearance

The Flex framework has a great deal of functionality built into it, making it relatively easy to start building applications. All of the user interface components and layout containers greatly simplify the process of creating a new application because you can utilize all the functionality of the components without having to write all the code to make them work. As great as that is, it would be nearly useless in most cases if you couldn't customize the appearance of the components. Yet, as we’ll see in this chapter, customization of the appearance of Flex components is another built-in feature.

There are essentially two ways you can customize the appearance of components:

• Apply styles.

• Change skins.

Styles are settings such as color, font face, border settings, row height, and so on. These are settings that you can customize entirely programmatically both at compile time and at runtime. Styles allow you to customize a great deal of the appearance of components, yet they can go only so far. For example, if you want to change the background color of a button, you can do that using styles, but if you want to completely change the shape of a button (e.g., from a rounded rectangle to a trapezoid), you need to use a different technique in which you change the skins of the component. Skins can be graphical elements (e.g., PNG files) or programmatic elements (classes), and they allow you to not only customize the existing elements of a component, ...