Ajax JavaScript CSS HTML 5 Gecko XUL Forum

Créer une application XUL

Pour créer une premier programme d'exemple "Hello World!", il nous faut installer un environnement de développement et placer dans un répertoire la structure de fichier indispensable à XULRunner.

L'environnement de développement

Commencer par télécharger XULRunner et l'installer dans un répertoire, par exemple:

c:\xulrunner

Ce n'est pas nécessaire si on a installé Firefox 3.

Structure de fichiers

Toute application XUL utilise au moins quatre fichiers:

Ces fichiers sont enregistrés dans une arborescence, que vous placez dans le répertoire de l'application:

chrome
   | content
       | hello.xul
   | chrome.manifest
defaults
   | preferences
       | pref.js
application.ini

On a donc deux répertoires principaux: chrome et default. Chacun a au moins un sous-répertoire.
A coté de content on peut aussi ajouter un sous-répertoire locale pour les traductions des fichiers.

Le fichier application.ini

Ce fichier indique la version de Gecko requise pour faire fonctionner l'application. Elle contient aussi des informations de version concernant celle-ci et éventuellement le copyright:

[App]
Version=1.0
Vendor=Me
Name=hello
BuildID=numéro
ID={id généré par un outil}
[Gecko]
MinVersion=1.8

Les indications de version MinVersion et éventuellement MaxVersion, correspondent à la version de XULRunner utilisée pour développer le programme.
Les champs Name (nom de l'application, repris dans chrome.manifest) et BuildID sont requis.

Le fichier chrome.manifest

Ce fichier définit les chemins ou seront trouvés les fichiers nécessaires à l'application.
Il est placé à la racine du répertoire chrome, et il indique le chemin des fichiers XUL et autres ressources, normalement dans content et éventuellement locale.
Généralement ces deux répertoires sont aussi à la racine de chrome.

content hello file:content/

Dans cet exemple, les fichiers de l'application hello ont été enregistrés directement dans le sous-répertoire content. Donc si l'application est dans le répertoire MonApplication, le chemin complet sera:

c:\MonApplication\chrome\content\hello.xul

Le prefixe peut être file: pour des fichiers et jar: pour une archive.

Le fichier de préférences

Le fichier pref.js est utilisé par XULRunner pour démarrer l'application. Il contient l'URI du fichier XUL d'interface de base, lequel peut utiliser d'autres fichiers XUL.

pref("toolkit.defaultChromeURI", "chrome://MonApplication/content/hello.xul");

Le suffixe chrome ne désigne par le sous-répertoire chrome dans le chemin sur le disque mais indique une structure de fichier particulière. Le répertoire chrome est implicite.

Premier programme

Il affiche "Salut le Monde!", comme dans l'exemple précédemment vu.

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window id="quelqueID" title="Hello" width="600" height="600" 
     xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<description value="Salut le Monde!" />
</window>

L'espace de nom xmlns est standard, les autres paramètres dépendent de l'application. La feuille de style est le fichier par défaut, on doit choisir un identificateur et l'assigner à id, un titre, les dimmensions de la fenêtre.

Lancer le programme

Le programme est donné en paramètre à l'application XULRunner:

\xulrunner\xulrunner.exe application.ini

On peut lancer l'application avec l'exécutable firefox.exe de Firefox 3 à la place de xulrunner.exe.

Exemple