Skinning tutorial/fr: Difference between revisions

From Shareaza Wiki
Jump to navigation Jump to search
 
(9 intermediate revisions by the same user not shown)
Line 3: Line 3:
{{StableFr}}
{{StableFr}}


= Tutoriel du Skinning =
= Tutoriel de thématisation =


Dans ces lignes vous allez apprendre à construire un thème (ou skin) pour la télécommande du média player de Shareaza. Le principe et les commande sont identique pour construire un thème complet pour Shareaza.  
Dans ces lignes vous allez apprendre à construire un thème (ou skin) pour la télécommande du média player de Shareaza. Le principe et les commande sont identique pour construire un thème complet pour Shareaza.  
Line 18: Line 18:
= Pour commencer =
= Pour commencer =


Ce guide est divisé en plusieurs parties. La meilleure façon d'apprendre est de passer par l'instruction "[[#Élément|Élément par élément]]" pour faire votre premier thème.
Ce guide est divisé en plusieurs parties. La meilleure façon d'apprendre est de passer par l'instruction "[[#Les éléments d'un thème |Élément par élément]]" pour faire votre premier thème.
* Les thèmes se trouvent dans le dossier : C:\Program Files\Shareaza\Skins (par défaut).
* Les thèmes se trouvent dans le dossier : C:\Program Files\Shareaza\Skins (par défaut).
* Chaque thème à son propre dossier, comme : C:\Program Files\Shareaza\Skins\"Ma Skin".
* Chaque thème à son propre dossier, comme : C:\Program Files\Shareaza\Skins\"Ma Skin".
* Chaque dossier contient les fichiers du thème, ainsi que les fichiers support tels que les images ou les icônes.
* Chaque dossier contient les fichiers du thème, ainsi que les fichiers support tels que les images ou les icônes.
Chaque thème à son fichier de définition, qui est au format XML. Le format XML est un moyen facile de lire du format texte, ressemblant au HTML. Pour pouvoir écrire des fichier XML, il est fortement conseillé d'utiliser un éditeur XML à coloration syntaxique, tel que [http://notepad-plus.sourceforge.net/ Notepad++], [http://www.emeditor.com/ EmEditor] ou [www.pspad.com/fr/‎ PSPad]. Le fichier de définition indique à shareaza, toutes les informations utiles tels que :  
Chaque thème à son fichier de définition, qui est au format XML. Le format XML est un moyen facile de lire du format texte, ressemblant au HTML. Pour pouvoir écrire des fichier XML, il est fortement conseillé d'utiliser un éditeur XML à coloration syntaxique, tel que [http://notepad-plus.sourceforge.net/ Notepad++], [http://www.emeditor.com/ EmEditor] ou [http://www.pspad.com/fr/‎ PSPad]. Le fichier de définition indique à shareaza, toutes les informations utiles tels que :  
* qui a fait le thème.
* qui a fait le thème.
* Quelles sont les parties de l'interface à modifier.
* Quelles sont les parties de l'interface à modifier.
Line 47: Line 47:


{{Anchor|Manifest}}
{{Anchor|Manifest}}
{{Note||'''Astuce :''' Si vous souhaitez recharger votre thème rapidement, appuyez sur les touches '''Ctrl Shift Z'''}}


== Le "Manifest" ==
== Le "Manifest" ==


L'exemple ci-dessus inclus un élément <manifest>, qui spécifie le nom de la skin. Il est important d'inclure de bonnes méta informations à propos de votre skin, de façon à ce que les utilisateurs puissent l'identifier et la rechercher.
L'exemple ci-dessus intègre un '''"manifest"''', qui indique le nom du thème. Il est important d'inclure de bonnes ''méta informations'' à de votre thème, de façon à ce que les utilisateurs puissent l'identifier et la rechercher.
 
Ci-dessous, une référence complète pour l'élément <manifest>.
 
{| border="0" cellpadding="0" style="text-align:left"
|-
 
!style="text-align:center"|<ins>Un manifeste complet comme il devrait l'être tout le temps</ins> :!!style="text-align:center"| <ins>Signification des paramètres</ins> :
 
|-
|
<source lang="xml">
<manifest
name="Mon Petit Thème"
author="Moi"
updatedBy="Lui"
description="Ceci est mon premier thème pour shareaza,
il intègre une image ne filigrane dans la barre de menu principale"
link="http://une.adresse.internet/"
email="mon.adresse@email.com"
version="1.5"
type="Skin"
dir="ltr"
/>
</source>
|
* '''name''' = Le nom du thème.
* '''author''' = La personne qui a créer le thème.
* '''updatedBy''' = Éventuellement si une autre personne que l'auteur fait une mise à jour du thème.
* '''description''' = Une (longue) description (est préférable).
* '''link''' = Optionnel, votre site internet si vous en avez un, sinon l'adresse du site officiel de Shareaza fait l'affaire.
* '''email''' = Optionnel, votre adresse mail, afin de vous contacter pour plus d'informations.
* '''version''' = la version du thème.
* '''type''' = La plupart des thèmes devraient avoir ce tag de rempli, excepté les thèmes de traduction.
* '''language''' = Ne mettre seulement que si le paramètre "type="language"". Il indique le code de langage que la traduction fournit, exemple "en" pour english.
* '''dir''' = La majorité des thèmes peuvent omettre ce paramètre, il est utilisé pour les langues. Les valeurs peuvent être :
**'''ltr''' pour les langues qui s'écrivent de '''gauche vers la droite'''.
**'''rlt''' pour les langues qui s'écrivent de '''droite vers la gauche'''.
|-
|}
{{Note|#ADF993|Tous les attributs sont optionnels excepté le nom.}}
 
== Guide Visuel==
Le guide visuel est une collection de capture d'écran et d'autres démonstrations visuelles indiquant quelles sont les parties du thème par défaut correspondent aux ID (identifiants).


'''Ici, une référence complète pour l'élément &lt;manifest&gt;.'''
[http://shareaza.sourceforge.net/?id=skindocs/xml-default Default.xml] et [http://shareaza.sourceforge.net/?id=skindocs/xml-definitions Definitions.xml] présentent la liste des icônes par défaut de Shareaza ainsi que leurs identifiants correspondants afin d'aider à déterminer comment modifier certaines icônes. La documentation [[Skinning.commandImages/fr|"Commandes & Images"]] devrait être consultée pour connaître la syntaxe exacte afin de remplacer des icônes.
  <source lang="c">
  &lt;manifest
  name="Le Nom de la Skin"
  author="L'auteur qui la créée"
  description="Une longue description est désirée."
  link="http://une.url.pour.la.skin. com/est/applicable/"
  email="votre.@dresse.com"
  version="1.5"
  type="Skin"
  /&gt;</source>


Tous les attributs sont optionnels excepté le nom.
== Les éléments d'un thème ==
* name = Le nom de la skin.
* author = La personne qui a créer la skin
* description = Une longue description de la skin.
* link = Optionnel, votre site internet.
* email = Optionnel, votre adresse mail, afin de vous contacter pour plus d'informations.
* version = Le nombre de révision de la skin.
* type = La plupart des skins devraient avoir ce tag de rempli. Les exceptions sont les skins de traduction.
* language = Inclure seulement si le type (ci-dessus) est "language". Il indique le code de langage que la traduction fournit, exemple "en" pour english.


{{Anchor|Element}}
Cette section liste tous les éléments que l'on peut inclure dans un thème avec des liens pour plus de détails.
=== Eléments de la Skin ===


Cette section liste tous les différents éléments que vous pouvez inclure dans la skin, avec des liens pour plus de détails.
<ins>Description des éléments utiliser :</ins>
'''Description des éléments utiliser :'''
<center>
* '''&lt;colourScheme&gt;''' Spécifies les couleurs du plan. Skinning
{| border="0" cellspacing="0" cellpadding="5"
* '''&lt;watermarks&gt;''' Ajoute des images filigrane aux parties de l'interface.Skinning
|- style="background-color:#FFFFC0"
* '''&lt;windowSkins&gt;''' Change radicalement l'aspect des fenêtres. Skinning
|'''<ins>Élément</ins>'''
* '''&lt;commandImages&gt;''' Change des images affichées sur des barres outils, menus et fenêtres. Skinning.  
|'''<ins>Description</ins>'''
* '''&lt;menus&gt;''' Définit les menus dans le programme. Skinning
|'''<ins>Utiliser pour la</ins>'''
* '''&lt;toolbars&gt;''' Définit les barres outils dans le programme. Skinning
|- style="background-color:#FFFFC0"
* '''&lt;fonts&gt;''' Change les fontes utilisées dans l'interface. Skinning
|[[Skinning.colourScheme/fr|<colourScheme>]]
* '''&lt;documents&gt;''' Fournit le RichDoc affiché sur l'onglet accueil. Skinning
|Indique le schéma de couleurs de l'interface utilisateur utilisé dans le programme.
* '''&lt;dialogs&gt;''' Change le texte affiché dans les dialogues. Traduction
|Thématisation
* '''&lt;commandTips&gt;''' Change le texte affiché dans les tooltips et les messages d'aide. Traduction  
|- style="background-color:#FFFFC0"
* '''&lt;strings&gt;''' Change le texte utilisé dans tout autres messages. Traduction
|[[Skinning.watermarks/fr|<watermarks>]]
* '''&lt;listColumns&gt;''' Change le texte affiché dans les colonnes. Traduction
|Ajoute des images en filigrane à des parties de l'interface.
|Thématisation
|- style="background-color:#FFFFC0"
|[[Skinning.windowSkins/fr|<windowSkins>]]
|Change radicalement l'apparence des fenêtres.
|Thématisation
|- style="background-color:#FFFFC0"
|[[Skinning.commandImages/fr|<commandImages>]]
|Change les images affichées sur les barres d'outils, les menus et les fenêtres.
|Thématisation
|- style="background-color:#FFFFC0"
|[[Skinning.menus/fr|<menus>]]
|Définit les menus du programme.
|Thématisation
|- style="background-color:#FFFFC0"
|[[Skinning.toolbars/fr|<toolbars>]]
|Définit les barres d'outils du programme.
|Thématisation
|- style="background-color:#FFFFC0"
|[[Skinning.fonts/fr|<fonts>]]
|Change la police d'écriture utilisée dans l'interface.
|Thématisation
|- style="background-color:#FFFFC0"
|[[Skinning.documents/fr|<documents>]]
|Fourni RichDoc affiché sur l'accueil.
|Thématisation
|- style="background-color:#FFFFC0"
|[[Skinning.tipMap/fr|<tipMap>]]
|ControlTip map, pour les infobulles.
|Traduction
|- style="background-color:#FFFFC0"
|[[Skinning.controlTips/fr|<controlTips>]]
|Modifie le texte affiché dans les infobulles pour différentes boîtes de dialogue.
|Traduction
|- style="background-color:#FFFFC0"
|[[Skinning.dialogs/fr|<dialogs>]]
|Modifie le texte affiché dans les boîtes de dialogue.
|Traduction
|- style="background-color:#FFFFC0"
|[[Skinning.commandTips/fr|<commandTips>]]
|Modifie le texte affiché dans les infobulles et les messages de commande d'aide.
|Traduction
|- style="background-color:#FFFFC0"
|[[Skinning.strings/fr|<strings>]]
|Modifie le texte utilisé dans tous les autres messages.
|Traduction
|- style="background-color:#FFFFC0"
|[[Skinning.listColumns/fr|<listColumns>]]
|Modifie le texte affiché dans la liste des vues.
|Traduction
|}</center>


====Shareaza Remote Skinning ====
== Compatibilité RTL (de droite à gauche) ==
Alors que les gens du monde entier peuvent profiter de votre thème, vous devriez vous assurer qu'il est (de droite à gauche) compatible RTL. C'est pour les langues qui s'écrivent et se lisent de la droite vers la gauche comme l'hébreu et l'arabe.


Maintenant que vous connaissez les éléments de skinning de shareaza, [[ShareazaRemoteSkinning/fr|faites un essai]] !
=Thématisation de la télécommande de Shareaza=


{{Anchor|Diffuser}}
Maintenant que vous avez abordé les éléments de la thématisation de shareaza, [[Skinning.remote/fr|faites un essai]] !
=== Diffusez vos Skins ===


Vous venez de créer une skin toute fraîche, mais cela n'apportera rien de la gardé pour vous, vrai ? Diffuser une skin Shareaza est très facile, mais quelques points sont à mentionner.
 
* S'assurer que la skin est prête pour le prime time. Tester toutes les fonctions, vérifier qu'il n'y a pas de résultat étrange. Dans la mesure du possible, essayez-la sur un autre ordinateur, un autre OS...
== Diffusez vos thèmes ==
 
Vous venez de créer une skin toute fraîche, mais cela n'apportera rien de la garder pour vous, vrai ? Diffuser un thème Shareaza est très facile, mais quelques points sont à mentionner.
 
* S'assurer que le thème est prête pour le prime-time. Testez toutes les fonctions, vérifiez qu'il n'y a pas de résultat étrange. Dans la mesure du possible, essayez-la sur un autre ordinateur...
* S'assurer que tout est soigné et aussi petit que possible. Si vous avez créé des images, convertissez les en bitmaps 8 bits, 256 couleurs.
* S'assurer que tout est soigné et aussi petit que possible. Si vous avez créé des images, convertissez les en bitmaps 8 bits, 256 couleurs.
* Contrôler le manifeste. Il doit fournir un nom précis à la skin, son type, et toutes autres informations que vous jugez utile.
* Contrôler le manifeste. Il doit fournir un nom précis du thème, son type, et toutes autres informations que vous jugez utile.  
La meilleure façon de compacter et de distribuer une skin Shareaza est de Zipper tous les fichiers, et de tirer parti de l'installateur de skin de shareaza.  
 
La meilleure façon de compacter et de distribuer un thème Shareaza est de zipper tous les fichiers et de tirer parti de l'installateur de thème de shareaza.  
Pour cela :
Pour cela :
* Compacter le dossier skin au format "ZIP".
* Compacter le dossier skin au format "ZIP".
* Renommer l'extension de fichier ("*.Zip") en *.SKS.
* Renommer l'extension de fichier ("*.Zip") en *.SKS.


Ainsi les fichiers skin de Shareaza sont ouvert et installé au bon endroit par les utilisateurs.
De cette façon les fichiers thème de Shareaza seront ouvert et installé au bon endroit par les utilisateurs.


Pour conclure, placez votre skin en partage dans la [http://www.forum-shareaza.fr/Themes-Shareaza.html bibliothèque en ligne] des skins de Shareaza, et partagez-la. Le partage des skins sur Shareaza est très important, car il permet à chacun de les télécharger. Après tout, ne sommes-nous pas là pour ça?
Pour conclure, placez votre thème en partage sur le [http://shareaza.sourceforge.net/phpbb/viewforum.php?f=2 forum officiel] de Shareaza, et partagez-la. Le partage des thèmes sur Shareaza est très important, car il permet à chacun de les télécharger. Après tout, ne sommes-nous pas là partager ?


=== Obtenir de l'aide ===
== Obtenir de l'aide ==


Vous avez besoin d'aide. Vous voulez discuter de votre création, signaler sa "sortie".
Vous avez besoin d'aide. Vous voulez discuter de votre création, signaler sa "sortie".
Si oui, faites un tour sur le forum.
Si oui, faites un tour sur le [http://shareaza.sourceforge.net/phpbb/viewforum.php?f=2 forum].


{{Navigation|Skinning}}
{{Nav1Fr}}

Latest revision as of 21:44, 8 May 2014

  Updated:

This page has been updated on 29 avril 2014 for the release of Shareaza v2.7.x.0.

e
  Contenu stable

Les informations de cette page s'appliquent à toutes les versions de Shareaza tant qu'il n'y a pas de modification majeur.

e

Tutoriel de thématisation

Dans ces lignes vous allez apprendre à construire un thème (ou skin) pour la télécommande du média player de Shareaza. Le principe et les commande sont identique pour construire un thème complet pour Shareaza.

Créer des thème pour Shareaza

Créer un thème est facile. Les thèmes peuvent être simple ou complexe, au choix. Cette page fournie un didacticiel simple et des références détaillées pour la construction d'un thème pour Shareaza.

Avec ce guide vous pourrez faire des :

  1. Thèmes visuels - Changer le thème visuel ou le personnaliser les boutons/mise en page de programme.
  2. Thèmes linguistiques - Traduire le texte dans différents langages.

Pour commencer

Ce guide est divisé en plusieurs parties. La meilleure façon d'apprendre est de passer par l'instruction "Élément par élément" pour faire votre premier thème.

  • Les thèmes se trouvent dans le dossier : C:\Program Files\Shareaza\Skins (par défaut).
  • Chaque thème à son propre dossier, comme : C:\Program Files\Shareaza\Skins\"Ma Skin".
  • Chaque dossier contient les fichiers du thème, ainsi que les fichiers support tels que les images ou les icônes.

Chaque thème à son fichier de définition, qui est au format XML. Le format XML est un moyen facile de lire du format texte, ressemblant au HTML. Pour pouvoir écrire des fichier XML, il est fortement conseillé d'utiliser un éditeur XML à coloration syntaxique, tel que Notepad++, EmEditor ou PSPad. Le fichier de définition indique à shareaza, toutes les informations utiles tels que :

  • qui a fait le thème.
  • Quelles sont les parties de l'interface à modifier.
  • Comment le faire.
  • etc...

Petit exemple

Voici un thème très facile, appelez-le MonPetitTheme.xml. :

<source lang="xml">
<?xml version="1.0" encoding="UTF-8"?>
<skin xmlns="http://shareaza.sourceforge.net/schemas/Skin.xsd " version="1.0">
<manifest name="MonPetitTheme" author="Moi" type="Skin"/>
<watermarks>
 <watermark target="CCoolMenuBar" path="MyWatermark.bmp"/>
</watermarks>
</skin>
</source>

Ce thème spécifie son nom et son auteur et ajoute une image en filigrane à la barre de menu principale, facile, non ? Un thème c'est juste cela, vous changez ce que vous voulez.


Important : Les deux premières lignes de cet exemple ne doivent pas être éditées, ce sont les lignes qui indiquent la version du noyau du thème et non la version de votre skin.



Astuce : Si vous souhaitez recharger votre thème rapidement, appuyez sur les touches Ctrl Shift Z


Le "Manifest"

L'exemple ci-dessus intègre un "manifest", qui indique le nom du thème. Il est important d'inclure de bonnes méta informations à de votre thème, de façon à ce que les utilisateurs puissent l'identifier et la rechercher.

Ci-dessous, une référence complète pour l'élément <manifest>.

Un manifeste complet comme il devrait l'être tout le temps : Signification des paramètres :
<source lang="xml">
<manifest
name="Mon Petit Thème"
author="Moi"
updatedBy="Lui"
description="Ceci est mon premier thème pour shareaza, 
il intègre une image ne filigrane dans la barre de menu principale"
link="http://une.adresse.internet/"
email="mon.adresse@email.com"
version="1.5"
type="Skin"
dir="ltr"
/>
</source> 
  • name = Le nom du thème.
  • author = La personne qui a créer le thème.
  • updatedBy = Éventuellement si une autre personne que l'auteur fait une mise à jour du thème.
  • description = Une (longue) description (est préférable).
  • link = Optionnel, votre site internet si vous en avez un, sinon l'adresse du site officiel de Shareaza fait l'affaire.
  • email = Optionnel, votre adresse mail, afin de vous contacter pour plus d'informations.
  • version = la version du thème.
  • type = La plupart des thèmes devraient avoir ce tag de rempli, excepté les thèmes de traduction.
  • language = Ne mettre seulement que si le paramètre "type="language"". Il indique le code de langage que la traduction fournit, exemple "en" pour english.
  • dir = La majorité des thèmes peuvent omettre ce paramètre, il est utilisé pour les langues. Les valeurs peuvent être :
    • ltr pour les langues qui s'écrivent de gauche vers la droite.
    • rlt pour les langues qui s'écrivent de droite vers la gauche.

Tous les attributs sont optionnels excepté le nom.


Guide Visuel

Le guide visuel est une collection de capture d'écran et d'autres démonstrations visuelles indiquant quelles sont les parties du thème par défaut correspondent aux ID (identifiants).

Default.xml et Definitions.xml présentent la liste des icônes par défaut de Shareaza ainsi que leurs identifiants correspondants afin d'aider à déterminer comment modifier certaines icônes. La documentation "Commandes & Images" devrait être consultée pour connaître la syntaxe exacte afin de remplacer des icônes.

Les éléments d'un thème

Cette section liste tous les éléments que l'on peut inclure dans un thème avec des liens pour plus de détails.

Description des éléments utiliser :

Élément Description Utiliser pour la
<colourScheme> Indique le schéma de couleurs de l'interface utilisateur utilisé dans le programme. Thématisation
<watermarks> Ajoute des images en filigrane à des parties de l'interface. Thématisation
<windowSkins> Change radicalement l'apparence des fenêtres. Thématisation
<commandImages> Change les images affichées sur les barres d'outils, les menus et les fenêtres. Thématisation
<menus> Définit les menus du programme. Thématisation
<toolbars> Définit les barres d'outils du programme. Thématisation
<fonts> Change la police d'écriture utilisée dans l'interface. Thématisation
<documents> Fourni RichDoc affiché sur l'accueil. Thématisation
<tipMap> ControlTip map, pour les infobulles. Traduction
<controlTips> Modifie le texte affiché dans les infobulles pour différentes boîtes de dialogue. Traduction
<dialogs> Modifie le texte affiché dans les boîtes de dialogue. Traduction
<commandTips> Modifie le texte affiché dans les infobulles et les messages de commande d'aide. Traduction
<strings> Modifie le texte utilisé dans tous les autres messages. Traduction
<listColumns> Modifie le texte affiché dans la liste des vues. Traduction

Compatibilité RTL (de droite à gauche)

Alors que les gens du monde entier peuvent profiter de votre thème, vous devriez vous assurer qu'il est (de droite à gauche) compatible RTL. C'est pour les langues qui s'écrivent et se lisent de la droite vers la gauche comme l'hébreu et l'arabe.

Thématisation de la télécommande de Shareaza

Maintenant que vous avez abordé les éléments de la thématisation de shareaza, faites un essai !


Diffusez vos thèmes

Vous venez de créer une skin toute fraîche, mais cela n'apportera rien de la garder pour vous, vrai ? Diffuser un thème Shareaza est très facile, mais quelques points sont à mentionner.

  • S'assurer que le thème est prête pour le prime-time. Testez toutes les fonctions, vérifiez qu'il n'y a pas de résultat étrange. Dans la mesure du possible, essayez-la sur un autre ordinateur...
  • S'assurer que tout est soigné et aussi petit que possible. Si vous avez créé des images, convertissez les en bitmaps 8 bits, 256 couleurs.
  • Contrôler le manifeste. Il doit fournir un nom précis du thème, son type, et toutes autres informations que vous jugez utile.

La meilleure façon de compacter et de distribuer un thème Shareaza est de zipper tous les fichiers et de tirer parti de l'installateur de thème de shareaza. Pour cela :

  • Compacter le dossier skin au format "ZIP".
  • Renommer l'extension de fichier ("*.Zip") en *.SKS.

De cette façon les fichiers thème de Shareaza seront ouvert et installé au bon endroit par les utilisateurs.

Pour conclure, placez votre thème en partage sur le forum officiel de Shareaza, et partagez-la. Le partage des thèmes sur Shareaza est très important, car il permet à chacun de les télécharger. Après tout, ne sommes-nous pas là partager ?

Obtenir de l'aide

Vous avez besoin d'aide. Vous voulez discuter de votre création, signaler sa "sortie". Si oui, faites un tour sur le forum.



Navigation:     Page d'accueil > Skinning tutorial/fr