Change button position and fade button

           
<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
    xmlns:mx="http://www.adobe.com/2006/mxml" 
    layout="absolute">
    
    <mx:Script>
        
            private function changeState() : void {
                currentState = (currentState == null) ? "alternate" : null;
            }
      
    </mx:Script>
    
    <mx:states>
        <mx:State name="alternate">
            <mx:SetProperty target="{button2}" name="x" value="100"/>
            <mx:SetProperty target="{button2}" name="y" value="10"/>
            <mx:SetProperty target="{button3}" name="visible" value="false"/>
        </mx:State>
    </mx:states>
    
    <mx:transitions>
        <mx:Transition toState="alternate">
            <mx:Parallel>               
                <mx:Fade target="{ button3 }" />
                <mx:Fade target="{ button1 }" />
                <mx:Move target="{ button2 }" />
                <mx:Fade target="{ button3 }" alphaTo="1" />
            </mx:Parallel>
        </mx:Transition>
        <mx:Transition toState="">
            <mx:Sequence>           
                <mx:Move target="{ button1 }" />
                <mx:Fade target="{ button1 }" alphaTo="1" />
                <mx:Move target="{ button2 }" />
                <mx:Fade target="{ button3 }" alphaTo="1" />
            </mx:Sequence>
        </mx:Transition>
    </mx:transitions>
    
    <mx:Button x="10" y="10" label="Button 1" id="button1" click="changeState()" />
    <mx:Button x="10" y="40" label="Button 2" id="button2" click="changeState()" />
    <mx:Button x="10" y="70" label="Button 3" id="button3" click="changeState()" />
    
</mx:Application>

1.	Wrap Parallel, fade and move with Transition
2.	Use Transition to add and remove controls dynamically
3.	Define transitions for this example in MXML using the tag
4.	Set control to invisible during transition
5.	Using a filter in Transition
6.	Advanced Transitions: Move, Rotate, Resize
7.	Transitions with tag
8.	Transition With Blurs
9.	Action Transitions
10.	Custom AnimateTransitionShader Transform
11.	Using a filter
12.	Defining a custom filter

Change button position and fade button : Transition « Effects « Flex

Related examples in the same category