XML-based User interface Language

Caractéristiques
Extension	.xul
Type MIME	application/vnd.mozilla.xul+xml
Développé par	Fondation Mozilla
Version initiale	Vers 1999
Type de format	Langage de balisage
Basé sur	Extensible Markup Language
Spécification	Format ouvert
Site web	(en) developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL

XML-based User interface Language (abréviation XUL) est un langage de description d’interfaces graphiques fondé sur XML créé dans le cadre du projet Mozilla. XUL se prononce zoul en anglais (pour rimer avec cool, mais aussi en hommage au demi-dieu Zoul dans le film SOS Fantômes).

En août 2015, Mozilla a annoncé que l'utilisation de XUL pour créer des extensions Firefox deviendrait obsolète dans les futures versions au profit de WebExtensions^[1].

Caractéristiques

XUL comprend un ensemble de balises permettant de définir des boutons, des listes, des menus, ou encore des zones d’édition ; en résumé, tous les éléments d’une véritable interface utilisateur. Un tel langage facilite le travail du développeur et permet d’écrire l’interface d’une application aussi aisément qu’une page web.

Le développement d’une application XUL se rapproche du développement d’une application cliente ou client-serveur traditionnelle. À chaque objet graphique sont associés des événements (clic de souris, double-clic, etc.) pour lesquels le développeur doit écrire du code (typiquement en JavaScript) à exécuter par la machine cliente. L’application peut récupérer des données d’un serveur, par exemple via des requêtes HTTP.

Le fait de définir dans un document XML la structure de l’interface graphique permet de réutiliser la même structure d’un environnement à l’autre et même d’un langage de programmation à l’autre. Des moteurs similaires à XUL existent pour GTK+ (Glade), Java, PHP, JavaScript, Flash (MXML), Qt (Qt Designer), wxWidgets(wxXmlResource, fichiers XRC), .Net (XAML) et Android.

Les deux grandes richesses de XUL sont son extensibilité et la facilité de réutilisation d’éléments. Il est possible de définir ses propres balises pour mettre en place des composants complexes et réutilisables en écrivant un fichier XBL (eXtensible Binding Language). Celui-ci comporte, pour chaque nouveau composant qu’il décrit, une partie décrivant l’aspect graphique du composant, par association des éléments graphiques de base par exemple, et plusieurs parties décrivant son comportement, sous la forme de fonctions JavaScript. Les bindings ainsi définis peuvent hériter les uns des autres, et surcharger leurs contenus ou comportements.

Initialement, XUL a été développé afin de permettre de créer facilement l’interface graphique du navigateur web Mozilla. Un moteur XUL est intégré au moteur Gecko de Mozilla. Plus tard, Mozilla a développé XULRunner, pour permettre d’exécuter des applications XUL sans Mozilla ou Firefox, avant de l'abandonner.

Organisation d'une fenêtre

Une fenêtre XUL est conçue comme un emboîtement de « boîtes » rectangulaires. Une boîte contient des sous-éléments qui sont juxtaposés soit verticalement, soit horizontalement. Ces sous-éléments peuvent être des champs de type texte, des listes déroulantes, des champs affichant du code HTML, et ainsi de suite. Ces sous-éléments peuvent aussi être des boîtes, qui elles-mêmes contiendront d’autres éléments. À l’intérieur de chaque boîte, divers paramètres permettent de paramétrer facilement l’alignement des sous-éléments (à gauche, en haut, centré…) ainsi que leur comportement en cas de redimensionnement de la fenêtre (taille fixe, taille proportionnelle…).

L’affichage de tous ces éléments graphiques peut être configuré en utilisant une feuille de style CSS, ce qui facilite l’accès à XUL pour les développeurs web.

Exemple

Comparaison entre quelques lignes de code XUL et HTML qui affichent toutes deux le traditionnel « Hello World! » :

XUL

 <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
   <box>
     <description>Hello world!</description>
   </box>
 </window>

HTML

 <html>
   <body>
     <p>
       Hello World!
     </p>
   </body>
 </html>

XUL et les autres technologies d'interface graphique

XUL facilite la mise au point d’une interface plus évoluée que HTML sur le plan technique. En effet les objets XUL se manipulent via une interface DOM, comme en DHTML. De plus une interface XUL peut récupérer d’un serveur les seules données nécessaires à la mise à jour d’un élément de la page et non l’ensemble de la page elle-même ; ces données peuvent être récupérées en XML et de manière asynchrone, ce qui permet d’utiliser la méthode AJAX en programmation XUL. Ces techniques permettent d’améliorer considérablement les temps de réponse et le confort de l’utilisateur. L’environnement XUL les utilise de manière transparente pour l’utilisateur dans le système des templates (modèles de page) qui permet de générer une partie de l’interface utilisateur à partir de données externes en RDF, sans avoir à écrire une ligne de code Javascript. XUL peut exploiter et interagir avec les diverses ressources de Mozilla dont le SVG.

XUL est aussi un concurrent des technologies client-serveur traditionnelles comme Delphi. XUL offre par exemple l’avantage d’être fondé sur des standards ouverts, tel XML, et sur des logiciels libres : les fichiers de description d’interface sont de simples fichiers texte. Toutefois, XUL ne bénéficie pas du support d’environnements de développement sophistiqués : il faut écrire ou générer des fichiers XML pour décrire l’interface graphique.

Voir aussi

Bibliothèque graphique
XUP (XUL est cité dans la proposition de standard XUP)

Logiciels liés à XUL

XULRunner
Gul 2.0

Références

↑ Kev Needham, « The Future of Developing Firefox Add-ons », sur blog.mozilla.org, 21 août 2015 (consulté le 7 septembre 2015)

Liens externes

Portail de l’informatique

[1] Kev Needham, « The Future of Developing Firefox Add-ons », sur blog.mozilla.org, 21 août 2015 (consulté le 7 septembre 2015)

[1]