Création d’une première application de bureau AIR à l’aide du kit SDK de Flex

A titre d’illustration rapide et pratique du fonctionnement d’Adobe® AIR®, suivez ces instructions pour créer une application AIR simple basée sur SWF, « Hello World », par le biais du kit SDK Flex. Ce didacticiel illustre la compilation, le test et la mise en package d’une application AIR à l’aide des outils de ligne de commande intégrés au kit SDK de Flex (ce dernier contient le kit SDK d’AIR).

Avant de commencer, vous devez installer le moteur d’exécution et configurer Adobe® Flex™. Ce didacticiel fait appel au compilateur AMXMLC, à l’application de débogage du lanceur AIR (ADL) et à l’outil AIR Developer (ADT). Ces programmes résident dans le répertoire bin du kit SDK Flex (voir Configuration du kit SDK Flex).

Création du fichier descripteur d’application AIR

Cette section est consacrée à la création du fichier descripteur d’application, à savoir un fichier XML dont la structure est la suivante :

<application xmlns="..."> 
    <id>...</id> 
    <versionNumber>...</versionNumber> 
    <filename>…</filename> 
    <initialWindow> 
        <content>…</content> 
        <visible>…</visible> 
        <width>…</width> 
        <height>…</height> 
    </initialWindow> 
</application>
  1. Créez un fichier XML appelé HelloWorld-app.xml et enregistrez-le dans le répertoire du projet.

  2. Ajoutez l’élément <application> avec pour attribut l’espace de noms AIR :

    <application xmlns="http://ns.adobe.com/air/application/2.6"> Le dernier segment de l’espace de noms, « 2.6 », indique la version du moteur d’exécution requis par l’application.

  3. Ajoutez l’élément <id> :

    <id>samples.flex.HelloWorld</id> L’ID identifie l’application de manière unique, en conjonction avec l’ID d’éditeur (dérivé par AIR du certificat de signature du package d’application). Le format recommandé correspond à une chaîne de style DNS inversé dont les éléments sont séparés par un point, telle que « com.company.AppName ». L’identifiant d’application assure l’installation, l’accès au répertoire de stockage du système de fichiers de l’application privé, l’accès aux emplacements de stockage chiffrés privés et la communication entre les applications.

  4. Ajoutez l’élément <versionNumber> :

    <versionNumber>1.0</versionNumber> Permet à l’utilisateur de déterminer la version de l’application qu’il installe.

  5. Ajoutez l’élément <filename> :

    <filename>HelloWorld</filename> Nom du fichier exécutable et du répertoire d’installation de l’application, ainsi que des autres références à cette dernière dans le système d’exploitation.

  6. Ajoutez l’élément <initialWindow>, qui contient les éléments enfant suivants, afin de spécifier les propriétés de la fenêtre initiale de l’application :

    <content>HelloWorld.swf</content> Identifie le fichier HTML racine que doit charger AIR.

    <visible>true</visible> Indique que la fenêtre est immédiatement visible.

    <width>400</width> Définit la largeur de la fenêtre (en pixels).

    <height>200</height> Définit la hauteur de la fenêtre.

  7. Enregistrez le fichier. Le format du fichier descripteur d’application complet est le suivant :

    <?xml version="1.0" encoding="UTF-8"?> 
    <application xmlns="http://ns.adobe.com/air/application/2.6"> 
        <id>samples.flex.HelloWorld</id> 
        <versionNumber>0.1</versionNumber> 
        <filename>HelloWorld</filename> 
        <initialWindow> 
            <content>HelloWorld.swf</content> 
            <visible>true</visible> 
            <width>400</width> 
            <height>200</height> 
        </initialWindow> 
    </application>

Cet exemple se contente de définir quelques-unes des propriétés d’application disponibles. Voir Fichiers descripteurs d’applications AIR pour consulter la liste complète des propriétés de l’application, qui permettent de définir des paramètres tels que le chrome, la taille et la transparence des fenêtres, le répertoire d’installation par défaut, les types de fichier associés et les icônes de l’application.

Programmation du code de l’application

Remarque : les applications AIR basées sur SWF peuvent utiliser une classe principale définie avec MXML ou Adobe® ActionScript® 3.0. Cet exemple définit sa classe principale par le biais d’un fichier MXML. Le processus de création d’une application AIR avec une classe ActionScript principale est similaire. Au lieu de compiler un fichier MXML pour obtenir le fichier SWF, vous compilez le fichier de classe ActionScript. Si vous utilisez ActionScript, la classe principale doit étendre flash.display.Sprite.

A l’instar de toutes les applications Flex, les applications AIR basées sur la structure Flex contiennent un fichier MXML principal. Les applications de bureau AIR font appel au composant WindowedApplication en tant qu’élément racine au lieu du composant Application. Le composant WindowedApplication fournit les propriétés, les méthodes et les événements de contrôle de l’application et de sa fenêtre initiale. Pour les plates-formes et profils pour lesquels AIR ne prend pas en charge les fenêtres multiples, continuez à utiliser le composant Application. Dans les applications mobiles Flex, vous disposez également des composants View ou TabbedViewNavigatorApplication.

La procédure suivante permet de créer l’application Hello World :

  1. Créez un fichier appelé HelloWorld.mxml dans un éditeur de texte et ajoutez le code MXML suivant :

    <?xml version="1.0" encoding="utf-8"?> 
    <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
                           xmlns:s="library://ns.adobe.com/flex/spark" 
                           xmlns:mx="library://ns.adobe.com/flex/mx" 
                           title="Hello World"> 
    </s:WindowedApplication>
  2. Ajoutez ensuite un composant Label à l’application (placez-le dans la balise WindowedApplication).

  3. Définissez la propriété text du composant Label sur « Hello AIR ».

  4. Définissez les contraintes de mise en forme de sorte qu’il reste centré.

    L’exemple suivant illustre le code dans son état actuel :

    <?xml version="1.0" encoding="utf-8"?> 
    <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
                           xmlns:s="library://ns.adobe.com/flex/spark" 
                           xmlns:mx="library://ns.adobe.com/flex/mx" 
                           title="Hello World"> 
         
        <s:Label text="Hello AIR" horizontalCenter="0" verticalCenter="0"/> 
    </s:WindowedApplication>

Compilation de l’application

Avant d’exécuter et de déboguer l’application, compilez le code MXML dans un fichier SWF par le biais du compilateur amxmlc. Le compilateur amxmlc réside dans le répertoire bin du kit SDK Flex. Le cas échéant, vous pouvez définir la variable d’environnement path de l’ordinateur de sorte à inclure le répertoire bin du kit SDK Flex. Définir cette variable d’environnement simplifie l’exécution des utilitaires de ligne de commande.

  1. Ouvrez une interface de commande ou un terminal et accédez au dossier de projet de l’application AIR.

  2. Entrez la commande suivante :

    amxmlc HelloWorld.mxml 

L’exécution de amxmlc produit HelloWorld.swf, qui contient le code compilé de l’application.

Remarque : s’il est impossible de compiler l’application, corrigez les fautes d’orthographe ou les erreurs de syntaxe. Les erreurs et les avertissements sont affichés dans la fenêtre de console d’exécution du compilateur amxmlc.

Pour plus d’informations, voir Compilation de fichiers source MXML et ActionScript pour AIR.

Test de l’application

Pour exécuter et tester l’application à partir de la ligne de commande, faites appel à l’application de débogage du lanceur AIR (ADL) afin de lancer l’application par le biais du fichier descripteur correspondant. (L’application ADL réside dans le répertoire bin du kit SDK Flex.)

 A l’invite de commande, entrez la commande suivante :
adl HelloWorld-app.xml 

L’application AIR résultante ressemble à l’illustration suivante :

Grâce aux propriétés horizontalCenter et verticalCenter du contrôle Label, le texte est placé au centre de la fenêtre. Vous pouvez déplacer ou redimensionner la fenêtre comme pour toute autre application de bureau.

Pour plus d’informations, voir Application de débogage du lanceur AIR (ADL).

Création du fichier d’installation AIR

Lorsque l’application s’exécute correctement, vous pouvez, à l’aide de l’outil ADT, la mettre en package sous forme de fichier d’installation AIR, c-à-d. un fichier d’archives contenant tous les fichiers de l’application, que vous pouvez distribuer à vos utilisateurs. Pour pouvoir installer un fichier AIR mis en package, vous devez installer Adobe AIR.

Pour garantir la sécurité des applications, tous les fichiers d’installation AIR doivent être signés numériquement. A des fins de développement, vous pouvez générer un certificat auto-signé de base à l’aide de l’outil ADT ou d’un autre outil de génération de certificats. Vous pouvez également acheter un certificat développeur auprès d’une autorité de certification commerciale. Lorsque les utilisateurs installent un fichier AIR auto-signé, l’éditeur porte la mention « Inconnu » pendant le processus d’installation.  En effet, un certificat auto-signé garantit uniquement que le fichier AIR n’a pas été modifié depuis sa création. Rien n’empêche une tierce personne de présenter un faux fichier AIR auto-signé comme étant votre application. Il est fortement recommandé de signer les fichiers AIR que vous publiez au moyen d’un certificat commercial vérifiable. Pour une présentation de la sécurité AIR, voir Sécurité AIR (développeurs ActionScript) ou Sécurité AIR (développeurs HTML).

Génération d’un certificat auto-signé et d’une paire de clés

 A l’invite de commande, entrez la commande suivante (le fichier exécutable ADT réside dans le répertoire bin du kit SDK Flex) :
adt –certificate -cn SelfSigned 1024-RSA sampleCert.pfxsamplePassword

Cet exemple utilise le nombre minimal d’attributs qu’il est possible de définir pour un certificat. Vous pouvez attribuer toute valeur aux paramètres en italique. Le type de clé doit correspondre à 1024-RSA ou 2048-RSA (voir Signature d’applications AIR).

Création d’un package AIR

 A l’invite de commande, entrez la commande suivante (sur une même ligne) :
adt -package -storetype pkcs12 -keystore sampleCert.pfx HelloWorld.air 
HelloWorld-app.xml HelloWorld.swf

Vous êtes invité à entrer le mot de passe du fichier de magasin de clés. Tapez le mot de passe et appuyez sur Entrée. Les caractères saisis ne sont pas affichés par mesure de sécurité.

L’argument HelloWorld.air correspond au fichier AIR généré par l’outil ADT. HelloWorld-app.xml est le fichier descripteur d’application. Les autres arguments représentent les fichiers utilisés par l’application. Cet exemple n’utilise que trois fichiers, mais vous pouvez inclure un nombre illimité de fichiers et de répertoires.

Une fois le package AIR créé, vous pouvez double-cliquer dessus pour installer et exécuter l’application. Libre à vous également d’entrer le nom de fichier AIR en tant que commande dans une fenêtre de shell ou de commande.

Pour plus d’informations, voir Mise en package d’un fichier d’installation AIR de bureau.