Learn flex 3 with the help of articles and examples discussed here.
Flex is the an open source framework developed by Adobe for creating rich
internet applications. Flex based applications provide real time rich experience
to the user which is not possible in traditional html based applications.
Currently, Flex is most popular choice because of its cross browser and cross
platform features. It runs consistently among all major browsers having flash
player installed in it. Developers feels very easy to develop the flex
application using Adobe flex builder application development tool. Developers
can concentrate and spend more time on business logic and work flow rather than
consuming time on developing User Interfaces.
Benefits of flex:
1. Its free and open source framework
2. Used to develop cross platform rich internet applications based on flash
3. Flex applications provide real time rich user-experience.
4. Much more faster than traditional html based applications.
5. Loads only the required content from the server hence reduces the load on
servers a lot.
6. Flex puts very less overhead to the database, and network.
7. Developing user interfaces are now easy using Adobe Flex Builder.
8. Unlike AJAX, flex applications looks and reacts the same way on each
browser and platform.
- Introducing Flex
Flex is a programming language developed on adobe technology
to enhance the users capability in building rich internet applications. This
latest adobe technology possesses all flash features.
- Downloading and Installing Flex
Flex technology is built with earlier scripting
language technologies and now it has become an adobe's open source product.
and Installing Flex Builder
In this tutorial you will learn the complete downloading and installing procedure
of adobe flex
- Compiling MXML application
In this tutorial you will be provided two ways to compile you flex
source file. First one is very easy and in this you all have to just put
or directly save your .mxml file in the bin
directory of your flex folder. Here the bin directory is the
place where the flex compiler is located.
flex ant coding example
Inside the tutorial, demonstration regarding using
eclipse as an editor for creating flex and ant projects is given. Also,
the coding of flex and apache ant applications and compiling
flex application with ant build.xml file is illustrated very
nicely inside the tutorial.
MXML files with FlexBuilder
On this page, you will be guided, to code and compile a flex application on adobe Flex
Builder. This adobe product is eclipse based therefore many of
eclipse features can be seen inside the flex builder.
- Flex Combo Box example
In this tutorial page you will be taught to utilize ComboBox control inside
your flex file. In the example you will learn to build two ComboBox
Combo Box selecteditem
In this tutorial page you will learn how to utilize the selectedItem property
in flex, for getting the details associated to items inside the flex combo box
control. Below example contains a flex combo box control with id value
Check Box control example
The page provides illustration about the working of flex checkbox control.
Example is based on registration for online training courses. On the
registration form, trainee check marks the courses in which he/she is
- Flex wipe behavior example
Code below shows the implementation of wipe behavior in buttons through its
rollOverEffect property. The first button wipes from left to right and the
second one from right to left.
- Flex Alert Box example
Alert box is a dialog box that appears on window with some message and stays
rigid until the event associated with it is not done. Alert Box is
also referred to as pop-up window.
- Flex Validator example
Code below shows Flex
component example. With these components different types of data are get
validated with appropriate validators. The provided flex feature is mostly
used in validating the user ids, email addresses and
- Flex Tab Navigator example
Under mx.containers package TabNavigator class is
present and under this
class TabNavigator container is present.
Tab Navigators are Navigator containers of flex.
- Flex Cascading Style Sheets example
Following code demonstrates the use of <mx:Style> tag. Style definitions
of this tag are implemented on other GUI components like on Button
This implementation is done by using the class selector, here class selector is
used with name Alexander.
- Action Script 'source' attribute example
In the example below an action script file with .as extension has been
imported in the main Operations.mxml file. This .as file instance is brought
through the source attribute in <mx:Script> tags.
- Action Script 'include' statement example
Example below shows two consequent action script files: GeometricalFigures.as and
Sqrt.as, and the third example, i.e.
Figure.mxml is our
main flex file inside which the working of include statement has been
- Flex addEventListener example
The example below shows the working of the addEventListener
method . As
the name suggests, the method adds events in flex components.
- Flex removeEventListener example
In the example below flex removeEventListener method
working is demonstrated. This method removes the events from the flex components.
Here mouse click event are removed by the method.
- Flex dispatchEvent example
The example below demonstrates the working of flex dispatchEvent() method.
Method works like a driver that drives the event mentioned in its constructor.
This method is used to manually dispatch or run away an event.
- Flex custom mxml tags example
Flex .mxml files, whose functionalities
are extended in to other Flex .mxml files
are called custom mxml components. Custom
mxml components are also referred to as custom mxml tags in
the flex .mxml files in which their functionality is imported.
- Flex current target property example
The example below describes the working flex currentTarget property. Code below shows a method
.setSelection which is used to highlight
the text letters as per defined closed indexes.
- Flex single event on varied components
In the example below, listeners for a single event MouseEvent.MOUSE_DOWN,
are created on two flex check boxes controls, due to which whenever the check boxes are clicked the
second argument of the .addEventListener method is get switched.
- Flex Circle drawing example
Example below draw circles on the panel background of your application.
Circles drawn and its properties like color, size and dimensions will
completely depend on you as here you are both the artist and the button operator.
- Flex target property example
In coding the below flex application we have use an
event object property target
. We also have another event object property currentTarget.
- Flex event phase detection example
With example below an introduction of phases in flex is demonstrated. In
flex there are three phases. capturing, targeting and bubbling.
- Flex terminating event flow example
In the example below, how to terminate an event flow is demonstrated. With
this example the motive of previous event phase detecting example as well
as a new flex feature zooming components are also demonstrated.
- Flex data binding example
In the example below, data binding in flex
is demonstrated. Here data binding means binding or connecting the properties
or attributes of flex controls to each other.
- Flex KeyboardEvent properties
In this example working of properties charCode
and keyCode of KeyboardEvent class under flash.events
package is demonstrated.
- Flex Handling KeyboardEvents
Following tutorial describes KeyboardEvent class
defined under flash.events package. Class is associated with the keyboard
keys pressed on the keyboard. It is commonly used for detecting the key
pressed on the keyboard.
Example below demonstrates the working of KeyboardEvent
listeners. In the example when certain specific keys are pressed the function eventListener
invokes the functions neo and trinity.
key & mouse with Flex
On this web page you will to know how to determine for
a key, is pressed or not when an event occurs. In the example below two flex
controls CheckBox and Button and two flex containers HBox and VBox
In this tutorial you'll come to know about the horizontal slider option of flex.
- Conversion of temperature from kelvin to Celsius
It is a very famous example and almost everyone of us have done this example once in any language.
- For..in loop
In this tutorial we will study for..in loop which is similar to for each loop
of C#, Java and other popular languages, in this example you will see how to display a list on a textbox on click event.
- How to display on textbox using ObjectUtil class
In this tutorial we will see how to display a text in textbox using ObjectUtil class.
This is a small example of Login screen in flex, we assume that the userid should be roseindia and password is abc, if someone enter wrong id or password or just hit the submit button, an alert message will be displayed, if both the userid and password would correct then an welcome message in alert box will be displayed.
This tutorial will help you to learn event handling on mouse click.
- Simple Text display
In this tutorial we will come to know that how to display any text in a text input box using a button click.
- Change button's text:
This tutorial will help you to learn how to change the label of a button on clicking on itself.
- Change panel height, width and title
With the help of a button's click we can change the height, width , and title of a panel.
- Change the text of a button whenever you clicked
In the current tutorial we'll study that how to change the label of a button on clicking on itself.
- Performing Object Introspection
In OOP based programming language object introspection is a technique to determining the elements(properties and methods) of a class at run time.
- Using the interospection API:
In the present API, we will describeType() method which will return an E4X XML object, this kind of object contains the description of the target object in XML format.
- Difference between Flex and Flash
There is not big difference between the flex and flash. Flash is more oriented or specially designed software for designer because they can create anything without using any code.
- How to design Form Layout in Flex Using Container
The Adobe Flex is the combination of several languages designed for developing attractive projects without wasting so much time in coding or designing.