Introduzione alle animazioni

Prova il modo di comporre
Jetpack Compose è il toolkit per la UI consigliato per Android. Scopri come utilizzare le animazioni in Compose.

Le animazioni possono aggiungere segnali visivi che informano gli utenti su cosa sta succedendo nella tua app. Sono particolarmente utili quando lo stato della UI cambia, ad esempio quando vengono caricati nuovi contenuti o quando diventano disponibili nuove azioni. Inoltre, le animazioni conferiscono un aspetto rifinito alla tua app, che la rende più professionale.

Android include diverse API di animazione a seconda del tipo di animazione che vuoi. Questa documentazione fornisce una panoramica dei diversi modi in cui puoi aggiungere movimento alla tua UI.

Per capire meglio quando utilizzare le animazioni, consulta anche la guida al motion design di Material.

Animare le bitmap

Figura 1. Una risorsa drawable animata.

Per animare una grafica bitmap come un'icona o un'illustrazione, utilizza le API di animazione disegnabili. In genere, queste animazioni vengono definite in modo statico con una risorsa disegnabile, ma puoi anche definire il comportamento dell'animazione in fase di runtime.

Ad esempio, un buon modo per comunicare all'utente che due azioni sono correlate è animare un pulsante di riproduzione che si trasforma in un pulsante di pausa quando viene toccato.

Per ulteriori informazioni, leggi Animare la grafica disegnabile.

Animare la visibilità e il movimento della UI

Figura 2. Una leggera animazione quando una finestra di dialogo viene visualizzata e scompare rende meno brusco il cambiamento della UI.

Quando devi modificare la visibilità o la posizione delle visualizzazioni nel layout, è consigliabile includere animazioni sottili per aiutare l'utente a capire come sta cambiando l'interfaccia utente.

Per spostare, mostrare o nascondere le visualizzazioni all'interno del layout corrente, puoi utilizzare il sistema di animazione delle proprietà fornito dal pacchetto android.animation, disponibile in Android 3.0 (livello API 11) e versioni successive. Queste API aggiornano le proprietà degli oggetti View in un determinato periodo di tempo, ridisegnando continuamente la visualizzazione man mano che le proprietà cambiano. Ad esempio, quando modifichi le proprietà di posizione, la visualizzazione si sposta sullo schermo. Quando modifichi la proprietà alpha, la visualizzazione viene visualizzata o scompare gradualmente.

Per creare queste animazioni nel modo più semplice, attiva le animazioni nel layout in modo che quando modifichi la visibilità di una visualizzazione, venga applicata automaticamente un'animazione. Per saperne di più, vedi Aggiornamenti del layout con animazione automatica.

Per scoprire come creare animazioni utilizzando il sistema di animazione delle proprietà, leggi la Panoramica dell'animazione delle proprietà. Puoi anche consultare le seguenti pagine per creare animazioni comuni:

Movimento basato sulla fisica

Figura 3. Animazione creata con ObjectAnimator.

Figura 4. Animazione creata con API basate sulla fisica.

Quando possibile, applica la fisica del mondo reale alle animazioni in modo che sembrino naturali. Ad esempio, devono mantenere lo slancio quando il target cambia e fare transizioni fluide durante le modifiche.

Per fornire questi comportamenti, la libreria di supporto Android include API di animazione basate sulla fisica che si basano sulle leggi della fisica per controllare il modo in cui si verificano le animazioni.

Di seguito sono riportate due animazioni comuni basate sulla fisica:

Le animazioni non basate sulla fisica, come quelle create con le API ObjectAnimator, sono piuttosto statiche e hanno una durata fissa. Se il valore target cambia, devi annullare l'animazione al momento della modifica del valore target, riconfigurarla con un nuovo valore come nuovo valore iniziale e aggiungere il nuovo valore target. Visivamente, questo processo crea un arresto improvviso nell'animazione e un movimento sconnesso in seguito, come mostrato nella figura 3.

Le animazioni create con API di animazione basate sulla fisica, come DynamicAnimation, sono guidate dalla forza. La variazione del valore target comporta una variazione della forza. La nuova forza viene applicata alla velocità esistente, il che consente una transizione continua al nuovo target. Questo processo produce un'animazione dall'aspetto più naturale, come mostrato nella figura 4.

Animare le modifiche al layout

Figura 5. Un'animazione per mostrare maggiori dettagli può essere ottenuta modificando il layout o avviando una nuova attività.

Su Android 4.4 (livello API 19) e versioni successive, puoi utilizzare il framework di transizione per creare animazioni quando scambi il layout all'interno dell'attività o del fragment corrente. Devi solo specificare il layout iniziale e finale e il tipo di animazione che vuoi utilizzare. Il sistema calcola ed esegue un'animazione tra i due layout. Puoi utilizzarlo per sostituire l'intera UI o per spostare o sostituire solo alcune visualizzazioni.

Ad esempio, quando l'utente tocca un elemento per visualizzare ulteriori informazioni, puoi sostituire il layout con i dettagli dell'elemento, applicando una transizione come quella mostrata nella figura 5.

Il layout iniziale e finale sono memorizzati in un Scene, anche se la scena iniziale viene di solito determinata automaticamente dal layout corrente. Crea un Transition per indicare al sistema il tipo di animazione che vuoi, poi chiama TransitionManager.go() e il sistema esegue l'animazione per scambiare i layout.

Per ulteriori informazioni, leggi Animare le modifiche al layout utilizzando una transizione. Per un esempio di codice, consulta BasicTransition .

Animare il passaggio tra le attività

Su Android 5.0 (livello API 21) e versioni successive, puoi anche creare animazioni che eseguono la transizione tra le attività. Si basa sullo stesso framework di transizione descritto nella sezione precedente, ma ti consente di creare animazioni tra layout in attività separate.

Puoi applicare animazioni semplici, ad esempio far scorrere la nuova attività dal lato o farla apparire gradualmente, ma puoi anche creare animazioni che eseguono la transizione tra le visualizzazioni condivise in ogni attività. Ad esempio, quando l'utente tocca un elemento per visualizzare ulteriori informazioni, puoi passare a una nuova attività con un'animazione che ingrandisce l'elemento in modo fluido fino a riempire lo schermo, come l'animazione mostrata nella figura 5.

Come di consueto, chiami startActivity(), ma gli passi un pacchetto di opzioni fornite da ActivityOptions.makeSceneTransitionAnimation(). Questo pacchetto di opzioni potrebbe includere le visualizzazioni condivise tra le attività, in modo che il framework di transizione possa collegarle durante l'animazione.

Per altre risorse, consulta: