Personnalisez avec Zooper Widget! No limite!

Par edem84 - Le 7/02/14 - Affichages : 30465
Sans être root, créez vous-même vos widgets, personnalisez vos écrans avec une ou plusieurs de vos créations en utilisant Zooper Widget qui permet l’insertion de toutes sortes de variables, icônes, bitmaps, textes, zones de clics etc...
Image

Mise en garde : le tuto que je vous propose est non exhaustif tant cet outil permet de choses.
Ce que vous lirez n'est qu'une prise en main de cette application qui est en français. Pour aller plus loin (inclure ses propres icônes, créer ses variables etc...) je vous engage à pratiquer et chercher sur internet, il y a pléthores de sites qui en parlent (DeviantArt, XDA, mycolorscreen etc...). Vous trouverez ce que vous souhaitez en cherchant un tant soit peu ;)


Zooper Widget existe en deux versions sur le play store :
- gratuite : Image
lien : https://play.google.com/store/apps/details?id=org.zooper.zwfree

- payante : Image
lien : https://play.google.com/store/apps/details?id=org.zooper.zwpro
La version Pro enlève les pubs sur l'application, permet de choisir les actions à effectuer lors d'un clic sur le widget, permet de sauvegarder sur les SD card les widgets réalisés, permet de transformer un widget en apk pour le partage.

Pré-requis :
Ce n’est pas une obligation, mais sachez que ce tuto a été réalisé sur un Gnote 3 dont le launcher de base est remplacé par Nova Prime. Pourquoi ?
Parce qu’il permet de régler la grille sur l’écran (ici 8 lignes x 7 colonnes, sans marges).
D’autres launchers le permettent, SSlauncher, Apex etc...
Nova Launcher permet aussi le chevauchement des widgets, ce qui nous intéresse particulièrement car sur notre création, je poserai des icônes du système en obligeant notre widget à se placer en arrière-plan.
Vous pouvez quand même suivre la procédure avec le lanceur de base de votre Galaxy.
Pas besoin d’être root non plus !

Description du GRAND widget que nous allons construire qui comportera 12 objets :
Image

Comment faire ?
- Premièrement, vous rajoutez sur votre appareil, un écran vierge.
- Ensuite vous appuyez longuement dessus pour rajouter un widget.
- Dans la liste vous choisissez : Zooper Widget et le premier (1x1). Quelque soit la taille définitive de votre widget, je vous conseille de toujours choisir le 1x1, vous allez voir pourquoi ;)
- Vous avez maintenant sur votre écran vierge, un carré noir représentant le widget 1x1. Appuyez dessus et redimensionnez de façon à lui donner la place définitive (ici on va faire un widget sur tout l’écran).
- Une fois le widget vide ajusté, cliquez dessus pour entrer dans l’application et commencer la création, choisir “Vide : démarrer avec un widget vide”.
Image

- Vous êtes dans la partie paramétrage de votre widget qui est vide pour l’instant. Cliquez sur “Disposition”
- Dans “Disposition”, comme il n’y a rien, vous cliquez sur le signe “+” pour créer un premier objet
- Il vous est demander de choisir le type de module que vous voulez créer. Nous choisissons “Rectangle” pour le placer en haut du widget (il servira de fond à l’horloge etc...)
Image

- Par défaut, le rectangle est placé au centre du widget, je vous laisse chercher pour le déplacer en haut à gauche et lui donner une taille de 360 en largeur sur 90 en hauteur, ainsi que pour lui donner une couleur (blanche par défaut)
Image

- une fois notre premier rectangle créé, nous allons déposer l’horloge (nota : à chaque ajout d’objet, celui-ci se place au-dessus du précédent! Sachez quand même que vous pouvez à tout moment changer l’ordre). Pour créer l’horloge, nous rajoutons un nouveau module “Texte”.
Image

- Il nous faut maintenant formater le texte pour qu’il affiche les variables que l’on veut (ici, pas de soucis car par défaut, il affiche l’heure), mais voyons comment faire :
- Cliquez sur “Forme du texte”, dans l’écran suivant chercher “Heure” et choisir le “Mode 24H”, pressez la touche “retour” de votre Galaxy pour sortir de cet écran de réglage.
- De la même manière que pour l’horloge, nous allons rajouter deux modules qui seront : la localisation et les conditions météo courantes
Image
- Pour finir de remplir ce premier rectangle, il nous faut rajouter l’icône dynamique de la météo courante. Pour cela, il nous faut choisir le module “Jeu d’icônes ajustables”. Ce sont des icônes qui évoluent dynamiquement en fonction de la météo. Dans le screen suivant, choisir “Current weather” et valider, il vous reste à la placer au bon endroit et si vous voulez, vous pouvez réduire sa taille ou l’agrandir.
Image

- le premier rectangle étant terminé, nous allons passer au second. Pour ce faire, nous allons dupliquer le rectangle blanc que nous avons fait en tout premier. Allez dans “Disposition”, cocher le premier rectangle et cliquez sur l’icône de duplication en haut.
Votre second rectangle est fait, il vous reste à le positionner correctement en dessous du premier.
Image

- Dans ce second rectangle nous allons poser le jour et la date en cours, je vous laisse faire, c’est la même procédure que pour l’heure, si ce n’est qu’il vous faudra choisir les bons éléments dans les variables : “Nom du jour” et “jour et nom du mois”.
Image

- De même que pour l’icône et les conditions météo, vous choisirez de placer une icône dans les “jeux d’icônes ajustables” puis “battery icons filled” et pour la charge de la batterie, c’est un texte préformaté qui utilise la variable batterie > Info longue. Vous ferez de nouveau pareil pour les appels et SMS manqués.
Image

- Nous allons maintenant placer une photo sous le rectangle 2. Toujours la même procédure : ajout d’un module “bitmap”, choix de la photo, on place ou il faut, on resize et on valide. Pour la faire passer sous les rectangles, on va dans “Disposition” puis on utilise l’icône des doubles flèches à côté de “Bitmap” et sans lâcher, on fait glisser en haut. Pour info, les éléments placés en haut de liste sont en arrière-plan.
Image

- Dernière étape de la construction, nous allons placer un troisième rectangle blanc qui servira de fond aux icônes systèmes que vous voudrez glisser depuis la page de vos applications.
Comme pour le second rectangle, on va dupliquer et placer cette copie en bas de widget.

Nos éléments sont en place, reste maintenant à faire quelques réglages sympas :
- je veux d’un clic sur l’heure afficher l’application Horloge : dans la liste des modules, repérez le module texte “heure” (ici 16:45), cliquez dessus et aller dans “Action lorsque vous touchez le widget”. Dans le screen qui apparaît, chercher “Horloge” dans la liste des applications, cliquez dessus.
Image

- je veux que le widget se mette à jour (météo et localisation) quand je touche l’image : dans le “paramétrage du widget”, cliquez sur “Action lorsque vous touchez le...”, dans le screen suivant, vous choisirez “Force ZooperUpdate”.
Image

Voilà, nous venons de faire ensemble notre premier grand widget avec zooper, je ne vais pas aller plus loin car je vous rappelle que cette application est en français et pas mal accessible, donc parcourez-la, vous serez étonné par ses possibilités (rotation d'objets, transparence etc...).

Sachez qu’avec la version pro vous pouvez enregistrer vos créations sur carte SD et par là même, les partager!
Si pas mal de membres s’y mettent, je pense qu’ils nous faudra ouvrir un topic [skins Zooper] dans lequel nous partagerons nos oeuvres ;)


Image

Edit du 07/02/2014 à 22h00 :
je viens d'ouvrir un topic pour que vous déposiez vos œuvres Zooper : [skins Zooper] Vos contributions afin de ne pas polluer ce topic et avoir une belle base de données Zooper.
134 réponse(s) -