Introduzione alle animazioni

Prova il metodo Scrivi
Jetpack Compose è il toolkit consigliato per la UI per Android. Scopri come utilizzare le animazioni in Compose.

Le animazioni possono aggiungere segnali visivi che informano gli utenti di ciò che accade nella tua app. Sono particolarmente utili quando l'interfaccia utente cambia stato, ad esempio quando vengono caricati nuovi contenuti o diventano disponibili nuove azioni. Le animazioni aggiungono un look raffinato alla tua app, migliorandone la qualità.

Android include diverse API di animazione a seconda del tipo di animazione desiderato. Questa documentazione fornisce una panoramica dei diversi modi per aggiungere movimento alla UI.

Per capire meglio quando utilizzare le animazioni, consulta anche la guida di Material Design per il movimento.

Anima bitmap

Figura 1. Un elemento drawable animato.

Per animare una grafica bitmap, ad esempio un'icona o un'illustrazione, utilizza le API di animazione disegnabili. Di solito, queste animazioni sono definite in modo statico con una risorsa drawable, ma puoi anche definire il comportamento dell'animazione in fase di esecuzione.

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 maggiori informazioni, leggi l'articolo Animazione grafica disegnabile.

Animazione della visibilità e del movimento dell'interfaccia utente

Figura 2. Una sottile animazione che appare quando appare e scompare una finestra di dialogo rende la modifica dell'interfaccia utente meno fastidiosa.

Quando devi modificare la visibilità o la posizione delle visualizzazioni nel layout, ti consigliamo di includere piccole animazioni per aiutare l'utente a comprendere come sta cambiando la UI.

Per spostare, mostrare o nascondere le viste all'interno del layout corrente, puoi utilizzare il sistema di animazione delle proprietà fornito dal pacchetto android.animation, disponibile su 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 vista man mano che le proprietà cambiano. Ad esempio, se modifichi le proprietà di posizione, la visualizzazione si sposta sullo schermo. Quando modifichi la proprietà alpha, la vista va in dissolvenza in entrata o in uscita.

Il modo più semplice per creare queste animazioni è attivare le animazioni nel tuo layout in modo che, quando modifichi la visibilità di una visualizzazione, un'animazione venga applicata automaticamente. Per maggiori informazioni, consulta la sezione Animazione automatica degli aggiornamenti del layout.

Per informazioni su come creare animazioni utilizzando il sistema di animazione delle proprietà, consulta la panoramica dell'animazione della proprietà. Puoi anche visualizzare le pagine seguenti 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 alle animazioni la fisica del mondo reale in modo che abbiano un aspetto naturale. Ad esempio, dovrebbero mantenere lo slancio quando il target cambia e effettuare transizioni fluide durante qualsiasi modifica.

Per fornire questi comportamenti, la libreria dell'Assistenza 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.

Due animazioni comuni basate sulla fisica sono le seguenti:

Le animazioni non basate sulla fisica, ad esempio quelle create con le API di 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, riconfigurare l'animazione con un nuovo valore come nuovo valore iniziale e aggiungere il nuovo valore target. Visivamente, questo processo crea un'interruzione brusca nell'animazione e successivamente un movimento sconnesso, come mostrato nella Figura 3.

Le animazioni create con API di animazione basate sulla fisica, come DynamicAnimation, sono azionate dalla forza. La modifica del valore target determina una variazione in vigore. La nuova forza si applica alla velocità esistente, il che esegue una transizione continua verso il nuovo target. Questo processo produce un'animazione più naturale, come mostrato nella Figura 4.

Anima le modifiche al layout

Figura 5. Puoi creare un'animazione per mostrare ulteriori dettagli modificando il layout o avviando una nuova attività.

In Android 4.4 (livello API 19) e versioni successive, puoi utilizzare il framework di transizione per creare animazioni quando cambi il layout all'interno dell'attività o del frammento correnti. Devi solo specificare il layout iniziale e finale e il tipo di animazione che vuoi utilizzare. Il sistema determina ed esegue un'animazione tra i due layout. Puoi usarlo per sostituire l'intera UI o per spostare o sostituire solo alcune viste.

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

Il layout iniziale e finale vengono archiviati ciascuno in una Scene, sebbene la scena iniziale sia di solito determinata automaticamente dal layout corrente. Puoi creare una Transition per indicare al sistema il tipo di animazione desiderato, quindi chiamare TransitionManager.go() e il sistema esegue l'animazione per scambiare i layout.

Per ulteriori informazioni, consulta Animare le modifiche al layout utilizzando una transizione. Per un esempio di codice, dai un'occhiata a BasicTransaction.

Animazione di un'attività

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

Puoi applicare animazioni semplici come lo scorrimento laterale della nuova attività o la dissolvenza, ma puoi anche creare animazioni che passano da una visualizzazione condivisa all'altra in ogni attività. Ad esempio, quando l'utente tocca un elemento per visualizzare maggiori informazioni, puoi passare a una nuova attività con un'animazione che ingrandisce perfettamente l'elemento fino a riempire lo schermo, come l'animazione mostrata nella Figura 5.

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

Per risorse aggiuntive, consulta: