[TUTO]Créez votre propre jeu d'icônes Bitmap avec Zooper Widget

[Ajaxx]

Bien le bonjour,

Je vous propose ici un tutoriel vous permettant de créer votre propre jeu d'icônes bitmap avec le formidable outil qu'est Zooper Widget:

Vous trouverez l'application sous forme gratuite (ne vous permettant pas de sauvegarder vos widgets), en cliquant sur le carré orange, ou bien en version payante, accessible depuis le carré bleu ;)

Je précise que les deux versions permettent de réaliser ce tutoriel.

Zooper Widget

Si vous avez des questions, ou désirez en apprendre plus sur ZW, merci de les poser sur ce sujet créé par @ : / :)

CE TUTORIEL N'EXIGE AUCUNE CONNAISSANCE QUE CE SOIT EN BIDOUILLAGE, TOUT LE MONDE PEUT LE REALISER SANS DANGER ;)

Vous n'avez qu'à suivre les consignes.

Tout d'abord, qu'est-ce que les jeux d'icônes bitmap sur Zooper Widget?

Il s'agit d'icônes pouvant être ajoutées à un widget, et variables selon des conditions pré-établies. A ce jour, seules l'état de la batterie et les conditions météo peuvent être affichées par ces icônes.

Ils sont chacun contenus dans des zips open-source, mis en ligne par Zooper, Org.: ils contiennent: un fichier XML et des icônes au format PNG.

Maintenant, passons à la création:

1) Tout d'abord, téléchargez les sets d'icônes de ZW ici pour les conditions météo et là pour l'état de la batterie

I. Pour les conditions météo

-Ouvrez le dossier weathericonsetsample.zip que vous avez préalablement téléchargé grâce aux liens plus haut, et décompressez-le.

-Dans le dossier icons, remplacez les images par les vôtres, au format PNG.

Chaque image correspondra à une condition météorologique, les noms sont en anglais, je vous fournis les traductions:

N.B: lorsque le mot night est contenu, cela affichera les paramètres pour la nuit; par exemple: clouds = temps couvert, clouds night = ciel nocturne couvert.

- clear = temps clair

- clouds = ciel couvert

- few clouds = temps nuageux

- hail =grêle

- mist = temps brumeux

- none available = lorsque ZW ne parvient pas à trouver les conditions météo

- showers = averses

- showers scattered = pluie

- snow rain = neige fondue

- snow scattered = épisodes neigeux

- snow = neige continue

- storm = orage

Voilà ce que ça donne, par exemple:

-Ensuite, ouvrez le fichier config.xml avec l'éditeur intégré par défaut à Android:

Vous n'avez qu'à modifier les lignes sous uniquement (cf l'image ci-dessous)

_ Entre et : Ex: Mes icônes Météo (thème FrAndroid)

_ Vous pouvez également éditer la description, soit la zone entre et Ex: fait avec mes images

Enfin, sauvegardez votre modification, puis re-zippez le dossier, que vous renommerez iconsets; déplacez-le dans le dossier IconSets du dossier de ZooperWidget accessible depuis la racine, comme sur la capture d'écran ci-dessous.

Et voilà! Vous n'avez plus qu'à choisir ce jeu d'icônes pour votre widget, en créant un widget zooper sur votre écran d'accueil, en cliquant sur disposition, + en haut de votre écran, puis Jeu d'icônes bitmap, en sélectionnant votre pack d'icônes dans Jeu d'icônes.

Le tour est joué,le widget affichera vos icônes pour vous donner la météo! ^-^

II. Pour l'état de la batterie

- De même, ouvrez le dossier mybatteryiconset.zip que vous avez préalablement téléchargé grâce aux liens plus haut, et décompressez-le.

-Dans le dossier icons, remplacez les images par les vôtres, au format PNG.

Les icônes serviront à afficher l'état de la batterie, sur une précision de 20%, par exemple, l'image 000 s'affichera entre 0 et 20% de batterie restante.

Toutes les icônes existent en deux versions, à savoir charging et discharging : la première correspond au cas où la batterie est en charge, la seconde en état de décharge.

Voilà les icônes:

-Ensuite, ouvrez le fichier config.xml avec l'éditeur intégré par défaut à Android:

Vous n'avez qu'à modifier les lignes sous uniquement (cf l'image ci-dessous)

_ Entre et : Ex: Mes icônes Baterie (Thème FrAndroid)

_ Vous pouvez également éditer la description, soit la zone entre et Ex: Icônes Batterie de test

Comme ça par exemple:

-Enfin, sauvegardez votre modification, puis re-zippez le dossier, que vous renommerez iconsets; déplacez-le dans le dossier IconSets du dossier de ZooperWidget accessible depuis la racine, comme sur la capture d'écran visible plus haut.

-Et voilà! Vous n'avez plus qu'à choisir ce jeu d'icônes pour votre widget, en créant un widget zooper sur votre écran d'accueil, en cliquant sur disposition, + en haut de votre écran, puis Jeu d'icônes bitmap, en sélectionnant votre pack d'icônes dans Jeu d'icônes.

Et tataa...! Vous pouvez désormais afficher vos propres images comme icônes variables en fonction des conditions suscitées! ;)

Pour les bidouilleurs un peu plus chevronnés, vous pouvez bien sûr manipuler le fichier XML, mais ce sera pour un autre tuto. ;)

Ici, je vous joins les liens mis à disposition par Zooper, Org. sur leur site zooper.org:

Pour le jeu d'icônes des conditions météo: http://www.zooper.org/wp/archives/1155

Pour le jeu d'icônes de l'état de la batterie: http://www.zooper.org/wp/archives/1084

N'hésitez pas à commenter (c'est là mon premier tuto), ou à poser des questions si vous rencontrez des difficultés :)

Modifié 22 octobre 2014 par Ajacc

[Stahw]

Très bon tuto @ !

Félicitation si c'est ton premier

Petite critique si je peux me permettre

Ensuite, ouvrez le fichier config.xml avec l'éditeur intégré par défaut à Android:

Vous n'avez qu'à modifier les lignes sous "uniquement (cf l'image ci-dessous)

_ Entre et : Ex: Mes icônes Météo (thème FrAndroid)

Ce passage n'est pas très clair (pour moi en tous cas) je ne comprend pas où et quoi changer :-)

Encore Bravo et merci pour ce tuto

[Ajaxx]

Ah oui, j'ai supprimé un mot par mégarde en relisant !

Merci :)

Pas de lézard, les critiques ça fait progresser ! ^_^

ÉDIT: ah non, c'est parce que ce sont des éléments de code ^_^

[evowizz]

Salut @ très bon tuto :P

[titik2]

Nickel ton tuto Ajacc

[Ajaxx]

Merci! :)

[LucasPetetin]

Très bon tuto :) merci