,

Première application AIR avec Aptana

Note : Cet article se destine à ceux qui débutent avec AIR ou qui ont envie de découvrir le développement d'applications avec Aptana.

Aptana Studio est un éditeur de texte évolué (IDE en anglais, pour "Integrated Development Environment" ou Environnement de développement intégré) qui permet de créer facilement un florilège de fichiers dans différents langages à destination du Web. Basé sur l'éditeur Eclipse, ses capacités peuvent être étendues grâce à une multitude de plugins. Le site d'Aptana propose divers plugins gérables depuis l'application : support de bibliothèques javascript, contrôle de sources avec SVN, plugin pour Ruby on Rails, pour PHP, etc.

La suite de cet article traitera de la mise en place d'un premier projet AIR avec Aptana. Si vous n'avez pas encore installé Aptana, je vous propose de lire mon article précédent à ce sujet qui explique l'installation des outils nécessaires au développement AIR sous Aptana.

Création du projet

  1. Allez dans la vue projet que vous trouverez dans le panneau de gauche, deuxième onglet. Affichez le menu contextuel par clic droit et allez dans New > project... Ou faites "File > New > project" depuis le menu du haut.
  2. Dans la fenêtre qui vient d'apparaître, ouvrez le répertoire "Aptana Projects".
  3. Sélectionnez "Adobe AIR Project" et cliquez sur le bouton "Next" en bas de fenêtre.
  4. L'étape suivante vous permet de renseigner dans l'ordre :

    • le nom de votre projet
    • le répertoire dans lequel vos fichiers se trouveront
    • le nom du fichier HTML principal de votre projet
    • un exemple d'utilisation des sandboxes dans AIR (modèle de sécurité, j'y reviendrai dans un prochain article). Ce dernier paramètre n'est pas primordial pour une première application. Laissez donc le choix par défaut, soit "Application sandbox".
  5. Cliquez sur "Next" une fois cette étape terminée. Si vous vous êtes trompé sur un élément (le nom par exemple), vous pourrez toujours le changer par la suite.
  6. La fenêtre suivante vous permet de configurer les propriétés de l'application. Pour cette première application, vous pouvez laisser les champs préremplis tel quel (vous pourrez aussi y revenir plus tard, via l'édition du fichier XML de configuration de votre projet). Vous remarquerez que cette fenêtre permet aussi de spécifier un chemin vers les icônes de votre projet (icônes pour les barres des tâches, le dock et dans le système de fichier).
  7. L'étape suivante vous permet de spécifier les propriétés de la fenêtre de votre application : utilisation des styles de votre système (System chrome) ou fenêtre transparente (Custom chrome (transparent), si la fenêtre peut être minimisée, maximisée ou redimensionnée et enfin sa taille d'origine, sa taille minimale, maximale et son positionnement sur l'écran au lancement. Concernant les propriétés de la fenêtre :

    • "System chrome" : votre fenêtre ressemble et se comporte comme une fenêtre normale.
    • "Custom Chrome (transparent)", la fenêtre est complètement transparente, sans aucun contrôles pour agir dessus. Ne vous inquiétez pas : cette option permet justement de créer soi même sa fenêtre, les boutons de contrôles, etc.
    • "Custom Chrome (opaque)", désactive complètement le chrome système.
  8. Vous pouvez, si vous le voulez, terminer la création du projet dès cette étape. Cependant, les deux étapes suivantes vous permettent d'inclure des outils propres à AIR dans votre application (un debuggueur, les alias AIR notamment (j'en reparlerai)) mais aussi des outils autres, tels que des bibliothèques Javascript.
  9. Une fois que vous avez fait vos choix, cliquez sur "Finish" et Aptana vous crée votre projet AIR. Il apparait d'ores et déjà dans la vue "Project" à gauche.

J'ai une application toute neuve mais comment la lancer ?

Le lancement d'une application AIR se fait généralement par la création d'un paquet, contenant les fichiers et les données du projet. C'est à ce moment que le plugin de développement AIR prend tout son sens (en plus de l'aide à la création de projet). Sans plugin AIR, vous auriez été obligé d'aller dans le terminal et lancer une commande pour créer le paquet, l'installer ensuite sur votre machine et enfin lancer l'application pour vérifier si vos modifications ont bien été prise en compte. Le plugin d'Aptana permet une visualisation instantanée de l'application d'un simple clic, ce qui vous donne la possibilité de vous concentrer pleinement sur votre application.

Pour ce faire :

  1. Localisez le bouton "launch" ("exécuter") vert avec une petite flèche blanche et cliquez dessus (il se trouve dans la barre d'outils du haut). Votre application devrait se lancer et vous devriez voir apparaître votre application.
  2. Cette première application est celle par défaut. Elle vous montre quelques possibilités de AIR : lire des données depuis un fichier local, récupérer des données sur internet en AJAX. Cela ne représente qu'une infime partie des possibilités offertes par AIR. A votre imagination !

Fichiers de l'application

Selon ce que vous avez choisi comme options, le nombre de fichiers et de dossiers peut varier. Cependant : certains d'entre eux sont toujours présents.

  • application.xml : fichier de configuration de l'application. Il doit toujours se trouver à la racine de votre projet et conserver le même nom.
  • [votre-nom-de-fichier].html : votre fichier principal. Il doit également être à la racine du projet.
  • dossier "icons" : répertoire où sont stockées les icônes par défaut. Vous pouvez déplacer, renommer ce répertoire à votre guise. Cependant attention : si vous déplacez/renommez le répertoire ou les icônes, il ne faut pas oublier d'éditer les noms/chemins vers ceux-ci dans le fichier application.xml. Vous pouvez utiliser des chemins absolus pour les références à ces fichiers.


C'est tout pour cette mise en bouche. Je vous renvoie vers le site d'Aptana pour d'autres explications sur la mise en route avec cet éditeur de texte. Vous pouvez également aller voir chez Adobe pour une explication plus en profondeur (en anglais).

Amusez-vous bien !