• L'équipe de développeur de Samurize pour cet excellent logiciel
• Madness : correcteur et béta testeur officiel
• Tous les autres membres de la team CXP

Bienvenue dans la 7eme leçon consacrée à Samurize (déjà la 7e, cela passe vite ).

La config d'aujourd'hui vous permettra d'afficher des infos relatives à la puissance du signal Wifi et aux taux de transfert. Et ceci sous forme de barre de progression ou de graphiques (cf. Image1).

Image1

Comme vous pouvez le voir sur l'image, la config est assez chargée (18 contrôles ). De plus elle aborde beaucoup de nouveautés. La leçon sera donc assez longue et peut être un peu complexe. Mais si vous avez bien suivi les leçons précédentes, il ne devrait pas y avoir de problème, ne partez donc pas en courrant

Information : Si vous n'utilisez pas le Wifi pour vous connecter à internet, vous pourrez bien entendu passez le passage correspondant

a) Le texte

Nous allons commencer cette leçon par la partie de gauche (partie relative à la réception). Et contrairement aux autres leçons, nous n'allons pas commencer par les éléments du fond. Je vais essayer de vous montrer l'ordre logique de création d'une config (i-e les infos puis ensuite les éléments décoratifs comme les cadres, fonds...).

Nous voulons afficher le total reçu et le débit de réception. On commence par le total. Pour ce faire, on ajoute un nouveau contrôle : Total envoyé/reçu (vous avez bien entendu lancé l'éditeur de config ).

Image2

On va ensuite dans l'onglet Source (cf. Image2) et on choisit :

• La carte dans la liste en dessous de Réseau
• En valeur à afficher : Total reçu
• En unité : MegaBytes
• Vous pouvez cocher ou non la case Remise à zéro au redémarrage

Ensuite, dans l'onglet Affichage, on change :

• Le texte en : Vitesse de réception (Total : %v Mo)
• La police en : Tahoma, 8pt. Couleur : Noire
• Alignement horizontal : centré et alignement vertical : milieu

Maintenant que nous avons réglé l'affichage de notre contrôle, on va pouvoir le positionner Cela se passe dans l'onglet Général.

Cet élément sera le plus en haut à gauche de la config, on le place donc (par exemple) en X: 60 et Y: 130. La taille du contrôle dépend de la longueur du texte et de la police utilisée. Dans notre cas, une largeur de 200 et une hauteur de 20 me semblent adaptées

b) Le graphique

En dessous de ce premier contrôle, on va placer la vitesse de réception sous forme de graphique. Pour obtenir cette vitesse, on va utiliser un nouveau contrôle : Compteur de performance.

Avant même que le contrôle soit ajouté à la config, une boite de dialogue s'ouvre et vous permet de choisir ce que va faire le compteur. (Il est possible de réouvrir cette boite de dialogue si vous voulez changer la configuration onglet Source, bouton Changer le compteur).

Comme vous pouvez le voir, il y a vraiment beaucoup de choix. Pour le débit, il faut choisir :

• Dans Objet de performance : Interface réseau.
• Puis dans la liste à gauche : Octets reçus/s
• Et dans la liste de droite : le nom de votre carte résau.

Image3

Après avoir cliqué sur OK, dans l'onglet Source, cochez la case Modifier la valeur de retour (unité) et sélectionnez dans les deux listes déroulantes, Convertir de : Bytes à : KiloBytes (cf. Image3).

Allez ensuite dans l'onglet Général et :

• Changez le type de dessin en Graphique
• On positionne le graph en dessous du texte (X: 60 et Y: 160)
• Et pour la taille, on choisit : Largeur: 201 et Hauteur: 51

Toujours dans cet onglet, on va utiliser de nouvelles options qui vont nous permettre d'ajouter un fond et une grille sur le contrôle

Image4

Pour le fond (cf. Image4) :

• Cochez la case Rempli
• Choisissez la couleur : Blanc
• Réglez la transparence : 100

Image5

Ensuite pour la grille (cf. Image5) :

• Cochez la case Grille
• Choisissez la couleur : Noir
• Réglez la transparence : 200
• Réglez l'espacement horizontal et vertical : 10 pour les deux.

On passe maintenant au réglage du graphique, pour ce faire, direction l'onglet Affichage. Entrez les réglages comme sur l'image suivante (Le bleu est R:74 G:166 B:207 ) :

Conseil : Sur l'image, la valeur max est de 100 (Ko/s). Vous pouvez bien entendu adapter cette valeur en fonction de votre connexion.

c) La bordure

Les deux éléments principaux de cette partie sont donc en place. On passe maintenant à la décoration. Pour cela, on va utiliser les formes de base présentes dans Samurize.

Information : On pourrait parfaitement utiliser une image et mettre la config dessus, mais le but du tuto n'est pas de vous apprendre à utiliser photoshop ou gimp. De plus, on va voir que l'on peut faire de belles choses juste avec Samurize.

Pour commencer, on va mettre un rectangle arrondi autour de nos 2 contrôles. Rendez-vous dans le menu Ajouter objet en arrière-plan.

Décochez la case Rempli pour n'avoir que le contour du rectangle. Et utilisez ces réglages :

• Couleur : noir
• Arrondi : 20
• X: 50 et Y: 130
• Largeur: 220 et Hauteur: 90

Pour bien marquer la séparation entre le texte et le graphique, on va mettre une ligne entre les deux Cet élément se trouve au même endroit que le rectangle arrondi (Ajouter objet en arrière-plan), et se nomme Ajouter ligne (c'était pas trop dur à trouver ).

On positionne la ligne comme ceci :

• Couleur : noir
• X: 50 et Y: 140
• Largeur: 219 et Hauteur: 20
• Angle: 0 et Epaisseur: 0

d) Le fond

Pour finir cette partie, on va rajouter un deuxième Rectangle arrondi (plein cette fois-ci) pour faire le fond blanc transparent

Positionnez cet élément de la même façon que pour le précédent Rectangle. Les seules différences sont que vous devez cocher la case Rempli, que la couleur est Blanche et la transparence est de 50.

Il ne reste plus qu'à mettre ce rectangle en dessous du précédent (rappelez-vous du tuto4, le dernier élément placé est celui qui est le plus au-dessus). Cependant nous ne voulons pas que le fond soit au dessus. Il suffit alors de cliquer sur le bouton le plus à droite sur cette image pour le mettre en dessous des autres éléments

Conseil : Si vous ne comptez pas faire la partie sur le wifi, vous pouvez décaler tous les éléments de cette partie de 60px sur la gauche.

Dans cette partie, on va voir un peu la même que chose que ce que l'on vient juste de faire. Donc l'explication risque d'être redondante. Mais faire deux fois la même chose vous permettra de bien comprendre!

Conseil : Un bon exercice serait de faire cette partie tout seul. Vous devriez en être capable car on va utiliser exactement les mêmes éléments en changeant juste la vitesse d'émission par la vitesse de réception.

a) Le texte

On commence comme précédemment avec l'affichage du texte. On ajoute un contrôle Total envoyé/reçu.

Puis, on configure ce que va afficher ce contrôle. Comme vous devez le savoir maintenant, cela se passe sous l'onglet Source. On choisit :

• La carte dans la liste déroulante en dessous de Réseau
• Valeur à afficher : Total envoyé (c'est ici que cela diffère par rapport à la partie précédente)
• Unité : MegaBytes
• Vous pouvez cocher ou non Remise à zéro au redémarrage

Après, on configure (à partir de l'onglet Affichage) comment les informations seront affichées :

• Le texte est : Vitesse d'émission (Total : %v Mo) (ici aussi on a un changement )
• La police est : Tahoma, 8pt. Couleur : Noire
• Alignement horizontal : centré et alignement vertical : milieu

Enfin, on positionne le texte comme ceci :

• X: 350 et Y: 130
• Largeur: 200 et Hauteur: 20

b) Le graphique

On continue avec l'ajout du graphique vitesse d'émission. Pour obtenir cette vitesse, on utilise un contrôle Compteur de performance.

Dans la boite de dialogue qui s'ouvre, on choisit :

• Pour Performance object : Interface réseau
• Dans la liste de gauche : Octets envoyés/s
• Dans la liste de droite : le nom de votre carte résau

On modifie la valeur de retour de ce contrôle en changeant l'unité de Bytes à : KiloBytes (cf. Image3).

Allez ensuite dans l'onglet Général et utilisez ces réglages :

• Type de dessin: Graphique
• X: 350 et Y: 160
• Largeur: 201 et Hauteur: 51

Dans cet onglet, on va pouvoir ajouter la grille et le fond comme nous l'avons déjà fait pour le contrôle du même type utilisé pour la reception. Les réglages sont exactement les mêmes, reportez-vous donc à la partie précédente (cf. Image4 et Image5 et textes associés).

Pour finir, direction l'onglet Affichage. Entrez les réglages comme sur l'image suivante (Le bleu est R:74 G:166 B:207 ) :

Conseil : Sur l'image, la valeur max est de 100 (Ko/s). Vous pouvez bien entendu adapter cette valeur en fonction de votre connexion.

c) Le cadre

Pour finir cette partie, il nous reste 3 contrôles à ajouter : deux pour la bordure et un pour le fond. Comme précédemment, la bordure se compose d'un rectangle arrondi et d'une ligne horizontale

Après avoir ajouté le rectangle arrondi, décochez la case Rempli pour n'afficher que le contour. Et utilisez ces réglages :

• Couleur : noir
• Arrondi : 20
• X: 340 et Y: 130
• Largeur: 220 et Hauteur: 90

Ensuite, on positionne la ligne comme ceci :

• Couleur : noir
• X: 340 et Y: 140
• Largeur: 219 et Hauteur: 20
• Angle: 0 et Epaisseur: 0

Pour le fond, c'est encore un rectanle arrondi. On le positionne à la même place que la bordure. Cette fois-ci, on coche la case Rempli. On change juste la couleur en Blanc et la transparence à 50.

Assurez-vous que le fond blanc est bien en dessous des contours noirs. Si ce n'est pas le cas, vous pouvez changer l'ordre d'affichage gràce à ce bouton :

Voici ce que vous devriez avoir obtenu après ces 2 étapes :

Information : Si vous n'avez pas de connexion wifi, vous pouvez allez directement à la partie V.

a) Le texte

On va commencer cette partie en ajoutant le texte. Pour cela, ajoutez un nouveau contrôle texte que vous positionez comme ceci :

• X: 280 et Y: 130
• Largeur: 50 et Hauteur: 20

Dans l'onglet Affichage, changez le texte en Signal et modifiez l'alignement horizontal et vertical en Centré et Milieu

Laissez tous les autres réglages sur leur valeur par défaut.

b) La barre de progression

On aborde maintenant la partie importante : l'affichage de la puissance du signal wifi sous forme de barre de progression. Gagné, on utilise encore un compteur de performance

Après avoir ajouté ce compteur, on choisit dans la boite de dialogue qui s'ouvre :

• Pour Performance object : Interface réseau.
• Puis dans la liste à gauche : Bande passante
• Et dans la liste de droite : le nom de votre carte résau.

Dans l'onglet Général, on positionne le contrôle :

• X: 290 et Y: 160
• Largeur: 31 et Hauteur: 51

Toujours dans cet onglet, on va modifier de nombreuses choses pour customiser l'affichage de notre contrôle

• Tout d'abord, on change le type de dessin en Barre de progression.
• On ajoute un fond en cochant la case Rempli : Couleur blanche et Transparence 100.
• On coche Grille : Couleur noir, Transparence 200, Espacement horizontal 70 et vertical 10.
• Enfin, on coche Afficher la valeur de la crête. Et dans les propriétés de la crête, on change la couleur (R:74 G:166 B:207). Et on diminue la valeur Durée de la crête à 1000.

Image6

On passe à l'onglet Affichage pour modifier l'apparence de la barre de progression.

Tout d'abord, il faut changer le sens en Vertical. Ensuite, décocher Espacement. Enfin, changer la couleur toujours dans le même bleu que depuis le debut (R:74 G:166 B:207). Enfin, mettre 100 en transparence (cf. Image6).

Il ne reste plus qu'à regler la valeur max. Celle-ci va dépendre de votre carte wifi. Effectuez le réglage en fonction des valeurs suivantes :

• 802.11 - 2000000 (rare)
• 802.11a - 54000000
• 802.11b - 11000000
• 802.11g - 54000000 (le plus courant)

c) Le décor

Pour finir, il ne reste plus qu'à ajouter le contour et le fond. Pour harmoniser la config, on va encore utiliser 3 contrôles (deux pour le contour et un pour le fond). Et on va utliser les mêmes réglages que lors des deux parties précédentes.

Comme on l'a déjà fait deux fois dans cette leçon et que ce n'est pas très difficile à faire, je ne vais pas détailler la marche à suivre. Vous devriez être capable de le faire tout seul. Il suffit juste de modifier la position et la taille par rapport à ce que l'on a déjà fait

Si vous êtes observateur, vous aurez surement noté que la grille noire des graphiques étaient dessiné en dessous des éléments bleus

Information : C'est très peu visible donc cette étape est vraiment facultative. C'est seulement si vous êtes perfectionniste comme moi

Pour corriger le problème, nous allons mettre, par dessus les 3 contrôles qui posent problème, un contrôle texte vide (sans texte) qui servira juste à afficher la grille.

Utilisez les mêmes réglages pour la grille que ceux utilisés précédemment.

Nous voici (enfin?) arrivé à la fin de cette 7eme leçon sur Samurize. L'affichage de graphique et de barre de progression n'a plus de secret pour vous maintenant

Bravo Lefreut, comme d'habitude c'est super, merci

Merci beaucoup pour le temps que tu dois passer à nous rédiger tout ces super tutos qui me premette d'avancer
Voilà mon bureau actuel:
[img=http://img49.imageshack.us/img49/7894/bureau6iv.th.jpg]

Merci pour ce tuto clair et précis, cepandant je suis franc, je n'utiliserais pas ce tuto :p

Ce que j'ai déjà me suffit et j'ai tout obtenu grâce à toi...

Merci, merci mille fois ! (petit rappel : "mille" est invariable)

Merci à vous

Livan -> attend les prochains tutos, ils pourraient te plaire

salut a tous Je suis nouveau sur le forum et je découvre.
Par contre peut on me dire ou trouver les premières leçons (ici la 7)
Merci d'avance (je vais quand même continué a chercher)

bienvenue jfjbest

si tu souhaites te présenter, tu peux le faire dans ce topic

pour répondre à ta question, direction la table des matières

Merci

Salut,

Merci pour ce super tuto Lefreut...je sais pas s'il va me servir mais il est bien quand même .
Sinon, c'est pas que ça me dérange mais bon: A un moment, dans le tuto il est dit que le panneau du compteur de performance est en anglais mais moi je l'ai en français. Donc à la place de ce qu'il est écrit, je crois, que dans objet de performance faut mettre: interface de réseau puis octets reçus/s ou octets envoyés/s, non?

@+

Donc c'est parce que mon Windows est en anglais que j'ai le panneau en anglais

Oui, c'est bien interface de réseau puis octets reçus/s ou octets envoyés/s