flex 3: extending and styling components

course duration: 3 days
delivery method: On-site / In-house
audience: Existing Java and Flash developers. To gain the most from this class, you should:

have attended the Flex 3: Developing Rich Applications course.
have equivalent knowledge of the topics covered in Flex 3: Developing Rich Applications.

You do not:

need to be a designer
need to know any design tools

description

Flex 3: Extending and Styling Components provides experienced Flex developers with hands-on, practical experience implementing common graphical and interactive requirements illustrated by designer and project mockups. This three-day course instructs programmers how to work with embedded images and fonts, implement transitions and easing effects, apply filters and blends, and programmatically interact with mouse position and actions like dragging and dropping. In addition, students will learn how to extend and skin Flex UI components using both images and shapes drawn with the ActionScript Drawing API.

course outline

Unit 1: Introducing Flex 3: Extending and Styling Components
- Programming the Visual Experience
- Understanding Project Roles
- Introducing Mastery Learning
- Understanding the Course Format
- Reviewing the Course Prerequisites
- Reviewing the Course Outline
Unit 2: Embedding Images and Fonts
- Embedding Images at Compile-Time22
- Layering Content Using Absolute Layout27
- Creating a Reusable Embedded Image29
- Creating Instances of an Embedded Image Class30
- Understanding Device Font Limitations32
- Embedding Fonts with Absolute File Paths35
- Embedding Fonts using Adobe Flash39
Unit 3: Modifying the Look and Feel of Flex Components
- Exploring Filters
- Applying Blends
- Modifying the Look-and-Feel of Flex Components using MXML Styles
- Modifying Graphical Skins using Flex Skin Design Extensions for CS3
- Installing the Flex Skin Design Extensions for Flash
- Selecting which component to modify in Flash
- Importing the Flex skins artwork
Unit 4: Creating Popups
- Creating a Popup Window
- Passing Data to the Popup Window
Unit 5: Extending Flex Components
- Exploring Display Object Basics
- Extending Flex Components
- Implementing the createChildren() Method
- Implementing the updateDisplayList() Method
- Improving Custom Component Reusability with Stylesheets
Unit 6: Drawing shapes and Skinning Programmatically
- Understanding the Relationship Between Display List Objects and the Graphics Class
- Calling the clear() Method
- Drawing Lines
- Creating a Visual Element as an ActionScript Class
- Creating Shapes
- Defining Fill Methods
- Implementing a ButtonSkin from the mx.skins.halo Package
- Implementing a Programmatic Skin
Unit 7: Animating components and View States
- Creating Behaviors in ActionScript
- Reviewing View States and Transitions
- Using the CurrentStateChange Event
Unit 8: Creating Mouse-Aware Applications
- Detecting the mouse position
- Detecting the stage dimensions
Unit 9: Implementing Drag and Drop Functionality
- Understanding the DragManager
- Specifying the Data to Display in a List Control
- Enabling Dragging on Non-List-Based Controls
- Controlling Dropping with Formats
- Handling Data in Drag and Drop Operations