Sommario

• Ciclo di vita di un attore
• Visualizzazione di una scena o di un composito
  • Inizializzazione
  • Post-inizializzazione
  • Primo rendering
  • RIASSUNTO
• Aggiunta dinamica di un attore
• Eliminazione di un attore
• Variazione del valore della proprietà di un attore
• Transformations de liaison

Ciclo di vita di un attore

Tutti gli attori hanno un ciclo di vita in cui vengono visualizzati e poi eliminati da una scena (questo vale anche per un composito).

In ogni fase del ciclo di vita, l’attore subisce trasformazioni che talvolta si traducono in eventi. Questi forniscono l’opportunità di eseguire azioni prestabilite mediante l’uso di script Javascript.

Per sapere quando e come intervenire al momento giusto su un attore, è importante capire il suo ciclo di vita in una scena/composizione.

Visualizzazione di una scena o di un composito

Quando una scena o un composito viene visualizzato, il Runtime ne interpreta le caratteristiche a partire dall’attore principale che contiene la struttura degli attori che compongono la scena o il composito. Questo attore contiene anche tutte le definizioni degli script.

Il Runtime attraverserà l’albero degli attori partendo dall’attore principale. Si occuperà quindi di ogni figlio, di ogni figlio di un attore figlio, ecc.

La visualizzazione della struttura ad albero avviene in 3 fasi:

• Inizializzazione
• La post-inizializzazione
• il primo rendering.

Ogni passaggio ha un ruolo particolare durante il quale vengono attivati gli eventi.

Inizializzazione

Durante la fase di inizializzazione, la struttura ad albero viene percorsa, dall’alto verso il basso, in modo da identificare gli attori che la compongono.

In questa fase, ogni attore inizializza le sue proprietà, valorizza le proprietà definite nei suoi parametri, crea eventuali proprietà aggiuntive e attribuisce loro un valore.

A questo punto viene generato un evento: onInit.

In questo momento, potrebbe succedere che non tutti gli attori definiti nella scena o nel composito siano presenti o disponibili. I collegamenti non sono ancora stati completati.

✔️ CONSIGLIO
Si tratta quindi di una fase preferenziale per completare l’inizializzazione dell’attore. Ad esempio, la modifica dei valori delle proprietà tramite script. Infatti, non esiste il rischio di perdere prestazioni a causa dell’esecuzione dei collegamenti e delle loro possibili implicazioni, in quanto non sono ancora operativi.

Questo è anche il momento migliore per definire la logica operativa da collegare all’attore o alla scena/composito.

Per contro, non è il momento giusto per cercare di accedere ad altri attori, poiché questi non sono ancora stati tutti creati.

Non è nemmeno il momento di agire sull’elemento DOM corrispondente all’attore: non è ancora stato creato!

Post-inizializzazione

Una volta inizializzato l’intero albero, il Runtime eseguirà la fase di post-inizializzazione, questa volta risalendo l’albero.

In questa fase, l’attore inserisce l’elemento DOM nel flusso HTML, crea i suoi collegamenti, determina le fonti di questi collegamenti e li esegue.

Viene quindi generato un evento: onPostInit.

✔️ CONSIGLIO
Questo è il momento giusto per agire nell’elemento DOM. Ma attenzione, lo stile CSS dell’attore non è ancora definito, né lo sono le sue classi CSS. Non è il momento di agire su questi elementi.

Tutti gli attori sono presenti e disponibili, ma alcuni non sono ancora post-inizializzati.

Primo rendering

Dopo che l’attore principale è stato post-inizializzato, il Runtime eseguirà la prima fase di rendering.

Questa operazione consiste nello ripercorrere la struttura ad albero degli attori, verso il basso

Sono previste diverse azioni:

Ogni attore ha un elemento DOM corrispondente nel flusso HTML. Le classi CSS sono definite in base al tipo di attore e allo stile dell’attore che utilizza. Una classe unica è definita anche in base alla chiave e alla posizione dell’attore. È molto utile per identificare l’attore nel DOM. Infine, vengono aggiunte le classi definite nella proprietà Classe dell’attore.

Lo stile CSS dell’elemento viene compilato grazie alle proprietà dell’attore e allo Stile dell’attore che utilizza. È in questa fase che lo stile CSS viene costruito e inserito nell’elemento DOM..

Viene generato l’evento onCssStyling.

✔️ CONSIGLIO
Questo è il momento di modificare lo stile CSS dell’elemento DOM o di aggiungervi classi CSS tramite script.

Successivamente, viene eseguito un primo calcolo della sagoma sull’attore. Alcuni attori necessitano di questo passaggio per essere visualizzati correttamente, come ad esempio la Box di visualizzazione.

Infine, viene generato l’evento onRender. Nel contesto dell’evento, il campo isFirstRender è vero. Questo perché l’evento viene attivato ogni volta che l’attore passa attraverso la fase di rendering, quindi è interessante sapere se si tratta del primo rendering o meno.

✔️ CONSIGLIO
Questo evento è il momento giusto per agire sull’elemento DOM o al suo interno.

RIASSUNTO

Aggiunta dinamica di un attore

Quando un attore viene aggiunto dopo la visualizzazione di una scena o di un composito, tutto si svolge come se fosse un attore principale. Il rendering di questo attore e dei suoi figli passa attraverso le stesse fasi:

• Inizializzazione
• Post-inizializzazione
• Primo rendering

Una volta che l’attore è stato visualizzato, la struttura ad albero subirà una successione di cambiamenti di dimensioni. Quindi ci si aspetta che l’evento onComputeLayout venga eseguito su gran parte dell’ascendenza dell’attore aggiunto.

✔️ CONSIGLIO
A causa di questo fenomeno di ricalcolo delle taglie dovuto all’inserimento di un attore in modo dinamico, nel caso di aggiunte multiple, è necessario tenere conto di questo tempo e ridurlo al minimo (aggiunta in un canvas, dimensioni fisse del contenitore, ritardo tra ogni aggiunta, aggiunta di attori in una volta sola).

Eliminazione di un attore

Quando un attore viene cancellato, ad esempio quando si cambia una scena, i collegamenti vengono rimossi e anche l’elemento DOM viene rimosso dal flusso HTML. L’evento onDestroy viene generato.

✔️ CONSEIL
Questo è un buon momento per rimuovere gli eventi sull’elemento DOM che sono stati aggiunti manualmente.

È importante notare che l’eliminazione di un albero di attori viene eseguita dal basso verso l’alto.

Variazione del valore della proprietà di un attore

Quando il valore della proprietà di un attore cambia o viene aggiunto, vengono attivati due eventi:

• onValueChanged che viene attivato per una determinata proprietà dell’attore. Il nuovo newValue e il vecchio oldValue sono presenti nel contesto dell’evento.
• L’evento onPropertyChanged viene attivato per qualsiasi proprietà o componente aggiuntivo dell’attore. Oltre ai valori vecchi e nuovi, i campi name e propertyPath sono presenti nel contesto per identificare la proprietà o il complemento che è cambiato.

Prima che questi due eventi vengano generati, una variazione di valore può innescare quello che viene definito una modifica. Sono possibili 4 modifiche:

• Nessuna modifica: in questo caso non succede nulla. Questa è la modifica predefinita per i componenti aggiuntivi.
• Stile CSS: in questo caso, lo stile CSS dell’elemento DOM viene ricalcolato. L’evento onCssStyling viene nuovamente attivato.
• Rendering: in questo caso, viene eseguito un nuovo rendering globale. Gli eventi onCssStyling, onComputeLayout e onRender vengono generati.
• Gabarit : in quest’ultimo caso, viene ricalcolata l’intera sagoma della struttura di attori. Questo causerà l’esecuzione di una serie di eventi onComputeLayout.

Le proprietà specifiche di un attore prevedono ciascuna un proprio tipo di modifica. Spetta a voi definire la modifica che comporta la variazione di valore di una proprietà aggiuntiva.

Transformations de liaison

È possibile intervenire sul valore che verrà scritto nella proprietà target di un collegameto. L’evento onReadTransform viene generato quando il valore sorgente di un vincolo è letto perché è cambiato o la sorgente è cambiata. Questo valore viene passato nel campo value del contesto dell’evento e, per impostazione predefinita, viene restituito direttamente dall’evento. È possibile trasformare questo valore per scrivere qualcos’altro nella proprietà di destinazione.

✔️ CONSIGLIO
Molto utile, ad esempio, per cambiare il tipo di valore: da un valore booleano a un colore.

Allo stesso modo, se la scrittura è abilitata sul collegamento, una modifica del valore di destinazione attiverà la scrittura sul valore di origine. L’evento onWriteTransform iene generato e consente di intervenire sul valore trasmesso.

⚠️ ATTENZIONE
Se si esegue una trasformazione in lettura su un collegamento abilitato alla scrittura, assicurarsi di eseguire la trasformazione inversa. In caso contrario, l’interfaccia si troverebbe in un ciclo infinito in cui la scrittura annulla ciò che la lettura ha fatto.

---

---