Premiers pas avec flex

Installation ou configuration (Apache Flex)

Il existe deux façons de configurer le SDK Apache Flex. Vous pouvez utiliser le programme d’installation Apache Flex SDK fourni, une application Adobe AIR qui automatise le processus (sous Windows ou OS X/macOS). Ou vous pouvez l’installer manuellement ce qui nécessite évidemment un plus grand confort avec votre plateforme mais offre plus de flexibilité avec les détails d’installation.

Installation du SDK Apache Flex à l’aide du programme d’installation Apache Flex

  1. Téléchargez le binaire [installer][1] pour votre système d’exploitation (Windows, Mac or Linux).
  2. Exécutez le programme d’installation
  3. Sélectionnez la version du SDK que vous souhaitez télécharger. Le projet Apache Flex vous suggère de télécharger la dernière version publiée.
  4. Sélectionnez la version de Flash Player. Le projet Flex suggère que vous le laissiez par défaut. Cliquez sur Suivant**.
  5. Sélectionnez un répertoire dans lequel vous souhaitez installer le SDK. Cliquez sur Suivant**.
  6. Vérifiez tous les contrats de licence. Cliquez sur Installer.
  7. Attendez que le programme d’installation télécharge et installe le SDK Apache Flex.

Installation manuelle du SDK Apache Flex

REMARQUE : Cela peut être un processus long et complexe.

Préparez votre système

  1. Téléchargez et installez le dernier JDK Java
  2. Téléchargez et installez la dernière version d’Ant
  3. Téléchargez et installez la dernière version de Git
  4. Téléchargez et installez la dernière version de JUnit

Configurer la structure des dossiers

  1. Créez la structure de répertoires suivante sur votre ordinateur pour le SDK Flex, généralement stockée dans le répertoire racine ou Documents.
/ApacheFlex
/ApacheFlex/dependencies
/ApacheFlex/source

Télécharger la source

  1. Ouvrez un terminal et changez le répertoire en :
/ApacheFlex/source
  1. Exécutez la commande git suivante pour télécharger la source du SDK Flex :
git clone https://git-wip-us.apache.org/repos/asf/flex-sdk.git flex-sdk
  1. Exécutez la commande git suivante pour télécharger la source TLF :
git clone https://git-wip-us.apache.org/repos/asf/flex-tlf.git flex-tlf
  1. Accédez au répertoire flex-sdk :
/ApacheFlex/source/flex-sdk
  1. Basculez vers la branche “develop” (facultatif) :
git checkout develop

Modifier les propriétés de l’environnement

Pour que les scripts de compilation fonctionnent, vous devez définir les variables d’environnement. Le fichier de propriétés d’environnement contient les variables d’environnement qui pointent vers les emplacements des dépendances que vous utiliserez tout au long du processus. Ceux-ci sont utilisés par les différents scripts de construction pour exécuter et compiler le SDK. Vous ajouterez des variables d’environnement supplémentaires tout au long de ce didacticiel. Lorsque vous exécuterez le script de construction ultérieurement, le script validera les chemins fournis et vous avertira s’ils sont incorrects.

  1. Créez le fichier de propriétés de l’environnement :

Dans le répertoire flex-sdk, créez une copie du fichier env-template.properties et nommez-le env.properties.

Puisque vous avez déjà installé Java et Ant, définissez le chemin de ceux-ci en ajoutant ce qui suit à la fin du fichier env.properties :

env.JAVA_HOME=/System/Library/Frameworks/JavaVM.framework/Versions/Current/Commands/java

env.ANT_HOME=/Applications/Ant/bin
  1. Ajoutez ensuite le chemin vers le répertoire TLF :
env.TLF_HOME=/ApacheFlex/source/flex-tlf

Ajouter les dépendances requises

SDK Adobe AIR

  1. Téléchargez Air SDK Flex Edition (Assurez-vous de télécharger l’édition spécialement conçue pour Flex).
  2. Extraire vers :
/ApacheFlex/dependencies/AIRSDK/4.0

où le nom du répertoire final fait référence à la version du SDK AIR que vous avez téléchargée.

  1. Définissez la variable d’environnement AIR_HOME sur le chemin du SDK AIR que vous avez choisi à l’étape précédente. Par exemple,
env.ANT_HOME=/ApacheFlex/dependencies/AIRSDK/4.0

Projecteur Adobe Flash Player

  1. [Télécharger le projecteur Flash Player][3]
  2. Exécutez le programme d’installation. Le programme d’installation de Projector Content Debugger ne s’installe nulle part (du moins pour moi). Une fois que vous avez exécuté le programme d’installation, vous devez le copier à l’emplacement de votre choix. Dans ce cas, copiez-le dans le répertoire /ApacheFlex/dependencies/player. Remarque : sur OSX, ajoutez « .app/Contents/MacOS/Flash Player Debugger » au chemin d’accès au Flash Player.
/ApacheFlex/dependencies/player/Flash Player.app/Contents/MacOS/Flash Player Debugger
  1. Définissez la variable d’environnement FLASHPLAYER_DEBUGGER sur le chemin d’installation du projecteur.
env.FLASHPLAYER_DEBUGGER=/ApacheFlex/dependencies/player/Flash Player.app/Contents/MacOS/Flash Player Debugger

Vous pouvez également utiliser le plug-in Flash Player. Il se situe généralement ici : /Library/Internet Plug-ins/Flash Player/ Le chemin complet serait : /Library/Internet Plug-ins/Flash Player.app/Contents/MacOS/Flash Player Debugger

Adobe Flash Player playerglobal.swc

  1. [Télécharger playerglobal.swc][3] - Ceci se trouve sur la même page que le débogueur de contenu que vous venez de télécharger.
  2. Copiez-le dans :
/ApacheFlex/dependencies/PlayerGlobal/player/12.0

où le numéro correspond à la version que vous téléchargez. 3. Renommez le fichier copié en ‘playerglobal.swc’ 4. Définissez la variable d’environnement PLAYERGLOBAL_HOME sur :

env.PLAYERGLOBAL_HOME=/ApacheFlex/Dependencies/PlayerGlobal/player

Boîte à outils Adobe Pixel Bender

  1. Téléchargez Pixel Bender pour [Windows][4] ou pour [Mac][5]
  2. Installez Pixel Bender. Lorsque vous installez le programme, il vous donne la possibilité de choisir l’emplacement d’installation. Copiez cet emplacement avant d’installer.
  3. Définissez la variable d’environnement PIXELBENDER_HOME sur le répertoire d’installation.

Préparer le système

Pour les tests, le fichier mm.cfg d’Adobe Flash Player doit avoir les propriétés appropriées définies et un fichier FlashPlayerTrust doit autoriser les fichiers SWF locaux à accéder aux fichiers locaux.

  1. Ouvrez le fichier mm.cfg dans un éditeur. L’emplacement du fichier mm.cfg dépend de votre système d’exploitation. [Voir cette page][2].
  2. S’il n’existe pas, lancez manuellement le débogueur de contenu Adobe Flash Player Projector et il devrait créer le mm.cfg à ce moment-là.
  3. Ajoutez ou vérifiez que les entrées suivantes se trouvent dans le fichier :
ErrorReportingEnable=1
TraceOutputFileEnable=1
  1. Dans le même répertoire que le fichier mm.cfg se trouve le répertoire FlashPlayerTrust.
  2. Ouvrez ce répertoire et créez un nouveau fichier texte appelé ApacheFlex.cfg.
  3. Dans ce fichier, ajoutez le répertoire parent du SDK Apache Flex. Par exemple:
#Path to Apache Flex Source
/ApacheFlex/source
  1. Enregistrez le fichier.

Définir les propriétés de construction

  1. Dans le répertoire flex-sdk se trouve le fichier de propriétés de construction. Celui-ci contient les numéros de version du logiciel que vous avez téléchargé.
  2. Ouvrez ce fichier et définissez les valeurs suivantes sur la version de Flash Player et du SDK AIR que vous utilisez :
# Flash player version for which player global swc to use
playerglobal.version = 12.0

# AIR version number
air.version = 4.0

Ces valeurs sont utilisées pour créer le chemin d’accès au SDK. Donc, si vous avez enregistré le playerglobal.swc dans le répertoire suivant : /ApacheFlex/dependencies/PlayerGlobal/player/12.0 la valeur de playerglobal.version serait 12.0.

Remarque : Étant donné que cette valeur crée le chemin, assurez-vous d’utiliser la valeur complète, 12.0, au lieu de 12 si votre chemin la contient.

Remarque : si vous utilisez une nouvelle version de Flash Player qui n’est pas encore mentionnée dans la version du SDK Flex avec laquelle vous travaillez, vous pouvez recevoir le message : Error: configuration variable ‘swf-version’ value contains unknown token ‘playerglobal.swfversion’ Vous devrez mettre à jour le fichier /ApacheFlex/source/flex-sdk/frameworks/build.xml avec un code de vérification de version mis à jour.

[1] : http://flex.apache.org/installer.html [2] : http://helpx.adobe.com/flash-player/kb/configure-debugger-version-flash-player.html [3] : http://www.adobe.com/support/flashplayer/downloads.html [4] : http://www.adobe.com/go/pixelbender_toolkit_zip/ [5] : http://www.adobe.com/go/pixelbender_toolkit_dmg/

Hello World (s’exécute dans le navigateur) 

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx">

    <s:Label text="Hello World!" />

</s:Application>

Hello World (s’exécute dans l’application) 

<?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">

    <s:Label text="Hello World!" />

</s:WindowedApplication>