Transitions entre un state précis et le state de base
Hello,
Voilà je n'arrive pas a appliquer une transition lors d'un changement de state.
/!\ Le détail qui suit est très important !!!
Mon application possède 2 states, le state de base, et le state "sLogin" qui "hérite" ( obligatoirement ) du state de base ( mais qui ne garde aucun des composants du state de base ). De plus ce state "sLogin" est configuré comme étant le state afficher au démarrage.
Code:
1
2
|
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" borderStyle="none" currentState="sLogin" > |
Donc pour faire simple Mon state "sLogin" possède un Panel avec un formulaire pour s'authentifier. J'aimerais que, lorsque les identifiants saisies sont correctes, je passe du state "sLogin" au state de base ( accessible via : this.currentState=''; )
Cette manip marche très bien à l'heure actuelle mais je voudrais ajouter une transition entre les 2 states pour que le Panel contenant le formulaire de "sLogin" devienne de plus en plus transparent pour enfin disparaitre et laisser place aux autres composants du state de base ( en gros faire un fadeOut )
Comme vous vous en doutez le code suivant ne marche pas :
Code:
1
2
3
4
5
6
7
8
|
<!-- Transitions -->
<mx:transitions>
<mx:Transition fromState="sLogin" toState="">
<mx:Fade target="{pLoginPanel}" alphaFrom="1" alphaTo="0" duration="1000"/>
</mx:Transition>
</mx:transitions> |
J'ai essayer de remplacer - toState="" - par - toState="*" - pour tester ... mais sa ne change rien.
Alors J'ai fouiller sur le net et je suis tomber sur un article où en gros le gars à le même problème que moi sauf que lui, c'est ses transitions entre 2 states "Particuliers" ( comprendre : ne concernant pas le state de base ) qui ne fonctionnaient pas.
En lisant sa solution, j'ai compris qu'il fallait que je passe par les balises :
<mx:addChildAction> et <mx:removeChildAction>
Si je ne me trompe pas, celles-ci permettent de gérer quant-est-ce que sont ajouté ou supprimé les éléments propres à un state. ( ces balises sont à intégrer au sein d'une balise <mx:transition> )
Donc voici le code que j'ai modifier :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
|
<!-- Transitions -->
<mx:transitions>
<mx:Transition fromState="sLogin" toState="">
<mx:Sequence>
<mx:Fade target="{pLoginPanel}" alphaFrom="1" alphaTo="0" duration="1000"/>
<mx:RemoveItemAction />
<mx:RemoveChildAction />
<mx:AddChildAction />
</mx:Sequence>
</mx:Transition>
</mx:transitions> |
On peut voir que j'ai également placé une balise <mx:RemoveItemAction /> car je ne saisie pas bien la nuance avec la balise <mx:RemoveChildAction />
Donc dans le doute j'ai mis les 2 ;) .
le Problème étant que ce code ne marche toujours pas :p ( et pire, il produit le même résultat, c'est à dire que le lorsque j'appuie sur le bouton pour me connecter, je change de state sans que la transition est le moindre effet ).
Donc voilà Merci de me venir en aide car la je coince ;)
( pour info, voici le code de l'application : )
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
|
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" borderStyle="none" currentState="slogin" >
<!-- States -->
<mx:states>
<mx:State name="slogin">
<mx:AddChild position="lastChild">
<mx:Panel id="pLoginPanel" width="250" height="148" layout="absolute" horizontalCenter="0" verticalCenter="0" title="Identification">
<mx:Label x="10" y="12" text="Login"/>
<mx:TextInput id="login" right="10" width="140" backgroundColor="#8A8A8A" backgroundAlpha="0.4" top="10"/>
<mx:Label x="10" y="44" text="Password"/>
<mx:TextInput y="42" id="password" right="10" width="140" backgroundColor="#8A8A8A" backgroundAlpha="0.4" displayAsPassword="true"/>
<mx:Button label="Connexion" right="10" bottom="10" click="checkCredential(login.text,password.text)"/>
</mx:Panel>
</mx:AddChild>
<mx:RemoveChild target="{titlewindow1}"/>
</mx:State>
</mx:states>
<!-- Transitions -->
<mx:transitions>
<mx:Transition fromState="slogin" toState="">
<mx:Sequence>
<mx:Fade target="{pLoginPanel}" alphaFrom="1" alphaTo="0" duration="1000"/>
<mx:RemoveItemAction />
<mx:RemoveChildAction />
<mx:AddChildAction />
</mx:Sequence>
</mx:Transition>
</mx:transitions>
<!-- Scripts -->
<mx:Script source="scripts.as"/>
<!-- Styles -->
<mx:Style source="styles.css" />
<mx:XMLList id="menuXmlList">
<menuitem label="Facture">
<menuitem label="Ajouter" click="curentstate='login'"/>
<menuitem label="Lister"/>
<menuitem label="Supprimer"/>
</menuitem>
<menuitem label="Administration">
<menuitem label="Utilisateurs"/>
<menuitem label="Statistiques"/>
</menuitem>
</mx:XMLList>
<mx:RemoteObject id="roServiceVO"
fault="getFault(event)"
endpoint="/../weborb/weborb.php"
destination="ServiceVO"
source="ServiceVO"
>
<mx:method name="loadUsers" result="loadUsersResult(event)"/>
<mx:method name="updateUser" result="updateUserResult(event)"/>
<mx:method name="checkCredential" result="checkCredentialResult(event)"/>
</mx:RemoteObject>
<mx:TitleWindow id="titlewindow1" layout="absolute" title="Budget Manager" height="70" width="100%" styleName="TitleWindowStyle" x="0" y="0" >
<mx:MenuBar id="myMenuBar" labelField="@label" itemClick="menuBarHandler(event)" dataProvider="{menuXmlList}" styleName="MenuBarStyle" menuStyleName="MenuStyle" x="0" y="5" />
</mx:TitleWindow>
</mx:Application> |
