Ajouter une image animée GIF [Programmation]

Cette page est en lecture seule. Vous pouvez afficher le texte source, mais ne pourrez pas le modifier. Contactez votre administrateur si vous pensez qu'il s'agit d'une erreur.

====== Ajouter une image animée GIF ======

===== Ajout de l'image =====

Je voudrais utiliser cette image :

{{:butterfree-f.gif?nolink&}}

{{:butterfree-f_1.gif?nolink&}}

Pour la télécharger, cliquer {{:butterfree-f.gif?linkonly|ICI}}

On crée un nouveau lutin en l'important à partir d'un fichier : {{:87f32adcfa8b640d800aa6e582ea18df.png}}

{{:b5e276f1f772bc837413d98e3571536d.png}}

puis

{{:4a36381a86e65d18b0800d23d88c8163.png}}

Après quelques seconde d'attente :

{{:2001022e1bf36a024507bf94131d3663.png}}

Le fond de l'image est transparent sauf pour la première image.

{{:e496a899c5e49dc45a64bfb0ac26805d.png}}

On va "colorier" en transparent la première image :

{{:9724d77dbfbeb7755bb684ca628c79c8.png}}

On choisit la couleur transparente :

{{:64a9e844fc4e57c1cc0d02c81f41468d.png}}

Et on applique :

{{:1c4c34926cacb2d866d0e85fa3e40385.png}}

{{:6c63c3f110965b716869ff83ca21272f.png}}

===== Pour animer =====

{{:5f20204489425fd6ce4fbf1c1e997b5a.png}}

===== Problème rencontré =====

{{:03fdeb1e02a235eda65d8bc04eb916c7.png}}

Il faut modifier le fichier gif avec Gimp.

On ouvre le fichier dans Gimp

{{:266ca01a1f5490bb000622d622989029.png}}

Puis exporter dans le menu Fichier :

{{:f6e2155621de1d5089659a1971736469.png}}

Cliquer sur Exporter

{{:455e1e84f2f5dad5d8fc3b5f11be39e8.png}}

Choisir un nouveau nom de fichier ou remplacer l'ancien.

Cocher les options suivantes puis cliquer sur exporter.

{{:b47354821495d2dc9502a4c4a71cb54e.png}}

En important à nouveau dans scratch, le problème a disparu.

===== Trouver des images animées =====

Dans google image, lancer une recherche :

{{:2b8daf02d4a00824318388f81bd6e8fc.png}}

Aller dans Outils

{{:61d55490ba5d47d1c4ae473e878f864c.png}}

Choisir la couleur transparente

{{:d4bbce2add9de4288409f66b969f822f.png}}

et le Type Image Animées

{{:df55c7a3d9efe014a4e4fb9dc9f73081.png}}

En cliquant sur ces images, on voit l'animation