XML-UI

XML-UI permet la création dynamique d'interfaces utilisateurs pour la gestion de données provenant d'un document XML.
Les contrôles graphiques de l'interface utilisateur sont définis dans un autre document XML avec les noms des éléments du document que l'on souhaite modifier. D'autre part XML-UI comprend la présentation de plusieurs volets s'enchaînant les uns à la suite des autres au travers de liens, ainsi que la gestion optionnelle des éléments ou le parcours d'une collection d'éléments.
XML-UI peut être utile pour offrir une interface utilisateur afin modifier des paramètres issues de fichiers de configuration en XML.

Exécution

XML-UI nécessite le parseur XML de Microsoft qui est installé sur votre machine si vous avez déjà une version d'Internet Explorer 4.01 ou supérieure.
L'application XML-UI doit être exécutée avec deux arguments :

XMLUI doc_xml docUI_xml

où doc_xml est le chemin et le nom du fichier XML à modifier, et docUI_xml le chemin et le nom du fichier XML décrivant les éléments de l'interface utilisateur, leurs associations avec les éléments de doc_xml, ainsi que la navigation entre les différents volets.
Je vous propose plusieurs exemples à examiner pour faire vos premiers pas avec XML-UI. Le premier exemple s'attarde d'avantage sur une description générale d'XML-UI. Vous pourrez vous reporter à la rubrique "Références" de la documentation pour lister tous les contrôles d'interface utilisables dans XML-UI.

Exemples

Exemple 1

Le premier exemple est la gestion d'une liste de contacts représentée dans le fichier Contacts.xml et que l'on ouvrira dans XML-UI avec le fichier d'interface utilisateur ContactUI.xml en double-cliquant sur le lien "Contacts".

L'élément document de Contacts.xml est "CONTACTS" ; celui-ci contient une collection d'éléments nommés "CONTACT" de sous-élements "NOM", "PRENOM" et "EMAIL".
Voici un extrait du document XML :

<CONTACTS>
<CONTACT>
<NOM>Goetzmann</NOM>
<PRENOM>Bertrand</PRENOM>
<EMAIL>bgoetzmann@object-everywhere.com</EMAIL>
</CONTACT>
<CONTACT>
...
</CONTACT>
</CONTACTS>

Quand au document ContactUI.xml, celui-ci doit obéir à la dtd XML-UI.dtd pour garantir que celui-ci est valide (à venir) : l'élément document doit être "XML-UI" et contenir au moins un sous-élément de nom PANEL avec un attribut "name" fixé à "default ". Les contrôles graphiques définis sous cet élément seront créés dynamiquement pour constituer le premier volet qui apparaîtra à l'écran.
Nous trouvons donc dans ContactUI.xml :

<?xml version="1.0" encoding="ISO-8859-1"?>
<XML-UI>
<PANEL name="default" title="Contacts" nodes="CONTACTS/CONTACT" navigation="yes" crd="yes">
<EDIT node="NOM" desc="Nom :" width="200"/>
<EDIT node="PRENOM" desc="Prénom :" width="200"/>
<EDIT node="EMAIL" desc="email :" width="200"/>
</PANEL>
</XML-UI>

Tout d'abord, l'attribut "encoding" de la déclaration XML de la première ligne permettra la présence des caractères accentués. Ici l'élément document "XML-UI" ne comporte qu'un sous-élément "PANEL" dont l'attribut "name" est bien "default ".
La valeur de l'attribut "title" sera utilisée comme nom de fenêtre de l'application XML-UI et aussi affichée dans le volet supérieur.
L'attribut "nodes", quand à lui, opère une sélection vers le document doc_xml: ici on souhaite gérer tous les éléments "CONTACT" placés sous "CONTACTS".
On examinera l'exemple 3 pour préciser une sélection qui soit relative à celle définie pour un autre volet.
Pour permettre une navigation dans une collection d'éléments de doc_xml, il suffit d'affecter la valeur "yes" à l'attribut "navigation" pour faire apparaître la barre de navigation, tandis que l'attribut "crd" permettra l'ajout ou la suppression d'un nouvel élément.
Sous l'élément "PANEL" nous trouvons les éléments qui seront représentés dans XML-UI par des contrôles fenêtrés et comportant un attribut "node" précisant le nom du sous-élément ou de l'attribut de "CONTACT" auquel le contrôle sera lié. Pour spécifier qu'il s'agit d'un nom d'attribut, celui doit être précédé du caractère "@".
Dans la barre de boutons, le bouton "Valider" permet de placer en mémoire les données saisies dans les différents contrôles fenêtrés dans le volet présenté, tandis que la sélection du bouton "Annuler" initialisera ces mêmes contrôles avec les données en mémoire.
Une sélection du bouton "Enregistrer" équivaut à une validation puis à l'enregistrement des données en mémoire dans le fichier doc_xml passé en argument.

On pourra fermer l'application avec les boutons "OK" et "Annuler" situés en bas à droite de la fenêtre de l'application. Cliquez sur "OK" pour enregistrer les modifications avant fermeture, et sur "Annuler" pour fermer l'application sans enregistrer.

Exemple 2

Le deuxième exemple montre une utilisation des liens pour naviguer entre trois volets différents et modifier des options de configuration du fichier XML Liens.xml et que l'on ouvrira, dans XML-UI, avec le fichier d'interface utilisateur LiensUI.xml en double-cliquant sur le lien "Liens".

Le fichier LiensUI.xml définit quatre volets dont les noms sont "default", "activex", "eai" et "ids". Utiliser plusieurs volets avec des liens, définis avec l'élément "LINK", pour aller d'un volet à un autre, permet de regrouper de manière logique, dans chaque volet, des paramètres à modifier.
C'est l'attribut "dest" de l'élément "LINK" qui définit quel est le volet qui apparaîtra. En cas de besoin, le bouton "Volet précédent" permettra de revenir au volet précédent et le bouton "Début" vous ramènera au volet "default ".

Exemple 3

La troisième exemple est le plus sophistiqué. On souhaite modifier une série d'articles contenus dans le fichier articles.xml. Cliquer sur le lien "Articles" pour modifier ce fichier avec le fichier de description d'interface articlesUI.xml.

L'interface fait ici usage de tous les contrôles fenêtrés d'XML-UI.
Chaque article est décrit par les éléments "titre" ou "description" par exemple, et possède un corps qui une collection d'éléments "para".
Dans l'interface utilisateur, le contrôle LISTBOX permet de représenter de manière synthétique l'ensemble des paragraphes d'un article. La rubrique "Références" de la documentation décrit l'utilisation de ce contrôle pour ajouter, supprimer ou modifier le texte afférent à un élément.
L'élément "LISTBOX" du fichier articlesUI.xml contient l'attribut "subpanel" qui, lorsque l'on aura double-cliqué sur une ligne du contrôle, fera apparaître une boîte de dialogue contenant le volet précisé dans celui-ci.
Au volet "corps" correspond la chaîne de sélection "./corps" (attribut "nodes") pour signifier que la sélection, dans le fichier articles.xml, s'opérera à partir de la chaîne de sélection du volet appelant.
D'autre part le contrôle LISTBOX étant rattaché à l'élément "para", les contrôles du volet sont liés à des attributs de cet élément.

Ressource

Télécharger XML-UI

Sommaire

Exécution
Exemples
Ressource

Début