✎ creer_un_jeu_de_couleurs_pour_gedit [Wiki ubuntu-fr]

Vous affichez une ancienne révision du document ! Si vous l'enregistrez, vous créerez une nouvelle version avec ce contenu.

----

====== Créer un jeu de couleurs pour gEdit ======
Cette page indique comment créer un jeu de couleurs pour gEdit.

Lorsque vous écrivez un code source, vous avez plusieurs styles de texte : les variables, les types de fonction/variable...
gEdit peut colorer ces styles de texte, pour le plus grand plaisir de nos yeux délicats.
Un jeu de couleur prend la forme d'un fichier xml, attribuant des effets de texte à un style de texte déjà défini.

Un programme existe, [[http://www.dabj01.co.cc/badschemer.php|badschemer]], pour créer des styles de façon plus confortable. Il est aussi possible d'y aller à la main pour faire quelque chose de plus personnalisé. ;-)

===== Fichier de départ =====

Voici un exemple de contenu d'un jeu de couleurs vide : 
<code><?xml version="1.0" encoding="UTF-8"?>
<style-scheme id="exemple" _name="Exemple" version="1.0">

<author>Auteur</author>
  <_description>Mettez une description du thème (ce qu'il évoque, l'origine d'un tel thème...).</_description>

</style-scheme></code>

Quelques explications sur les balises utilisées : 
<code><style-scheme id="Exemple" _name="Exemple" version="1.0"></code>
  * id est un identifiant pour le jeu de couleurs, qu'il est conseillé de mettre en minuscule.
  * _name est le nom que gEdit affichera dans l'onglet Police et Couleurs, dans les Préférences.
<code><author>Auteur</author></code>
  * C'est assez clair, non ? :-)
<code><_description>Mettez une description du thème (ce qu'il évoque, l'origine d'un tel thème...).</_description></code>
  * Une courte description du thème est affichée dans l'onglet Police et Couleurs, dans les Préférences. C'est ici qu'il faut l'indiquer.

Toutes vos prochaines balises seront à placer entre </_description> et </style-scheme>.

===== Décorez vous-même les styles =====
==== Les balises couleur ====
Vous pouvez appliquer différents effets à du texte, notamment le colorer. Lorsqu'un paramètre vous demande une couleur, vous pouvez seulement indiquer une valeur, exemple : 
<code>foreground="#FFFFFF"</code>
Mais il faudra alors rentrer manuellement chacune des couleurs. Et si vous comptez appliquer la même couleur à plusieurs styles de texte ? Et si vous voulez changer d'un coup la couleur de ces mêmes styles ?
Une méthode plus rapide, et aussi plus claire, est de donner des noms à des couleurs.

Par convention on met ces indications de couleur tout de suite après la balise </_description>.

Voici un exemple de couleurs que vous pouvez définir : 
<code><color name="gris" value="#bbbbbb"/>
<color name="blanc" value="#eeeeee"/>
<color name="jaune" value="#fce94f"/>
<color name="kaki" value="#617200"/></code>
Ainsi vous définissez vos propres valeurs de gris, de blanc, et ainsi de suite. Si vous trouvez qu'une certaine valeur de jaune est mal appropriée par rapport aux autres couleurs, vous avez juste à la modifier :-) 
Ça tombe bien, gEdit possède un greffon pour sélectionner une couleur et l'insérer dans le document. :-D

==== Les balises de style ====
Voila le plus intéressant : les styles !
Un style se définit comme tel : 
<code><style name="nomdustyle" parametre="valeur" autreparametre="autrevaleur"/></code>
La liste des styles personnalisables est longue et aucune documentation claire n'existe à ce jour. Vous trouverez donc ci-dessous une liste non-exhaustive des styles utilisables.

=== Liste des paramètres ===

Voici la liste des paramètres disponibles : 
  *bold : afficher du texte en gras. Mettre la valeur true pour le mettre en gras, false étant la valeur par défaut.
  *italic : afficher du texte en italique. Mettre la valeur true pour le mettre en italique, false étant la valeur par défaut.
  *underline : afficher du texte en souligné. Mettre la valeur true pour le mettre en souligné, false étant la valeur par défaut.
  *strikethrough : barrer du texte. Mettre la valeur true pour barrer le texte, false étant la valeur par défaut.
  *use-style : utiliser un style déjà défini. Voir plus bas la liste de style définissables.
  *foreground : définir la couleur du texte. Pour la valeur, vous pouvez indiquer une valeur hexadécimale : #000000 , ou bien un nom donné à une couleur (voir ci-dessus la balise couleur).
  *background : définir la couleur du fond. Vous pouvez indiquer une couleur de la même façon que pour foreground.
  *line-background : Si le style que vous désignez occupe au moins le premier caractère d'une ligne, alors line-background coloriera le fond de tout ce qui se trouve sur la ligne à droite du style en question. Dans ce cas, et si un autre style doit s'appliquer sur la ligne sur la droite, la propriété background prendra le dessus sur la line-background à cet endroit-là. Ce paramètre est difficile à bien placer, il peut être utilisé pour les commentaires par exemple.

=== Liste des styles de base ===
Un style est défini au paramètre name. Cette partie liste tous les styles communs.
  * text : Désigne le texte en général.
  * selection : Désigne le texte sélectioné (surligué avec le curseur)
  * selection-unfocused : Lorsque vous quittez la fenêtre de gEdit où vous avez sélectionné un texte, vous pouvez appliquer des effets à la sélection de sorte à voir ce que vous aviez sélectionner avant de regarder ailleurs. Sinon, les valeurs adoptées seront celles de selection.
  * current-line : gEdit propose de mettre en valeur la ligne où se trouve le curseur (voir Préférences). current-line définit les effets appliqués sur cette ligne.
  * line-number : gEdit propose d'afficher une colonne indiquant les numéros de ligne (voir Préférences). line-number définit les effets appliqués à cette colonne. Les effets de texte tels bold ou underline ne fonctionnent pas.
  * cursor : Définit les propriétés du curseur. Les effets de texte tels bold ou underline ne fonctionnent pas.
  * secondary-cursor : Il semblerait que cette fonctionnalité soit utilisée pour certaines langues, par exemple pour écrire en chinois une zone de préédition apparait en créant un deuxième curseur. Vous pouvez colorer secondary-cursor d'une couleur différente de cursor, les propriétés des deux styles étant les mêmes.
  * bracket-match : gEdit propose, lorsque vous avez un duo de parenthèse et que vous mettez votre curseur sur une des parenthèses, de mettre en valeur l'autre parenthèse.
  * bracket-mismatch : Cette fonctionnalité n'a pas encore été implanté dans gEdit. Le principe étant de montrer les erreurs de parenthésage, par exemple (] où le crochet prend la place d'une parenthèse fermée.
  * search-match : Lors d'une recherche, plusieurs termes sont colorées : un qui est sélectionné, les autres qui ne le sont pas. search-match vous permet d'appliquer des effets sur ces termes.

=== Les styles propres aux langages de programmation ===
Dans gEdit, chaque langage possède son propre fichier de spécification, ce qui est tant mieux pour savoir quels sont les mots à considérer comme étant un commentaire, une variable, etc.
Le système actuel sur lequel fonctionne ces fichiers est voué à changer dans la prochaine version de gtk, la version actuelle de gtk étant la 2.6 . De ce fait, cet article contiendra une courte liste résumant les styles applicables pour tous les langages de programmation, et il vous faudra explorer un peu pour plus d'effets.

gEdit  peut appliquer à un même style plusieurs effets différents selon le langage utilisé.
Si vous ne pensez pas utiliser d'effets différents à un style, vous pouvez définir les effets liés à un style comme suit : 
<code><style name="text" foreground="noir" background="blanc" /></code>
le style text sera le même pour tous.
Cependant, pour indiquer un style différent pour un langage en particulier, il suffit d'indiquer dans le nom les initiales du langage utilisé suivi du style, par exemple pour le langage C : 
<code><style name="c:variable" foreground="rose"/></code>
Lorsque vous ouvrirez un fichier contenant du code écrit en C, les variables prendront une couleur "rose" (si vous l'avez définie).
Pour les autres langages, on utilise le mot-clé def : 
<code><style name="def:variable" foreground="jaune"/></code>
Si vous avez défini une couleur "jaune", les variables dans n'importe quel langage s'afficheront en "jaune".

Pour savoir s'il faut utiliser le mot-clé def: ou pas : 
def: s'applique à beaucoup de styles propres aux langages de programmation. Vous pouvez regarder dans le fichier def.lang situé en /usr/share/gtksourceview-2.0/language-specs/def.lang tous les styles définis dans les lignes : 
<code><style id="unstyle" .../></code>
Pour colorer le style unstyle, vous devez écrire def:unstyle .

Dans le même dossier, vous pouvez voir différents fichiers .lang, par exemple c.lang. Au niveau de : 
<code><styles>
        <style id="comment"           _name="Comment"             map-to="def:comment"/>
        <style id="error"             _name="Error"               map-to="def:error"/>
        <style id="string"            _name="String"              map-to="def:string"/>
               
           ...
        
        <style id="printf"            _name="printf Conversion"   map-to="def:special-char"/>
        
           ...
        
    </styles></code>
Le contenu qui nous intéresse est l'id.
Ou bien vous voulez choisir précisément le style printf, ce qui donnera ça : 
<code><style name="c:printf" foreground="#rose" background="#violet" /></code>
Ou bien vous ne choisissez pas ce style et le style en question prendra une valeur par défaut.
Le fichier .lang vous indique au passage le style par défaut qui sera appliqué, c'est le paramètre map-to. Si ce style par défaut n'est pas défini, ce sera le style du texte qui sera appliqué.
Et si le style text n'est pas défini dans votre jeu de couleurs, votre texte sera écrit noir sur blanc.

À ce niveau, attention à ne pas mélanger ce que vous faites entre le fichier .lang et votre jeu de couleurs .xml : c'est le deuxième qui contient les couleurs et tout le bazar. :-)

Si vous ne comptez pas appliquer d'effets à certains styles spécifiques à un langage, autrement dit si vous voulez y aller simple, alors on va se contenter des styles par défaut. :)
Certains styles sont imbriquées dans d'autre : soit vous vous contentez du style parent, soit vous indiquez à tous les styles fils les effets de texte que vous voulez.
Tous les styles ci-dessous sont déjà précédées par def: pour ceux qui liraient cette doc à toute vitesse.^_^

== Les commentaires ==
  * def:comment : Pour désigner les commentaires.
    * def:shebang : Dans les fichiers de shell, on indique le shell à utiliser en début de fichier avec un shebang.
    * def:doc-comment : Pour les commentaires destinés à la documentation qui sera générée à la compilation.
    * def:doc-comment-element : Utilisé pour les textes du style doc-comment, permet de mettre en valeur certains éléments comme @author.
== Les constants ==
  * def:special-char : Pour désigner des "caractères spéciaux" : par exemple en C, on peut utiliser dans les chaines des "caractères spéciaux" comme %s ou \n.
  * def:constant : Pour désigner des valeurs constantes.
    * def:character : Lorsque vous saisissez un caractère, par exemple 'c' que vous voulez stocker dans une variable de type char
    * def:string : Pour les chaines de caractère cette fois.
    * def:number : Pour les valeurs de nombre.
      * def:floating-point : Pour le point des valeurs flottantes, par exemple le . de 3.14 .
      * def:decimal : Pour des valeurs décimales classiques, comme 1234.
      * def:base-n-integer : Pour des nombres de base-N. Par exemple la valeur hexadécimale d'une couleur comme vous allez en utiliser pour faire un jeu de couleurs : #00abd3.
      * def:complex : Pour des nombres complexes.
    * def:special-constant : Pour des constantes spéciales, par exemple en C la constante **NULL**.
      * def:boolean : pour les valeurs booléennes, **true** et **false**.
== Les identifiants ==
  * def:identifier : pour des noms de variable.
    * def:function : pour les noms de fonction.
    * def:builtin : Pour les fonction de type Built-in, par exemple abs en Python.
== Les états ==
  * def:statement : Le terme général pour...
    * def:operator : Pour désigner les opérateurs : +, *, etc.
    * def:keyword : pour les mots-clés comme if, else, switch, etc.
== Les types ==
  * def:type : Pour les types de données : int, double, char...
== Les autres ==
  * def:preprocessor : Pour les directives de préprocesseur, par exemple en C.
  * def:error : Pour des erreurs d'écriture
    * def:reserved : Certains mots sont "réservés", par exemple en Java : const, goto...
  * def:note : Des notes destinées au programmeur, par exemple TODO, FIXME...
  * def:underlined : Tout ce qui doit être souligné, par exemple en HTML les liens, ou les adresses mail.

===== Liens externes =====

* [[http://library.gnome.org/devel/gtksourceview-2.0/stable/lang-reference.html|Documentation pour créer un fichier lang (en)]]
  * [[http://library.gnome.org/devel/gtksourceview-2.0/stable/lang-tutorial.html|Un tutoriel pour créer un fichier lang (en)]]

----

//Contributeurs : [[utilisateurs:Zarmakuizz]].//

Merci de recopier le code ci-contre pour prouver que vous êtes humain : L U T N H Merci de laisser ce champ vide :

Résumé

Note : En modifiant cette page, vous acceptez que le contenu soit placé sous les termes de la licence suivante : CC Paternité-Partage des Conditions Initiales à l'Identique 3.0 Unported