« New Name: Same Great Taste | Main | Designing Flex in Fireworks (Including Style Explorer as Fireworks Extension) »
April 03, 2007
Flex Style Explorer Update: Advanced Color Spaces and Add Swatches
With much thanks to Matt MacLean for his contribution of code to the Advanced Color Picker, the Flex Style Explorer just got a little more useful. Two new features have been added that should make your life a little easier.
First, the advanced color picker is even more advanced, with color spaces for Hue, Saturation, and Brightness, as well as R, G, and B color spaces. Additionally added was support for text entry for all those values, as well as the web hex value. Thanks very much for your contribution Matt.
Also, I've added support for adding swatches to the basic color pickers from the advanced color picker. In advanced color picker, select "add swatch", and that color swatch will appear in all color pickers throughout the application, as shown below.
As always, the source code is included, so if anyone out there has the initiative, and more importantly, the time to contribute your own ideas and code to the Style Explorer to help make it an even more useful application, send your code my way and we'll consider integrating it. (Kuler integration perhaps?)
CLICK HERE TO EXPERIENCE THE APPLICATION (and remember, view source to download)
Posted by Peter Baird at April 3, 2007 02:26 PM
Comments
Hi Peter,
Would be cool to add support for viewing/importing swatches from Kuler. :)
-David
Posted by: David at April 3, 2007 08:20 PM
Glad to see you got the swatches working :)
Posted by: Matt MacLean at April 4, 2007 03:26 AM
Great Kuler idea, its actually a very simple implementation and I managed to get it working in about 15 minutes. See Here: http://www.maclema.com/content/sek/
Posted by: Matt MacLean at April 4, 2007 08:49 AM
Thanks a lot, man ! It's really usefull (and well done).
But I don't understand how to use the dataChange event. I can't call it. I tried change, which is used in the standard colorPicker, in vain.
Posted by: stef at April 13, 2007 06:10 AM
hi, kuler import is great. There is only one small problem, that if you add more kuler swatches (that fit in more than one line of swatches), color selector doesn't get resized, so colors in overlapping lines can't be selected. Anyway, thanks for this update!!!
Posted by: milan at April 23, 2007 01:53 AM
I have been using the style explorer 2.0.1 and have noticed in the tree component , the background of the tree turns black when you select a depth color. This was not was happened in 2.0 this is happening in my own css styling of the tree element. I have been trying to find a answer or fix for this for 2 weeks and have not had any luck.
Please help
Posted by: chris b at April 30, 2007 09:21 AM
Its a great tool but, there are a few things I feel have been overlooked. One obvious, is the ability to apply alpha values to control or container titles or labels. The Panel container title is a particular pain in the neck.
[a /]
Posted by: aYo at May 21, 2007 03:23 AM
Very great tool this style explorer.
Just a question, how do you generate this pop-up (the color picker) in flex ? I can't find any tutorial.
And can we place images instead of text in the title panel for example ?
Thanks,
Anthony
Posted by: Anthony at May 30, 2007 05:31 AM
Anthony. I'm not sure if you're asking how to generate a popup, or how to implement the advanced color picker in flex, but just to let you know, the source code for the entire application is included. Right-click and select "view source" to view and download the source code. The code for the color picker is in the file components/AdvancedColorPicker.mxml.
Posted by: Peter Baird at May 30, 2007 06:46 AM
Hi Peter,
I cant download the source code. I there any way where can I download the source code?
Thanks!
Lycan
Posted by: Lycan at August 13, 2007 07:16 PM
I really like the theme that the Style Explorer uses and was wondering if it could be obtained somehow? I like the thin scroll bars!
Posted by: sascha/hdrs at August 15, 2007 05:07 AM
It's all in the source. Right-click anywhere on the app and select "View Source" to download the source code.
Posted by: Peter Baird at August 15, 2007 06:20 AM
Duh! *slap hand on forehead* You're right! how could I forget the source feature?!
Lets see how you made the Tree inset with round corners ... :)
Posted by: sascha/hdrs at August 16, 2007 01:38 AM
I downloaded the source for the style explorer and compiled in in flexBuilder 2.01 with hotfixes 2 & 3 applied. I get the following warnings:
Data binding will not be able to detect changes when using square bracket operator; for Array, please use ArrayCollection.getItemAt() instead.
doubleTextSliders.mxml flex2StyleExplorer/components line 12
doubleTextSliders.mxml flex2StyleExplorer/components line 24
quadTextSliders.mxml flex2StyleExplorer/components line 12
quadTextSliders.mxml flex2StyleExplorer/components line 24
quadTextSliders.mxml flex2StyleExplorer/components line 36
quadTextSliders.mxml flex2StyleExplorer/components line 48
The application seems to run fine, however. Just fyi...
Great application, BTW! I use it almost everyday. :)
Posted by: Randy Martin at August 17, 2007 11:40 AM
Great tool - I use it all the time. Love the new colour picker.
One thing that seems to be missing from v2.0 and v3.0b is the dropdownStyles tab for a PopUpButton.
Posted by: Darren at July 22, 2008 11:11 PM