Attention: Here be dragons

This is the latest (unstable) version of this documentation, which may document features not available in or compatible with released stable versions of Godot.

Checking the stable version of the documentation...

Introduzione alle funzionalità d'animazione

Il nodo AnimationPlayer consente di creare animazioni di ogni tipo, dalle più semplici alle più complesse.

In questa guida imparerai a:

Lavorare con il pannello Animazione
Animare qualsiasi proprietà di qualsiasi nodo
Creare una semplice animazione

In Godot, è possibile animare qualsiasi cosa disponibile nell'Ispettore, come trasformazioni dei nodi, sprite, elementi dell'interfaccia utente, particelle, visibilità e colore dei materiali e così via. Si possono anche modificare i valori delle variabili di script e persino richiamare funzioni.

Creare un nodo AnimationPlayer

Per utilizzare gli strumenti di animazione dobbiamo prima creare un nodo AnimationPlayer.

Il tipo di nodo AnimationPlayer è il contenitore di dati per le animazioni. Un nodo AnimationPlayer può contenere più animazioni, che possono passare automaticamente tra l'una all'altra.

Dopo aver creato un nodo AnimationPlayer, cliccaci sopra per aprire il pannello Animazione nella parte inferiore della viewport.

La posizione del pannello di animazione

Il pannello di animazione è composto da quattro parti:

I controlli di animazione (ovvero, aggiungi, carica, salva ed elimina animazioni)
La lista delle tracce
La timeline con i fotogrammi chiave
I controlli della timeline e delle tracce, dove puoi ad esempio ingrandire la timeline e modificare le tracce.

Le animazioni per i computer si basano sui fotogrammi chiave

Un fotogramma chiave definisce il valore di una proprietà in un determinato momento.

I rombi rappresentano i fotogrammi chiave nella timeline. Una linea tra due fotogrammi chiave indica che il valore non cambia tra di essi.

Imposti i valori delle proprietà di un nodo e crei fotogrammi chiave per l'animazione. Quando l'animazione viene eseguita, il motore interpola i valori tra i fotogrammi chiave, cambiandoli gradualmente nel tempo.

Bastano due fotogrammi chiave per ottenere un movimento fluido

La timeline definisce la durata dell'animazione. È possibile inserire fotogrammi chiave in vari punti e modificarne i tempi.

Ogni linea nel pannello Animazione è una traccia di animazione che fa riferimento a una proprietà Normale o Trasformazione di un nodo. Ogni traccia memorizza un percorso a un nodo e la sua proprietà influenzata. Ad esempio, la traccia di posizione nell'illustrazione fa riferimento alla proprietà position del nodo Sprite2D.

Esempio di tracce di animazione di tipo Normale

Suggerimento

Se animi la proprietà sbagliata, è possibile modificare il percorso di una traccia in qualsiasi momento facendo doppio clic su di essa e digitando il nuovo percorso. Riproduci l'animazione premendo il pulsante "Riproduci dall'inizio" (o premendo Shift + D sulla tastiera) per vedere immediatamente le modifiche.

Tutorial: creare una semplice animazione

Impostazione della scena

In questo tutorial, creeremo un nodo Sprite con un AnimationPlayer come figlio. Animeremo lo sprite per farlo muovere tra due punti sullo schermo.

Avvertimento

AnimationPlayer eredita da Node anziché da Node2D o Node3D, il che significa che i nodi figlio non erediteranno la trasformazione dai nodi genitore a causa di un semplice Node presente nella gerarchia.

Pertanto, si sconsiglia di aggiungere nodi che hanno una trasformazione 2D/3D come nodi figlio di un nodo AnimationPlayer.

Lo sprite contiene una texture immagine. Per questo tutorial, seleziona il nodo Sprite2D, clicca su Texture nell'Ispettore e poi su Carica. Seleziona l'icona predefinita di Godot per la texture dello sprite.

Aggiungere un'animazione

Seleziona il nodo AnimationPlayer e clicca sul pulsante "Animazione" nell'editor di animazioni. Dall'elenco, seleziona "Nuovo" ( Aggiungi animazione ) per aggiungere una nuova animazione. Inserisci un nome per l'animazione nella casella di dialogo.

Gestire le librerie di animazione

Per riutilizzabilità, l'animazione è registrata in un elenco nella risorsa di libreria di animazioni. Se si aggiunge un'animazione all'AnimationPlayer senza specificare impostazioni particolari, l'animazione sarà registrata nella libreria di animazioni predefinita [Global] presente in AnimationPlayer.

Se ci sono più librerie di animazioni e si tenta di aggiungere un'animazione, sarà visualizzata una casella di dialogo per sceglierne una.

Aggiungi una nuova animazione con l'opzione della libreria

Aggiungere una traccia

Per aggiungere una nuova traccia al nostro sprite, selezionalo e dai un'occhiata alla barra degli strumenti:

Questi interruttori e pulsanti consentono di aggiungere fotogrammi chiave per la posizione, la rotazione e la scala del nodo selezionato. Poiché stiamo animando solo la posizione dello sprite, assicurati che sia selezionato solo l'interruttore di posizione. Gli interruttori selezionati sono blu.

Clicca sul pulsante chiave per creare il primo fotogramma chiave. Dato che non abbiamo ancora impostato una traccia per la proprietà "Position", Godot si offrirà di crearla per noi. Clicca su Crea.

Godot creerà una nuova traccia e inserirà il nostro primo fotogramma chiave all'inizio della timeline:

Il secondo fotogramma chiave

Dobbiamo impostare la posizione finale del nostro sprite e quanto tempo ci vorrà per arrivarci.

Supponiamo di voler impiegare due secondi per muoverlo tra i punti. Normalmente, l'animazione è impostata per durare solo un secondo, quindi cambia la durata dell'animazione a 2 nei controlli sul lato destro dell'intestazione della timeline nel pannello di animazione.

Ora sposta lo sprite verso destra, nella sua posizione finale. Puoi usare lo Strumento Sposta nella barra degli strumenti o impostare il valore X della Position nell'Ispettore.

Clicca sull'intestazione della timeline vicino al segno dei due secondi nel pannello di animazione, quindi clicca sul pulsante chiave nella barra degli strumenti per creare il secondo fotogramma chiave.

Riproduci l'animazione

Clicca sul pulsante "Riproduci dall'inizio" ().

Evviva! La nostra animazione funziona:

Riproduci automaticamente al caricamento

È possibile fare in modo che un'animazione si riproduca automaticamente all'avvio della scena del nodo AnimationPlayer o all'unione di un'altra scena. Per farlo, clicca sul pulsante "Riproduci automaticamente al caricamento" nell'editor di animazione, proprio accanto al pulsante di modifica.

L'icona corrispondente apparirà anche davanti al nome dell'animazione, così potrai identificare facilmente quale sia l'animazione da riprodurre automaticamente.

Avanti e indietro

Godot ha una funzionalità interessante che possiamo usare nelle animazioni. Quando è impostato un ciclo di animazione ma non è specificato alcun fotogramma chiave alla fine dell'animazione, il primo fotogramma chiave è anche l'ultimo.

Ciò significa che ora possiamo estendere la durata dell'animazione a quattro secondi e Godot calcolerà anche i fotogrammi dall'ultimo fotogramma chiave al primo, muovendo il nostro sprite avanti e indietro.

È possibile cambiare questo comportamento cambiando la modalità di ripetizione della traccia. Ciò verrà trattato nel prossimo capitolo.

Impostazioni di traccia

Ogni traccia di proprietà ha un pannello di impostazioni alla fine, dove è possibile impostare la modalità di aggiornamento, l'interpolazione della traccia e la modalità di ripetizione.

La modalità di aggiornamento di una traccia indica a Godot quando aggiornare i valori delle proprietà. Questo può essere:

Continuo: aggiorna la proprietà a ogni frame
Discreto: aggiorna la proprietà solo sui fotogrammi chiave
Cattura: se il tempo del primo fotogramma chiave è maggiore di 0.0, il valore attuale della proprietà sarà memorizzato e unito alla prima chiave di animazione. Ad esempio, è possibile utilizzare la modalità Cattura per muovere un nodo da un punto qualsiasi a una posizione specifica.

Solitamente si usa la modalità "Continua". Gli altri tipi sono utilizzati per preparare animazioni complesse.

L'interpolazione di traccia indica a Godot come calcolare i valori dei fotogrammi tra i fotogrammi chiave. Sono supportate le seguenti modalità di interpolazione:

Più vicino: imposta il valore basandosi sul fotogramma chiave più vicino
Lineare: imposta il valore basandosi su un calcolo di funzione lineare tra i due fotogrammi chiave
Cubica: imposta il valore basandosi su un calcolo di funzione cubica tra i due fotogrammi chiave
Angolo lineare (appare solo nella proprietà di rotazione): Modalità lineare con rotazione del percorso più breve
Angolo cubica (appare solo nella proprietà di rotazione): Modalità cubica con rotazione del percorso più breve

Con l'interpolazione cubica, l'animazione è più lenta nei fotogrammi chiave e più veloce tra di essi, il che produce movimenti più naturali. L'interpolazione cubica è comunemente utilizzata per animare personaggi. L'interpolazione lineare anima i cambiamenti a una frequenza fissa, producendo un effetto più robotico.

Godot supporta due modalità di ripetizione, che influenzano l'animazione quando è impostata per ripetersi:

Clamp loop interpolation: quando questa è selezionata, l'animazione si interrompe dopo l'ultimo fotogramma chiave per questa traccia. Quando il primo fotogramma chiave viene raggiunto nuovamente, l'animazione verrà ripristinata ai suoi valori.
Wrap loop interpolation: quando questa è selezionata, Godot calcola l'animazione dopo l'ultimo fotogramma chiave per raggiungere nuovamente i valori del primo fotogramma chiave.

I fotogrammi chiave per le altre proprietà

Il sistema di animazione di Godot non si limita a posizione, rotazione e scala. È possibile animare qualsiasi proprietà.

Se selezioni lo sprite mentre il pannello di animazione è visibile, Godot visualizzerà un piccolo pulsante chiave nell'Ispettore per ciascuna delle proprietà dello sprite. Clicca su uno di questi pulsanti per aggiungere una traccia e un fotogramma chiave all'animazione attuale.

I fotogrammi chiave per le altre proprietà

Modifica di fotogrammi chiave

È possibile cliccare su un fotogramma chiave nella timeline dell'animazione per visualizzarne e modificarne il valore nell'Ispettore.

Editor di fotogrammi chiave modificando una chiave

È anche possibile modificare il valore di easing per un fotogramma chiave cliccando e trascinando la sua curva di easing. Questo indica a Godot come interpolare la proprietà animata quando raggiunge questo fotogramma chiave.

Puoi modificare le tue animazioni così finché il movimento "non vada bene".

Utilizzo di tracce RESET

È possibile configurare un'animazione speciale di RESET per contenere la "posa predefinita". Ciò serve a garantire che la posa predefinita sia ripristinata quando si salva la scena e la si riapre nell'editor.

Per le tracce esistenti, si può aggiungere un'animazione chiamata "RESET" (con distinzione tra maiuscole e minuscole), quindi aggiungere tracce per ogni proprietà che si desidera ripristinare. L'unico fotogramma chiave dovrebbe essere al tempo 0 e avere il valore predefinito desiderato per ogni traccia.

Se la proprietà Reset On Save di AnimationPlayer è impostata su true, la scena sarà salvata con gli effetti dell'animazione reset applicati (come se fosse stata ricercata al tempo 0.0). Ciò influisce solo sul file salvato: le tracce delle proprietà nell'editor rimangono dove erano.

Se vuoi ripristinare le tracce nell'editor, seleziona il nodo AnimationPlayer, apri il pannello inferiore Animazione, quindi scegli Applica reset nel menu a discesa Modifica dell'editor di animazione.

Quando si preme l'icona del fotogramma chiave accanto a una proprietà nell'ispettore, l'editor chiederà di creare automaticamente una traccia RESET.

Nota

Le tracce RESET servono anche come valori di riferimento per le fusioni. Consulta anche For better blending.

Onion skinning

L'editor di animazioni di Godot consente di utilizzare l'onion skinning durante la creazione di un'animazione. Per attivare questa funzionalità, clicca sull'icona a forma di cipolla in alto a destra dell'editor di animazioni. Ora ci saranno copie rosse trasparenti di ciò che è animato nelle sue posizioni precedenti nell'animazione.

Il pulsante con i tre punti accanto al pulsante dell'onion skinning apre un menu a discesa che consente di regolare come funziona, inclusa la possibilità di usare l'onion skinning per i fotogrammi futuri.

Marcatori di animazione

I marcatori di animazione servono per riprodurre una parte specifica di un'animazione anziché l'intera sequenza. Ecco un esempio di caso d'uso: c'è un file di animazione in cui un personaggio effettua due azioni distinte e il progetto richiede l'intera animazione, oltre a entrambe le azioni singolarmente. Invece di creare due animazioni in più, è possibile posizionare marcatori sulla timeline e ora entrambe le azioni si possono riprodurre singolarmente.

Per aggiungere un marcatore a un'animazione, fai clic destro sullo spazio sopra la timeline e seleziona Inserisci marcatore....

../../_images/animation_marker_click_area.webp

Tutti i marcatori richiedono un nome univoco all'interno dell'animazione. È anche possibile impostare il colore dei marcatori per una migliore organizzazione.

Per riprodurre la parte dell'animazione tra due marcatori, usa i metodi play_section_with_markers() e play_section_with_markers_backwards(). Se nessun marcatore di inizio viene specificato, viene usato l'inizio dell'animazione, mentre se nessun marcatore di fine viene specificato, viene usata la fine dell'animazione.

Se il marcatore di fine si trova dopo la fine dell'animazione, AnimationPlayer troncherà la fine della sezione in modo da non andare oltre.

Per vedere in anteprima l'animazione tra due marcatori, usa Maiusc + clic per selezionare i marcatori. Quando ne selezioni due, lo spazio tra di essi dovrebbe essere evidenziato in rosso.

../../_images/animation_marker_selected.webp

Ora tutti i pulsanti di riproduzione dell'animazione funzioneranno come se l'area selezionata fosse l'intera animazione. Riproduci animazione dall'inizio tratterà il primo marcatore come l'inizio dell'animazione, Riproduci animazione all'indietro dalla fine tratterà il secondo marcatore come la fine, e così via.