What is component life cycle in flex 4?

Ans:

Component life cycle is the way in which in flex framework interacts with every component. It is set of methods the framework calls to instantiate, control and destroy components. They are method that takes the most of every frame.

Flex component life cycle: 3 stage

Birth: Construction

· Calls your constructor.

· Can access properties and methods of class but not its children as they are not created yet.

· Must be public and no return type.

· Call super()

· Not used often in flex.

Birth: Configuration

· The process of assigning values to properties on objects

· This results in the first call to commitProperties();

· Containers must not expect children to be added yet.

Birth: Attachement

· Adding a component to element list

· parent.addElement(yourComponent)

Birth: Initialization

· After attachment, components are initialized

· It involves several method calls and events dispatches.

Life: Deferment

· The invalidation process

o When a property is set, retain the value on a private variable

o Set a ‘dirty’ flag

o Invalidate the Component

· The validation process

o When the framework calls validation methods, updates your component accordingly.

o Ex . setting text on TextBase class.

Life: Invalidation

· Invalidation Methods plays role here, called to “invalidate” a component, but not do any work on it.

· invalidateProperties() – any property changes

· invalidateSize() –change to width or height

· invalidateDisplayList() –change to child elements

· invalidateSkinState() – sets skinChanged property to true and calls invalidateProperties()

Life:Validation

· “do the work” that invalidation requires move things, add things and remove things etc.

· Methods called are

o commitProperties()- all changes based on property and data events go here

o getCurrentSkinState()- used if the current skin state need to be updated

o updateDisplayList() – used when elements on display list need to be drawn.

o measure()- caluculate the size of components

Life:Defferment

· It puts off the “real work” until the appropriate time.

Life:Interaction

· In this phase component assigns handlers to user events

· Process things and cause invalidation to occur

Death:Removal

· This refers to the process of removing components from the element list.

· These component can be re-parented( come back to live) or abandoned to die.

Death:GarbageCollection

· Any object in the element list with no active reference is eligible for garbage collection.

How to implement Singleton pattern in ActionScript 3.0

Today I will discuss how to implement singleton design pattern using ActionScript 3.0.

Let start with the basics

The Singleton Pattern

This pattern ensures that a class has only one instance. It also ensure that global access is provided to this single instance.

Singletons are generally used in situations where data needs to be kept synchronized or for centralizing

shared resources.

Take for example the situation in which two views display and allow the user to update data, but hold

two separate instances of that data. When one view updates the data, the other view will be out of sync.

However, if both views are pointing to the same object, this problem no longer exists; all you have to do

is refresh the views (which you would probably do by implementing the observer pattern on the model

with the views as observers).

Another possibility is two views that need to access the same external data source via a service call.

If each view has its own instance of the service call, you now have to maintain that code in two different

locations and you will be creating duplicate resources (in the form of objects) that do essentially the same thing. Again, this is not an issue if both views are referencing the same object

A typical singleton class is made up of three major parts. These are:

• A static variable that holds a reference to the single instance.
• A public static method (most commonly called getInstance) that provides global access to the stored instance if one already exists and creates it if it does not.
• Some means of limiting the class to a single instance.

A typical singleton class might look like the following

package com.somedomain.somepackage{

private static instance:SingletonExample;

private function SingletonExample():void{

//any code need to initialize the object

}

public static function getInstance():SingletonExample{

if (SingletonExample.instance == null){

SingletonExample.instance = new SingletonExample();

}

return SingletonExample.instance;

}

}

The single instance of the class is held in the private static instance property. The constructor of the class

is set to private so that it cannot be accessed from outside the class. The public static method getInstance

provides the only method for retrieving the instance, ensuring that all classes that make use of it are

referencing the same instance.

Singleton Pattern implementation in Action Script 3.0

The implementation of a singleton class in ActionScript is slightly different, since ActionScript does not

allow for private constructors. You can simulate a private constructor by using an internal class, as in the

following example:

package{

public class Singleton

{

private static var instance:Singleton;

public function Singleton(enforcer:SingletonEnforcer){}

public static function getInstance():Singleton

{

if (Singleton.instance == null)

{

Singleton.instance = new Singleton(new SingletonEnforcer);

}

return Singleton.instance;

}

}

}

class SingletonEnforcer{}

The class SingletonEnforcer is defined in the same file as the singleton class, but outside the package

definition. When a class is defined in this manner in ActionScript, then only the main class defined in the

file (the one inside the package definition) may access it.

Since the constructor requires an instance of the SingletonEnforcer, any attempt to directly instantiate the

class using the constructor will fail because of an invalid parameter error. However, since the getInstance

function is internal to the class, it may freely access the SingletonEnforcer class and pass it to the

constructor.

Hope this will help you to understand how to implement Singleton pattern in ActionScript 3.0

visit: http://www.masterkingmahendra.com to view my profile and other articles and post.

How to remove color cast from an Image

Today I am discussing how to remove color cast from image using Adobe Photoshop CS5.

For demonstrating this I have taken the following image.

Step 1)

First open this image in Photoshop and Duplicate the background layer using (ctrl+j ) in windows and (cmd+j )in mac.

Step2)

Using eyedropper tool with sample size of 5 by 5 average take 3 sample from highlight, midtones and shadow region respectively as shown in fig below. Hold down shift key and click the with eyedropper tool to get the sample and then open the info panel by pressing F8 function key.

Notice in info panel the three sample ‘s RGB value. At each sample point these value are not equal. To make color correct this image we will use curve adjacent layer.

Step 3)

Add curve adjustment layer above the existing layer. With the curve adjustment try to make RGB value almost equal to all three point by adjusting Red, Green and Blue Channel curves respectively. Eventually you will find that the color cast from image has removed completely. After this your info panel will have almost like this.

Try this technique with other image and have fun.

JQuery Introduction

Add Google search field in your site

Today I am discussing how to add Google search box to your site page, so you can allow your site visitor to search some content within your site




Step1.
Add div section to you page using the div tag.

Step 2.
Add form element inside the div with method attribute set to GET and action attribute set to “http://www.google.com/search”.

Step3.
Add input field with type “text” with id attribute set to “query”.
Add input type with type “submit”
Add an input field with type “hidden” with name attribute set to “sitesearch” and value attribute set to your site URL.

Save and test your page by entering some keyword for searching. Enjoy…

Rotating Div with CSS3

In this demo I am explaining you how to rotate div with help of CSS3 transform property.

Step 1.

Create a simple HTML page with two div element as shown bleow

Save this page as testrotate.html.

Step 2.

Now add style tag in the head section of your page

Step 3

Add following style to div selector inside the style tag

div{

width:150px;

height:75px;

background-color:yellow;

border:2px solid black;

}

Save and test the page you will see two div with yellow background

Step 4

Now add another style for second div using id selector below previous style

div#my{

background-color:cyan;

transform:rotate(60deg);

-moz-transform:rotate(60deg); /* For Firefox */

-webkit-transform:rotate(60deg); /* For Safari and Chrome */

-o-transform:rotate(60deg); /* For Opera */

}

Save and test the web page. You will see the the div with id my will transformed with angle 60 deg.

*Note this feature is not supported in Internet explorer.

Here is you final page with rotated div…. Enjoy