6 ways/effects that response to user’s event in Flex

<!---------------------------------------from:http://ntt.cc------------------->

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" viewSourceURL="srcview/index.html">

<mx:states>
<mx:State name="up">
<mx:SetProperty target="{lbApproach6}" name="y" value="0"/>
</mx:State>
<mx:State name="down">
<mx:SetProperty target="{lbApproach6}" name="y" value="50"/>
</mx:State>
</mx:states>

<mx:transitions>
<mx:Transition fromState="*" toState="*">
<mx:Move target="{lbApproach6}" duration="1000"/>
</mx:Transition>
</mx:transitions>

<mx:VBox width="600" paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">
<mx:Label textAlign="center" width="100%" fontSize="14">
<mx:text>Continue clicking the checkbox to see effect</mx:text>
</mx:Label>
<mx:HBox width="100%">
<mx:Canvas width="50%" borderStyle="inset">
<mx:Label horizontalCenter="0" x="0" y="0" id="lbApproach1" text="Approach 1: Play all the effects at once"/>
<mx:CheckBox horizontalCenter="0" x="0" y="100" id="cbApproach1" label="Move Down" click="onCheckbox1(event)"/>
</mx:Canvas>
<mx:Canvas width="50%" borderStyle="inset">
<mx:Label horizontalCenter="0" x="0" y="0" id="lbApproach2" text="Approach 2: Disable input while effect plays"/>
<mx:CheckBox horizontalCenter="0" x="0" y="100" id="cbApproach2" label="Move Down" click="onCheckbox2(event)"/>
</mx:Canvas>
</mx:HBox>
<mx:HBox width="100%">
<mx:Canvas width="50%" borderStyle="inset">
<mx:Label horizontalCenter="0" x="0" y="0" id="lbApproach3" text="Approach 3: Queue up the clicks"/>
<mx:CheckBox horizontalCenter="0" x="0" y="100" id="cbApproach3" label="Move Down" click="onCheckbox3(event)"/>
</mx:Canvas>
<mx:Canvas  width="50%" borderStyle="inset">
<mx:Label horizontalCenter="0" x="0" y="0" id="lbApproach4" text="Approach 4: Remember the last value"/>
<mx:CheckBox horizontalCenter="0" x="0" y="100" id="cbApproach4" label="Move Down" click="onCheckbox4(event)"/>
</mx:Canvas>
</mx:HBox>
<mx:HBox width="100%">
<mx:Canvas  width="50%" borderStyle="inset">
<mx:Label horizontalCenter="0" x="0" y="0" id="lbApproach5" text="Approach 5: Reverse as necessary"/>
<mx:CheckBox horizontalCenter="0" x="0" y="100" id="cbApproach5" label="Move Down" click="onCheckbox5(event)"/>
</mx:Canvas>
<mx:Canvas  width="50%" borderStyle="inset">
<mx:Label horizontalCenter="0" x="0" y="0" id="lbApproach6" text="Approach 6: State and transition"/>
<mx:CheckBox horizontalCenter="0" x="0" y="100" id="cbApproach6" label="Move Down" click="onCheckbox6(event)"/>
</mx:Canvas>
</mx:HBox>
</mx:VBox>

<mx:Script>
<![CDATA[
import mx.events.EffectEvent;
import mx.effects.Move;
public function onCheckbox1(e:MouseEvent) : void
{
var move:Move = new Move(lbApproach1);
move.yTo = cbApproach1.selected ? 50 : 0;
move.duration = 1000;
move.play();
}

private var _approach2Move:Move;
public function onCheckbox2(e:MouseEvent) : void
{
if (_approach2Move == null)
{
_approach2Move = new Move(lbApproach2);
_approach2Move.addEventListener(EffectEvent.EFFECT_END, function(e:EffectEvent):void {
cbApproach2.enabled = true;
});
_approach2Move.duration = 1000;
}
if (!_approach2Move.isPlaying)
{
_approach2Move.yTo = cbApproach2.selected ? 50 : 0;
_approach2Move.play();
cbApproach2.enabled = false;
}
}

private var _clickQueue:Array = [];
private var _approach3Move:Move;
public function onCheckbox3(e:MouseEvent) : void
{
if (_approach3Move == null)
{
_approach3Move = new Move(lbApproach3);
_approach3Move.addEventListener(EffectEvent.EFFECT_END, function(e:EffectEvent):void {
if (_clickQueue.length > 0)
{
_approach3Move.yTo = (_clickQueue[0] == true) ? 50 : 0;
_clickQueue = _clickQueue.slice(1);
_approach3Move.play();
}
});
_approach3Move.duration = 1000;
}
if (!_approach3Move.isPlaying)
{
_approach3Move.yTo = cbApproach3.selected ? 50 : 0;
_approach3Move.play();
}
else
{
_clickQueue.push(cbApproach3.selected);
}
}

private var _lastValue:String = "none";
private var _approach4Move:Move;
public function onCheckbox4(e:MouseEvent) : void
{
if (_approach4Move == null)
{
_approach4Move = new Move(lbApproach4);
_approach4Move.addEventListener(EffectEvent.EFFECT_END, function(e:EffectEvent):void {
if (_lastValue != "none")
{
_approach4Move.yTo = _lastValue == "true" ? 50 : 0;
_approach4Move.play();
_lastValue = "none";
}
});
_approach4Move.duration = 1000;
}
if (!_approach4Move.isPlaying)
{
_approach4Move.yTo = cbApproach4.selected ? 50 : 0;
_approach4Move.play();
}
else
{
_lastValue = cbApproach4.selected.toString();
}
}

private var _approach5Move:Move;
public function onCheckbox5(e:MouseEvent) : void
{
if (_approach5Move == null)
{
_approach5Move = new Move(lbApproach5);
_approach5Move.duration = 1000;
}
if (!_approach5Move.isPlaying)
{
_approach5Move.yTo = cbApproach5.selected ? 50 : 0;
_approach5Move.play();
}
else
{
_approach5Move.reverse();
}
}

public function onCheckbox6(e:MouseEvent) : void
{
currentState = cbApproach6.selected ? "down" : "up";
}

]]>
</mx:Script>
</mx:Application>