Crea uno sfondo animato su Android utilizzando una GIF animata

Hai mai visto una bella GIF animata che scorre senza interruzioni e ti chiedi se puoi usarla come sfondo dal vivo sul tuo dispositivo Android? Bene, puoi, e in questo tutorial ti mostrerò come.

Alla ricerca di una scorciatoia?

Se preferisci utilizzare una soluzione già pronta invece di codificarla tu stesso, prova l'elemento GIF Live Wallpaper su Envato Market. Ti permette di creare la tua app per Android Live Wallpaper basata su GIF animate. 

introduzione

Creare un wallpaper live interessante e bello da zero usando solo matematica e codice per generare la grafica può essere noioso e richiede molto tempo. Richiede anche molta creatività. D'altra parte, creare una GIF animata o trovarne una online è molto più semplice. In questo tutorial, imparerai come convertire qualsiasi GIF animata in uno sfondo animato.

Prerequisiti

Assicurati di disporre della versione più recente di Android Studio. Puoi scaricarlo dal sito web degli sviluppatori Android.

Anche se qualsiasi GIF animata lo farà, ti suggerisco di scaricare un buon cinemagraph. Un cinemagraph non è altro che una GIF animata, solitamente creata da un video, che scorre senza interruzioni. Puoi trovare molti buoni su Flickr.

Per questo tutorial, sto usando un cinemagraph creato dall'utente di Flickr djandyw.com in quanto è disponibile sotto una licenza Creative Commons.

1. Crea un nuovo progetto

Avvia Android Studio, crea un nuovo progetto e assegna un nome al progetto GIFWallpaper. Scegli un nome di pacchetto univoco se prevedi di pubblicare questa app su Google Play.

Impostare l'SDK minimo su API 8: Android 2.2 (Froyo).

La nostra app non avrà un Attività, quindi scegli Aggiungi Nessuna Attività e fare clic finire.

2. Descrivi lo sfondo

Uno sfondo live richiede un file che lo descriva. Crea un nuovo file XML chiamato res / xml / wallpaper.xml e sostituire il suo contenuto con il seguente XML:

  

L'etichetta e la miniatura sono particolarmente importanti in quanto verranno utilizzate quando lo sfondo viene visualizzato nell'elenco degli sfondi disponibili sul dispositivo.

3. Modifica il manifest

Per funzionare come sfondo animato, la nostra app ha bisogno di una sola autorizzazione, android.permission.BIND_WALLPAPER.

Una carta da parati dal vivo funziona come un Servizio che può ricevere il  android.service.wallpaper.WallpaperService azione intenzionale. Dai il nome a Servizio GIFWallpaperService e aggiungilo al manifest del progetto, AndroidManifest.xml.

      

Successivamente, per assicurarti che l'app possa essere installata solo su dispositivi in ​​grado di eseguire sfondi live, aggiungi il seguente snippet al manifest:

 

4. Aggiungi GIF animata

Copia la GIF animata scaricata da Flickr in risorse cartella del progetto. Ho chiamato la GIF girl.gif.

5. Creare il servizio

Crea una nuova classe Java e chiamala GIFWallpaperService.java. Questa classe dovrebbe estendere il WallpaperService classe.

GIFWallpaperService di classe pubblica estende WallpaperService 

Perché WallpaperService è una classe astratta, devi scavalcarla onCreateEngine metodo e restituisci una tua istanza Motore, che può rendere i frame della GIF.

Per usare la GIF animata, devi prima convertirla in a Film oggetto. Puoi usare il Film La classe di decodeStream metodo per farlo. Una volta il Film oggetto è stato creato, passalo come parametro al costruttore dell'abitudine Motore.

Questo è ciò che onCreateEngine il metodo dovrebbe assomigliare a:

@Override public WallpaperService.Engine onCreateEngine () try Movie movie = Movie.decodeStream (getResources (). GetAssets (). Open ("girl.gif")); restituisce nuovo GIFWallpaperEngine (filmato);  catch (IOException e) Log.d ("GIF", "Impossibile caricare asset"); return null; 

6. Creare il motore

Iniziamo a lavorare su Motore adesso. Crea una classe chiamata GIFWallpaperEngine dentro il GIFWallpaperService classe e farlo estendere WallpaperService.Engine.

Aggiungi i seguenti campi a questa nuova classe:

  • frameDuration: Questo numero intero rappresenta il ritardo tra le operazioni di re-draw. Un valore di 20 ti dà 50 fotogrammi al secondo.
  • visibile: Questo valore booleano consente al motore di sapere se lo sfondo live è attualmente visibile sullo schermo. Questo è importante, perché non dovremmo disegnare lo sfondo quando non è visibile.
  • film: Questa è la GIF animata sotto forma di a Film oggetto.
  • titolare: Questo si riferisce al SurfaceHolder oggetto disponibile per il motore. Deve essere inizializzato sovrascrivendo il onCreate metodo.
  • gestore: Questo è un handler oggetto che verrà utilizzato per avviare a Runnable questo è responsabile per disegnare effettivamente lo sfondo.

La tua classe dovrebbe ora assomigliare a questa:

classe privata GIFWallpaperEngine estende WallpaperService.Engine private final int frameDuration = 20; titolare di SurfaceHolder privato; film privato film; visibile booleano privato; gestore dell'handler privato; public GIFWallpaperEngine (film movie) this.movie = movie; handler = new Handler ();  @Override public void onCreate (SurfaceHolder surfaceHolder) super.onCreate (surfaceHolder); this.holder = surfaceHolder; 

Quindi, crea un metodo chiamato disegnare che disegna il contenuto della GIF animata. Rompiamo questo metodo:

  • Per prima cosa controlliamo se il visibile la variabile è impostata su vero. Noi continuiamo solo se lo è.
  • Utilizzare il SurfaceHolder'S lockCanvas metodo per ottenere un Tela attingere.
  • Disegna una cornice della GIF animata sul Tela dopo il ridimensionamento e il posizionamento.
  • Una volta completato tutto il disegno, passare il Tela ritorno al SurfaceHolder.
  • Aggiorna il fotogramma corrente della GIF animata usando il Film oggetto di tempo impostato metodo.
  • Chiama ancora il metodo usando il gestore dopo aver atteso frameDuration millisecondi.

Il disegnare il metodo non viene mai chiamato direttamente. Viene sempre chiamato usando a handler e a Runnable oggetto. Pertanto, facciamo il Runnable oggetto un campo della classe e chiamalo drawGIF.

Aggiungi il seguente codice al GIFWallpaperService classe:

private Runnable drawGIF = new Runnable () public void run () draw (); ; private void draw () if (visible) Canvas canvas = holder.lockCanvas (); canvas.save (); // Regola le dimensioni e la posizione in modo che // l'immagine appaia bene sullo schermo canvas.scale (3f, 3f); movie.draw (canvas, -100, 0); canvas.restore (); holder.unlockCanvasAndPost (tela); movie.setTime ((int) (System.currentTimeMillis ()% movie.duration ())); handler.removeCallbacks (drawGIF); handler.postDelayed (drawGIF, frameDuration);  

Il onVisibilityChanged il metodo viene automaticamente chiamato ogni volta che cambia la visibilità dello sfondo. Abbiamo bisogno di sovrascriverlo e, in base al valore del visibile argomento, avviare o interrompere drawGIF. Il removeCallbacks metodo del handler è usato per fermare qualsiasi in sospeso drawGIF piste.

@Override public void onVisibilityChanged (boolean visible) this.visible = visible; se (visibile) handler.post (drawGIF);  else handler.removeCallbacks (drawGIF); 

Infine, ignora il OnDestroy metodo del Motore per fermare qualsiasi in sospeso drawGIF viene eseguito se lo sfondo è disattivato.

@Override public void onDestroy () super.onDestroy (); handler.removeCallbacks (drawGIF); 

7. Compila e installa

Il tuo sfondo live è ora pronto. Compilalo e installalo sul tuo dispositivo Android. Una volta installato, dovresti riuscire a trovare lo sfondo nell'elenco degli sfondi disponibili.

Molti lanciatori ti danno la possibilità di cambiare lo sfondo dopo un lungo gesto di tocco. In alternativa, puoi andare alle impostazioni del display per cambiare lo sfondo.

Se la GIF sembra troppo piccola o non è posizionata correttamente, torna al menu disegnare metodo e regolare la scala e la posizione.

Conclusione

Ora sai come usare una GIF animata per creare uno sfondo animato. Sentiti libero di sperimentare più GIF. Se prevedi di pubblicare il tuo sfondo live su Google Play, assicurati di avere il permesso del creatore di utilizzare commercialmente la GIF animata. Visita il sito Web degli sviluppatori Android per ulteriori informazioni su WallpaperService classe.