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, badschemer, pour créer des jeux de couleurs de façon plus confortable. Il est aussi possible d'y aller à la main pour faire quelque chose de plus personnalisé, et c'est ce que nous allons voir.

Voici un exemple de contenu d'un jeu de couleurs vide :

<?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>

  <!-- On place ici les différentes informations sur le style -->

</style-scheme>

Quelques explications sur les balises utilisées :

<?xml version="1.0" encoding="UTF-8"?>

Cette ligne est la première ligne de quasiment tous les fichiers en xml. Il indique qu'on utilise la version 1.0 du xml avec un encodage de caractères en utf-8.

<style-scheme id="exemple" _name="Exemple" version="1.0">

• id est un identifiant pour le jeu de couleurs, qu'il est conseillé de mettre en minuscule.
• _name est le nom du jeu de couleurs que Gedit affichera dans l'onglet Police et Couleurs, dans les Préférences.
• version est la version des styles de texte que vous utilisez. Pour l'instant on n'a qu'une seule version, la 1.0, donc autant la laisser telle quelle.

<author>Auteur</author>

• C'est assez clair, non ?

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

• Une courte description du jeu de couleurs que vous créez/modifiez est affichée dans l'onglet Police et Couleurs, dans les Préférences. C'est ici qu'il faut l'indiquer.

<!-- On place ici les différentes informations sur le style -->

• Le texte dans la balise est un commentaire, c'est-à-dire que vous pouvez écrire ce que vous voulez ici sans que cela ne soit pris en compte. Histoire de vous y retrouvez dans ce que vous écrivez, usez-en !

Pour éviter de faire des fichiers deux fois plus lourds que nécessaire, n'en abusez pas non plus, sauf si vous débutez.

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

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 hexadécimale, par exemple :

foreground="#FFFFFF"

Mais il faudra alors rentrer manuellement chacune des couleurs. Et si vous comptez appliquer la même couleur à plusieurs styles ? 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 :

<color name="gris" value="#bbbbbb"/>
<color name="blanc" value="#eeeeee"/>
<color name="jaune" value="#fce94f"/>
<color name="kaki" value="#617200"/>

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. Voir la section des greffons de Gedit.

Si vous en utilisez, votre fichier de style ressemblera alors à ça :

<?xml version="1.0" encoding="UTF-8"?>
<style-scheme id="base" _name="Base" version="1.0">

  <author>Vous</author>
  <_description>Ceci est un fichier de base pour faire son thème.</_description>
  
  <!-- Aidez-vous de ce tutoriel pour faire votre propre style : 
  http://doc.ubuntu-fr.org/creer_un_jeu_de_couleurs_pour_gedit
  -->
  
  <!-- Couleur : facultatif -->
  <color name="" value="">
  <!-- name : le nom de la couleur à utiliser, value : la valeur hexadécimale (exemple #003366) --></style-scheme>

Voila le plus intéressant : les styles ! Ce que vous allez colorer, afficher en gras… selon vos envies. Un style se définit comme tel :

<style name="nomdustyle" parametre="valeur" autreparametre="autrevaleur"/>

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.

Voici la liste des paramètres disponibles :

• bold : afficher du texte en gras.
• italic : afficher du texte en italique.
• underline : afficher du texte en souligné.
• strikethrough : barrer du texte.

Pour ces quatre paramètres, il faut donner une valeur booléenne : true pour afficher cet effet, false dans le cas contraire. Par définition, ces paramètres sont réglés sur false. Cependant, il se peut que deux styles se chevauchent, et qu'un texte s'affiche en gras alors que vous le voulez sans l'effet de gras quoi qu'il arrive. Dans ce cas-là, annoncez explicitement le paramètre en false.

• 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 du style.
• background : définir la couleur de fond du style.
• line-background : Si le texte du style que vous désignez occupe au moins le premier caractère d'une ligne, alors line-background colorera 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 ou pour le style bracket-match (voir plus bas).

Ces trois derniers paramètres demandent une couleur. Vous pouvez indiquer une valeur hexadécimale : #000000 , ou bien un nom donné à une couleur (voir ci-dessus la balise couleur).

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.

Gedit est un éditeur de texte avant tout destiné à programmer, de ce fait il peut formater du code, et ça passe aussi par les styles. Les styles que vous allez utiliser sont définis dans des fichiers bien spéciaux appelés "définitions de langage". Ces fichiers sont localisés normalement dans le dossier : /usr/share/gtksourceview-2.0/language-specs/ , sinon entrez :

find / -name def.lang

Ce dossier contient des définitions de langage pour de nombreux langages, vous devez sûrement voir dans le dossier de nombreux fichiers .lang. Tous ces langages font appel à des styles qui ont été définis dans le fichier def.lang de ce dossier, ce qui en fait le fichier le plus important d'entre tous les autres. Ensuite, chaque langage définit ses propres styles en indiquant à quelle partie du texte appliquer quel style de def.lang. Ce qui veut dire que vous pouvez définir des styles pour chacun des langages en y allant au cas-par-cas. Mais comme c'est long et lourd, il vaut mieux définir des styles par défaut, et indiquer des styles bonus après ça. Pour utiliser le style d'un langage, il faut indiquer son style et son fichier. Un style par défaut est défini comme ceci :

<style name="def:style" parametre="valeur" autreparametre="autrevaleur"/>

Parce que les styles par défaut sont dans le fichier def.lang Mais si vous voulez définir un style pour le C uniquement, il faut d'abord voir quels styles sont définis dans le fichier c.lang : ouvrez-le et cherchez les lignes du genre :

<styles>
        <style id="comment"           _name="Comment"             map-to="def:comment"/>
        <style id="printf"            _name="printf Conversion"   map-to="def:special-char"/>
        ...
</styles>

Les noms des styles sont dans le paramètre id: si vous voulez formater le style comment (voir plus bas), il vous faudra l'appeler ainsi :

<style name="c:comment" parametre="valeur" autreparametre="autrevaleur"/>

Le paramètre _name indique un nom plus complet pour le style. Le paramètre map-to dit quel style appeler pour le formatage si aucun style n'a été précisé. Si vous ne précisez pas de style pour comment, on ira prendre le style comment par défaut. Autre information, l'organisation des styles pourrait changer lors du passage à la version 3 de Gedit. Ce qui n'est pas pour tout de suite

Bien, passons à ces styles par défaut. Vous trouverez ci-dessous tous les noms des styles, tous précédés du préfixe def: , comme ça ceux qui lisent la doc un peu vite peuvent tout de suite copier/coller les noms des styles Certains styles, s'ils ne sont pas définis, adoptent les mêmes propriétés qu'un autre style. On peut former ainsi des "familles de styles" qui sont ici représentées par des décalages sur la droite. À titre d'exemple, si le style def:shebang n'est pas défini, comme on peut dire que def:shebang est le "style fils" de def:comment, alors le style def:shebang sera identique à def:comment. Si par contre def:comment n'est pas défini, n'ayant pas de "style parent" alors def:comment s'affichera comme du texte.

• 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, par exemple : #!/bin/bash .
  • def:doc-comment : Pour les commentaires contenant du texte destiné à la documentation du programme, la documentation en question 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.

• def:special-char : Pour désigner des "caractères spéciaux" : par exemple en C, on peut utiliser des caractères comme %s ou \n.
• def:constant : Pour désigner des valeurs constantes. Lorsque vous écrivez "variable=123", 123 est une valeur qui ne changera jamais. variable par contre, elle, variera (c'est le but aussi ). Les styles qui suivent correspondent à différentes catégories de 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 les valeurs flottantes, par exemple 2.3e10 .
    • 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.

• def:identifier : pour des identifiants de variable.
  • def:function : pour les identifiants de fonction.
  • def:builtin : Pour les identifiants de fonction de type Built-in, par exemple abs en Python.

• def:statement : Le terme général pour désigner les deux styles qui suivent.
  • def:operator : Pour désigner les opérateurs : +, *, etc.
  • def:keyword : pour les mots-clés comme if, else, switch, etc.

• def:type : Pour les types de données : int, double, char…

• def:preprocessor : Pour les directives de préprocesseur. Certains langages indiquent au compilateur les librairies à importer, ces lignes situées au début du fichier sont appelées directives de préprocesseurs. Plus d'information sur Wikipédia
• 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…
• def:underlined : Tout ce qui doit être souligné, par exemple en HTML les liens, ou les adresses mail. Si vous voulez un peu de folklore, vous pouvez décider que ces textes soient affichés en italique, mais pensez un peu aux autres, par pitié appliquez seulement un soulignement à ce style si vous le définissez.

Petit rappel de comment définir un de ces styles :

<style name="def:comment" parametre="valeur" autreparametre="autrevaleur"/>

Sur cette page on a vu comment formater le texte. En partie. Peut-être aimeriez-vous colorer certaines parties de texte qui n'ont pas encore de style ? Il faudra alors créer le style. Et pour créer le style, ça se fait directement dans les fichiers de définition de langage vus plus haut. Il n'y a pas encore de page française pour expliquer comment créer ou modifier des définitions de langage. Vous trouverez plus bas des liens vers une documentation et un tutoriel, en anglais.

Si vous cherchez des indications supplémentaires sur la coloration du texte ou si ce tuto vous semble flou, n'oubliez pas de contacter le(s) contributeur(s).

• Documentation pour créer un fichier lang (en)
• Un tutoriel pour créer un fichier lang (en)

Contributeurs : Zarmakuizz.