Java EE et Flex, partie 1: une combinaison convaincante

Adobe Flex devient un choix populaire pour générer le côté client des applications Java d'entreprise. Dans ce premier de deux articles, Dustin Marx montre comment Flex peut vous aider à fournir des interfaces utilisateur hautement interactives qui accèdent à la logique d'entreprise de votre application Java EE. Obtenez une introduction pratique à la mise au point d'un client Flex simple, puis activez-le pour communiquer avec votre serveur Java EE. Niveau: débutant

Flex 3 vous offre un autre choix pour créer des interfaces utilisateur basées sur un navigateur pour vos applications Java EE. Si vous n'avez pas encore découvert à quel point il est simple d'ajouter des clients riches aux applications Java d'entreprise avec Flex, cet article pourrait vous servir de point d'entrée. Vous découvrirez les avantages que Flex apporte à la table, comment créer des mises en page d'applications à l'aide de la grammaire XML de Flex et comment faire fonctionner votre client Flex avec une application Java EE.

Les développeurs Java adoptent Flex

Nous savons que certains développeurs Java résistent à Flex en tant que technologie frontale pour Java EE, mais il existe un argument solide pour donner une chance à Flex. L'auteur Dustin Marx discute des facteurs à l'origine de l'adoption de Flex dans la communauté Java dans une barre latérale de cet article pratique.

Avant de vous demander d'installer Flex et de commencer à créer un exemple d'application, examinons les avantages de l'utilisation de Flex en tant que technologie côté client. Flex offre des avantages spécifiques aux développeurs Java et certains plus généraux. Nous examinerons les deux.

Pourquoi choisir Flex?

Adopter une nouvelle technologie signifie adopter une courbe d'apprentissage, ce qui peut prendre un certain temps. Voici quelques avantages généraux liés à l'utilisation de Flex:

  • Vous pouvez écrire du code Flex une fois et l'exécuter dans n'importe quel navigateur Web pour lequel un plugin Flash Player existe. Aucun des codes de détection de navigateur ou d'objet typiques des applications JavaScript ou Ajax n'est requis.
  • L'environnement d'exécution cible (Flash Player 9 ou version ultérieure) est installé sur plus de 95% des navigateurs Web dans le monde.
  • Flex est basé sur des normes. Son langage de script (ActionScript 3.0) a ses racines dans ECMAScript (la même spécification implémentée par JavaScript), et son langage de mise en page est une grammaire XML spécifique appelée MXML. La connaissance des normes sous-jacentes peut vous aider à apprendre Flex avec une relative facilité.
  • Flex a un mécanisme simple et rafraîchissant pour lier la propriété d'un objet dans une application Flex à la propriété d'un autre objet dans Flex. Cette fonctionnalité addictive est communément appelée liaison de propriété . (JSR 295: Beans Binding est destiné à ajouter cette fonctionnalité au langage Java, mais elle ne sera pas incluse dans Java SE 7.)
  • Vous pouvez associer le frontal basé sur Flex à n'importe quelle technologie dorsale en utilisant des techniques qui favorisent un couplage lâche. Flex fournit une prise en charge intégrée de la communication avec les back-ends via les services Web traditionnels HTTP et SOAP.
  • Flex fournit un ensemble riche de composants, d'effets Flash (y compris l'animation, la vidéo et l'audio) et des fonctionnalités d'accessibilité qui permettent d'ajouter facilement de la richesse et des expériences très fluides à une application Web.

Flex pour les développeurs Java

Les avantages généraux peuvent suffire à vous attirer vers Flex, mais il y en a d'autres qui s'adressent principalement ou entièrement aux développeurs Java.

L'un de ces avantages est la similitude frappante entre Java et ActionScript 3.0 dans les fonctionnalités du langage, les concepts et la syntaxe. Les langages utilisent des instructions conditionnelles similaires, une syntaxe de boucle et même des conventions de codage. (On peut soutenir qu'ActionScript ressemble plus à Java qu'à JavaFX Script.) L'outil de génération de documentation ASDoc de type Javadoc de Flex utilise la même syntaxe de commentaire que celle que vous utilisez en Java pour générer la documentation. La structure d'empaquetage d'ActionScript est liée à la structure de répertoires exactement de la même manière que Java aborde les packages et les répertoires.

ActionScript 3 fournit également des fonctionnalités orientées objet basées sur les classes (telles que les classes au sens Java, l'héritage et les interfaces) et le typage statique. Ces ajouts à ce à quoi la plupart d'entre nous sont habitués dans JavaScript facilitent l'apprentissage et l'utilisation d'ActionScript. (ActionScript rend toujours le typage dynamique et l'héritage basé sur des prototypes disponibles pour les situations où vous voulez ou avez besoin de ces fonctionnalités de JavaScript traditionnel.)

La capacité de Flex à communiquer avec un back-end Java EE à l'aide de services Web HTTP ou SOAP est très utile, mais vous n'êtes pas limité à ces approches de communication. Blaze DS - un produit open source distinct d'Adobe - vous offre une flexibilité encore plus grande pour la communication entre un frontal Flex et un back-end Java EE. BlazeDS vous permet d'utiliser JMS pour la communication et vous permet d'utiliser la communication à distance d'objets avec Java. BlazeDS ajoute également des avantages potentiels en termes de performances car il utilise le format binaire AMF3 pour une communication plus rapide que ce qui est normalement connu avec XML.

Un produit open source tiers appelé GraniteDS offre encore plus de choix pour appliquer un frontal Flex à une application Java EE. GraniteDS prend en charge le format binaire AMF3 ainsi que certaines fonctionnalités non disponibles avec BlazeDS. Par exemple, GraniteDS propose des outils et des frameworks de services pour intégrer plus facilement Flex avec des back-ends basés sur EJB 3, Spring Framework, Guice ou Seam.

En discutant de Flex jusqu'à présent, j'ai utilisé à plusieurs reprises les mots simples et faciles . Mais ne me croyez pas sur parole. La meilleure façon de comprendre à quel point les bases de Flex sont simples et faciles est de les essayer par vous-même. Dans les sections suivantes, vous allez implémenter un exemple d'application, le refactoriser pour ajouter des fonctionnalités et réduire le code standard, puis établir la communication entre votre nouveau client Flex et un servlet Java.

Acquérir et installer Flex

Les exemples de cet article utilisent le SDK Flex 3.2. Si vous souhaitez créer et exécuter les exemples, téléchargez le SDK Flex (y compris le compilateur et le débogueur de ligne de commande). Un seul fichier ZIP contient le SDK Flex pour plusieurs plates-formes.

Décompressez le fichier dans un emplacement évident, tel que C:\flex_sdk_3_2. Pour plus de commodité, ajoutez l'emplacement du binrépertoire Flex SDK dans le chemin afin que les outils de ligne de commande puissent être exécutés à partir de n'importe quel répertoire. J'aime créer une FLEX_HOMEvariable d'environnement qui pointe vers l'emplacement du SDK Flex, puis ajouter $FLEX_HOME/binou %FLEX_HOME%\binau fichier PATH. Vous pouvez vérifier une installation correcte de Flex en exécutant la commande mxmlc -version, comme illustré à la figure 1.

Bien qu'il ne soit pas nécessaire de créer et d'exécuter les exemples, vous pourriez être intéressé par le téléchargement de FlexBuilder 3, qui est disponible gratuitement pendant une période d'essai. FlexBuilder vous permet d'utiliser n'importe quel éditeur de texte (tel que JEdit ou vim) ou Java IDE (tel que NetBeans ou Eclipse) pour écrire et maintenir des fichiers MXML et ActionScript. Aptana Studio et Spket IDE incluent un support spécifique pour l'édition de fichiers liés à Flex.

MXML: mise en page Flex avec XML

Flex utilise MXML pour définir la disposition d'une application Flex. Les fichiers de mise en page Flex sont généralement nommés avec une .mxmlextension. Le code MXML doit être du XML bien formé et utiliser des espaces de noms XML. L'exemple de la liste 1 montre une application Flex simple mais complètement fonctionnelle, entièrement écrite avec MXML, qui affiche une liste d'articles JavaWorld sélectionnés.

Listing 1. Exemple MXML statique

Comme cet exemple est statique, il ne montre pas beaucoup des avantages de Flex et de Flash. Cependant, il constitue une bonne introduction à MXML.

Tout le code du Listing 1 est du XML bien formé. La plupart des lignes XML du listing 1 sont liées aux mêmes lignes de code ( GridRowéléments répétitifs avec éléments GridItemet Labeléléments imbriqués ). Ils permettent de définir une grille d'affichage statique avec le Gridcomposant et ses GridRowet GridItemsous-éléments. L'utilisation de , et organiser et présenter des données d'une manière similaire à la façon dont les éléments de table HTML

, , et
, respectivement, sont souvent utilisés.

Ce premier exemple MXML illustre également la balise racine utilisée dans toutes les applications MXML. Cette balise comprend une largeur et une hauteur explicites pour l'application Flex. Le mxpréfixe est associé à l'espace de noms XML Flex dans le cadre de cet élément racine.

Vous utiliserez le compilateur de ligne de commande Flex,, mxmlcpour compiler les exemples de cet article. Les valeurs par défaut de Flex (définies dans le flex-config.xmlfichier) sont suffisantes pour les besoins des exemples, ce qui mxmlcfacilite la compilation . En supposant que la première liste MXML est enregistrée dans un fichier nommé Example1.mxml, vous la compilez avec cette commande:

mxmlc Example1.mxml

Conformément aux paramètres par défaut, ce fichier MXML est compilé dans un fichier SWF, appelé Example1.swf, qui est placé dans le même répertoire que le fichier MXML à partir duquel il a été généré. Vous pouvez exécuter le fichier SWF en l'ouvrant dans un navigateur Web ou en entrant simplement le nom complet du fichier sur la ligne de commande. Le fichier SWF rendu ressemble à quelque chose comme à la figure 2.