Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial

Le transizioni

Gestire il passaggio tra uno stato ed un altro
Gestire il passaggio tra uno stato ed un altro
Link copiato negli appunti

Una transizione è il passaggio da uno stato ad un altro, in questo passaggio possiamo inserire animazioni o effetti particolari. Per questo motivo trattiamo le transizioni come verie propri elementi e le codifichiamo grazie all'array <s:transitions>, che contiene i singoli elementi <Transition>.

Per indicare il cambiamento di stato cui si applica una transizione utilizziamo le proprieta fromState e toState.

All'interno della <Transition> possiamo dichiarare gli effetti da utlizzare nella transizione. In questa lezione vediamo come inserire piccole animazioni nel passaggio tra uno stato e l'altro.

Le proprietà fondamentali degli effetti sono:

  • target, che stabilisce l'oggetto investito dall'effetto. Con targets indichiamo una collezione (array) di oggetti
  • duration, che indica la durata della transizione espressa in millisecondi

Apriamo allora il file MXML dell'applicazione in modalita Source, ed inseriamo nel tag Application il seguente codice :

<s:transitions>
  <s:Transition fromState="Stato1" toState="Stato2" >
    <s:Fade alphaFrom="0" alphaTo="1" duration="1500" target="{label}"/>
  </s:Transition>
  <s:Transition fromState="Stato2" toState="Stato3">
    <s:Move  xFrom="-100" xTo="25"  duration="1500" target="{label}"/>
  </s:Transition>
  <s:Transition fromState="Stato3" toState="Stato2">
    <s:Wipe target="{label}" duration="1500" direction="up"/>
  </s:Transition>
  <s:Transition fromState="Stato2" toState="Stato1">
    <s:Wipe target="{label}" duration="1500" direction="down"/>
  </s:Transition>
</s:transitions>

Abbiamo inserito una transizione per ogni cambiamento di stato, in un progetto reale sicuramente andrebbero progettate meglio, ma lo scopo qui è mostrare l'utilizzo dello strumento.


Ti consigliamo anche