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.
Last 5 posts in actionscript
- HOWTO Create a Facebook App using FlexBuilder - June 24th, 2009
- Roman Numeral/Arabic Convertion AIR App - Johnny V Now Available - December 25th, 2008
- How to convert Roman Numerals and Arabic numbers in ActionScript 3 - December 17th, 2008
- Using Flash Player 10 to produce Dynamic Musical Notes - May 20th, 2008
- Flash Player 10 Dynamic Sound Generation - May 20th, 2008
Last 5 posts in as3
- HOWTO Create a Facebook App using FlexBuilder - June 24th, 2009
- Guitar Synth for Flash - February 27th, 2009
- Abstract Thermometer AIR app - January 22nd, 2009
- Roman Numeral/Arabic Convertion AIR App - Johnny V Now Available - December 25th, 2008
- How to convert Roman Numerals and Arabic numbers in ActionScript 3 - December 17th, 2008
Last 5 posts in flash
- HOWTO Create a Facebook App using FlexBuilder - June 24th, 2009
- Roman Numeral/Arabic Convertion AIR App - Johnny V Now Available - December 25th, 2008
- How to convert Roman Numerals and Arabic numbers in ActionScript 3 - December 17th, 2008
- Flash Player 10 Pure Flash Keyboard using SampleDataEvent - September 3rd, 2008
- Using Flash Player 10 to produce Dynamic Musical Notes - May 20th, 2008
Last 5 posts in flash CS3
- How to use Bitmap and BitmapData in ActionScript 3 - v2 - April 23rd, 2008
- How to use the FileSystem in AIR to find the users directory folders - March 1st, 2008
- Yahoo Maps ActionScript 3.0 Released - February 11th, 2008
- Update: Flash/Flex Tidbit #2 How to use Alpha Mask in Flash CS3 - January 8th, 2008
- Tidbit #3 - testing additions to your code - Control Variable - November 28th, 2007
Entry Filed under: actionscript, as3, flash, flash CS3

1 Comment Add your own
1. Lee Brimelow | December 22nd, 2007 at 1:37 pm
Nice dude!
Leave a Comment
Some HTML allowed:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">
Trackback this post | Subscribe to the comments via RSS Feed