Syllabus - Adobe Flex Certification

1. Creating a User Interface (UI)

• Identify and describe the basic UI controls used in a Flex application.
• Identify the purpose of UI containers and when to use them.
• Change the look and feel of a design by using API styles, style sheets, filters, and blends.
• Dynamically change the look of an application by using view states, transitions and effects.
• Position UI elements by using constraint-based layout.
• Position UI elements by using enhanced constraints.
• Implement application navigation by using navigator containers.
• Customize list-based controls.

2. Flex system architecture and design

• Create and use custom components.
•  Transfer data between components by using data bindings.
• Data Binding
• Create, handle, and dispatch custom events.
• Handle framework events.
• List and describe the differences between model, view, and controller code in a Flex application.

3. Programming Flex applications with ActionScript

• Define and extend an ActionScript class.
• Implement an ActionScript interface.
• Use access modifiers with classes and class members.
• Under the purpose of and implement data transfer objects.
• Implement accessor methods in ActionScript.
• Use an ArrayCollection to sort, filter, and provide data.
• Implement data validation.
• Manipulate XML data by using E4X.

4. Interacting with data sources and servers

• Implement simple LiveCycle Data Services (LCDS) messaging and data management.
• Create, connect to, and define a local database.
• Add, update, and remove records from local database.
• Interact with remote data and services by using Remote Procedure Call (RPC) services.
• Upload files to a server.

5. Using Flex in the Adobe Integrated Runtime (AIR)

• Given a scenario, compile and export a release build of an AIR application.
• Create, populate, and delete files and directories on a local file system.
• Create and customize native windows and menus.
• Adding drag-and-drop functionality to and from the desktop.
• Install, uninstall, and update an AIR application.
• List and describe the AIR security contexts.

Fundamentals: Data Binding in Flex

Data binding enables a property to watch another property for changes in value.

{} are used for denoting/specifying data binding in flex. Below is the code example which show how to generate email address using Flex data binding

1:  <?xml version="1.0" encoding="utf-8"?>  
2:  <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"   
3:             xmlns:s="library://ns.adobe.com/flex/spark"   
4:             xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">  
5:     <s:Form x="11" y="5"   
6:           width="313"   
7:           backgroundColor="#FFFFFF"   
8:           contentBackgroundColor="#DADADA">  
9:        <s:FormItem width="290" label="First Name:">  
10:           <s:TextInput id="firstName"   
11:                     width="196"/>  
12:        </s:FormItem>  
13:        <s:FormItem width="290" label="Last Name:">  
14:           <s:TextInput id="lastName"   
15:                     width="196"/>  
16:        </s:FormItem>  
17:        <s:FormItem width="290" label="Email:">  
18:           <s:TextInput text="{firstName.text}.{lastName.text}@xyzcompany.com"   
19:                     width="196"/>  
20:        </s:FormItem>  
21:        <s:FormItem width="290">  
22:           <s:Button label="Submit"/>  
23:        </s:FormItem>  
24:     </s:Form>  
25:  </s:Application>  

The code above builds up dynamically the email address by watching the change in the First Name and Last Name property of the form.

text="{firstName.text}.{lastName.text}@xyzcompany.com" is the code specifing the data binding.
The above binding is one-way binding, that means incase changes are made to the Email id field the texts in First Name and Last Name field will not be affected.

Dispatching Events

The best practice for defining components that return information back to the main application is to design the component to dispatch an event that contains the return data.

the main application can define an event listener to handle the event and take appropriate action.

ChangeWatcher - it watches a variable for changes and when somthing happens fires an event. There are 3 ways to specify the paramters that chain.

ChangeWatcher.watch(this."myvar, header)


ChangeWater.watch(name:"myvar", getter: function():String{return "something"}}, handler);

BindingUtils.bindProperty


package mx.binding.util
// requires framework.swc
// immediately bind two properties one-way.
BindingUtils.bindProperty(this, "var1", this, "var2");

Data Binding in Flex Application

More DIY videos at 5min.com