Italian (Italiano) translation by Stefano Pastore (you can also view the original English article)
Hai mai visto una bella gif animata che viene riprodotta senza intoppi e ti sei chiesto se puoi utilizzarla come sfondo per il tuo dispositivo Android? Ebbene, puoi, in questo tutorial ti mostrerò come fare.
Introduzione
Creare uno sfondo animato bello ed interessante a partire da zero, utilizzando solamente matematica e codice per generare la grafica, può essere tedioso e richiedere molto tempo. Necessita anche di molta creatività. D'altra parte, creare una gif animata o trovarne una online è molto più facile. In questo tutorial, imparerai come convertire una gif animata in uno sfondo animato.
Prerequisiti
Assicurati di avere installata l'ultima versione di Android Studio. La puoi ottenere dal sito per gli sviluppatori di Android.
Anche se una qualsiasi gif animata andrà bene per il nostro scopo, ti consiglio di scaricare una buona cinemagraph. Una cinemagraph non è nulla se non una gif animata — generalmente ottenuta a partire da un video — che viene riprodotta all'infinito. Ne puoi trovare di ottime su Flickr.
Per questo tutorial, userò una cinemagraph creata dall'utente Flickr djandyw.com poiché è disponibile sotto licenza Creative Commons.
1. Creare un Nuovo Progetto
Apri Android Studio, crea un nuovo progetto e chiamalo GIFWallpaper. Scegli un nome di pacchetto unico se hai intenzione di pubblicare l'app su Google Play.

Imposta il valore minimo della SKD ad API 8: Android 2.2 (Froyo).

La nostra app non avrà un'Activity
, per cui scegli Add No Activity e clicca su Finish.

2. Descrivi lo Sfondo
Uno sfondo animato necessita di un file che lo descriva. Crea un nuovo file XML chiamato res/xml/wallpaper.xml e rimpiazza il suo contenuto con il codice XML che segue:
<?xml version="1.0" encoding="UTF-8"?> <wallpaper xmlns:android="http://schemas.android.com/apk/res/android" android:label="GIF Wallpaper" android:thumbnail="@drawable/ic_launcher"> </wallpaper>
I valori label e thumbnail sono particolarmente importanti perché saranno utilizzati quando lo sfondo apparirà nella lista di quelli disponibili sul tuo dispositivo.
3. Modifica il file Manifest
Per funzionare come sfondo animato, la nostra app ha bisogno solo di un permesso android.permission.BIND_WALLPAPER
.
Uno sfondo animato funziona come Service
che può ricevere l'azione android.service.wallpaper.WallpaperService
. Nomina il Service
GIFWallpaperService ed aggiungilo ad file manifest del progetto, AndroidManifest.xml.
<service android:name=".GIFWallpaperService" android:enabled="true" android:label="GIF Wallpaper" android:permission="android.permission.BIND_WALLPAPER" > <intent-filter> <action android:name="android.service.wallpaper.WallpaperService"/> </intent-filter> <meta-data android:name="android.service.wallpaper" android:resource="@xml/wallpaper" > </meta-data> </service>
Poi, per assicurarsi che l'app possa essere installata solo su dispositivi che supportano sfondi animati, aggiungi il seguente blocco di codice al file Manifest:
<uses-feature android:name="android.software.live_wallpaper" android:required="true" > </uses-feature>
4. Aggiungere la Gif Animata
Copia la gif animata che hai scaricato da Flickr nella cartella assets del progetto. Io ho chiamato la gif girl.gif.
5. Creare il Service
Crea una nuova classe Java e chiamala GIFWallpaperService.java. La classe dovrebbe estendere la classe WallpaperService
.
public class GIFWallpaperService extends WallpaperService { }
Poiché WallpaperService
è una classe astratta, devi fare l'override del suo metodo onCreateEngine
e restituire un'instanza del tuo Engine
, che farà il render dei frame della gif.
Per usare la gif animata, devi prima convertira in un oggetto Movie
. Per far ciò, puoi usare il metodo decodeStream
della classe Movie
. Una volta che l'oggetto Movie
è stato creato, passalo come parametro al costruttore dell'Engine
creato.
Così è come il metodo onCreateEngine
dovrebbe essere fatto:
@Override public WallpaperService.Engine onCreateEngine() { try { Movie movie = Movie.decodeStream( getResources().getAssets().open("girl.gif")); return new GIFWallpaperEngine(movie); }catch(IOException e){ Log.d("GIF", "Could not load asset"); return null; } }
6. Creare Engine
Cominciamo adesso a lavorare su Engine
. Crea una classe che si chiama GIFWallpaperEngine all'interno della classe GIFWallpaperService
e fa' che estenda WallpaperService.Engine
.
Aggiungi i seguenti campi a questa nuova classe:
-
frameDuration
: questo intero rappresenta il ritardo tra le operazioni di ridisegno. Un valore di 20 ti dà 50 frame al secondo. -
visible
: questo booleano fa sapere ad engine se lo sfondo animato è correntemente visibile sullo schermo. Questo è impostante perché non dovremmo disegnare lo sfondo se esso non è visibile. -
movie
: questa è la gif animata sotto forma di oggettoMovie
. -
holder
: si riferisce all'oggettoSurfaceHolder
disponibile all'engine. Deve essere inizializzato facendo l'override del metodoonCreate
. -
handler
: questo è un oggettoHandler
che sarà utilizzato per far partire unRunnable
, responsabile del disegno dello sfondo.
La tua classe dovrebbe adesso essere simile a questa:
private class GIFWallpaperEngine extends WallpaperService.Engine { private final int frameDuration = 20; private SurfaceHolder holder; private Movie movie; private boolean visible; private Handler handler; public GIFWallpaperEngine(Movie movie) { this.movie = movie; handler = new Handler(); } @Override public void onCreate(SurfaceHolder surfaceHolder) { super.onCreate(surfaceHolder); this.holder = surfaceHolder; } }
Poi, crea un metodo chiamato draw
che disegni i contenuti della gif animata. Scomponiamo questo metodo:
- Prima verifichiamo che la variabile
visibile
abbia valoretrue
. Continuiamo solo se lo è. - Usa il metodo
lockCanvas
diSurfaceHolder
per ottenere unCanvas
su cui disegnare. - Disegna un frame della gif animata sul
Canvas
dopo averlo ridimensionato e posizionato. - Una volta che i disegni sono finiti, ripassa
Canvas
aSurfaceHolder
. - Aggiorna il frame corrente della gif animata utilizzando il detodo
setTime
dell'oggettoMovie
. - Chiama il metodo ancora una volta utilizzando l'
handler
dopo aver aspettato perframeDuration
millisecondi.
Il metodo draw
non è mai chiamato in maniera diretta. Viene sempre chiamato utilizzando un oggetto Handler
e un Runnable
. Quindi rendiamo l'oggetto Runnable
un campo della classe e chiamiamo drawGIF
.
Aggiungi il seguente codice alla classe GIFWallpaperService:
private Runnable drawGIF = new Runnable() { public void run() { draw(); } }; private void draw() { if (visible) { Canvas canvas = holder.lockCanvas(); canvas.save(); // Adjust size and position so that // the image looks good on your screen canvas.scale(3f, 3f); movie.draw(canvas, -100, 0); canvas.restore(); holder.unlockCanvasAndPost(canvas); movie.setTime((int) (System.currentTimeMillis() % movie.duration())); handler.removeCallbacks(drawGIF); handler.postDelayed(drawGIF, frameDuration); } }
Il metodo onVisibilityChanged viene automaticamente invocato non appena la visibilità dello sfondo cambia. Abbiamo bisogno di farne l'override e, basandosi sul valore dell'argomento visible
, far iniziare o fermare drawGIF
. Il metodo removeCallbacks
di Handler
è utilizzato per fermare qualsiasi esecuzione di drawGIF
in attesa.
@Override public void onVisibilityChanged(boolean visible) { this.visible = visible; if (visible) { handler.post(drawGIF); } else { handler.removeCallbacks(drawGIF); } }
Infine, fai l'override del metodo onDestroy
di Engine
per fermare qualsiasi esecuzione di drawGIF
in sospeso se lo sfondo è disattivato.
@Override public void onDestroy() { super.onDestroy(); handler.removeCallbacks(drawGIF); }
7. Compila ed Installa
Il tuo sfondo animato è adesso pronto. Compila ed installalo sul tuo dispositivo Android. Una volta installato, dovresti poter trovare lo sfondo nella lista degli sfondi disponibili.
La maggior parte dei launcher dà un'opzione per cambiare lo sfondo dopo che si è fatto a lungo il tap. In alternativa puoi andare nelle impostazioni di visualizazione per cambiare lo sfondo.

Se la gif risulta troppo piccola o non posizionata correttamente, torna indietro al metodo draw e modifica i valori di ridimensionamento e posizione.
Conclusione
Adesso sai come utilizzare una gif animata per creare uno sfondo animato. Sentiti libero di sperimentare con altre gif. Se hai intenzione di pubblicare il tuo sfondo su Google Play, assicurati di avere il permesso del creatore dell'immagine per utilizzare la gif a fini commerciali. Visita il sito degli sviluppatori di Android per saperne di più sulla classe WallpaperService
.
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Update me weeklyEnvato Tuts+ tutorials are translated into other languages by our community members—you can be involved too!
Translate this post