Leonardi, une approche de l'IHM en Java

Rija RANDRIANO

Cet article n'est qu'un avant goût sur la performance de Leonardi Studio développé par la société Lyria mais je précise que des tutoriaux sont offerts avec le pack d'installation de Leonardi (même avec la version Free) avec plus de 1000 pages (fichiers PDF).

- Titre : Leonardi, une approche de l'IHM en Java

- Auteur : Rija RANDRIANO

- Parution : 30 mai 2007

- Mise à jour : 15 juillet 2007

- Licence : Copyright ® Developpez LLC. Tous droits réservés Developpez LLC. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents et images sans l'autorisation expresse de Developpez LLC. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.

Sommaire

- I. Introduction

- II. Les offres sur le produit Leonardi

- III. Architecture de Leonardi

- IV. Modèle IHM de Leonardi

- V. Premier pas avec Leonardi

- V-A. Description des données (classes)

- V-B. Description de la navigation

- V-C. Leonardi et Java proprement dit

- VI. Les différentes configurations de Leonardi

- VI-A. Configurations requises

- VI-B. Leonardi et Eclipse

- VI-C. Leonardi et Afficheur DHTML/AJAX

- VII. Conclusion

- VIII. A propos de Lyria

I - Introduction

Le slogan de Lyria l'éditeur de Leonardi c'est "L'IHM en toute simplicité" ou en anglais "MMI made simple". IHM est l'abréviation de Interface Homme-Machine (en anglais MMI ou Man-Machine Interface). L'interface homme-machine n'est pas un concept nouveau qui se définit comme l'étude de la façon dont les humains interagissent avec les ordinateurs ou entre eux à l'aide d'ordinateurs, ainsi que la façon de concevoir des systèmes informatiques qui soient ergonomiques, c'est-à-dire efficaces, faciles à utiliser. Le concept de faciliter un outil de génération d'IHM pour des développeurs reste rare, c'est ce que propose l'équipe Lyria actuellement.

Le framework Leonardi est un moyen simple pour développer une IHM cliente riche, légère ou lourde sans rien connaître à ces technologies. Ce logiciel prend en charge ces technologies liées aux données et aux écrans et logiciels d'affichage pour s'affranchir d'une rupture technologique qui pourrait coûter trop cher.

II - Les offres sur le produit Leonardi

Il existe bel et bien une déclinaison libre de cet outil intéressant : LEONARDI FREE que vous pouvez tester pour le connaître davantage. Bien que gratuit sous seules réserves de comporter le contrat de licence LEONARDI dans l'installation standard du projet et l'écran d'accueil de LYRIA , il est fourni avec les composants standards donc il permet de comprendre assez vite le Model-Driven de la société Lyria.

Les autres offres de ce framework de Lyria sont LEONARDI AGILE, LEONARDI EVOLUTION et LEONARDI FACTORY.

Prenons LEONARDI EVOLUTION. LEONARDI EVOLUTION s'adresse prioritairement aux besoins de migration technologique d'une application existante avec une forte connotation métier (type progiciel ou application métier ancienne).

Son propos est de permettre la réalisation d'IHM actuelles, riches et homogènes sans nécessiter d'experts de toutes les technologies du moment. Sa principale force est de permettre au développeur de se concentrer sur le fonctionnel métier et de trouver dans LEONARDI les outils permettant une représentation graphique dans l'air du temps et conforme aux standards.

Il y a LEONARDI FACTORY la solution pour automatiser le développement d'IHM pour des projets d'envergure.

Télécharger Leonardi.

III - Architecture de Leonardi

L'idée fondatrice de Leonardi est la fourniture de services génériques à partir de la description des objets métiers présentés à l'utilisateur final.

Ce concept est porté par une architecture mettant en oeuvre cinq composants principaux :

- le modèle métier de l'application,

- les afficheurs Leonardi,

- les connecteurs Leonardi,

- le noyau Leonardi,

- les comportements spécifiques de l'application.

Voir l'architecture Leonardi.

IV - Modèle IHM de Leonardi

Développer avec LEONARDI, c'est tout d'abord modéliser les données de votre application, la manière dont elles collaborent et les traitements associés. Avec LEONARDI MMI Model™, cette étape de modélisation est soit assistée (avec atelier RAD) ou soit automatisée par introspection de bases de données, depuis un modèle UML, ou par ré ingénierie de modèle existant.

Le modèle ainsi créé tournera avec le moteur IHM (MMI Engine), ce moteur va générer une IHM sous un angle réellement métier pour divers cibles grâce à ses composants afficheurs.

V - Premier pas avec Leonardi

Démarrer Leonardi Studio.

Une fois Studio démarré, une première fenêtre de sélection d'application est proposée. On peut soit sélectionner une application existante: l'application démo HOTEL est disponible par défaut, soit créer une nouvelle application: il suffit de cliquer sur le bouton de création d'application à droite de la boîte combo de sélection. Pour la création d'une nouvelle application, il faut entrer un identifiant et un titre puis de préciser un répertoire de sauvegarde.

V-A - Description des données (classes)

La première étape de développement d'une application cliente avec Leonardi est la modélisation. Les données de l'application sont d'abord décrites par le développeur pour aboutir à un méta modèle (format XML) : c'est le MMI Model™, décrivant les données du monde métier, leur structure (basée sur des classes et des attributs typés) et les traitements que l'utilisateur final peut leur soumettre. Le MMI Model™ peut être généré de manière automatique par introspection de données existantes (SGBD, Java...), par import XMI ou encore de manière assistée grâce à l'atelier de LEONARDI Studio.

Pour comprendre cette modélisation, expliquons les étapes de création des diverses classes de l'application HOTEL. Nous allons expliquer la définition des classes applicatives de cette application de réservation de chambres.

Créons tout d'abord une application dont l'identifiant sera HOTEL et le titre HOTEL également.

La première classe à créer est la classe " province ". Pour cela, il suffit de cliquer sur l'action Créer … dans la barre d'outils Edition. Dans la fenêtre qui apparaît, nous allons saisir les champs :

- Identifiant : province

- Nom : Région

- Image : une petite image qui représente cette classe

Après validation, la classe " province " est visible dans l'onglet Arborescence des classes avec l'image qui lui a été associée. Si on n'a pas rempli le champ image, une image par défaut est affichée.

Maintenant, il faut décrire les attributs de la classe " province ". Nous allons affecter deux attributs à cette classe : un identifiant et un nom. Pour créer l'attribut " identifiant ", sélectionner la classe province et déclencher le clic droit pour afficher un menu contextuel : cliquer sur Créer Attribut textuel. La fenêtre de création d'un nouvel attribut textuel de classe apparaît alors à l'écran. Nous allons saisir dans cette fenêtre les champs suivants :

- Identifiant : province_id

- Nom : Identifiant

Nous allons ensuite créer le deuxième attribut sur le nom :

- Identifiant : province_name

- Nom : Nom

Nous allons maintenant configurer leur comportement (behaviour) en modifiant les marques : sélectionner l'attribut dans le panneau droit de l'écran puis cliquer sur Modifier les marques … dans la barre d'outils des attributs.

La fenêtre de modification des marques s'affiche alors et propose un ensemble de choix qui vont nous permettre de paramétrer le comportement des attributs. Pour le premier attribut nous sélectionnons les marques id, create et hidden. Pour le deuxième attribut nous sélectionnons les marques name, create, set, unique et main.

Remarque : Il y a aussi une astuce rapide pour créer et paramétrer les attributs. Double cliquez sur la classe applicative en question puis basculer dans l'onglet Attributs, il suffit d'écrire en une seule ligne les informations sur l'attribut avec ses marques génériques.

Nous allons maintenant nous intéresser aux actions disponibles sur la classe " province ". Nous allons donc seulement autoriser les actions de création, de modification et de suppression sur cette classe. Pour cela nous allons nous positionner dans l'onglet Action. On peut alors enrichir cette application avec de nouvelles classes plus complexes : villes, gérants, établissements, chambres, réservations, réservations en cours, etc. L'attribut employé jusque là n'est que l'attribut textuel, il faut préciser que Leonardi en possède tant d'autres : numérique, temporel, énuméré, relationnel, fichier, tableau, champ typé, etc. L'attribut relationnel permet par exemple de lier une classe existante avec la classe qui l'utilise. L'attribut fichier est souvent utilisé pour associer une image comme attribut d'une classe en cochant le type image lors de la création de l'attribut .

Ainsi, nous avons compris comment définir des classes avec ses attributs sous Leonardi. Laissons cette application de réservation hôtelière mais attaquons avec une toute autre application, une sorte de petit exercice, relativement simple dont voici un tableau récapitulatif de ses classes (application de gestion d'une librairie):

Classe Domaine

Identifiant

Nom

Type

Catégorie

domaine_id

Identifiant

NUMERIQUE

id

domaine_titre

Domaine

TEXTUEL

name, create, set, main

Les domaines seront par exemple : arts, informatique, électronique, romans, etc. Le fait que la catégorie ne contient que id assigne que cet attribut est un membre statique de la classe (pas touche !).

Classe Livre

Identifiant

Nom

Type

Catégorie

livre_id

Identifiant

NUMERIQUE

id

livre_titre

Titre

TEXTUEL

name, create, set, main

livre_auteur

Auteurs

TEXTUEL

name, create, set, main

V-B - Description de la navigation

Arbre de navigation de l'application HOTEL :

A partir de maintenant, vous pouvez exécuter votre application Leonardi. Pour cela, il suffit de cliquer sur Exécuter puis de sélectionner parmi les afficheurs au choix : SWT, SWING, DHTML/AJAX et SVG.

Intéressons-nous maintenant à la déclaration de l'arbre de navigation. Il s'agit d'indiquer à Leonardi comment afficher les données applicatives à l'utilisateur final. Il suffit d'aller dans l'onglet Arbre de navigation. On peut faire tout simple en déclenchant le bouton de génération automatique de l'interface graphique : cliquer sur Générer l'IHM par défaut. Au moment où notre arbre de navigation est défini, on est en mesure d'exécuter notre application.

Il est intéressant d'implémenter une action de login pour notre application comme celle de l'application de démo HOTEL.

Nous allons donc créer une action racine qui sera pour notre application une action de login. Dans l'onglet Arbre de navigation nous allons déclencher l'action Créer une action. Choisir le type login et renseigner l'identifiant et le nom, puis cliquer sur suivant.

V-C - Leonardi et Java proprement dit

Il s'avère que l'application créée avant cette section est plutôt basique. Afin de personnaliser l'application, on utilise Java pour attribuer des comportements spécifiques au programme. Pour cela, il faut ouvrir ou créer une application en niveau avancé (l'onglet Classes Java s'ajoute dans la fenêtre principale du Studio).

Sur la classe sur laquelle on voudrait attribuer un comportement spécifique, choisir Comportement de classe dans le menu contextuel et valider les propositions faites dans le formulaire. L'éditeur que vous avez indiqué dans les préférences s'ouvre alors avec une classe Java générée par Leonardi comme le code suivant:

package bibliotheque.behavior;

import java.util.*;
import leon.app.behavior.*;
import leon.app.behaviorinterface.*;
import leon.control.*;
import leon.data.*;
import leon.info.*;
import leon.view.event.*;

public class DomaineClassBehavior extends LyClassBehavior
{
/**
* Default Constructor
*/
public DomaineClassBehavior()
{
}

public void init(LyController controller)
{
super.init(controller);
}
}

Vous pouvez alors surcharger toutes les méthodes que vous voulez contrôler : par ex controlNewValues() pour le contrôle sur la saisie d'une valeur lors de la création/modification d'une donnée. On peut aussi basculer dans l'arbre de navigation pour développer des comportements de présentation : choisir Comportement de l'action > Comportement de l'action dans le menu contextuel.

Concernant les classes Java utilisables au sein du framework (ici), outre les classes Java standard, il est fourni avec l'application Leonardi plusieurs documents qui indiquent comment prendre en main la programmation IHM en Java, ainsi qu'une documentation complète des classes et méthodes disponibles au sein de Leonardi. Sous Windows, des liens sont créés dans le menu "Démarrer" pour en savoir plus sur les API Leonardi (import leon.*).

Voici par exemple la liste des méthodes générées automatiquement lors du clic sur le comportement de classe:

Méthodes héritées de la classe leon.app.behavior.LyClassBehavior:
addExtraValues, buildFilterElement, changeState, checkDeletion, checkDeletions, checkNewValue, checkNewValue, controlNewValue, controlNewValue, controlNewValues, copy, enableChoiceOption, enableRelationLink, enableRelationLink, endCreation, endDeletion, endSet, getAction, getAutoCompletionMaximum, getAutoCompletionValues, getChoiceContextOptions, getChoiceDomain, getConfirmDeletionMessage, getDefaultValue, getFacetObjects, getFilterChoiceDomain, getFilterRelationClasses, getFilterRelationDomain, getFilterTransverseActions, getImage, getNextValue, getRelationClasses, getRelationContext, getRelationDomain, getRelationFilter, getTabName, getTitle, getTransverseActions, getTransverseActions, getValue, hide, isDisplayed, isEditable, isEnabled, isOptional, isValidGroup, modify, needCheck, paste, propagate, setObject, show, useEditTable, useEditTable.

Méthodes héritées de la classe leon.app.behavior.LyActionBehavior (la classe mère de LyClassBehaviour):
endAction, getClientContext, getContextTitle, getHelpFile, getImage, getImageTooltip, getMenuItemImage, reset, startAction

Méthodes héritées de la classe leon.app.behavior.LyBehavior:
free, handleDemand, init
etc.

On est alors libre de surcharger ces méthodes pour obtenir des comportements spécifiques pour notre application. Il peut parfois être très utile de consulter le code source des classes API de Leonardi pour mieux comprendre leurs fonctionnements, les sources se trouvent dans le dossier src/leon du répertoire d'installation.

VI - Les différentes configurations de Leonardi

VI-A - Configurations requises

Pour fonctionner, Leonardi nécessite :

- JDK 1.4.2

- Eclipse V3 à V3.2

- Windows 2000, XP et supérieur ou une distribution Linux avec un noyau 2.4.3 et supérieur mais également sous Unix et Mac OS X

VI-B - Leonardi et Eclipse

Il est intéressant de savoir que Leonardi existe aussi en version Plugin Eclipse Standalone qui permet d'utiliser tout le studio dans le fameux EDI Eclipse. Pour l'utiliser, il faut installer le plugin Eclipse de Leonardi Studio qui se situe au départ dans le fichier compressé com.lyria.studio_3.3.zip qui est à décompresser dans le répertoire des plugin de Eclipse. Pour le lancer, il suffit de suivre le menu Window > Open Perspective > Other sous Eclipse, puis normalement Leonardi Studio doit apparaître dans la liste qui s'affiche, sélectionner et lancer pour utiliser le SDK Eclipse de Leonardi. Ainsi, on peut faire tout ce qu'on peut faire dans Leonardi Studio dans l'EDI de Eclipse.

Remarque : Leonardi Studio n'est pas une application Win32 ou un exécutable Linux à part entière mais un programme Java ! Le raccourci correspondant à Leonardi ne fait qu'ouvrir avec la machine virtuelle Java (JVM) les exécutables JAR correspondant à Leonardi Studio.

VI-C - Leonardi et Afficheur DHTML/AJAX

Il ne faut pas oublier d'indiquer le répertoire du JDK dans le menu Préférences de Leonardi Studio.

VII - Conclusion

Leonardi Studio est tout simplement un outil génial et indispensable pour développer un logiciel avec une présentation visuelle ergonomique et actuelle.

Pour l'utilisateur, l'IHM c'est la partie visible de l'application. Le problème de concevoir une interface graphique riche adaptée aux besoins des utilisateurs en Java semble résolu. Leonardi est en effet une solution permettant de se concentrer que sur les besoins métier de l'application et de lui laisser la génération de l'interface graphique. L'évolutivité demeure un challenge de l'éditeur de Leonardi car les standards actuels évoluent, les applications Leonardi s'adaptent alors à cette évolution car elles peuvent être créées en client lourd, client léger, client riche, architecture orientée services...

De plus, le logiciel Leonardi proprement dit, en plus d'être un éditeur d'IHM est très facile d'utilisation : il est fourni avec deux langues le français et l'anglais, ce qui est un atout pour nous développeurs francophones. Bref, Leonardi permet de se libérer des technologies et de continuer l'amour de programmer en Java.

VIII - A propos de Lyria

Lyria est une société créée depuis 2000 dans l'objectif de rechercher des solutions plus efficaces pour réaliser plus rapidement des projets.

Dans ce cadre et devant des développements de plus en plus complexes, dans des environnements de plus en plus variés, les développeurs de Lyria se sont intéressés très tôt à la réutilisation et la capitalisation du logiciel. C'est depuis Avril 2000 que le projet commençait à se concrétiser : fin 2002 marque une étape importante dans les développements de leur produit avec la mise sur le marché d'un atelier graphique de paramétrage qui pousse encore plus loin l'automatisation de la création des interfaces.

Aujourd'hui, Lyria propose un logiciel complet, simple, très productif développé selon les besoins des clients.

Visitez le Forum Leonardi pour plus d'informations.

Téléchargez Leonardi pour le tester dès maintenant.