1.4. Making User Interfaces Engaging and Effective

In this part of the chapter, we explore a few subjects that facilitate sprucing up of user interfaces to make them more productive. By no means are these either exhaustive or detailed.

1.4.1. Exploring Effects

An effect is a dynamic behavior that is applied to a target component when an effect is triggered. Therefore, a trigger and a target are the two complementary parts of an effect. An effect is activated or triggered in the same manner as an event, although it is distinct from it. For example, both a creationCompleteEvent and a creationCompleteEffect are activated when an application is created, initialized, and set up. On an effect trigger, a specific effect is applied to a target. As an example, you may want a label to glow when the mouseDownEffect is triggered on that label. The label in this case is the target for the effect. Listing 1-7 shows how to accomplish such an effect.

Example 1.7. Glow on a Mouse Down Effect
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    backgroundColor="0xFFFFFF">
    <mx:Glow id="glowEffect" duration="1000"/>

    <mx:Label id="firstLabel" text="First Label"
        mouseDownEffect="{glowEffect}"/>
    <mx:Label id="secondLabel" text="Second Label"/>

</mx:Application>

A few common effects available in Flex are:

  • AnimateProperty

  • Blur

  • Dissolve

  • Fade

  • Glow

  • Iris

  • Move

  • Pause

  • Resize

  • Rotate

  • SoundEffect

  • WipeLeft

  • WipeRight

  • WipeUp

  • WipeDown

  • Zoom

In addition, to these built-in effects, one can ...

Get Professional BlazeDS: Creating Rich Internet Applications with Flex® and Java® now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.