Archive

Archive for the ‘Uncategorized’ Category

Top Flex Components

April 1, 2010 Leave a comment

1. Flex Custom Tooltip

…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.

Categories: Uncategorized

Top 10 Flex Explorers

December 28, 2009 Leave a comment

 

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 used by many sites like flexdownloads.com

 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

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.

Flex Charts ExplorerCharts 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.

 Flex primitive shapes

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

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

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.

Flex easing functions explorer

 Easing Functions Explorer

 

Attribution

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

Categories: Uncategorized