Full Colour Spectrum Color Picker For Flex
Flex comes with it's own built-in ColorPicker component, which looks like this:
It works well, but you have to click on it little picker square (see above, left) to open the picker itself and, once open, you're then limited to the web-safe colour palette.
The other day I wanted a picker that was always on show and allowed any colour to be chosen. After a search I found this solution which builds a spectrum of colours on the fly (worth a look just to see what is possible with Flex). The trouble with it, for me, was the lack a greyscale and being unable to choose white as a colour. Not having time to figure out how to modify it to meet these two requirements I took a different tact. Instead of generating the spectrum on the fly I embedded the following image:
This is based on this image, which I modified in Fireworks to add the grey-scale bar and the white fade at the top.
I then embedded this Image in the Flex component and came up with this (working demo):
Click on the colour swatch to change the app's background colour. You can download a demo Flex app here with the self-contained component (based loosely on the one linked to above). Enjoy.
Flex is very powerful indeed but for me a Flex component always is a foreign particle in a webpage. At least it makes me feel that it is...
Reply
Agreed. I rarely (never!) use Flex as a component of a webpage. Only for demo like the above. The colour picker is used inside a fully-blown Flex app.
Reply
Clever. Shouldn't be too hard to implement in JavaScript if the map is set up to known colors at a computable coordinate. Just need to figure out how to convert x and y to RGB. Seems like I've seen that done in JavaScript already, come to think of it... not that that's the point, but that get's you on a web page without a full flex app.
Reply