Flex: Programming the Visual Experience

Flex: Programming the Visual Experience


Experienced Flex Developers needing to extend their knowledge in the Visual side of the product.


Practical experience of using Adobe Flex.


3 days. Hands on.

This course is available on site only.  Please call for details.

Course Objectives

This course provides experienced Flex developers with hands on, practical experience implementing common graphical and interactive requirements illustrated by designer and project mock-ups. The 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 Content

Flex: Programming the Visual Experience
Modifying the default look-and-feel of Flex applications.
Introducing Mastery Learning.
Understanding the Course Format.
Reviewing the course prerequisites.
Reviewing the course outline.
Setting up the application files.

Enhancing the application with imagery and layering
Adding background colours and imagery to the application.
Adding an application background image.
Adding imagery to the Natural Experiences application.
Layering content using absolute layout.
Creating a reusable embedded image.
Creating instances of an embedded image class.
Using bindable variables for imagery.
Creating simple popup functionality.

Enhancing the application with fonts, filters and blends
Understanding the limitations of device fonts.
Learning the limitations of device fonts.
Embedding fonts with direct calls to the font files in the file system.

Embedding fonts using FlashType
Exploring advanced FlashType settings.
Exploring filters.
Exploring filter properties.
Applying blends.

Modifying the look-and-feel of Flex components graphically
Exploring 9-slice scaling.
Exploring 9-slice scaling.
Modifying the look-and-feel of Flex components using MXML styles.
Modifying the Natural Experiences.
Modifying graphical skins using Adobe Flash templates.

Extending Flex Components
Learning display object basics.
Exploring the non-content children.
Introducing the DisplayObject class and its subclasses.
Extending Flex components.
Creating an extended component.
Implementing the createChildren() method.
Implementing the updateDisplay List() method.
Calling the updateDisplayList() method of the super class.
Improving custom component reusability with stylesheets.

Drawing shapes and programmatically modifying the look-and-feel of Flex components
Understanding the relationship between display list objects and the Graphics class.
Calling the clear() method.
Exploring the clear() method.
Drawing lines.
Using the scaleMode argument of the lineStyle() method.
Ordering the lineStyle() method arguments.
Using line methods to draw a star.
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.

Animating components and state changes
Reviewing Behaviors.
Defining behavior triggers.
Applying behaviors.
Creating a fly-in popup component.
Reviewing View States and Transitions.
Using the CurrentStateChange change event.
Understanding the order of events and transitions.
Setting a custom component’s size for state changes.
Handling child components that become invisible in transitions.

Passing data between components to affect layout and data display
Creating custom component properties.
Passing and displaying XML photo data in the gallery.
Reviewing the Repeater component.
Using dynamic data in the Repeater.
Using currentItem with a complex data structure.
Using Repeater data in ActionScript.
Calculating custom component size.
Creating a more flexible tile display.

Creating mouse-aware application features
Detecting the mouse position.
Moving the popup to the mouse position.
Detecting the stage dimensions.
Creating animation using the Timer class.
Understanding easing.

Implementing Drag and Drop Functionality
Understanding the DragManager.
Enable drag and drop functionality in a drag enabled component.
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.
Viewing data in the DragSource.

Virtual Courses

ALL of our courses can be delivered virtually. And our Bath public schedule of courses are now available as live virtual sessions, using the popular Zoom Virtual Classroom and remote labs. Delegates can test their access at: www.zoom.us/test

On-Site Courses

Can't attend one of our public classes? Booking for multiple people?

All our courses are available on your site! Delivered for your staff, at your premises.

Contact us to find out more...