Créer un fond d'écran animé sur Android à l'aide d'un GIF animé

Avez-vous déjà vu un magnifique GIF animé qui effectue une boucle homogène et vous demandez-vous si vous pouvez l'utiliser comme fond d'écran animé sur votre appareil Android? Eh bien, vous pouvez, et dans ce tutoriel, je vais vous montrer comment.

À la recherche d'un raccourci?

Si vous préférez utiliser une solution prête à l'emploi au lieu de la coder vous-même, essayez l'élément GIF Live Wallpaper sur Envato Market. Il vous permet de créer votre propre application Live Wallpaper Android basée sur des GIF animés.. 

introduction

Créer un fond d’écran animé intéressant et beau à partir de rien en utilisant uniquement les mathématiques et le code pour générer les graphiques peut être fastidieux et prendre beaucoup de temps. Cela demande aussi beaucoup de créativité. Par contre, créer un GIF animé ou en trouver un en ligne est beaucoup plus facile. Dans ce tutoriel, vous allez apprendre à convertir un GIF animé en papier peint en direct..

Conditions préalables

Assurez-vous de disposer de la dernière version d'Android Studio. Vous pouvez l'obtenir sur le site Web des développeurs Android..

Même si tout GIF animé fera l'affaire, je vous suggère de télécharger un bon cinemagraph. Un cinemagraph n’est rien d’autre qu’un GIF animé, généralement créé à partir d’une vidéo, en boucle. Vous pouvez trouver beaucoup de bons sur Flickr.

Pour ce tutoriel, j'utilise un cinémagraph créé par l'utilisateur djandyw.com de Flickr, car il est disponible sous une licence Creative Commons..

1. Créer un nouveau projet

Démarrez Android Studio, créez un nouveau projet et nommez-le. GIFWallpaper. Choisissez un nom de package unique si vous envisagez de publier cette application sur Google Play..

Définissez le SDK minimum sur API 8: Android 2.2 (Froyo).

Notre application ne va pas avoir un Activité, alors choisissez Ajouter aucune activité et cliquez terminer.

2. Décrivez le papier peint

Un fond d'écran en direct a besoin d'un fichier qui le décrit. Créez un nouveau fichier XML nommé res / xml / wallpaper.xml et remplacez son contenu par le XML suivant:

  

L'étiquette et la vignette sont particulièrement importantes car elles seront utilisées lorsque le fond d'écran apparaît dans la liste des fonds d'écran disponibles sur votre appareil..

3. Modifier le manifeste

Pour fonctionner comme fond d'écran en direct, notre application nécessite une seule permission, android.permission.BIND_WALLPAPER.

Un live wallpaper fonctionne comme un Un service qui peut recevoir le  android.service.wallpaper.WallpaperService action intentionnelle. Nomme le Un service GIFWallpaperService et l'ajouter au manifeste du projet, AndroidManifest.xml.

      

Ensuite, pour vous assurer que l'application ne peut être installée que sur des appareils pouvant exécuter des fonds d'écran animés, ajoutez l'extrait de code suivant au manifeste:

 

4. Ajouter un GIF animé

Copiez le GIF animé que vous avez téléchargé de Flickr dans le dossier les atouts dossier du projet. J'ai nommé le GIF girl.gif.

5. Créer le service

Créez une nouvelle classe Java et nommez-la. GIFWallpaperService.java. Cette classe devrait étendre la WallpaperService classe.

Classe publique GIFWallpaperService étend WallpaperService 

Parce que WallpaperService est une classe abstraite, vous devez remplacer sa onCreateEngine méthode et retourner une instance de votre propre Moteur, qui peut rendre les cadres du GIF.

Pour utiliser le GIF animé, vous devez d’abord le convertir en un fichier. Film objet. Vous pouvez utiliser le Film la classe decodeStream méthode pour le faire. Une fois la Film l'objet a été créé, transmettez-le en tant que paramètre au constructeur de la coutume Moteur.

C'est ce que le onCreateEngine méthode devrait ressembler à:

@Override public WallpaperService.Engine onCreateEngine () try Movie movie = Movie.decodeStream (getResources (). GetAssets (). Open ("girl.gif")); renvoyer le nouveau GIFWallpaperEngine (film);  catch (IOException e) Log.d ("GIF", "Impossible de charger l'actif"); return null; 

6. Créer le moteur

Commençons à travailler sur le Moteur à présent. Créer une classe nommée GIFWallpaperEngine à l'intérieur de GIFWallpaperService classe et le faire s'étendre WallpaperService.Engine.

Ajoutez les champs suivants à cette nouvelle classe:

  • frameDuration: Cet entier représente le délai entre les opérations de redessinage. Une valeur de 20 vous donne 50 images par seconde.
  • visible: Ce booléen indique au moteur si le fond d'écran animé est actuellement visible à l'écran. C'est important, car nous ne devrions pas dessiner le papier peint quand il n'est pas visible.
  • film: Ceci est le GIF animé sous la forme d'un Film objet.
  • titulaire: Cela fait référence à la SurfaceHolder objet disponible pour le moteur. Il doit être initialisé en remplaçant le onCreate méthode.
  • gestionnaire: C'est un Gestionnaire objet qui sera utilisé pour démarrer une Runnable qui est responsable de dessiner réellement le papier peint.

Votre classe devrait maintenant ressembler à ceci:

classe privée GIFWallpaperEngine étend WallpaperService.Engine privé final int frameDuration = 20; détenteur privé de SurfaceHolder; film de film privé; booléen privé visible; gestionnaire de gestionnaire privé; public GIFWallpaperEngine (film de film) this.movie = movie; handler = new Handler ();  @Override public void onCreate (SurfaceHolder surfaceHolder) super.onCreate (surfaceHolder); this.holder = surfaceHolder; 

Ensuite, créez une méthode nommée dessiner qui dessine le contenu du GIF animé. Décomposons cette méthode:

  • Nous vérifions d’abord si le visible variable est définie sur vrai. On ne continue que si c'est.
  • Utilisez le SurfaceHolderde lockCanvas méthode pour obtenir un Toile faire appel à.
  • Dessinez un cadre du GIF animé sur le Toile après mise à l'échelle et positionnement.
  • Une fois tout le dessin terminé, passez le Toile Retour à la SurfaceHolder.
  • Mettez à jour le cadre actuel du GIF animé à l'aide du bouton Film objets régler le temps méthode.
  • Appelez à nouveau la méthode en utilisant le gestionnaire après avoir attendu frameDuration millisecondes.

le dessiner La méthode n'est jamais appelée directement. Il est toujours appelé en utilisant un Gestionnaire et un Runnable objet. Par conséquent, faisons la Runnable objecter un champ de la classe et l'appeler drawGIF.

Ajoutez le code suivant au GIFWallpaperService classe:

private Runnable drawGIF = new Runnable () public void run () draw (); ; private void draw () if (visible) Canvas canvas = holder.lockCanvas (); canvas.save (); // Ajuste la taille et la position pour que // l'image soit belle sur votre écran 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);  

le onVisibilityChanged La méthode est automatiquement appelée chaque fois que la visibilité du papier peint change. Nous devons le remplacer et, en fonction de la valeur du visible argument, soit démarrer ou arrêter drawGIF. le removeCallbacks méthode du Gestionnaire est utilisé pour arrêter toute attente drawGIF court.

@Override public void onVisibilityChanged (booléen visible) this.visible = visible; if (visible) handler.post (drawGIF);  else handler.removeCallbacks (drawGIF); 

Enfin, remplacez le onDestroy méthode du Moteur arrêter toute attente drawGIF s'exécute si le fond d'écran est désactivé.

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

7. Compiler et installer

Votre live wallpaper est maintenant prêt. Compilez-le et installez-le sur votre appareil Android. Une fois installé, vous devriez pouvoir trouver le papier peint dans la liste des papiers peints disponibles..

La plupart des lanceurs vous offrent la possibilité de changer le papier peint après un long geste. Alternativement, vous pouvez aller dans les paramètres d'affichage pour changer le fond d'écran.

Si le GIF semble trop petit ou qu’il n’est pas positionné correctement, retournez à la dessiner méthode et ajuster l'échelle et la position.

Conclusion

Vous savez maintenant comment utiliser un GIF animé pour créer un fond d'écran en direct. N'hésitez pas à expérimenter avec plus de GIF. Si vous envisagez de publier votre fond d'écran animé sur Google Play, assurez-vous que vous disposez de l'autorisation de son créateur pour utiliser le GIF animé à des fins commerciales. Visitez le site Web Android Developer pour en savoir plus sur le WallpaperService classe.