Accessibility
Chet Haase

Chet Haase

Adobe

Table of Contents

  1. Introduction
  2. Working with the Animate class: "One effect to rule them all"
  3. Using basic effects
  4. Resize effects
  5. Transform effects
  6. Fade effect
  7. AnimateColor effect
Created:
1 June 2009
Modified:
4 October 2009
User Level:
Beginner, Intermediate
Products:
Flex

Effects in Adobe Flex 4 beta – Part 1: Basic effects

Note: This article was created based on Flex 4 beta 1. However, it still applies to beta 2.

Flex effects are, to this graphics geek, one of the coolest and most interesting parts of the Flex platform. Flex effects make it easy to create rich applications and compelling user experiences. In fact, Flex effects are so useful that we decided to make them even more powerful in Adobe Flex 4 beta. We've enabled them to target arbitrary objects and property types, to take advantage of new technologies in Flash Player, and to be more powerful and functional in general.

This article describes the new effects in Flex 4 SDK beta. In order to get you up to speed quickly, I'll dive right into the main classes and provide code examples to implement basic effects. The details of how Flex effects work in general are outside the scope of this article—I'll focus on using the new capabilities of Flex 4 effects to create animations and describe how to incorporate them into your applications. This article doesn't cover all of the new Flex 4 features that you may see in some of the code snippets, such as the new spark components, multiple namespaces, the Declarations block, and the new states syntax, because there are other articles available that address those enhancements. That leaves us free to focus on animation.

Because of the numerous animation features available in Flex 4 beta, it was impossible to fit descriptions of all of the new effects functionality into one bite-sized article. Instead, this topic is broken up into two parts: Part 1 describes the basic infrastructure of the new effects and covers the basic, fundamental effects that most Flex developers may use on a regular basis. Part 2 describes some of the more advanced effects that build on new functionality available in Flash Player 10.

Requirements

In order to make the most of this article, you'll need the following software and files:

Adobe Flash Builder 4 beta (formerly known as Flex Builder)

Adobe Flex 4 SDK beta

Adobe Flash Player 10

Sample files:

Note: The sample files include both the source files for each code example as well as a SWF file to play the applications. The examples should compile under the beta build of the SDK, but since some APIs may still change before the final version of Flex 4 ships, the source may not build exactly as is with other versions.

Prerequisite knowledge

Basic understanding of the Flex Builder environment and prior experience developing Flex applications is recommended.

Creative Commons License
This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License

Page 1 of 5
Next Page

About the author

Chet is a senior computer scientist on the Flex SDK team at Adobe. His background and interest is in graphics, animation, and anything that puts the pixels on the screen. You can see more Flexplorations from Chet on his technical blog at http://graphics-geek.blogspot.com.