When working with an application component and styles, the application component can define its own style values for components within. The easiest way to specify such styles is to define cascading style sheets (CSS) within the application component as you would within an application (however, you will still have the limitation of not being able to specify CSS type selectors other than in ActionScript). When working with styles within a component, keep in mind why application components exist. They don't exist to be as fully featured and flexible as distributed components. They exist to allow you to build an application more efficiently. As such, you may find that defining styles within an application component is acceptable.
With application components, you can also define your own custom styles, as discussed in Chapter 19.
Also, as we saw in Chapter 14, styles in Flex support inheritance, which is also supported by application components. When defining a global style or CSS custom class, these styles are applied to all display items in Flex. This allows you the benefit of providing one master CSS file for an application. In the CSS file, you can define your custom style, and for any component in your application you can apply the style by setting the
In this example, we first set the
styleName property of the
<mx:Label id="contactName" styleName="heading" x="10" y="10" text="John Doe"/>
styleName value is set, we can ...