Using Styles with the ColorPicker

You can set several styles to change the appearance of the ColorPicker component. For example the following procedure changes the number of columns (columnCount) in the ColorPicker to 12, changes the height (swatchHeight) and width (swatchWidth) of the color swatches, and changes the padding for both the text field (textPadding) and the background (backgroundPadding).

Create a new Flash file (ActionScript 3.0) document.
Drag the ColorPicker component to the Stage and give it an instance name of aCp.

Open the Actions panel, select Frame 1 in the main Timeline and enter the following code:

aCp.setStyle("columnCount", 12);
aCp.setStyle("swatchWidth", 8);
aCp.setStyle("swatchHeight", 12);
aCp.setStyle("swatchPadding", 2);
aCp.setStyle("backgroundPadding", 3);
aCp.setStyle("textPadding", 7);

Select Control > Test Movie.
Click the ColorPicker to open it and see how these settings have altered its appearance.

Using Styles with the ColorPicker

To change the appearance of the ColorPicker with styles: