Introduction to Flex 2 Training (3 days)

Introduction to Flex 2 Training Overview

In this Adobe Flex training class, students will learn how to use Adobe Flex to create their first rich internet applications.

Introduction to Flex 2 Training Course Goals

• Understand what is meant by "Rich Internet Application"
• Learn to layout an application in Flex
• Learn to use Flex controls
• Learn to handle events and work with data structures
• Learn to work with remote XML data
• Learn to create components with MXML
• Learn to work with data sets
• Learn to declare and use custom events
• Learn to create custom components with ActionScript 3.0
• Learn to use DataGrids and ItemRenderers
• Learn to use drag and drop
• Learn about navigation in Flex applications

Introduction to Flex 2 Training Course Prerequisites

Experience in the following areas is required:

• Basic XML knowledge

Experience in the following areas would be beneficial.

• Object-oriented programming

Introduction to Flex 2 Training Course Outline

1. Understanding Rich Internet Applications
   1. Understanding the Evolution of Computer Applications
   2. Breaking away from the Page-based Architecture
   3. Identifying the Advantages of Rich Internet Applications
   4. Business Managers
   5. IT Organizations
   6. End Users
   7. RIA Technologies
   8. Asynchronous Javascript and XML (Ajax)
   9. Flash
   10. Laszlo
   11. Flex
   12. Windows Presentation Foundation/XAML/Expression
2. Getting Started
   1. Getting Started with Flex Application Development
   2. Creating a Project and an MXML Application
   3. Understanding the Flex Builder 2 Workbench
   4. Running Your Application
   5. Creating a Second Application Page and Working in Design Mode
   6. Getting Ready for the Next Lesson
3. Laying Out the Interface
   1. Learning About Containers
   2. Laying Out the E-commerce Application Using Design Mode
   3. Working with Constraint-based Layouts
   4. Working with View States
   5. Controlling View States
   6. Laying Out an Application in Source Mode
   7. Adding and Controlling View States with MXML
4. Using Simple Controls
   1. Introducing Simple Controls
   2. Using Flex Explorer to Learn About Simple Controls
   3. Displaying Images
   4. Building a Detail View
   5. Using Data Binding to Link a Data Structure to a Simple Control
   6. Using a Form Layout Container to Lay Out Simple Controls
   7. Adding Radio Buttons and Date Fields to the Dashboard
5. Handling Events and Data Structures
   1. Introducing Handling Events and Complex Data Structures
   2. Using the <mx:Model> Tag with a Creation Complete Event
   3. Building a Custom ActionScript Class
   4. Building a Method to Create an Object
   5. Building Shopping Cart Classes
   6. Exploring the Event Object
6. Using Remote XML Data with Controls
   1. Retrieving XML Data with HTTPService
   2. Using ArrayCollections
   3. Using Collections as Data Providers
   4. Understanding Security Issues
   5. Populating a List with Retrieved XML as an ArrayCollection of Objects
   6. Populating a ComboBox Control and Programmatically Adding an Option
   7. Using XML Data with a Tree Control
   8. Understanding E4X operators
   9. Populating a Tree Control with XML Data
   10. Retrieving XML Data and Transforming it into an ArrayCollection
   11. of Custom Objects
   12. Using Data Binding with Complex Data Structures
   13. Sorting and Manipulating Shopping Cart Data
   14. Adding a Remove Button
7. Creating Components with MXML
   1. Introducing MXML Components
   2. Understanding the Basics on How to Create a Custom Component
   3. Creating a Custom Component Step by Step
   4. Using Custom Components in Application Architecture
   5. Creating an Update/Delete Product Component and Instantiating It
   6. Popping Up Product Information When Clicking the Update and Delete
   7. Buttons
   8. Creating Another Value Object
   9. Creating a Data Manager Component for All Three Applications
   10. Using the New Data Manager Component
   11. Implementing Add Product Functionality
   12. Creating and Using a Component for the Dashboard Application
8. Using Controls and Repeaters with Data Sets
   1. Introducing Using Data Sets
   2. Understanding HorizontalList and TileList Components
   3. Implementing a labelFunction
   4. Implementing an itemRenderer
   5. Displaying the Categories Using a HorizontalList and an itemRenderer
   6. Displaying Grocery Products Based on Category Selection
   7. Using a Repeater to Loop Over a Data Set
   8. Retrieving Data from Repeated Components
   9. Addressing Components Built by a Repeater
   10. Understanding Performance Differences Between TileList and Repeater
   11. Displaying Grocery Items Based on Category
   12. Coding States to Display Detailed Product Information
   13. Placing Products in the Shopping Cart
9. Using Custom Events
   1. Understanding the Benefits of a Loosely Coupled Architecture
   2. Dispatching Events
   3. Declaring Events for a Component
   4. Identifying the Need for Custom Event Classes
   5. Building and Using the CategoryEvent
   6. Creating and Using the ProductEvent Class
   7. Using ProductEvent to Remove a Product from the Cart
   8. Using ProductEvent to Add a Product to the Cart
   9. Understanding Event Flow and Event Bubbling
10. Creating Custom Components with ActionScript 3.0
    1. Introducing Building a Component with ActionScript 3.0
    2. Creating the Structure of the Class
    3. Overriding the createChildren() Method
    4. Creating a Button in ActionScript
    5. Using the addChild() Method to Add the Button to your Component
    6. Understanding chrome and rawChildren
    7. Using addChild on rawChildren to Add Elements to the Chrome
    8. Overriding the updateDisplayList() Method
11. Using DataGrids and ItemRenderers
    1. Introducing DataGrids and ItemRenderers
    2. Adding a Generic DataGrid to Chart Pod
    3. Adding HTTPService Calls to Dashboard
    4. Displaying the Shopping Cart with a DataGrid
    5. Add Inline Editing Control for DataGridColumn
    6. Create an MXML Item Renderer for Displaying the Product
    7. Create an Inline MXML Item Renderer for Displaying the Remove Button
    8. Update ShoppingCartItem with Set and Get Functions
12. Using Drag and Drop
    1. Introducing the Drag and Drop Manager
    2. Dragging and Dropping Between Two DataGrids
    3. Dragging and Dropping Between a DataGrid and a List
    4. Using a Nondrag-Enabled Component in a Drag-and-Drop Operation
    5. Dragging a Grocery Item to the Shopping Cart
13. Implementing Navigation
    1. Introducing Navigation
    2. Using a TabNavigator in the Data-entry Application
    3. Adding a Home Page and Checkout Page in the E-commerce Application
    4. Creating the First Step of the Checkout Process Displayed by a ViewStack
    5. Completing the Checkout Process Using the ViewStack

Introduction to Flex 2 Training Course Materials

Each student will receive a copy of Adobe Flex 2: Training from the Source by Jeff Tapper, Matt Boles, James Talbot, Ben Elmore and Mike Labriola, which will serve as a guide for the class.

Introduction to Flex 2 Training Technical Requirements

1. Operating Systems Options
   • Operating System Options
     • Windows Vista
     • Windows XP with Service Pack 2
   • Macintosh
2. Flex 3 Requirements
   1. Adobe Flex Builder 3
      • Download
      • System Requirements
   2. Adobe Flex 3 SDK
      • Download
   3. Sun Java Runtime Environment 1.4.2 or later
      • Download
3. Flash Player (latest version)
   • Download
4. Eclipse 3.1 or later
   • Download
5. Browser Options
   • Internet Explorer 6.0 or later
     • Download
   • Firefox
     • Download
   • Safari
     • Download

Class Files for Introduction to Flex 2 Training

The class files for this course are included on a CD that is shipped with the book.