Far "pulsare" un'immagine... o qualche altro elemento!

Per far "pulsare" qualche elemento nella propria app sono necessari 3 elementi:
  • l'oggetto da far "pulsare" (ad esempio, un ImageView)
  • l'XML con la configurazione dell'animazione
  • il codice per gestire l'animazione

Oggetto da far "pulsare"

L'oggetto da far pulsare può essere un semplice ImageView, come questo:

1
2
3
4
5
6
<ImageView
    android:id="@+id/ivIconOk"
    android:layout_width="match_parent"
    android:layout_height="80dp"
    app:srcCompat="@drawable/ic_result_ok"
    />

Animare utilizzando un XML

L'XML per l'animazione è il seguente:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale xmlns:android="http://schemas.android.com/apk/res/android"
           android:duration="120"
           android:fromXScale="1"
           android:fromYScale="1"
           android:pivotX="50%"
           android:pivotY="50%"
           android:repeatCount="3"
           android:repeatMode="reverse"
           android:toXScale="0.8"
           android:toYScale="0.8"
           android:interpolator="@android:anim/bounce_interpolator"
        />
</set>

Quest'animazione fa pulsare 3 volte l'oggetto (riduce dal 100% al 50% di dimensione, fissando il punto centrale) e poi si ferma.

Alcune annotazioni

Per "pulsazione" si intende riduzione o ingrandimento. Impostarlo a 3 volte vuol dire che, partendo dalla dimensione minore, si ingrandirà, si rimpicciolirà e poi si reingrandirà di nuovo.
Il repeatMode "reverse" indica che, concluso un ciclo, riprende dalla forma corrente (ingrandimento-riduzione-ingrandimento-riduzione...)

Codice Java

Questo invece è il codice per attivare la "pulsazione":

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
final ImageView iv = (ImageView) findViewById(R.id.ivIcon);
Animation pulse = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.pulse);

pulse.setAnimationListener(new Animation.AnimationListener()
{
    @Override
    public void onAnimationStart(Animation animation)
    {
        // avvio della pulsazione
    }

    @Override
    public void onAnimationEnd(Animation animation)
    {
        // conclusione dell'animazione
    }

    @Override
    public void onAnimationRepeat(Animation animation)
    {
        // ad ogni ripetizione dell'animazione
    }
});

iv.startAnimation(pulse);

Nessun commento:

Generare un colore randomico di tonalità "pastello"

Questo script restituisce il codice di un colore generato a caso nelle tonalità pastello. La generazione viene definita attraverso le 3 ca...