Premier programme XUL

Pour écrire une interface XUL, il vous faut deux choses:
- Un simple éditeur de texte.
- Le navigateur Firefox qui affichera le code XUL.

Le code d'une interface graphique XUL se compose de balises XML prédéfinies, et de code JavaScript pour prendre en compte les actions de l'utilisateur. D'autres élements, d'autres formats pourront aussi être utilisés, mais cela, on le verra plus tard.

Le code XUL commence par une définition d'un espace de nom avec la propriété xmlns, qui est toujours la même:

xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"

Il se place dans une fenêtre, qui se crée avec les balises <window>.
Cela donne le modèle complet suivant:

<?xml version="1.0" encoding="iso-8859-1"?>
<window
   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
</window>

Ce modèle assez obscur une fois défini, on le réutilisera par copier-coller et n'aura plus besoin, dans une premier temps tout au moins de s'occuper de ce qu'il signifie.

Afficher un texte

Notre premier exemple affichera simplement le texte "Salut le Monde!".
Pour ce faire, il faut placer dans la fenêtre que nous avons créée avec les balises <window>, un composant textuel.

Le composant est la balise "description" et le texte est assigné à l'attribut "value" de cette balise:

<description value="Salut le Monde!" />

L'exemple complet

Nous donnons un identifieur à la fenêtre

id="hello"

ainsi que des dimensions avec les attributs height (hauteur) et width (largeur):

width="300" 
height="300"

Donc finalement:

<?xml version="1.0" encoding="iso-8859-1"?>
<window  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
   id="hello"
   width="300"
   height="300"
>
    <description value="Salut le Monde!" />
</window>

Voir les fichiers

Démo: code.zip