In alcune situazioni, è necessario animare le immagini. Ciò è utile se vuoi visualizzare un'animazione di caricamento personalizzata composta da più immagini o se vuoi che un'icona si trasformi dopo l'azione di un utente. Android offre due opzioni per l'animazione dei disegni.
La prima è utilizzare una AnimationDrawable. In questo modo puoi specificare diversi file disegnabili statici visualizzati uno alla volta per creare un'animazione. La seconda opzione prevede l'utilizzo di un elemento AnimatedVectorDrawable, che consente di animare le proprietà di un elemento disegnabile vettoriale.
Usa AnimationDrawable
Un modo per creare un'animazione consiste nel caricare una sequenza di risorse disegnabili, come un rotolo di pellicola.
La classe AnimationDrawable
è la base per questi tipi di animazioni disabili.
Puoi definire i frame di un'animazione nel codice utilizzando l'API della classe AnimationDrawable, ma è più facile definirli con un singolo file XML che elenca i frame che compongono l'animazione. Il file XML per questo tipo di animazione appartiene alla directory res/drawable/ del tuo progetto Android. In questo caso, le istruzioni forniscono l'ordine e la durata di ogni frame dell'animazione.
Il file XML è composto da un elemento <animation-list> come nodo principale e da una
serie di nodi figlio <item>, ognuno dei quali definisce un frame, una risorsa disegnabile
e la sua durata. Di seguito è riportato un file XML di esempio per un'animazione Drawable:
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="true">
<item android:drawable="@drawable/rocket_thrust1" android:duration="200" />
<item android:drawable="@drawable/rocket_thrust2" android:duration="200" />
<item android:drawable="@drawable/rocket_thrust3" android:duration="200" />
</animation-list>
Questa animazione viene eseguita per tre frame. Se l'attributo android:oneshot
dell'elenco viene impostato su true, il ciclo si ripete una volta e poi si arresta e tenga premuto sull'ultimo frame. Se imposti android:oneshot su false,
l'animazione si ripete.
Se salvi questo XML come rocket_thrust.xml nella directory res/drawable/
del progetto, puoi aggiungerlo come immagine di sfondo a un file View e quindi
chiamare start() per riprodurre il file. Di seguito è riportato un esempio di attività in cui l'animazione viene aggiunta a ImageView e poi animata quando viene toccato lo schermo:
Kotlin
private lateinit var rocketAnimation: AnimationDrawable
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.main)
val rocketImage = findViewById<ImageView>(R.id.rocket_image).apply {
setBackgroundResource(R.drawable.rocket_thrust)
rocketAnimation = background as AnimationDrawable
}
rocketImage.setOnClickListener({ rocketAnimation.start() })
}
Java
AnimationDrawable rocketAnimation;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);
rocketImage.setBackgroundResource(R.drawable.rocket_thrust);
rocketAnimation = (AnimationDrawable) rocketImage.getBackground();
rocketImage.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
rocketAnimation.start();
}
});
}
È importante notare che il metodo start() richiamato su AnimationDrawable non può essere chiamato durante il metodo onCreate() di Activity, perché il AnimationDrawable non è ancora completamente collegato alla finestra. Per riprodurre immediatamente l'animazione, senza richiedere interazione, puoi chiamarla dal metodo
onStart()Activity, che viene chiamato quando Android rende la visualizzazione visibile sullo schermo.
Per ulteriori informazioni sulla sintassi XML, sui tag e sugli attributi disponibili, consulta la sezione Risorse di animazione.
Usa AnimatedVectorDrawable
Un Drawable vettoriale è un tipo di drawable scalabile senza che venga pixelato o sfocato. La classe AnimatedVectorDrawable e
AnimatedVectorDrawableCompat per la compatibilità con le versioni precedenti consentono di animare le proprietà di un drawable vettoriale, ad esempio la rotazione o la modifica dei dati del percorso per trasformarli in un'immagine diversa.
Di solito definisci drawable vettoriali animati in tre file XML:
- Un elemento disegnabile vettoriale con l'elemento
<vector>inres/drawable/. - Un drawable vettoriale animato con l'elemento
<animated-vector>inres/drawable/. - Uno o più animatori di oggetti con l'elemento
<objectAnimator>inres/animator/.
I drawable vettoriali animati possono animare gli attributi degli elementi <group> e
<path>. L'elemento <group> definisce un insieme di
percorsi o sottogruppi, mentre l'elemento <path> definisce i percorsi da tracciare.
Quando definisci un elemento disegnabile vettoriale che vuoi animare, utilizza l'attributo android:name
per assegnare un nome univoco a gruppi e percorsi, in modo da potervi fare riferimento nelle definizioni
dell'animatore. Ecco alcuni esempi:
res/drawable/vectordrawable.xml
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="64dp"
android:width="64dp"
android:viewportHeight="600"
android:viewportWidth="600">
<group
android:name="rotationGroup"
android:pivotX="300.0"
android:pivotY="300.0"
android:rotation="45.0" >
<path
android:name="v"
android:fillColor="#000000"
android:pathData="M300,70 l 0,-70 70,70 0,0 -70,70z" />
</group>
</vector>
La definizione di drawable vettoriale animato si riferisce ai gruppi e ai percorsi nel vettore disegnabile con i loro nomi:
res/drawable/animatorvectordrawable.xml
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/vectordrawable" >
<target
android:name="rotationGroup"
android:animation="@animator/rotation" />
<target
android:name="v"
android:animation="@animator/path_morph" />
</animated-vector>
Le definizioni dell'animazione rappresentano gli oggetti
ObjectAnimator o
AnimatorSet. Il primo animatore in questo esempio ruota il gruppo di destinazione di 360 gradi:
res/animator/rotation.xml
<objectAnimator
android:duration="6000"
android:propertyName="rotation"
android:valueFrom="0"
android:valueTo="360" />
Il secondo animatore in questo esempio modifica il percorso del vettore disegnabile da una forma all'altra. I percorsi devono essere compatibili per il morphing: devono avere lo stesso numero di comandi e lo stesso numero di parametri per ogni comando.
res/animator/path_morph.xml
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:duration="3000"
android:propertyName="pathData"
android:valueFrom="M300,70 l 0,-70 70,70 0,0 -70,70z"
android:valueTo="M300,70 l 0,-70 70,0 0,140 -70,0 z"
android:valueType="pathType" />
</set>
Ecco il risultato di AnimatedVectorDrawable:
AnimatedVectorDrawable.Anteprima animata della creatività vettoriale (AVD)
Lo strumento Drawable vettoriale animato in Android Studio ti consente di visualizzare in anteprima le risorse disegnabili animate. Questo strumento ti aiuta a visualizzare l'anteprima delle risorse <animation-list>,
<animated-vector> e <animated-selector> in
Android Studio e semplifica il perfezionamento delle animazioni personalizzate.
Per ulteriori informazioni, consulta la documentazione di riferimento delle API per
AnimatedVectorDrawable.