following is the code for taking a snapshot of the component on some event/action

Prerequisite for making this components work.

• Build project in flex 4.0 + SDK
• Use flash player 10 and above (MUST)
• Include Corelib.swc for JPEGEncoder to work

Explanation

BitmapData ()
The BitmapData () function takes a height and width of the component which has to be converted to image, i have used this you can very well use any UIComponent or DisplayObject.

bitmapData.draw(this,new Matrix ());
This is the place where the actual conversion takes place (where the bitmap data is drawn), Again you can use any UIComponent or DisplayObject in this place.

Bitmap Encoding: jpg.encode (bitmapData);
The component or screen area to be captured is converted into BITMAP data so that it could be encoded into Jpeg file format for saving it, you can also use a PNG or GIF encoder in this place as per your requirement. At this place the Bitmap data is encoded into a JPEG file format.

var ba : ByteArray = jpg.encode (bitmapData);
Since BITMAP data cannot be saved directly to the local system we first convert it into a ByteArray.

Date : dt.time
The date is only used to give each screenshot a unique timestamps so that each time the function is called a new file is saved.

file.save ( ba,’Screenshot at’+dt.time+’.jpg’ );
Now we pass the byte array to the file reference and also pass the name by which the file has to be saved, as shown in the function above.

Vollia you can now save JPEG file to your local file system via Flex without using any third party Serverside script to do so. No more HTTP request and error handling to take care of.

GO MAKE THE WORLD A BETTER PLACE
Say no to paper, No need to print graphs when you can save them to jpeg

Related posts:

1. Save file as PDF in flex
2. Caching images in Flex
3. uploads file via http/https

Related posts:

1. Flex Builder renamed
2. Flash “like” charts for iPad and iPhone
3. FrameworkQuest 2008 : Introduction

I am happy to announce that Folks at Amcharts are doing an awesome task for bridging the gap between flash users and non flash users by providing a charing component for both kinds of devices.

Now you can seamlessly view our data on both the device by using their FLASH/FLEX component or their JAVASCRIPT charting components.

How can this be done?
Use the HTML wrapper to decide if the device can handle flash or not. (can be done even with JS) Once you know what device you are running you can choose which kind of component to load. This gives you a seamless solution for your Business and YES it will support the normal flashbased platform as well as NON flash platforms

Important to note: you will have to follow the conventional MVC model to achieve. Keep VIEW and DATA separate.

• Find the latest version of the Javascript library at : www.amcharts.com/javascript
• You can also find the reference document at :  Javascript reference
• For other AmCharts component  visit: www.amcharts.com

Thanks for coming up with this solution. You guys at AmCharts ROCK!!

Related posts:

1. Power of Flash Catalyst
2. Multi Language-Support in flex
3. Export to Jpeg in flex.

Navigating around
· Accordion
· Headerless Menu
· Breadcrumbs
· Directory Navigation
· Doormat Navigation
· Double Tab Navigation
· Faceted Navigation
· Fly-out Menu
· Home Link
· Icon Menu
· Main Navigation
· Map Navigator
· Meta Navigation

Download detailed document: here

· Minesweeping
· Panning Navigator
· Overlay Menu
· Repeated Menu
· Retractable Menu
· Scrolling Menu
· Shortcut Box
· Split Navigation
· Teaser Menu
· To-the-top Link
· Trail Menu
· Navigation Tree

Basic interactions
· Action Button
· Guided Tour
· Paging
· Pulldown Button
· Slideshow
· Stepping
· Wizard

Searching
· Advanced Search
· Autocomplete
· Frequently Asked Questions (FAQ)
· Help Wizard
· Search Box
· Search Area
· Search Results
· Search Tips
· Site Index
· Site Map
· Footer Sitemap
· Tag Cloud
· Topic Pages

Dealing with data
· Carrousel
· Table Filter
· Collapsible Panels
· Details On Demand
· Collector
· Inplace replacement
· List Builder
· List Entry View
· Overview by Detail
· Parts Selector
· Tabs
· Table Sorter
· Thumbnail
· View

Personalizing
· Customizable Window
· Login
· Registration

Shopping
· Booking
· Product Comparison
· Product Advisor
· Product Configurator
· Purchase Process
· Shopping Cart
· Store Locator
· Testimonials
· Virtual Product Display

Making choices
· Country Selector
· Date Selector
· Language Selector
· Poll
· Rating

Giving input
· Comment Box
· Constraint Input
· Form

Miscellaneous
· Footer Bar
· Hotlist
· News Box
· News Ticker
· Send-a-Friend Link

Application needs: Patterns that help the application, or you the designer, communicate better with the user

Drawing attention
· Captcha
· Center Stage
· Color Coded Section
· Premium Content Lock
· Grid-based Layout
· Liquid Layout
· Outgoing Links
· Alternating Row Colors

Feedback
· Input Error Message
· Processing Page

Simplifying interaction
· Enlarged Click area
· Font Enlarger

Download detailed document: here

source : http://www.welie.com

No related posts.

in short making your component FOOOL proof  ;). Well then “Inspectable” is your best friend.

Usage:

If your like what you have read and want to learn more follow the link:Flex Metatags

No related posts.

First, there are two open source AS3 libraries that you can use to deal with data encryption in Flex: ASCrypt3 and Crypto. ASCrypt3 was my attempt at converting an ActionScript 2 library to an ActionScript 3 code base. I understand that Crypto was created from the ground up to make use of AS3 enhancements to make things more performance. Both libraries offer plenty of ways to encrypt, or decrypt data in Flex.

I’m going to assume that we want to use AES (Rijndael) to encrypt the data in Flex before sending it to ColdFusion. Unfortunately, I was never able to get the ASCrypt3 code base working with CF properly. People have told me they’ve used it successfully for Java. I have used Crypto to successfully pass encrypted data back and forth between ColdFusion and Flex, though.

First we need to create our key, and specify some settings. Load the Crypto demo. Click “Secret Key” from the TabNavigator and set these steps:

1. Encryption: AES
2. Mode: ECB
3. PaddingPKCS#5
4. Prepend IV to Cipher: Leave Unchecked
5. Key Format:Hex
6. Plain Text: Text
7. Cipher Text: Hex

Once your settings are set, click “Generate 128 bits” to generate a key. If you create your own key using alternate means, that’s fie but you’ll have to be sure it is 128 bits and in Hex format; or things may go awry when switching between systems.

Type your text: “This is a Test”, then click the Encrypt button. Doing this on the fly, my key was “e1787cfc32d25355f267c53837c6062e” and the cipher text was “182f2031903e0a63ed77881b1561954c”.

I’ll assume you know of some manner to get this data from Flex to ColdFusion (or, really any other backed you desire).

On the ColdFusion side, there is a great knowledge base article about dealing with encryption, so you might want to start there. To decrypt, we are dealing with a handful of built in functions:

• BinaryDecode: Converts a string to a binary object. We use it to turn our Hex Key into binary format.
• ToBase64: This calculates a string representation of a binary object. We are using BinaryDecode to turn our Binary String Hex Key into a string.
• Decrypt: This one performs the decryption algorithm

The actual code will be something like his:

First we take the HexKey, binaryDecode it and Base64 it. Then we feed those values along with our encrypted text into the Decrypt function. Finally, output the results:

There is a lot of conversion going on, but I’m not quite sure why it’s needed. I was able to get this working using Crypto and CF, but never ASCrypt3 and CF. I suspect the problem was in the encoding of the key + result; but never had a chance to explore it in further depth. Can anyone explain?

Your mission, if you choose to accept it is to write the CF code to encrypt data before sending it to Flex. It shouldn’t take long.

If you need do something ‘real world’ you’ll have to download Crypto and figure out how to call the encryption algorithms within Flex. :-)

read original here

No related posts.

I still need to add other important functionalities.

• Close headerrenderer for each column
• delete entire row functionality
• user defined default state
• and much more…

Dint get the time to complete this post but someday i will surely post a complete working APP
by that time check out the code  USE AND MODIFY AS PLEASED!!!

Related posts:

1. Copy functionality in DataGrid
2. Filter datagrid using a hslider
3. Flex dataGrid default column sort

what you need to do is in the creationcomplete of any charting component write the following code

we  tried to set visible false but that dint work we also tried to remove the textfield child alltogether  but that too dint work but finally it was the html text property of the textfield that gave way.

now you can also add your custom  trial message to your application :)

just replace the blank with your text for example:

But its better that you buy your own licence key for charting. The above example was basically for educational purpose. have fun :)

Related posts:

1. Data visualization?
2. Dynamically add remove columns in a datagrid
3. Flash “like” charts for iPad and iPhone

Welcome, Flash Builder!

Related posts:

1. FrameworkQuest 2008 : Introduction
2. Power of Flash Catalyst
3. Flash “like” charts for iPad and iPhone

• createChildren()
• commitProperties()
• measure()
• updateDisplayList()

Here is what I found after doing some studies. The most of the following part is taken from Adobe flex help however what I am trying to do here is to elaborate it more by putting up some comments to each step to make it clearer.

Following steps are demonstrating the Button component life cycle

• Given if the component is going to be in a container then the parent property of component will be referred to the container(DisplayObjectContainer type)
• Get the style settings of the component
• Dispatches the preinitialize event on the component. // The preinitialize event(mx.events.FlexEvent) is triggered when the UIComponent is in a very raw stage and there is no children in existence at that time

• Calls the component’s createChildren() method. // createChildren is a protected method of UIComponent class which we need to override when we create a subclass of the UIComponent. Also from within an override of the createChildren() method, you call the addChild() method to add each child object. You do not call this method directly. Flex calls the createChildren() method in response to the call to the addChild() method to add the component to its parent.

• Calls the invalidateProperties(), invalidateSize(), and invalidateDisplayList() methods to trigger later calls to the commitProperties(), measure(), or updateDisplayList() methods during the next render event. //invalidateProperties() marks a component so that its commitProperties() method gets called during a later screen update. invalidateSize () Marks a component so that its measure() method gets called during a later screen update. invalidateDisplayList () Marks a component so that its updateDisplayList() method gets called during a later screen update.

The only exception to this rule is that Flex does not call the measure() method when the user sets the height and width of the component(it is the explicit hight and explicit width that the user can set for any component).

• Dispatches the initialize event on the component. At this time, all of the component’s children are initialized, but the component has not been sized or processed for layout. You can use this event to perform additional processing of the component before it is laid out.// Initizlize event gets dispatched when the component has finished its construction and has all initialization properties set. After the initialization phase, properties are processed, the component is measured, laid out, and drawn. After which the creationComplete event is dispatched.

• Dispatches the childAdd event on the parent container.The childAdd event is dispatched when the addChild() or addChildAt() method is called. At the time when this event is sent, the child object has been initialized, but its width and height have not yet been calculated, and the child has not been drawn on the screen. If you want to be notified when the child has been fully initialized and rendered, then register as a listener for the child’s creationComplete event.

• Dispatches the initialize event on the parent container.Dispatched when the component has finished its construction and has all initialization properties set. After the initialization phase, properties are processed, the component is measured, laid out, and drawn, after which the creationComplete event is dispatched.

• During the next render event, Flex performs the following actions:
  • Calls the component’s commitProperties() method.//commitProperties() processes the properties set on the component. You do not call this method directly. Flex calls the commitProperties() method when you use the addChild() method to add a component to a container, or when you call the invalidateProperties() method of the component. Calls to the commitProperties() method occur before calls to the measure() method. This lets you set property values that might be used by the measure() method.
  • Calls the component’s measure() method.// Measure() calculates the default size, and optionally the default minimum size, of the component. This is an advanced method that you might override when creating a subclass of UIComponent.
    The default implementation of measure() sets measuredWidth, measuredHeight, measuredMinWidth, and measuredMinHeight to 0.
  • Calls the component’s (Adobe help mention this method is in UIComponent where as it is in container class) container’s layoutChrome() method.The Container class, and some subclasses of the Container class, use the layoutChrome() method to define the border area around the container.
  • Calls the component’s updateDisplayList() method. //updateDisplayList() method sizes and positions the children of your component based on all previous property and style settings, and draws any skins or graphic elements that the component uses. The parent container for the component determines the size of the component itself.
  • Dispatches the updateComplete event on the component.
    Dispatched when an object has had its commitProperties(), measure(), and updateDisplayList() methods called (if needed).
    This is the last opportunity to alter the component before it is displayed. All properties have been committed and the component has been measured and layed out.
• Flex dispatches additional render events if the commitProperties(), measure(), or updateDisplayList() methods call the invalidateProperties(), invalidateSize(), or invalidateDisplayList() methods.
• After the last render event occurs, Flex performs the following actions:
  • Makes the component visible by setting the visible property to true.
  • Dispatches the creationComplete event on the component. The component is sized and processed for layout. This event is only dispatched once when the component is created.
  • Dispatches the updateComplete event on the component. Flex dispatches additional updateComplete events whenever the layout, position, size, or other visual characteristic of the component changes and the component is updated for display.

Thanks Yogesh Puri

Related posts:

1. Flex component lifecycle and event flow explained
2. Event Propogation
3. Flex "Bindable" tag