Category Archives: ColorPicker

Changing the text field width for the ColorPicker control in Flex 3

In a previous example, “Changing the preview color width for the ColorPicker control in Flex 3”, we saw how you can change the preview color width for a ColorPicker control.

The following example shows how you can change the text field width in the ColorPicker control’s drop down swatch panel by setting the swatchPanelStyleName and textFieldWidth styles in Flex 3.

Full code after the jump.

Continue reading Changing the text field width for the ColorPicker control in Flex 3

Changing the swatch grid background color for a ColorPicker control in Flex 3

The following example shows how you can set the swatch grid background color on a Flex 3 ColorPicker control by setting the swatchGridBackgroundColor style. You can also see how you can set the horizontalGap, and verticalGap styles using CSS.

Full code after the jump.

Continue reading Changing the swatch grid background color for a ColorPicker control in Flex 3

Changing the swatch highlight size for a ColorPicker control in Flex 3

The following example shows how you can set the swatch highlight size on a Flex 3 ColorPicker control by setting the swatchHighlightSize style. You can also see how you can set the swatchBorderColor, swatchBorderSize, and swatchHighlightColor styles using CSS.

Full code after the jump.

Continue reading Changing the swatch highlight size for a ColorPicker control in Flex 3

Styling the ColorPicker control in Flex 3

I saw this come up on a list recently, so thought I’d share the answer with my loyal readership. Styling the ColorPicker control changed somewhat between Flex 2.0.1 and Flex 3. Now, instead of applying certain styles directly to the ColorPicker itself, you create a new custom style and assign the swatchPanelStyleName style on the ColorPicker. But enough of my rambling, code is worth 1000 words.

Full code after the jump.

Continue reading Styling the ColorPicker control in Flex 3