SWF It Good

Custom ColorPicker Component – How to extend a Flash CS3 Component Class

December 13th, 2007

Ok so at my last job I was working on a boat client’s site. They asked for me to do a color option flash piece in two days. So I thought what was the quickest and easiest way to convey color options to a potential buyer…A color picker. But I thought a conventional ColorPicker was ugly and had a lot of things I didn’t need like the hex code input. Secondly the ColorPicker has a bunch of colors and I only needed a few in one row. So I started getting into the Flash CS3 components code, found ColorPicker and ColorPickerEvent Class and extended them to do what I wanted. The result is the CustomColorPicker.

It uses almost everything the ColorPicker does except this color picker stays open for a time after you have selected a color. The picker event passes which index in the Array was selected and you can use that to listen for a color change and trigger an Array in you app to be used in tandem.

Only problem so far is it doesn’t register the first one selected (on INIT, which is 0) inside of the class yet. You have to do it in your app.

In the working example, it loads xml and that is broken up in to VOs. Each VO’s color is pushed into an Array to be pushed into the CustomColorPicker’s colors property and when clicked it sends a message to change the view of the car, color text and color swatch of the corresponding index. For example if you click index 3, it get VOS_array[3].image, text and displays it.
All this is done on the inside all you have to do is grab the color and array index from the CustomColorPickerEvent.COLOR_CHANGE and you are good to go.

Please excuse the mess, I stripped the client data and grabbed images off of a google search of 08 Honda Civics, and changed up some stuff to look a little different. Leaving it ugly, but it looks good enough for you to get the use of the component.
Hope you like it and let me know if you have any improvements or question.

Source | Example

Entry Filed under: actionscript, as3, flash, flash CS3