Effect と Animate の整理

今の時代、Adobe Flex を使用している人も少ないと思いますが、個人的に、使用方法や概念を混乱していたので整理します。

下記のMoveEffect、とMoveAnimateは同じ動作をします。

MoveEffect.mxml

    <fx:Declarations>
        <!--MoveEffect-->
        <s:Move id="moveAnimate"
                target="{moveContainer}"
                duration="1000"
                xFrom="100"
                xTo="500"
                yFrom="100"
                yTo="500">
        </s:Move>
    </fx:Declarations>

MoveAnimate.mxml

    <fx:Declarations>
        <!--Animation-->
        <s:Animate id="moveAnimate"
                   target="{moveContainer}"
                   duration="1000">
            <s:SimpleMotionPath property="x"
                                valueFrom="100"
                                valueTo="500"/>
            <s:SimpleMotionPath property="y"
                                valueFrom="100"
                                valueTo="500"/>
        </s:Animate>
    </fx:Declarations>

Main.mxml

protected function moveBtnClickHandler(event:MouseEvent):void
{
    moveAnimate.play();
}