…or should we call it Zooltip since the component itself is called Zoom control?

With Web 2.0, you want to do more on one page so that users don’t have to jump from one page to another, especially in the world of Ajax where browser back button is usually broken unless you put in some custom code. One of the most important tools to try and keep users on one page is the tooltip.

A tooltip is a good alternative to provide more info or insight without the need to put additional images. It can also be a good preview tool so that users can use the preview to decide to “continue” or take a diversion to a full view of the enticing preview.

Flex has a built in tooltip that when uses is triggered on mouse over by default. The default Flex tooltip is completely text and very limited in its ability to be positioned relative to its master. The Flex Graphic Tooltip (aka Zoom control) allows usage of text, images and custom layouts. A custom “Zoomed” or detailed view of the item is launched on mouse over. The zoom view is an item renderer that you can customize for your needs. The data passed to the zoom renderer has many flexible set options.

The Flex Graphic Custom Tooltip can be downloaded from here…

2. 3D Flex Rotating Tag Cloud

The Flex 3D Tag Cloud is an interesting visualization of your tags as a rotating 3D cumulus cloud. This component is usable from ant HTML page as a Flash file or as a component in your Flex application.

You can get this Flex component/Flash application from here…

3. Flex Multiple Files Upload

One of the more difficult tasks with Flex is uploading files. With HTML you can upload multiple files with one HTTP request with almost no JavaScript code required. In stark contrast, file upload with Flex

• Can be done only one file at a time
• Requires writing Actionscript and use of FileReference class
• Does not have a reset capability like HTML

The solution to this problem is a Flex component that can upload multiple files with a single click (just like HTML) and expose capability to relate multiple files on the server with a common key. The Flex Multiple File Upload component provides this capability with great style, that includes a progress bar depicting the progress of your upload and error handling as well.

The component approach uses events to notify listeners of upload completion or error.

Test drive the Flex Multiple File Upload demo!

4. Flex Smart Form for File and Data Uploads

Flex and Flash have many advantages over plain HTML. Interactive UI, fantastic 3D displays, animation and object oriented UI components to name a few. But, sometimes you wish that Flex had some of the extremely powerful capabilities of HTML as well…..like the HTML Form to upload files and data with no data extraction and upload code to write.

HTML form is very powerful. It can upload your files and data at one shot, easily, just by specifying a target url. The Flex Smart form bridges this gap is Flex. And, it does the job in style! Not only can you update Text Input and Rich Text editor data, but you can also combine

• TextInput
• TextArea
• Rich Text Editor
• Radio Button
• Numeric Stepper
• HSlider, VSlider
• RadioButton
• Checkbox
• ColorPicker
• ComboBox
• DateChooser and DateField

This innovative component also supports multiple file uploads in Flex. If you ever thought uploading files in Flex was difficult then you will appreciate the upload capabilities of SmartForm that knits the data and file upload using a common key and makes uploading files and data as trivial as just specifying a url.

Some very strong capabilities of Smart Form Flex File upload are

• Multiple file uploads
• Reset capability that restores values to default/initial
• Progress indicator for file uploads
• Detailed log for status of all uploads
• Support for nested controls and containers
• Error trapping and handling
• Final upload status event

Test drive the Smart Form demo!

5. Flex AutoComplete Component

Hillen Coren’s autcomplete component is a must have component for many projects. This is one of the best Auto Complete components with many advanced options like…

• Allow Duplicates
• Allow Multiple Selections
• Allow new values
• Use a custom item renderer for the auto complete drop down

There are many more options. Full documentation can be found at Hillel’s website http://hillelcoren.com/flex-autocomplete/

You can downloads the source from here. There is a SWC included in the bin folder for ready usage if you do not want to modify the source.

Visually discover Adobe Flex components, styles, effects, charts using these explorers

1. Flex Style Explorer

Style any component, control or container online using this Flex Style Explorer, evaluate it visually and export what appeals to you as a Flex CSS and use it in your projects.

 Flex Style Explorer

2. Flex Component Explorer

What is that Flex component used for? What is the MXML Syntax? Most commonly used properties? Example usage? Effects, Charts, Visual Components, PrintControls, Advanced DataGrids, Validators, Formatters, States, Transitions, OLAP Datagrids, any components…this component explorer will let you best understand how to use a component with the right example.

Flex Component Explorer

3. Flex Chart Sampler

Explore different types of charts in Flex, try out there properties online and discover the right chart and settings for your data visualization.

Charts Sampler

4. Flex Primitives Explorer

Create primitive shapes like Star, Burst, Polygon, Gear, Wedge and Arc with MXML or Actionscript using the examples on this website.

Primitive Explorer

5. Flex Enhanced Button Skin Explorer

Going Bananas trying to style a Button? Use the enhanced button skin and discover many styling options for this skin with the Enhanced Button Skin Explorer.

Enhanced Button Skin Explorer

6. Flex Distortion Effects Explorer

Flip, Rotate, Push, Pop and more effects stylable using distortion and duration properties for that wow factor on show/hode of containers and images.

Distortion Effects Explorer

7,8,9 and 10 Flex Easing Functions  Explorer

Try out different easing functions using this interactive explorer. Discover differences between linear, quadratic, quintic, cubic, elastic, exponential, bounce and many other easing functions that Flex offers out of the box.

 Easing Functions Explorer

Attribution

The material in this post has been made possible with information sharing from FlexDownloads.com

1. Flexdownloads.com

A website made in flex and for other flex websites. Flexdownloads.com is a marketplace to buy and sell Adobe Flex and AIR components like slideshows, preloaders, ecommerce components, user interface components etc. Smart UI, intutive navigation and cool Flex components make this a standard for what Flex applications can be and should be.

Flex Components Marketplace -  FlexDownloads.com

2. Ebay Desktop

Bid and buy on Ebay with this Adobe AIR desktop. Create a watch list, subscribe to feeds and alerts or save your search queries. The desktop crossed 1 million in downloads in 2009 and works almost as great as the website.

Ebay Desktop AIR Application

3. Craig’s List Desktop

Interesting, intuitive and user friendly front for the immensely popular Craigslist. The visually minded users will greatly appreciate the ability to better view the listings in a more pictorial fashion and the ability to save the searches. This application cannot be used to add a new listing or update an existing one.

Craig’s List Desktop AIR Application

4. Tweet Deck

TweetDeck is an AIR application that lets you connect to Twitter, Facebook, LinkedIn and MySpace from your desktop. Composing a message from Tweetdeck is simple. You can add multiple accounts for any of these social networking sites. Avid twitter users can manage there twitter lists and even setup a Tweetdeck account that allows them to synchronize with iPhone. The app can hide on your desktop so that you can tweet unobtrusively and unnoticed.

Tweet Deck AIR Application for Twitter

5. Photoshop.com

Online photo sharing and image editing from Adobe combines the Photoshop capabilities with Flex RIA functionality at Photoshop.com. Some would argue that this fantastic site should not have qualified for this list since it is by Adobe itself, but even the detractors will appreciate this made-in-flex site which not only shows the confidence Adobe has in Flex but also exhibits its many capabilities. A treat for the eyes of a casual user and a stimulant for those who are artistically inclined. You will need a free Adobe id to access this website.

Photoshop.com – Online Image editing

6. Acrobat.com

MS Word, Star Office, Google Docs may offer more functionality to an expert user, but pale in comparison to acrobat.com when it comes to usability. For the casual office docs user Acrobat.com offers the ability to create documents, presentations, tables and pdf’s online with your Adobe ID account. Free of charge of course, special effects included. Our interest in this website of course is that it exhibits the difference between an HTML based application on the web like Google docs and a flex based application. The results are for you to judge after careful evaluation, but in my humble opinion, Acrobat.com is not just a lot easier to use that Google docs, it pretty much offers the same functionality and looks so much more better.

Acrobat.com – Online Office Productivity Documents

7. Disney.com

Even Four year olds can navigate this made-in-flex website and get to there favorite characters videos, games, stories and activities. If they managed to get to Little Einstein’s in under 2 minutes then it is not just because they are smart, but more so because Disney choose the right technology, architecture, designers and developers in building this website. Even grownups will appreciate the looks and usability of this website.

Disney.com – Education and Fun

8. Agile Agenda

Agile Agenda is an AIR application for Project Management. It takes a more lightweight and collaborative approach to project or program management and is based on the agile philosophy. Most project scheduling solutions take too much time to create the schedule and keep it current but with

Agile Agenda – Intuitive Project Management Online

9. Picnik

Online photo editing company uses Flex technology to fix underexposed photos, remove red eye or apply special effects to your photos on Flickr, Picasa, Facebook, MySpace ot Photobucket .

Picnik – Online Editing of Images

10. WorldTV.com

World TV is a new concept in the world of web video. It empowers anyone, anywhere to become there own media mogul. With WorldTV, you can create a full-screen web TV channel in seconds that reflects your own interests, ideas or personality. The website uses Flex components bound together with HTML and javascript.

World TV – Your own TV channel online