« Styleable Line Chart Component for FlashLite 2.0 | Main | Flex 2 Style Explorer Now Beta 2 »

March 14, 2006

Flex 2 Style Explorer (beta) available

The Flex 2 Style Explorer (beta) is now available for use. It being a beta, built with a beta product, there are the usual caveats. Being Flex 2, of course, to use this you'll need the Flash Player 8.5 to run it. Also, as Flex 2 is beta, there are some interesting behaviors you'll notice in terms of the way some things might look. And finally, as this is built on Beta 1 of Flex 2.0 some things may, and most likely WILL change in later versions. Once the next Beta comes out, I'll update it to beta 2, and re-submit.

flex2StyleExplorer.gif

Working through CSS in Flex 2, You'll notice some new and interesting things that are important for all designers and developers to understand. The most important thing is that the new Aeon components are built by layering transparent pieces. So, for example each buttons is made up of three peices, as shown in the image below):

aeonLayers.jpg

  • Border: this is the same as before
  • FillColors: These fill colors also now have fill alphas, so by default the buttons is partially transparent with the colors beneath it showing through.
  • HilightAlphas: There's a highlight on the top half of each button, which is basically a white fill with customizable levels of transparency.

    This allows for some very interesting effects, and a lot more customization with just a little code.

    BUT, it does also mean that designers of Flex 2.0 apps can no longer simply hand an image to a developer and expect them to be able to recreate it, since the colors that appear on the screen cannot be expressed and interpreted strictly by their color, but must include alpha values for two layers.

    That means designers will have to either hand off the CSS for a chosen component as "the spec" for that component, or will have to at the very least have an understanding of how that component is created and hand off specs that include fill-colors, fill-alphas, and highlight-alphas.

    Please let us know if you find anything buggy, or "not quite right". Enjoy.


    Click Here to run the Flex 2 Style Explorer

    [UPDATE] For those that haven't seen it, as Flex 2.0 is now released, a release version is now available, and can be loaded from the follow up post at http://examples.adobe.com/flex2/consulting/styleexplorer/Flex2StyleExplorer.html

Posted by Peter Baird at March 14, 2006 8:16 AM

Comments

Thats awesome. Will the final version have the ability to save and load your changes?

Posted by: phil at March 14, 2006 6:01 PM

Very nice! Will you please make the source code available with the download? Thanks!

Posted by: Tony Pujals at March 15, 2006 3:46 PM

First on saving and loading changes, great idea, but probably out of scope for now. As for source code, look for Flex 2 Style Explorer Beta 2 soon, and that will include "view source" integration.

Posted by: Peter Baird at March 15, 2006 5:42 PM

Thats really good! I'm waiting for release Beta2 including view source. Thank you.

Posted by: sato-shi at March 15, 2006 8:28 PM

Can someone tell me if there is a "Work in Progress" on a FLEX 2.0 or Flash Pro 8.x or 9 Rich Text Editor? I'm using one now, but they keep changing the licensing and I'm uncomfortable with it for the long term. Also, might Adobe/Macromedia consider a way to render both their version of html and normal html that can be used in a regular page (there are just many times this needs to be done).

Posted by: Robert Thompson at March 16, 2006 11:39 PM

Sorry for the confusion, but "Work in Progress" is the blog of Adobe Consulting, and while most of our work is in Flex, we are not directly affiliated with the product team, and would not be in a position to answer future looking product related questions. I can say that there is a RichTextEditor component available with flex 2.0, as shown in the documentation here: http://livedocs.macromedia.com/labs/1/flex/langref/mx/controls/RichTextEditor.html

Posted by: Peter Baird at March 17, 2006 6:41 AM

Dang, I'm to late or... to early any chance of this coming out for the Beta 2? Or should I download the source and try to fix it? It looks great tho. I'll check back. -p

Posted by: elvez at April 7, 2006 3:22 PM

Yes indeed it has been updated to Beta 2, please read the more recent post at http://weblogs.macromedia.com/mc/archives/2006/03/flex_2_style_ex_1.cfm#more

Posted by: Peter Baird at April 8, 2006 6:26 PM

is the download link broken? I keep getting a 404 error

Posted by: danny at June 24, 2006 7:40 AM

Nope, it should work. I just tried myself and it works for me. However, I should also note that there are a TON of changes between this version of the style explorer, and the code that it produces, from the release version of the Style Explorer, which should be coming over VERY shortly here. It's really not worth downloading this version. And, don't worry, when the release version of Flex Builder comes out, the Style Explorer will be very easy to find.

Posted by: Peter Baird at June 24, 2006 8:00 AM

Very nice! Will you please make the source code available with the download? Thanks!

Posted by: SX at July 17, 2006 12:12 AM

Doesn't seem to work in Safari / Camino (Firefox) on OS X 10.4.8....

Posted by: Brian Maurice-Snider at February 14, 2007 5:59 PM

I got the some problem with download, only 404 error. Help plz.

Posted by: motrin at April 7, 2007 10:03 AM

Again, this post refers to a version of the style explorer that works with Flex Beta 1... we are now at Flex 2.0.1 release, so this post is obsolete. If you're looking for the latest Flex style explorer, refer to latest post on the style explorer, or go directly to http://examples.adobe.com/flex2/consulting/styleexplorer/Flex2StyleExplorer.html. If you'd like to download, right-click and "view source" to download the Style Explorer and the source along with it.

Posted by: Peter Baird at April 7, 2007 11:47 AM

Post a comment




Remember Me?

(you may use HTML tags for style)

Powered by Movable Type