PDA

Volledige versie bekijken : Flex 2 transistions?


mech7
%Europe/Berlin %704 %2006, 17:54
Ik ben een beetje aan het proberen met de transitions maar bij het terug gaan naar de base state gebeurt er niks weet iemand wat er fout is? :(

loginForm.mxml


<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:states>
<mx:State name="registerForm">
<mx:AddChild relativeTo="{form1}" position="lastChild">
<mx:FormItem label="Email:" required="true">
<mx:TextInput id="emailInput" displayAsPassword="true"/>
</mx:FormItem>
</mx:AddChild>
<mx:SetProperty target="{registerButton}" name="label" value="Register"/>
<mx:SetProperty target="{loginPanel}" name="title" value="Register"/>
<mx:AddChild relativeTo="{controlbar1}" position="lastChild">
<mx:LinkButton label="Login" click="currentState=''"/>
</mx:AddChild>
<mx:RemoveChild target="{linkbutton1}"/>
<mx:AddChild relativeTo="{form1}" position="lastChild">
<mx:FormItem label="Firstname:" required="true">
<mx:TextInput id="firstnameInput" displayAsPassword="true"/>
</mx:FormItem>
</mx:AddChild>
<mx:AddChild relativeTo="{form1}" position="lastChild">
<mx:FormItem label="Lastname:" required="true">
<mx:TextInput id="lastnameInput" displayAsPassword="true"/>
</mx:FormItem>
</mx:AddChild>
</mx:State>
</mx:states>
<mx:transitions>
<mx:Transition toState="registerForm">
<mx:Resize duration="500" target="{this}"/>
</mx:Transition>
<mx:Transition toState="">
<mx:Resize duration="500" target="{this}"/>
</mx:Transition>
</mx:transitions>
<mx:StringValidator id="userValidator" property="text" source="{usernameInput}"/>
<mx:Panel title="Login" id="loginPanel">
<mx:Form id="form1">
<mx:FormItem label="User name:" required="true">
<mx:TextInput id="usernameInput"/>
</mx:FormItem>
<mx:FormItem label="Password:" required="true">
<mx:TextInput id="passwordInput" displayAsPassword="true"/>
</mx:FormItem>
</mx:Form>
<mx:ControlBar id="controlbar1">
<mx:Button label="Submit" click="mx.controls.Alert.show('You clicked','Click')" id="registerButton"/>
<mx:Spacer width="100%" />
<mx:LinkButton label="Register" id="linkbutton1" click="currentState='registerForm'"/>
</mx:ControlBar>
</mx:Panel>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
]]>
</mx:Script>
</mx:Canvas>

main.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" xmlns:forms="forms.*">
<forms:loginForm id="loginComponent"/>
</mx:Application>

TrueChaoZ
%Europe/Berlin %758 %2006, 19:12
Geef je transition eens een fromState, wellicht dat dat helpt:
<mx:Transition toState="registerForm" fromState="">

TheDutch
%Europe/Berlin %771 %2006, 19:30
De target "this" moet "loginPanel" zijn want die moet resizen :).


<mx:Transition toState="registerForm">
<mx:Resize duration="500" target="{loginPanel}"/>
</mx:Transition>
<mx:Transition toState="">
<mx:Resize duration="500" target="{loginPanel}"/>
</mx:Transition>

TheDutch
%Europe/Berlin %774 %2006, 19:35
Geef je transition eens een fromState, wellicht dat dat helpt:
<mx:Transition toState="registerForm" fromState="">
Dat is alleen nodig wanneer de transitie alleen mag plaatsen vinden tussen twee specifieke states wanneer je meer dan twee states hebt. In dit geval dus niet noodzakelijk.

mech7
%Europe/Berlin %778 %2006, 19:41
Hey dat werkt wel :D maar hoe komt het dan dat de animatie naar de registerForm state wel gaat maar naar de base state niet met this :s ?

De target "this" moet "loginPanel" zijn want die moet resizen :).


<mx:Transition toState="registerForm">
<mx:Resize duration="500" target="{loginPanel}"/>
</mx:Transition>
<mx:Transition toState="">
<mx:Resize duration="500" target="{loginPanel}"/>
</mx:Transition>

TheDutch
%Europe/Berlin %903 %2006, 22:41
Jij was de canvas aan het resizen ipv. het panel. Laat me in stappen uitleggen wat er dan gebeurd:

HEEN:
1. Panel wordt zonder effect groter.
2. Canvas resized met een effect mee.

TERUG:
1. Panel wordt zonder effect kleiner
2. Canvas resized met een effect mee.

Wanneer je goed kijkt zie je dat bij HEEN het Panel al groter is vóór de Canvas eroverheen resized. Wanneer je TERUG gaat is het Panel al weer direct klein en zie je natuurlijk de Canvas niet resizen omdat het niet over het Panel heen zal vallen.

Is het zo wat duidelijk? :)

TrueChaoZ
%Europe/Berlin %484 %2006, 12:37
Dat is alleen nodig wanneer de transitie alleen mag plaatsen vinden tussen twee specifieke states wanneer je meer dan twee states hebt. In dit geval dus niet noodzakelijk.Juistem daar zit wat in :)