O'Reilly logo

Programming Flex 2 by Joey Lott, Chafic Kazoun

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Skinning Components

Although styles are an excellent way to customize components, they can do only so much. If you want to change the color, font, or spacing settings for components, styles are perfect solutions. However, if you want to completely change the appearance of a component so that it uses a different shape, you'll need to use skins instead of (or in addition to) styles.

Component skins are graphics or classes that you can specify for states and/or parts of a component that will completely replace the standard appearance of the component. Every component type will have different skins that you can set. For example, buttons have skins such as upSkin, overSkin, and downSkin that determine the appearance of the button in the up, over, and down states. You can use embedded graphics such as .jpg files or .png files, or you can use programmatic skins. We'll discuss both options in the following sections.

Applying Skins

You can apply skins in the same way you apply styles: using inline skin settings, setStyle( ), CSS, or StyleManager. Each component type has skin settings that are treated like styles. The skin styles for each component type vary. For example, buttons have skin styles such as upSkin, overSkin, and downSkin and text input components have skin styles such as borderSkin.

The values for skin styles must always reference a class. For graphical skins, the value should be a class created by an embedded image (see Chapter 9 for more information about embedding images). For ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required