Recently, I had the opportunity to take some new Flash components for a spin. I am generally a user of the default Adobe UI components whenever I am working on an advanced UI in Flash and otherwise shy away from components as I prefer to work with something I have built from the ground up. Prior to testing the Jumpeye V3 components I had not heard of Jumpeye; once I took a look at the work the team is doing at Jumpeye I couldn’t believe that I hadn’t. I initially anticipated the components to be like most 3rd party components that you might use once and forget about; that was far from the case.

I thought it would be helpful to share my findings for those of you looking into great, easily customizable and dynamically driven components. I have been raving to my co-workers recently about the level of detail and documentation provided with each of the components.

If you guys want to see a sweet little video on the components in action you can check it out on Jumpeye’s main component page: http://www.Jumpeyecomponents.com/. If you want to learn more about the V3 components on your own you can also read more here: http://www.Jumpeyecomponents.com/about_v3_components.htm.

I thought I would take the time to show you some of the features of the components that I found really impressive and why I plan to use them when the opportunity arises in the future.

Dynamic Population
One of the nice features of the V3 components is that they are driven by external XML files for the data population. For example, to populate an Accordion Tree component you would use XML something like this:

This makes things pretty easy to follow as the other V3 components use a similar XML structure. This makes data entry and skinning much easier to carry across different UI components.

Another nice feature is the attention to detail taken to make the components as user-friendly as possible. In the image below you can see that I tried to use an Accordion Tree component without setting an XML path. I get a nice custom error telling me what I have done incorrectly.

Skinning
Skinning components and the ability to give them your own personal touch has always been a must for most Flash developers. When I went into the skins of the components I was really impressed at the level of detail that you were able to give to the components. The pre-made skins are laid out in manner much like the new UI components in Flash CS3. It is very easy to find what you want to change.

Skins are applied in the same XML file that loads the data for the component and are handled via movie clips with linkage IDs applied to them within your library. Once the component loads it can look at the style in the XML and use the proper movie clip for each portion of the UI.

Component assets are easily accessible within the library of the included files as well.


Interactivity and Parameter Controls
The components can be modified via the Parameters panel in the Flash IDE just like the default UI components. What impressed me was the ActionScript API used to interface the components into your projects. Those of you used to using event listeners and ActionScript 2 Class-based development are likely to appreciate the time put into the numerous different properties, methods and events that are broadcast and available to code against.
The Actual Components
Instead of me blabbing on about the components I thought it would be better to just show you some of the different components included in the V3 components family. Jumpeye has some great demos of each component already produced so I thought I would just send you to each of the demo pages. Click on the images below to go to the demos on the Jumpeye site.

The Accordion Panel
The Accordion Panel component work much like the default Adobe Accordion but adds a nice flair using easing, easy skinning and XML data integration:

Drop Down Tree Menu
The Drop Down Tree Menu has to be one of the best in my opinion. I have created menus like this from scratch before and it took longer than I would have liked to have spent. This is where the skinning capabilities really shine.

The Color Picker Pro
The Color Picker Pro is by far my favorite component in the family. This component is very dynamic and can change for use in many different forms and functions.

The V3 family also contains an XML Slideshow component and a Loader Pro component as well.

Free Upgrades to AS3 ComponentsCurrently the Jumpeye V3 components are written in and for AS2. Those of us purchasing the components now will get a free upgrade to the AS3 versions which are currently in production. That’s what I’m talking about!

Jumpeye also has a bunch of other components on their site as well that look like they would be pretty sweet. If you get the chance or are in the need of a component to help you out I would advise you to check them out first.

As my friend and I continue to learn the finer details of AS3 development we have come upon some interesting things. Today I learned about the fullScreenTakeOver property of the FLVPlayback Component.

Regardless of the settings and scale properties we set for the FLVPlayback component in our file, the FLVPlayback would take over the sceen when we ran our projector file. I stumbled upon the fullScreenTakeOver property of the FLVPlayback Component and noticed that the default value is true.

Here is the description from the help file:
When the stage enters full-screen mode, the FLVPlayback component is on top of all content and takes over the entire screen. When the stage exits full-screen mode, the screen returns to how it was before.

In our case the fix was easy enough:
import flash.system.fscommand;
fscommand(“fullscreen”, “true”);
fscommand(“allowscale”, “false”);
flvPlybk.fullScreenTakeOver = false;

Everything works as desired now. This example obviously deals with Projectors but this might rear its head in fullScreen browser mode as well so be on the lookout.

A story of staying true to your roots, a good read. As much as I would love to see Homestar on my TV… I mean, I know I can buy the DVDs… Since it is my fav Flash cartoon I thought I’d share:
http://www.wired.com/entertainment/…

John Knack at Adobe did a sweet video demo of my Kuler Panel in action. You can check it out here. Thanks for the shout out John!

Updates to the Flash CS3 Kuler Panel are now complete. Thanks to those of you who beta tested for me. Updates include:

• Improved swatch handling for schemes with differing numbers of swatches
• Improved UI
• Scheme name bug fixes
• Performance improvements

You can download the MXP here.

If you find anything that gives you trouble just let me know. Hope you enjoy.
Some additional imagery of the panel in action is below:

Someone pointed out that I am only bringing 4 of 5 swatch colors into the panel! Wow, sorry I overlooked that! I also was turned on to what was causing the elusive JSFL error. Thanks to everyone who has tested the panel. I hope to make the updates soon and release a new build.

**UPDATE HERE

I have been a big fan of the Kuler Dashboard Widget and the Kuler Apollo apps. I also thought it was pretty sweet how you can access Kuler from within Illustrator CS3 as well. That lead me to the development of a Kuler panel for Flash CS3. The custom panel is written in AS3 so it should run smoothly. This however, means that it will only run in Flash CS3. I used the common interface from the Dashboard and Widget versions (hope Adobe doesn’t mind). You can download the MXP installer here. I have only tested the installer on a PC so far – If anyone has problems with the install on PC or Mac please let me know. Thanks!