WipeLeft transition : Wipe Effect « Effects « Flex

1. Flex
2. Effects
3. Wipe Effect

WipeLeft transition

        

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Panel title="Sign In" id="signinPanel" fontSize="12">
        <mx:Form id="loginForm" backgroundAlpha="0.0">
            <mx:FormItem label="Email:" id="emailItem" backgroundAlpha="0.0">
                <mx:TextInput id="emailText" />
            </mx:FormItem>
            <mx:FormItem label="Password:" id="passwordItem">
                <mx:TextInput id="passwordText" displayAsPassword="true" />
            </mx:FormItem>
        </mx:Form>
        <mx:ControlBar>
            <mx:LinkButton id="forgotPasswordLink" label="Forgot password?" click="currentState='RequestPassword'" />
            <mx:Spacer width="100%" id="spacer" />
            <mx:Button label="Sign in" id="signinButton" />
        </mx:ControlBar>
    </mx:Panel>
    <mx:states>
        <mx:State name="RequestPassword">
            <mx:SetProperty target="{signinPanel}" name="title" value="Request New Password" />
            <mx:SetProperty target="{signinButton}" name="label" value="Submit" />
            <mx:RemoveChild target="{forgotPasswordLink}" />
            <mx:AddChild relativeTo="{spacer}" position="before">
                <mx:target>
                    <mx:LinkButton id="signInLink" label="Return to Sign In" click="currentState=''" />
                </mx:target>
            </mx:AddChild>
            <mx:RemoveChild target="{passwordItem}" />
        </mx:State>
    </mx:states>
    <mx:transitions>
        <mx:Transition fromState="*" toState="*">
            <mx:Parallel id="t1" targets="{[signinPanel,loginForm,passwordItem]}">
                <mx:WipeLeft />
            </mx:Parallel>
        </mx:Transition>
    </mx:transitions>
</mx:Application>

   
    
    
    
    
    
    
    
  

Related examples in the same category

1.	WipeLeft for Button rollOverEffect
2.	Play the WipeLeft effect each time the selected tab changes
3.	ActionScript and WipeLeft effect
4.	A wipe down effect trigger of the target component
5.	Define a set of wipe effects that Flex executes when the user toggles the chart's visibility
6.	Use Wipe effect when creating a Button completely
7.	Create the WipeLeft effect in ActionScript
8.	A custom mask with a WipeLeft effect
9.	Use Wipe effect as part of a transition that changes the font color of a button control from black to red
10.	WipeRight and ViewStack
11.	Set WipeLeft and WipeRight with setStyle method
12.	Fade, Dissolve, Iris, Zoom, WipeRight, WipeLeft, WipeUp, WipeDown