Retrouvez gratuitement la notice de l'appareil FLASH BUILDER 4.6 ADOBE au format PDF.
Téléchargez la notice de votre Environnement de développement intégré (IDE) au format PDF gratuitement ! Retrouvez votre notice FLASH BUILDER 4.6 - ADOBE et reprennez votre appareil électronique en main. Sur cette page sont publiés tous les documents nécessaires à l'utilisation de votre appareil FLASH BUILDER 4.6 de la marque ADOBE.
Builder Vous pouvez créer des applications utilisant la structure Adobe Flex® framework, MXML, Adobe Flash Player, Adobe AIR®, ActionScript 3.0 et ADEP (Adobe Digital Enterprise Platform) Data Services, ainsi que les composants graphiques Adobe® Flex® suivants :
Adobe ColdFusion®, Adobe ADEP Data Services et PHP. Voir « Projets Flex » à la page 88 et « Développement d’applications avec Flex » à la page 181.
Voir « Projets ActionScript » à la page 91.
Voir « Projets Flex mobiles » à la page 90 et « Création de projets ActionScript mobiles » à la page 91. Pour plus d’informations sur le développement d’applications mobiles avec Flex et Flash Builder, voir Développement d’applications mobiles avec Flex et Flash Builder.
Voir « Utilisation de projets de bibliothèque Flex » à la page 228.
Voir « Utilisation de Flash Builder avec Flash Professional » à la page 245.
Voir « Projets compatibles avec Flash Catalyst » à la page 92.
Vous pouvez aussi créer des composants ActionScript personnalisés. Voir « Création d’une classe ActionScript » à la page 42.
Flash Builder dispose des outils nécessaires au développement d’applications qui utilisent la structure Flex et ActionScript 3.0. Vous pouvez :
Voir Présentation de l’accès aux services de données.
Voir « Personnalisation du workbench » à la page 259.
Voir « Outils de développement de code dans Flash Builder » à la page 48.
Voir « Création d’interfaces utilisateur » à la page 182.
Voir « Publication du code source » à la page 118.
Voir « Projets dans Flash Builder » à la page 33 et « Ressources des projets » à la page 40.
Flash Builder intègre des outils de création, de test, de débogage et de profilage qui vous permettent d’améliorer votre productivité :
Voir « Création de projets » à la page 101.
Voir « Exécution et débogage des applications » à la page 120 et « Gestion des configurations de lancement » à la page 120.
Voir « Débogage d’outils dans Flash Builder » à la page 134.
Voir Exécution et débogage des applications mobiles.
Voir « Profilage d’outils dans Flash Builder » à la page 145.
Voir « Surveillance des applications qui accèdent aux services de données » à la page 224.
Flash Builder est disponible en deux versions : Standard et Premium. Flash Builder version Standard : cette version fournit un environnement IDE complet qui vous permet de créer des applications à l’aide de la structure Flex et de l’API Flash. Flash Builder version Standard inclut également des éditeurs MXML, ActionScript et CSS, ainsi que des outils de débogage. Il fournit une bibliothèque de diagrammes et de graphiques interactifs qui vous permettent de créer des tableaux de bord riches, des analyses de données interactives et des composants de visualisation des données. Flash Builder version Premium : outre les fonctionnalités de la version Standard, Flash Builder Premium comporte
L’environnement de test FlexUnit permet de générer et de modifier des tests pouvant se répéter. Les tests pouvant se répéter s’exécutent à partir de scripts, directement dans Flash Builder ou en dehors de l’environnement Flash Builder. Les fonctionnalités de génération par ligne de commande vous permettent de synchroniser les paramètres de génération d’un développeur avec une génération nocturne.
Les configurations plug-in et autonome de Flash Builder fournissent les mêmes fonctionnalités. Si vous ne savez pas quelle configuration utiliser, suivez les recommandations suivantes :
ActionScript, utilisez la configuration autonome de Flash Builder. Cette configuration vous permet également d’installer d’autres plug-ins Eclipse afin d’étendre la portée de vos futurs travaux de développement. Pour obtenir des informations détaillées sur l’installation de Flash Builder, voir les notes de mise à jour de Flash Builder 4.6.
Flash Builder utilise le client CHC (Adobe Community Help Client) comme moteur de recherche. Le CHC est une application AIR qui remplace le moteur Eclipse Help pour Flash Builder et constitue la plateforme de prochaine génération pour l’aide d’Adobe. Le client CHC se caractérise par les propriétés suivantes : Si vous disposez d’une connexion réseau, le client CHC accède au contenu situé sur le Web pour vous fournir en permanence les informations les plus récentes. En l’absence de connexion Internet, il est également opérationnel en mode local.
Ajoutez des commentaires, des évaluations et des contributions au contenu de l’Aide et aux ressources Adobe en ligne depuis le client CHC. Vous devez disposer d’un ID Adobe valide pour ajouter des commentaires et des évaluations.
Workbench : le terme workbench se réfère à l’environnement de développement Flash Builder qui contient tous les
Remarque : pour plus d’informations sur certaines fonctionnalités du workbench Eclipse, voir le guide de l’utilisateur du workbench Eclipse à l’adresse http://help.eclipse.org/help31/index.jsp. Perspective : une perspective représente un groupe de vues et d’éditeurs du workbench. Flash Builder contient deux
Flash pour les applications de débogage. Flash Builder Premium contient également la perspective Profil Flash. Si vous utilisez la configuration plug-in de Flash Builder (voir « Configurations Flash Builder » à la page 4), le workbench peut contenir d’autres perspectives telles qu’une perspective Java contenant des éditeurs et des vues permettant de développer des applications Java. Voir « Perspectives et vues de Flash Builder » à la page 7. Editeur : un éditeur vous permet d’éditer différents types de fichier. Les éditeurs dont vous disposez varient selon le
MXML, ActionScript 3.0 et CSS (Cascading Style Sheets, feuilles de style en cascade). Voir « Editeurs Flash Builder » à la page 20 et « Outils de développement de code dans Flash Builder » à la page 48. Vue : une vue comporte généralement un éditeur. Par exemple, lors de l’édition MXML, les vues Composants et Propriétés apparaissent également dans la perspective Développement Flash. Ces vues prennent en charge le développement d’applications et s’affichent par conséquent lorsqu’un fichier MXML est ouvert en édition.
Le terme vue est synonyme de panneau, ce dernier étant utilisé dans les versions précédentes de Flash Builder, dans Adobe Dreamweaver® et dans d’autres outils de développement Adobe. Espace de travail : à ne pas confondre avec le workbench, un espace de travail représente une zone définie d’un système de fichiers contenant les ressources (fichiers et dossiers) constituant vos projets d’application. Vous ne pouvez travailler que dans un seul espace de travail à la fois, mais vous pouvez cependant sélectionner un espace de travail différent à chaque lancement de Flash Builder.
Projet : toutes les ressources constituant vos applications figurent dans des projets. Vous ne pouvez pas créer une application dans Flash Builder sans créer au préalable un projet. Flash Builder prend en charge les différents types de projets, selon le type d’application que vous créez.
Configuration de lancement : une configuration de lancement est créée pour chacun de vos projets. Elle définit les
Voir « Gestion des configurations de lancement » à la page 120.
« Personnalisation du workbench » à la page 259
Pour prendre en charge une tâche particulière ou un groupe de tâches, les éditeurs et les vues correspondantes sont combinés dans une perspective. L’ouverture d’un fichier associé à une perspective particulière conduit à l’affichage automatique de cette perspective. La configuration autonome de Flash Builder propose trois perspectives :
Voir « Perspective Développement Flash » à la page 8. Les perspectives changent automatiquement selon la tâche en cours. Par exemple, si vous créez un projet Flex, le workbench affiche la perspective Développement. Si vous lancez une session de débogage, la perspective Débogage Flash s’affiche lorsque le premier point d’arrêt est atteint.
Le titre de la perspective que vous ouvrez remplace celui de la perspective précédemment affichée. Une icône apparaît en regard du titre. Elle permet de parcourir rapidement les perspectives dans la même fenêtre. Par défaut, les perspectives s’affichent dans la même fenêtre. Si vous utilisez la configuration plug-in de Flash Builder et que vous avez installé d’autres plug-ins Eclipse, d’autres perspectives peuvent s’afficher. Chaque plug-in Eclipse propose des perspectives prédéfinies, mais vous pouvez les personnaliser ou créer vos propres perspectives. Pour afficher la liste complète des perspectives, sélectionnez Fenêtre > Ouvrir la perspective > Autre.
La perspective Développement Flash comporte les éditeurs et les vues dont vous avez besoin pour créer des applications pour la structure Flex. Lorsque vous créez un projet, Flash Builder affiche la perspective Développement pour que vous puissiez commencer à développer une application. L’exemple suivant illustre les vues Explorateur de packages, Structure et Erreurs :
Lorsque vous créez un projet Flex, le fichier d’application MXML principal s’ouvre dans la zone de l’éditeur. Vous pouvez ensuite ouvrir et parcourir les documents MXML, ActionScript et CSS que vous utilisez. Pour plus d’informations, voir « Editeurs Flash Builder » à la page 20.
En mode Source (modification de code), la perspective Développement contient des éditeurs et les vues correspondantes suivantes : Vue Explorateur de packages La vue Explorateur de packages contient l’ensemble des projets et des ressources de l’espace de travail et constitue par conséquent un élément essentiel du workbench Flash Builder. Elle apparaît toujours dans les perspectives Développement et Débogage.
1 Dans l’Explorateur de packages, sélectionnez une ressource. 2 Sélectionnez Fichier > Propriétés.
ActionScript sélectionné, ce qui vous permet d’inspecter et de parcourir les sections ou lignes de code du document. La vue Structure affiche également les alertes d’erreur de syntaxe générées par le compilateur. Cette vue apparaît également lorsque vous utilisez l’éditeur ActionScript.
Vue Erreurs Lorsque vous saisissez du code, le compilateur Flash Builder détecte les erreurs de syntaxe et d’autres erreurs de compilation et les affiche dans la vue Erreurs. L’Explorateur de packages signale les nœuds contenant des erreurs. Lorsque vous déboguez vos applications, les erreurs, avertissements et autres informations apparaissent dans la vue Erreurs. Chaque erreur ou avertissement contient un message, le fichier et le dossier correspondants ainsi que le numéro de la ligne dans le fichier. Les erreurs demeurent affichées dans la vue Erreurs jusqu’à ce que vous les corrigiez ou qu’elles soient résolues.
à la page 84. Pour une présentation des vues optionnelles disponibles dans Flash Builder, voir « Autres vues utiles du workbench » à la page 16.
Flash Builder propose des assistants et des outils qui permettent de se connecter aux services de données. Utilisez la vue Données/Services pour vous connecter aux services de données. Une fois établie la connexion à un service de données, la vue Données/Services affiche le service, les types des données retournées et les opérations disponibles pour le service. Elle vous permet en outre de configurer l’accès au service et de lier les données retournées aux composants de l’interface utilisateur. Pour plus d’informations, voir Construction d’applications centrées sur les données avec Flash Builder.
Il est disponible avec Flash Builder Premium. Pour plus d’informations, voir « Surveillance des applications qui accèdent aux services de données » à la page 224.
Le mode Création de l’éditeur MXML représente visuellement le code édité en mode Source. Il contient cependant, par rapport à ce dernier, des vues supplémentaires prenant en charge les tâches de création. Ces vues sont les vues Composants, Propriétés, Aspect, Etats et Erreurs du mode Création.
La vue Composants contient tous les composants Flex standard. Vous pouvez les sélectionner et les ajouter à la zone de création. Cette vue contient également les composants personnalisés que vous créez.
Vue Etats Flex vous permet de créer des applications dont l’apparence varie selon les événements déclenchés directement par l’utilisateur ou générés de façon programmée. Ces changements d’interface utilisateur sont appelés états d’affichage. Vous créez et gérez les états d’affichage dans la vue Etats.
Vue Aspect La vue Aspect vous permet de définir le style global de l’application pour le texte et les couleurs. Vous pouvez également y définir le thème des applications du projet.
Pour plus d’informations, voir « Définition des propriétés des composants » à la page 27. Vue Structure En mode Création, la vue Structure présente une vue hiérarchique de la structure MXML de vos applications. Vous pouvez facilement parcourir la structure d’une application en sélectionnant des instructions de balises MXML et des composants individuels. L’élément sélectionné dans la vue Structure est mis en surbrillance dans la vue Création.
Les erreurs sont organisées dans une arborescence. Lorsque vous sélectionnez une erreur dans le panneau Détails de l’erreur du mode Création, les détails de l’erreur s’affichent dans le panneau Détails de l’erreur. Lorsque vous fermez un projet, les erreurs associées à ce projet sont supprimées de la vue Erreurs du mode Création. Remarque : la vue Erreurs du mode Création s’affiche uniquement lorsque le mode Création est activé. Si vous désactivez le mode Création (désélectionnez Fenêtre > Activer le mode Création), la vue Erreurs du mode Création ne s’affiche pas.
Outre les éditeurs et les vues associées aux perspectives Développement, Débogage et Profil par défaut de Flash Builder, le workbench contient des vues supplémentaires. Ces vues optionnelles sont classées par type et associées à des fonctionnalités distinctes du workbench ou à des plug-ins Eclipse spécifiques. Pour accéder aux vues qui n’apparaissent pas déjà dans une perspective et les ajouter au workbench, sélectionnez Fenêtre > Affichage d’une vue > Autre. Ces vues incluent les vues Tâches, Signets et Recherche, lesquelles vous aident à simplifier le processus de développement de l’application. Après avoir ajouté une vue à la perspective active, vous pouvez l’enregistrer en tant que partie de la perspective. Pour plus d’informations, voir « Personnalisation d’une perspective » à la page 18. Vous pouvez également créer des vues rapides qui facilitent l’accès aux vues fréquemment utilisées. Pour plus d’informations, voir « Création et utilisation des vues rapides » à la page 19.
Le mot par défaut entre parenthèses qui suit le nom de la perspective indique qu’il s’agit de la perspective par défaut. 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Perspectives. 2 Sous Perspectives disponibles, sélectionnez la perspective à définir par défaut, puis cliquez sur Perspective par
1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Perspectives. 2 Sous Ouverture d’une nouvelle perspective, sélectionnez Dans une nouvelle fenêtre.
Pour modifier la mise en forme d’une perspective, changez les éditeurs et les vues visibles dans une perspective donnée. Par exemple, vous pouvez afficher la vue Signets dans une perspective et la masquer dans une autre. Pour créer une perspective, procédez comme suit : 1 Ouvrez une perspective existante. 2 Affichez les vues et les éditeurs de votre choix. 3 Sélectionnez Fenêtre > Perspective > Sauvegarder la perspective sous (Fenêtre > Sauvegarder la perspective sous
4 Dans la boîte de dialogue Sauvegarder la perspective sous, entrez le nouveau nom de la perspective, puis cliquez sur OK.
1 Ouvrez la perspective à configurer. 2 Sélectionnez Fenêtre > Personnaliser la perspective. 3 Sélectionnez les onglets Raccourcis ou Commandes en fonction des éléments que vous souhaitez ajouter à la
4 Cochez les cases correspondant aux éléments que vous souhaitez afficher dans les menus et dans les barres d’outils
5 Cliquez sur OK. 6 Sélectionnez Fenêtre > Sauvegarder la perspective sous. 7 Dans la boîte de dialogue Sauvegarder la perspective sous, entrez le nouveau nom de la perspective, puis cliquez sur OK.
Vous pouvez supprimer des perspectives définies précédemment. Vous ne pouvez pas supprimer une perspective que vous n’avez pas créée. 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Perspectives. 2 Sous Perspectives disponibles, sélectionnez la perspective que vous souhaitez supprimer. 3 Cliquez sur Supprimer, puis sur OK.
Vous pouvez restaurer la présentation originale d’une perspective après l’avoir modifiée. 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Perspectives. Déplacement et ancrage de vues Vous pouvez déplacer les vues à l’intérieur du workbench, les ancrer à différents emplacements ou en annuler l’ancrage, en fonction de vos besoins. 1 Déplacez la vue vers l’emplacement souhaité en faisant glisser sa barre de titre.
Vous pouvez faire glisser un groupe de vues empilées en cliquant sur l’espace vide situé à droite des onglets des vues et en déplaçant la souris. Vous pouvez également déplacer une vue à l’aide de son menu contextuel. Ouvrez le menu contextuel à partir de l’onglet de la vue, sélectionnez Déplacer > Vue, déplacez la vue vers l’emplacement souhaité, puis cliquez de nouveau avec le bouton de la souris. 2 (Facultatif) Enregistrez les modifications en sélectionnant Fenêtre > Sauvegarder la perspective sous.
Outre l’ancrage des vues à différents emplacements du workbench, vous pouvez réorganiser les onglets des vues à l’intérieur d’un groupe de vues. ❖ Cliquez sur l’onglet de la vue à déplacer, faites glisser la vue vers l’emplacement souhaité, puis relâchez le bouton
Le passage d’une vue à l’autre peut se faire de différentes façons :
• Sélectionnez une vue dans le menu Fenêtre de Flash Builder. • Utilisez un raccourci clavier. Utilisez Ctrl+F7 sous Windows ou Commande+F7 sous Macintosh. Appuyez sur la touche F7 pour sélectionner une vue. Pour obtenir la liste des raccourcis clavier, cliquez sur Aide > Assistant de touches.
Les vues rapides sont des vues masquées que vous pouvez ouvrir et fermer rapidement. Elles sont identiques aux autres vues à ceci près qu’elles n’encombrent pas le workbench. Cliquez sur l’icône de vue rapide dans la barre de raccourcis pour afficher la vue. Cliquez à l’extérieur de la vue rapide (ou sur le bouton Réduire de sa barre d’outils) pour la masquer à nouveau. Remarque : si vous convertissez la vue Explorateur de packages en vue rapide, puis ouvrez un fichier à partir de la vue rapide Explorateur de packages, la vue est automatiquement masquée pour vous permettre d’utiliser ce fichier.
inférieur gauche de la fenêtre du workbench. L’icône de la vue que vous avez déplacée apparaît dans la barre de raccourcis. Cliquez sur cette icône pour ouvrir la vue. Cliquez à l’extérieur de la vue pour la masquer. Pour restaurer une vue rapide en vue normale, procédez comme suit : ❖ Dans le menu contextuel de la vue, désélectionnez Vue rapide.
Vous pouvez filtrer les tâches ou les problèmes qui s’affichent dans les vues Tâches ou Erreurs. Par exemple, pour voir uniquement les erreurs que le workbench a consignées, ou les tâches que vous avez marquées comme rappel personnel, filtrez les éléments avec lesquels la ressource ou le groupe de ressources sont associés. Vous pouvez filtrer par chaîne de texte dans le champ Description, par gravité d’erreur, par priorité de tâche ou par état de tâche. 1 Dans la barre des tâches de la vue Tâches ou Erreurs, cliquez sur Filtrer. 2 Renseignez la boîte de dialogue Filtres, puis cliquez sur OK.
Le développement d’applications dans Flash Builder repose sur l’utilisation des éditeurs MXML, ActionScript 3.0 et CSS. Les éditeurs sont associés à des types de ressource. Ainsi, lorsque vous ouvrez des ressources dans le workbench, l’éditeur correspondant s’affiche. Chaque éditeur intègre les fonctionnalités nécessaires au type de ressource donné. Editeur MXML : utilisez l’éditeur MXML pour éditer le code MXML et pour incorporer un code ActionScript et CSS
Source sert à l’édition du code. Le mode Création permet la mise en forme visuelle et la création des applications. Les deux modes sont synchronisés et les modifications effectuées dans un mode sont aussitôt répercutées dans l’autre mode. Editeur ActionScript : utilisez l’éditeur ActionScript pour éditer des fichiers de classe et d’interface ActionScript. Vous
Editeur CSS : utilisez l’éditeur CSS pour afficher et éditer des feuilles de style en cascade. Vous pouvez ensuite
Remarque : l’éditeur CSS est un éditeur à fonction unique pour les projets basés sur le SDK Flex 4. Pour les projets basés sur le SDK Flex 3, l’éditeur CSS comporte toutefois deux modes (Source et Création).
« Outils de développement de code dans Flash Builder » à la page 48 Trucs et astuces concernant Flash Builder
1 Si le fichier MXML n’est pas déjà ouvert dans l’éditeur MXML, cliquez deux fois sur le fichier dans l’Explorateur de
2 Si l’éditeur MXML affiche le code source, cliquez sur Création dans la partie supérieure de la zone de l’éditeur.
Le basculement entre les modes Source et Création affiche ou masque automatiquement les vues liées à la création, telles que Composants, Propriétés et Etats. Pour activer et désactiver ce comportement, accédez à la boîte de dialogue Préférences et sélectionnez Flash Builder > Editeurs > Mode Création et enfin l’option Afficher automatiquement les vues liées à la création.
❖ Cliquez sur le bouton Mode Panoramique sur le côté droit de la barre d’outils de l’éditeur. Appuyez sur H pour
Il existe plusieurs façons d’utiliser l’outil de zoom. Vous pouvez sélectionner des pourcentages dans le menu principal et le menu contextuel, cliquer sur le bouton Mode Zoom sur la barre d’outils ou utiliser des raccourcis clavier. Le pourcentage d’agrandissement en cours est toujours affiché dans la barre d’outils.
Vous pouvez recourir aux raccourcis clavier suivants dans la zone de création :
• Zoom arrière : Ctrl+- (Commande+- sous Mac OS) Pour connaître d’autres raccourcis clavier, sélectionnez Aide > Assistant de touches. ❖ Cliquez sur le bouton Actualiser de la barre d’outils de l’éditeur.
Vous pouvez créer une vue partagée dans laquelle vous pourrez afficher les deux modes simultanément. 1 Dans le menu contextuel de l’onglet de l’éditeur, sélectionnez Nouvel éditeur.
2 Faites glisser l’un des onglets vers la droite pour le juxtaposer à l’autre onglet. 3 Configurez l’un des éditeurs en mode Création et l’autre éditeur en mode Source.
Conception dans le menu Fenêtre.
La vue Composants s’affiche lorsque vous accédez au mode Création de l’éditeur MXML. Faites-en glisser les composants vers la zone de création pour définir la présentation de votre application. Cette vue affiche par défaut les composants recommandés pour un projet. La version du SDK Flex d’un projet détermine quels composants sont répertoriés comme composants recommandés. Par exemple, lors de la création d’un projet, Flash Builder utilise par défaut le SDK Flex 4.6. Les composants recommandés pour le SDK Flex 4.6 sont les composants Spark. Les composants MX ne possédant aucun équivalent Spark sont également répertoriés dans la liste des composants recommandés. La vue Composants regroupe les composants en catégories, telles que Contrôles, Présentations, Navigateurs et Graphiques. La catégorie Personnaliser contient les composants définis dans des fichiers MXML et ActionScript distincts. Pour plus d’informations, voir « Création de composants MXML personnalisés » à la page 233. Remarque : la vue Composants répertorie les composants visibles. Modification de l’affichage des composants dans la vue Composants Accédez au menu de la vue Composants pour en modifier l’affichage. 1 Pour afficher tous les composants, désélectionnez Afficher uniquement les composants recommandés.
2 Pour afficher les noms complets des classes, sélectionnez Afficher les noms qualifiés complets des classes.
MXML peut être le fichier de l’application principale (fichier doté d’un conteneur d’application) ou un fichier de composant MXML personnalisé. 2 Dans la vue Composants, localisez le composant à ajouter.
Pour plus d’informations, voir « Vue Composants » à la page 13. 3 Faites glisser un composant de la vue Composants vers le fichier MXML.
❖ Cliquez sur le bouton Mode Sélection (en forme de flèche) sur la droite de la barre d’outils de l’éditeur. Ce mode
Sélection. Faites glisser et déposez un composant à l’emplacement souhaité. Vous pouvez aussi le faire glisser pour le redimensionner et cliquer dessus pour le sélectionner.
Vous pouvez sélectionner plusieurs composants dans un fichier MXML. La sélection de plusieurs composants peut s’avérer utile si vous voulez définir une valeur commune pour une propriété partagée.
• Dans la vue Structure (Fenêtre > Structure), appuyez sur la touche Ctrl tout en cliquant sur (Commande-clic sous Macintosh) les composants dans le contrôle d’arborescence.
• Cliquez dans la marge grise encadrant le composant racine.
Vous pouvez changer la position des composants visuellement en fonction de la propriété layout du conteneur parent. Si le conteneur parent spécifie que le positionnement est absolu, vous pouvez faire glisser les composants pour les repositionner. Dans le cas contraire, les composants repositionnés appliquent les règles de présentation du conteneur parent. Par défaut, les conteneurs Spark font appel à la propriété BasicLayout qui autorise le positionnement absolu. Pour certains conteneurs MX, vous pouvez également définir la propriété layout sur absolute. Pour plus d’informations, voir MX layout containers. Remarque : vous pouvez également utiliser des contraintes de présentation pour positionner un composant dans un conteneur. Ces contraintes définissent de quelle manière les composants doivent être repositionnés en cas de redimensionnement d’un conteneur. Elles permettent toutefois aussi d’en spécifier la position dans des conteneurs dont la taille est fixe. Voir Using constraints to control component layout. 1 En mode Création de l’éditeur MXML, sélectionnez le composant dans la présentation et faites-le glisser vers une
Le composant est placé en fonction des règles de présentation du conteneur parent. Si le conteneur bénéficie du positionnement absolu, vous pouvez faire glisser les composants et les positionner n’importe où dans le conteneur. Par exemple, si vous déplacez un conteneur VGroup dans un conteneur HGroup, le conteneur VGroup est placé à l’horizontale avec les autres conteneurs enfant (s’ils existent). 2 En mode Création, sélectionnez le conteneur parent du composant et modifiez ses propriétés de présentation dans
Dans certains cas, vous pouvez changer la position des composants enfant en modifiant les propriétés du conteneur parent. Vous pouvez par exemple utiliser les propriétés verticalGap et horizontalGap du conteneur pour définir l’espacement entre les composants enfant et la propriété direction pour préciser une présentation à lignes ou à colonnes.
En mode Création, vous pouvez modifier la taille d’un composant en faisant glisser une poignée de redimensionnement, en utilisant le menu Création ou en modifiant ses propriétés dans la vue Propriétés. Remarque : utilisez une présentation basée sur contrainte pour spécifier la manière dont un composant est redimensionné dynamiquement lors du redimensionnement d’un conteneur. Pour plus d’informations, voir Using constraints to control component layout. Dimensionnement d’un composant visuellement ❖ En mode Création de l’éditeur MXML, cliquez sur le composant et faites glisser la poignée de dimensionnement pour le redimensionner.
Harmonisation de la largeur ou de la hauteur de deux composants ou plus 1 En mode Création, sélectionnez deux composants ou plus. 2 Dans le menu Création, sélectionnez l’une des options de dimensionnement suivantes : Rendre de la même largeur : définit la propriété width de tous les composants sélectionnés sur celle du composant que vous avez sélectionné en premier. Rendre de la même hauteur : définit la propriété height de tous les composants sélectionnés sur celle du
Si tous les composants sélectionnés se trouvent dans le même conteneur, et que le premier composant que vous sélectionnez a un pourcentage de largeur ou de hauteur spécifié, tous les éléments sont définis selon ce pourcentage. Dans le cas contraire, tous les composants sont définis avec la même largeur ou hauteur de pixel. Dimensionnement d’un composant en modifiant ses propriétés 1 En mode Création, sélectionnez le composant. Pour définir la taille de plusieurs composants simultanément, appuyez sur la touche Ctrl en cliquant (ou Maj-clic sous Mac OS) sur ces composants. 2 Dans la vue Propriétés (Fenêtre > Propriétés), définissez la propriété height ou width du ou des composants
La vue Propriétés propose trois vues pour l’affichage des propriétés d’un composant : une vue standard sous forme de formulaire, une vue par catégories sous forme de tableau et une vue alphabétique sous forme de tableau. Vous pouvez passer d’une vue à l’autre en cliquant sur les boutons correspondants dans la barre d’outils.
Lorsque vous faites glisser visuellement un composant dans un conteneur doté du positionnement absolu, le composant peut s’accrocher dans la bonne position selon l’endroit vers lequel vous le faites glisser par rapport aux composants existants. Les composants peuvent s’aligner à la verticale ou à l’horizontale. Par défaut, les conteneurs Spark font appel à la propriété BasicLayout qui autorise le positionnement absolu. Pour certains conteneurs MX, vous pouvez également définir la propriété layout sur absolute. Pour plus d’informations, voir MX layout containers. Vous pouvez désactiver l’accrochage pour un composant ou pour tous les composants. Activation ou désactivation de l’accrochage ❖ Le fichier MXML étant ouvert en mode Création dans l’éditeur MXML, sélectionnez (ou désélectionnez) Création > Activer l’alignement. Activation ou désactivation de l’accrochage dans les Préférences 1 Ouvrez la boîte de dialogue Préférences. 2 Sélectionnez Flash Builder > Editeurs > Mode Création dans le panneau latéral de la boîte de dialogue Préférences. 3 Sélectionnez ou désélectionnez l’option Activer l’accrochage.
Pour plus d’informations, voir Using constraints to control component layout. Alignement de composants dans un conteneur doté du positionnement absolu 1 En mode Création de l’éditeur MXML, sélectionnez deux composants ou plus dans le conteneur.
2 Sélectionnez l’une des options d’alignement suivantes dans le menu Création : Aligner à gauche : positionne tous les composants sélectionnés de manière que leur bord gauche s’aligne avec le
Aligner les centres à la verticale : positionne tous les composants sélectionnés de manière que leur centre s’aligne à
Aligner à droite : positionne tous les composants sélectionnés de manière que leur bord droit s’aligne avec le bord
Aligner en haut : positionne tous les objets sélectionnés de manière que leur bord supérieur s’aligne avec le bord du
Aligner les centres à l’horizontale : positionne tous les composants sélectionnés de manière que leur centre s’aligne
Aligner en bas : positionne tous les composants sélectionnés de manière que leur bord inférieur s’aligne avec le
Aligner les lignes de base : positionne tous les composants sélectionnés de manière que leur ligne de base de texte
Pour les objets dépourvus de contraintes de présentation, Flash Builder ajuste la propriété x pour changer l’alignement vertical et la propriété y pour modifier l’alignement horizontal. Pour les objets dépourvus de contraintes de présentation, Flash Builder ajuste les contraintes gauche et droite pour changer l’alignement vertical et les contraintes de haut et bas pour modifier l’alignement horizontal. Seules les contraintes existantes sont modifiées, aucun nouvelle contrainte n’est ajoutée. Supposons, par exemple, que le composant A possède une contrainte gauche et aucune contrainte droite, et que le composant B soit doté d’une contrainte gauche et d’une droite. Si vous sélectionnez les composants A et B et que vous sélectionnez Création > Aligner les centres verticaux, Flash Builder ajuste la contrainte gauche de l’objet A et les contraintes gauche et droite de l’objet B pour les aligner. La contrainte de droite non spécifiée de l’objet A reste non spécifiée.
Vous pouvez ajuster la position de composants dans un conteneur doté du positionnement absolu en les déplaçant d’un ou de dix pixels à la fois en utilisant les touches de direction.
Ajustement des composants de dix pixels ❖ Sélectionnez un ou plusieurs composants en mode Création de l’éditeur MXML et appuyez sur l’une des touches de direction tout en maintenant la touche Maj enfoncée. Maintenez la touche de direction enfoncée pour continuer à déplacer le composant.
Flash Builder affiche par défaut les bordures des conteneurs en mode Création de l’éditeur MXML. Vous pouvez toutefois les masquer. ❖ Sélectionnez Création > Afficher les bordures des conteneurs.
Vous pouvez définir visuellement les propriétés de composants dans la zone de création ou dans la vue Propriétés. Modification du texte affiché par un composant ❖ Pour éditer le texte affiché par un composant tel qu’un contrôle Label ou TextInput, cliquez deux fois sur le composant et saisissez vos modifications. Changement du texte dans le champ ID Lorsque vous modifiez du texte dans le champ ID, vous êtes invité à mettre à jour toutes les références de l’espace de travail avec le nouvel identifiant. Vous pouvez définir la suppression de cette boîte de dialogue à la page Mode Création des Préférences : 1 Ouvrez la fenêtre Préférences. 2 Sélectionnez Flash Builder > Editeurs > Mode Création. 3 Sélectionnez ou désélectionnez Toujours mettre à jour les références lors de la modification des ID dans la vue
Définition des autres propriétés d’un composant ❖ Sélectionnez un composant et définissez-en les propriétés dans la vue du même nom (Fenêtre > Affichage d’une vue > Flash Builder > Propriétés). Copie de composants dans d’autres fichiers MXML Vous pouvez copier et coller visuellement des composants d’un fichier MXML vers un autre. 1 Vérifiez que les deux fichiers MXML sont ouverts en mode Création de l’éditeur MXML. 2 Sélectionnez des composants dans l’un des fichiers. Cliquez ensuite sur Editer > Copier. 3 Accédez à l’autre fichier, cliquez à l’intérieur d’un conteneur et sélectionnez Editer > Coller.
Vous pouvez supprimer des composants de l’interface utilisateur. Sélectionnez un composant, puis procédez de l’une des manières suivantes :
• Dans le menu contextuel du composant, sélectionnez Supprimer. • Dans le menu Editer de Flash Builder, sélectionnez Supprimer.
à celle de <mx:VBox>. 1 Ouvrez un fichier MXML en mode Source dans l’éditeur MXML.
2 Placez le point d’insertion dans la balise de conteneur parent.
<s:HGroup> insertion point here </s:HGroup> Dans cet exemple, VGroup est recommandé, contrairement à VBox qui ne l’est pas.
appuyez sur Entrée.
L’assistant de contenu peut également suggérer des propriétés, des événements, des effets et des styles. Appuyez sur les touches Ctrl+Espace pour parcourir les recommandations de l’assistant de contenu. Vous pouvez modifier le type et l’ordre des recommandations de l’assistant de contenu. Dans la boîte de dialogue Préférences, sélectionnez Flash Builder > Editeurs > Code MXML > Avancé.
« Assistant de contenu » à la page 48 « Création de composants MXML personnalisés » à la page 233
Le workbench permet d’associer les éditeurs avec différents types de fichiers. 1 Sélectionnez Fenêtre > Préférences. 2 Cliquez sur le signe plus pour développer la catégorie Général. 3 Cliquez sur le signe plus pour développer la catégorie Editeurs, puis sélectionnez Associations de fichiers. 4 Sélectionnez un type de fichier dans la liste Types de fichier.
5 Dans la liste Editeurs associés, sélectionnez l’éditeur à associer à ce type de fichier.
Vous pouvez éditer un fichier MXML ou ActionScript dans un éditeur externe puis l’utiliser dans Flash Builder. Le workbench effectue les opérations de création ou d’actualisation nécessaires afin d’appliquer les modifications que vous avez apportées au fichier en dehors du workbench. Actualisation d’un fichier MXML ou ActionScript édité en dehors du workbench 1 Editez le fichier MXML ou ActionScript dans l’éditeur externe de votre choix. 2 Enregistrez et fermez le fichier. 3 Démarrez Flash Builder. 4 Dans l’une des vues de navigation du workbench, ouvrez le menu contextuel, puis sélectionnez Actualiser.
Le workbench vous permet d’ouvrir plusieurs fichiers dans différents éditeurs. Mais contrairement aux vues, les éditeurs ne peuvent pas être déplacés à l’extérieur du workbench pour créer des fenêtres. Vous pouvez cependant disposer les éditeurs en mosaïque dans la zone d’édition afin d’afficher les fichiers source côte à côte. 1 Ouvrez deux ou plusieurs fichiers dans la zone d’édition. 2 Cliquez sur l’onglet de l’un des éditeurs. 3 Faites-le glisser vers le bord gauche, droit, supérieur ou inférieur de la zone d’édition.
4 (Facultatif) Faites glisser les bords des éditeurs pour les redimensionner, si besoin est.
Vous pouvez procéder de différentes façons pour agrandir (restaurer) une vue ou un éditeur de manière à occuper entièrement la fenêtre du workbench.
• Cliquez deux fois sur l’onglet de la vue. • Dans le menu Fenêtre de Flash Builder, sélectionnez Agrandir/Rétablir l’éditeur. • Cliquez sur les icônes Agrandir/Restaurer situées dans l’angle supérieur droit de la vue ou de l’éditeur.
Flash Builder regroupe les ressources (dossiers et fichiers) qui constituent une application dans un conteneur appelé project.
Vous pouvez également fermer les projets à l’intérieur d’un espace de travail, importer des ressources et créer des liens vers des ressources externes.
Flash Builder prend en charge les différents types de projets, selon le type d’application que vous créez.
Utilisez un projet Flex pour créer une application Web ou d’ordinateur qui est basée sur la structure Flex. Une application Web s’exécute dans Adobe Flash Player, tandis qu’une application d’ordinateur s’exécute dans Adobe AIR. Lorsque vous créez le projet, vous indiquez s’il est destiné aux applications Web ou d’ordinateur. Un projet Flex contient un ensemble de propriétés qui contrôlent la façon dont l’application est générée, l’endroit où l’application construite est hébergée, la manière dont le débogage est géré et les relations avec les autres projets de l’espace de travail. Un projet Flex contient un fichier d’application MXML par défaut. Les autres fichiers MXML du projet peuvent également servir de fichiers d’application. Voir « Projets Flex » à la page 88 et « Développement d’applications avec Flex » à la page 181.
Utilisez un projet Flex mobile pour créer une application AIR destinée à la plateforme mobile. L’application repose sur la structure Flex. Vous pouvez utiliser Flash Builder pour afficher un aperçu, déboguer et profiler les applications mobiles à partir de l’ordinateur ou sur un périphérique. Un projet Flex mobile comporte un seul fichier d’application MXML par défaut. En général, une application mobile comporte un jeu de composants Vue qui affichent le contenu d’un périphérique. Le fichier d’application MXML par défaut lance le composant Vue par défaut. Flash Builder utilise AIR Debug Launcher (ADL) pour obtenir un aperçu des applications mobiles sur l’ordinateur. Bien qu’il ne s’agisse pas d’une vraie émulation, ADL vous permet de voir la mise en forme et le comportement de l’application, en proposant des options pour faire tourner l’application. Vous pouvez afficher un aperçu de l’application mobile sur un périphérique connecté au port USB de l’ordinateur de développement. Lorsque vous affichez un aperçu sur un périphérique, Flash Builder exporte l’application sur le périphérique. Voir « Projets Flex mobiles » à la page 90 et Développement d’applications mobiles avec Flex et Flash Builder.
Utilisez un projet ActionScript pour créer des applications Web ou d’ordinateur qui reposent sur les API de Flash ou d’Adobe AIR. Lorsque vous créez le projet, vous indiquez s’il est destiné à une application Web ou d’ordinateur. Ces projets ne faisant pas appel à MXML pour définir une interface utilisateur, vous ne pouvez pas afficher la mise en forme et la conception de l’application en mode Création. Vous travaillez exclusivement dans l’éditeur source, et dans les outils de débogage selon les besoins, puis créez le projet dans des fichiers SWF pour afficher un aperçu de votre application et la tester. Lorsque vous créez un projet ActionScript ou un fichier ActionScript autonome destiné à contenir des fonctions, une classe ou une interface, la perspective de développement Flex change pour prendre en charge l’éditeur ActionScript. Les principales vues associées à l’éditeur ActionScript sont les vues Structure et Erreurs.
Vous pouvez utiliser Flash Builder pour afficher un aperçu de l’application mobile à partir de l’ordinateur ou sur un périphérique. Flash Builder utilise AIR Debug Launcher (ADL) pour afficher un aperçu, déboguer et profiler des applications mobiles sur l’ordinateur. Bien qu’il ne s’agisse pas d’une vraie émulation, ADL vous permet de voir la mise en forme et le comportement de l’application, en proposant des options pour faire tourner l’application. Vous pouvez afficher un aperçu de l’application mobile sur un périphérique connecté au port USB de l’ordinateur de développement. Lorsque vous affichez un aperçu sur un périphérique, Flash Builder exporte l’application sur le périphérique. Vous pouvez faire appel à Flash Builder pour déboguer l’application exportée sur un périphérique. Voir « Création de projets ActionScript mobiles » à la page 91.
Utilisez un projet de bibliothèque Flex pour créer des bibliothèques de code personnalisées à partager entre les applications ou à distribuer à d’autres développeurs. En règle générale, vous utilisez les projets de bibliothèque pour assembler et distribuer les composants et ressources à d’autres développeurs. Un projet de bibliothèque génère un fichier SWC, c’est-à-dire un fichier archive pour les composants Flex ainsi que pour d’autres ressources. Voir « Utilisation de projets de bibliothèque Flex » à la page 228.
Utilisez un projet compatible avec Flash Catalyst si vous prévoyez de partager des fichiers de projet avec des projets Adobe Flash Catalyst. Cette fonctionnalité permet aux créateurs et développeurs de collaborer et de travailler ensemble sur le même projet. Voir « Projets compatibles avec Flash Catalyst » à la page 92.
Utilisez un projet Flash Professional pour modifier, créer ou déboguer des fichiers FLA ou XFL créés dans Adobe Flash Professional. Cette fonctionnalité permet aux développeurs Flash Professional de profiter de l’environnement de modification et de débogage que fournit Flash Builder. Les projets Flash Professional sont disponibles dans Flash Builder uniquement si vous avez installé Flash Professional. Voir « Utilisation de Flash Builder avec Flash Professional » à la page 245.
L’Explorateur de packages permet d’ajouter des ressources à un projet, d’importer des ressources, d’exporter des projets ainsi que de déplacer et de supprimer des ressources.
L’Explorateur de packages présente une arborescence des projets dans une vue à la fois physique et logique (plate). Cette vue vous permet de gérer les projets en ajoutant et en supprimant des ressources (dossier et fichiers), en important des ressources externes et en créant des liens vers ces ressources ainsi qu’en déplaçant les ressources vers d’autres projets dans l’espace de travail.
Utilisez le menu de l’Explorateur de packages pour spécifier la présentation des packages.
Vous pouvez développer le contenu d’une bibliothèque et ouvrir les éditeurs pour afficher les pièces jointes.
Vous pouvez créer un jeu de documents (collection de ressources), définir des filtres d’affichage et trier les ressources par nom et type. Ces options sont disponibles dans les menus de l’Explorateur de packages. Pour plus d’informations sur la modification des vues, voir « Personnalisation du workbench » à la page 259.
Dans l’Explorateur de packages, vous pouvez ouvrir les ressources du projet pour les modifier. Vous pouvez par exemple modifier les codes MXML et ActionScript dans les blocs <fx:Script> et le code CSS dans les blocs <fx:Style>. Vous pouvez également passer en mode Création et agencer visuellement les composants et les contrôles pour définir la présentation de l’application et son comportement. Pour plus d’informations sur l’utilisation des éditeurs Flash Builder, voir « Editeurs Flash Builder » à la page 20 et « Création d’interfaces utilisateur » à la page 182.
La plupart des commandes de menu que vous utilisez dans la vue Explorateur de packages sont également disponibles dans le menu contextuel de la vue.
« Gestion de projets » à la page 35 « Ressources des projets » à la page 40
Vous pouvez faire appel à une association d’opérations de suppression et d’importation pour déplacer un projet d’un espace de travail vers un autre. Lorsque vous supprimez un projet d’un espace de travail, vous pouvez l’effacer de l’espace de travail mais le laisser dans le système de fichiers (voir « Suppression d’un projet » à la page 37). Après avoir supprimé un projet d’un espace de travail, vous pouvez l’importer dans un autre.
Lorsque vous créez un projet Flex, vous pouvez spécifier quel SDK Flex vous souhaitez utiliser. Les paramètres du SDK pourront être modifiés ultérieurement en cliquant sur Projet > Propriétés > Compilateur Flex > Utiliser un SDK spécifique. Vous pouvez compiler un projet en utilisant un SDK Flex qui n’est pas disponible dans votre installation Flash Builder en le téléchargeant et en l’y ajoutant. Par exemple, téléchargez le SDK et ajoutez-le à Flash Builder à l’aide de la commande Projet > Propriétés > Compilateur Flex > Configurer les SDK Flex.
Lorsque vous supprimez un projet, vous le retirez de l’espace de travail en cours. Vous pouvez également le supprimer simultanément du système de fichiers. Au lieu de supprimer le projet de l’espace de travail, vous pouvez le fermer. La fermeture du projet vous permet de conserver une référence à ce projet dans l’espace de travail tout en libérant des ressources système. Pour plus d’informations, voir « Fermeture et ouverture de projets » à la page 37. 1 Dans l’Explorateur de packages, sélectionnez le projet à supprimer. 2 Dans le menu principal, sélectionnez Editer > Supprimer. 3 Sélectionnez une option. Supprimer également le contenu sous le répertoire : supprime définitivement le projet de l’espace de travail et du
Ne pas supprimer le contenu : supprime le projet de l’espace de travail sans le supprimer du système de fichiers.
Pour économiser de la mémoire et accélérer la génération sans supprimer un projet, vous pouvez le fermer. Lorsque vous fermez un projet, vous réduisez le projet et ses ressources, mais son nom reste visible dans l’Explorateur de packages. Un projet fermé nécessite moins de mémoire qu’un projet ouvert et est exclu des générations. Vous pouvez facilement rouvrir un projet fermé. 1 Dans l’Explorateur de packages, sélectionnez le projet à fermer ou rouvrir. 2 Dans le menu contextuel de l’Explorateur de packages, sélectionnez Fermer le projet ou Ouvrir le projet.
Lorsque vous créez un projet Flex, un fichier de l’application principale est créé. Par défaut, il est nommé d’après le projet. Le fichier de l’application principale est le point d’accès à vos applications et est la base du fichier SWF de l’application. Cependant, à mesure que vous ajoutez des fichiers à l’application, vous pouvez désigner un fichier différent comme fichier de l’application principale. Si vous préférez définir plusieurs fichiers d’application de manière à ce que chaque fichier d’application soit généré dans un fichier SWF distinct, voir « Gestion des fichiers d’application du projet » à la page 38. 1 Dans l’Explorateur de packages, sélectionnez le fichier d’application MXML que vous voulez définir comme fichier
2 Dans le menu contextuel de l’Explorateur de packages, sélectionnez Définir comme application par défaut.
Applications ActionScript si vous utilisez un projet ActionScript).
Un projet possède généralement un seul fichier de l’application principale, qui sert de point d’accès à l’application. Le compilateur Flash Builder utilise ce fichier pour générer le fichier d’application SWF. Une application complexe peut par exemple être dotée de nombreux composants MXML personnalisés qui représentent des éléments d’application distincts mais interdépendants. Vous pouvez créer un fichier d’application contenant un composant personnalisé et ensuite le générer, l’exécuter et le tester séparément. Par défaut, vous pouvez exécuter l’application à chaque ajout d’un fichier d’application MXML au projet Flex. Ce fichier est alors ajouté à la liste des fichiers d’application du projet. Tous les fichiers définis comme fichiers d’application doivent se trouver dans le dossier source du projet. Vous pouvez gérer la liste des fichiers d’application en sélectionnant un projet et en affichant ses propriétés. 1 Dans l’Explorateur de packages, sélectionnez un projet. 2 Sélectionnez Projet > Propriétés dans le menu principal ou sélectionnez Propriétés dans le menu contextuel. 3 Dans la boîte de dialogue Propriétés du projet, sélectionnez Applications Flex (ou Applications ActionScript si vous
4 Ajoutez et supprimez les fichiers d’applications selon vos besoins. Cliquez sur OK.
Vous ne pouvez travailler que dans un seul espace de travail à la fois. Lorsque vous installez et exécutez Flash Builder pour la première fois, un message vous invite à créer un espace de travail qui devient l’espace de travail par défaut. Vous pouvez créer d’autres espaces de travail et passer de l’un à l’autre en sélectionnant l’espace de travail voulu au lancement de Flash Builder ou en choisissant Fichier > Commuter l’espace de travail.
Chaque projet Flex possède son propre jeu de propriétés. Pour définir ces propriétés, sélectionnez le projet dans la vue Explorateur de packages. Dans le menu principal, sélectionnez ensuite Projet > Propriétés. Vous pouvez également accéder aux propriétés à partir du menu contextuel du projet. Vous pouvez définir les préférences de projet suivantes. Ressource : présente des informations générales concernant le projet, les paramètres pour le codage de texte et les délimiteurs de lignes du système d’exploitation.
Données/Services : pour les projets accédant à des services de données, cette page définit si le générateur de code par
Pour plus d’informations sur l’extension de Flash Builder de manière à prendre en charge la génération de code personnalisé, voir Extension de la prise en charge des services dans Flash Builder. Pour plus d’informations sur l’utilisation d’une seule instance de serveur lors de l’accès aux services, voir Utilisation d’une instance de serveur unique. Applications Flex : affiche le nom des fichiers de projet définis comme fichiers d’application pouvant être compilés,
Voir « Gestion des fichiers d’application du projet » à la page 38. Chemin d’accès à la génération Flex : spécifie le chemin d’accès à la génération, qui précise l’emplacement des fichiers source externes et des fichiers de bibliothèque. Vous pouvez modifier ce chemin et changer le nom du dossier de sortie
Compilateur Flex : spécifie d’une part les préférences optionnelles pour le compilateur (génération d’un fichier SWF accessible, activation des avertissements de compilation et de la vérification des types, spécification d’arguments de compilation supplémentaires et définition de la version du SDK Flex) et définit d’autre part les paramètres de l’enveloppe HTML
Modules Flex : précise les modules à générer et à optimiser pour le projet. Pour plus d’informations sur l’utilisation
Serveur Flex : spécifie le type de serveurs d’applications pour le projet. A la création d’un projet, vous avez la possibilité
Voir « Projets Flex » à la page 88 et Création d’un projet Flex pour l’accès à des services de données. Thème Flex : spécifie le thème à utiliser pour toutes les applications du projet. Vous pouvez spécifier l’un des thèmes
Voir « Application des thèmes » à la page 187. Références de projet : répertorie les projets auxquels le projet en cours fait référence. Exécuter/déboguer les paramètres : gère les paramètres de configuration de lancement.
Si votre espace de travail contient de nombreux projets, vous pouvez créer un jeu de documents afin de regrouper un certain nombre de projets. Vous pouvez alors afficher des jeux de documents différents dans les vues Explorateur de packages et Tâches de même que limiter la portée de vos recherches à des jeux de documents (et ainsi éviter les recherches portant sur l’ensemble de l’espace de travail). Création d’un jeu de documents 1 Dans la vue Explorateur de packages, ouvrez le menu de la barre d’outils et choisissez Sélectionner un jeu de documents.
3 Sélectionnez le type Ressource, puis cliquez sur Suivant. 4 Entrez le nom du jeu de documents, puis choisissez les projets de l’espace de travail que vous souhaitez inclure dans
5 Cliquez sur Terminer.
Affichage de tous les projets dans l’espace de travail ❖ Dans la vue Explorateur de packages, ouvrez le menu de la barre d’outils et choisissez Désélectionner le jeu de documents.
Les projets sont constitués de ressources (dossiers et fichiers) que vous pouvez gérer depuis l’Explorateur de packages. Les projets sont contenus dans un espace de travail. L’Explorateur de packages propose une représentation logique de l’espace de travail dans le système de fichiers. Il est actualisé à chaque fois que vous ajoutez, supprimez ou modifiez une ressource. Vous pouvez également modifier les ressources du projet directement dans le système de fichiers, sans passer par Flash Builder ni par l’Explorateur de packages.
Dans un souci d’efficacité, les composants peuvent être réutilisés, dans la même application ou dans une application différente. Vous pouvez utiliser Adobe Flash® Builder™ pour créer des composants MXML et ActionScript personnalisés, puis les intégrer à vos applications. Pour plus d’informations sur la création de composants ActionScript, voir « Création d’une classe ActionScript » à la page 42. Vous pouvez également créer un composant MXML directement à partir de code. Pour plus d’informations, voir Simple MXML Components.
1 Dans l’Explorateur de packages, sélectionnez Fichier > Nouveau > Fichier. Vous pouvez également ajouter des dossiers et des fichiers se trouvant en dehors du projet en cours. Pour plus d’informations, voir « Liaison à des ressources situées en dehors de l’espace de travail du projet » à la page 44.
1 Dans l’Explorateur de packages, sélectionnez le projet auquel vous souhaitez ajouter le fichier d’application MXML. 2 Dans le menu contextuel de l’Explorateur de packages, sélectionnez Nouveau > Application MXML. 3 Le fichier d’application est créé dans le dossier src par défaut. Vous pouvez sélectionner un autre dossier du projet,
4 Indiquez le nom du fichier d’application et sélectionnez une présentation Spark, si nécessaire. Pour plus
5 Les options suivantes s’appliquent uniquement aux projets mobiles : a Spécifiez un ID d’application. b Spécifiez le modèle d’application.
2 Dans la boîte de dialogue, spécifiez les propriétés de base de la nouvelle classe, puis cliquez sur Terminer.
Si vous avez enregistré le fichier dans le projet actif ou dans le chemin source correspondant, Flash Builder affiche également le composant dans la vue Composants pour permettre son insertion rapide dans les applications. Pour plus d’informations, voir « Ajout de composants en mode Création MXML » à la page 23. 3 Rédigez la définition de la classe ActionScript.
Vous pouvez faire appel à un assistant Flash Builder pour créer rapidement des interfaces ActionScript pour les projets Flex et ActionScript. Une interface est un ensemble de constantes et de méthodes que différentes classes peuvent partager. 1 Sélectionnez Fichier > Nouveau > Interface ActionScript. 2 Spécifiez les propriétés de base de la nouvelle interface dans la boîte de dialogue, puis cliquez sur Terminer. 3 Ajoutez à l’interface ActionScript les éventuelles constantes ou méthodes que les différentes classes partagent.
Vous pouvez faire appel à un assistant Flash Builder afin de créer rapidement des composants ActionScript pour les projets Flex. 1 Cliquez sur Fichier > Nouveau > Composant habillable ActionScript. 2 Spécifiez les propriétés de base du nouveau composant habillable, puis cliquez sur Terminer.
Vous pouvez également ajouter toutes les interfaces ActionScript que le nouveau composant habillable peut implémenter. Pour plus d’informations sur la création d’interfaces ActionScript, voir « Création d’une interface ActionScript » à la page 42. Le composant SkinnableComponent est créé dans l’emplacement et le package sélectionné. Par défaut, le logiciel ajoute automatiquement une référence au composant dans le fichier MXML principal.
Vous pouvez ajouter des dossiers à un projet selon vos besoins. Par exemple, vous pouvez créer un dossier pour stocker tous vos modèles de données. Vous pouvez également organiser tous les éléments qui constituent l’aspect visuel de votre application. 1 Dans l’Explorateur de packages, sélectionnez Fichier > Nouveau > Dossier. 2 Si l’espace de travail contient plusieurs projets, sélectionnez le projet à ajouter au dossier autonome.
Si vous le créez en dehors du dossier du chemin d’accès source, vous pourrez l’ajouter ultérieurement à ce chemin afin de le transformer en racine d’une structure de packages. Une fois que vous avez terminé cette procédure, sélectionnez Projet > Propriétés, puis Chemin d’accès à la génération Flex. Cliquez sur Ajouter un dossier et accédez au dossier que vous venez de créer. 3 Entrez le nom du dossier, puis cliquez sur Terminer.
La suppression de dossiers et de fichiers du projet les élimine de l’espace de travail et, par conséquent, du système de fichiers. Remarque : la suppression d’une ressource liée ne supprime du projet que le lien, pas la ressource (voir « Liaison à des ressources situées en dehors de l’espace de travail du projet » à la page 44). Cependant, si vous avez créé un lien à un dossier et que vous supprimez un ou plusieurs de ses fichiers, ceux-ci sont supprimés du système de fichiers. 1 Dans l’Explorateur de packages, sélectionnez la ressource à supprimer. 2 Sélectionnez Edition > Supprimer ou appuyez sur la touche Supprimer, puis cliquez sur Oui.
Flash Builder intègre un outil de recherche qui vous permet de localiser rapidement des ressources. Pour rechercher le document qui est actuellement ouvert dans l’éditeur, procédez comme suit : 1 Ouvrez le document sur lequel la recherche doit porter. 2 Utilisez l’une des méthodes suivantes :
• Sélectionnez Editer > Rechercher/Remplacer. 3 Saisissez la chaîne de texte à localiser. 4 (Facultatif) Entrez la chaîne de texte de remplacement. 5 (Facultatif) Définissez les critères de recherche avancés. 6 Cliquez sur Rechercher, Remplacer, Remplacer tout ou Remplacer/Rechercher.
Remarque : pour procéder à une recherche incrémentielle, appuyez sur Ctrl+J (Windows) ou Commande+J (Mac OS). Pour rechercher toutes les ressources dans l’espace de travail, Flash Builder comporte des fonctions de recherche avancées plus puissantes que les fonctions de recherche/remplacement. Flash Builder permet de rechercher et de repérer les références ou les déclarations vers les identifiants dans les fichiers ActionScript ou MXML, les projets ou les espaces de travail. Pour plus d’informations, voir « Recherche de références et restructuration du code » à la page 76.
❖ Sélectionnez Rechercher > Rechercher pour effectuer des recherches de fichiers complexes.
La vue Recherche affiche les résultats de votre recherche. Ouverture d’un fichier de la liste ❖ Cliquez deux fois sur le fichier. Suppression d’un fichier de la liste ❖ Sélectionnez le fichier à supprimer, puis cliquez sur Supprimer les occurrences sélectionnées. Suppression de tous les fichiers de la liste ❖ Cliquez sur Supprimer toutes les occurrences. Navigation entre les fichiers correspondants ❖ Cliquez sur Afficher l’occurrence suivante ou Afficher l’occurrence précédente. Affichage des recherches précédentes ❖ Cliquez sur la flèche en regard de l’option Afficher les recherches précédentes et sélectionnez une recherche dans la liste déroulante. Retour à la vue Recherche après sa fermeture 1 Sélectionnez Fenêtre > Affichage d’une vue > Autres. 2 Développez la catégorie Généralités, sélectionnez Recherche, puis cliquez sur OK.
Vous pouvez créer des liens avec des ressources situées en dehors du projet et de l’emplacement de l’espace de travail ainsi qu’avec des dossiers et des fichiers situés n’importe où dans le système de fichiers. Cette option est utile en cas de partage des ressources entre différents projets. Vous pouvez par exemple partager une bibliothèque de composants Flex ou ActionScript personnalisés entre plusieurs projets Flex. Les dossiers contenant des ressources liées sont signalés dans l’Explorateur de packages (comme l’illustre l’exemple suivant). Vous pouvez ainsi distinguer les ressources normales des ressources liées.
Lorsque les ressources sont partagées, les modifications que vous apportez aux dossiers et fichiers source affectent tous les projets qui leur sont liés. Soyez prudent lorsque vous supprimez de vos projets des ressources liées. Dans certains cas, vous supprimez simplement la référence au lien ; dans d’autres, vous supprimez la source même. Pour plus d’informations, voir « Suppression de dossiers et de fichiers » à la page 43.
Liaison à des ressources situées en dehors de l’espace de travail du projet 1 Dans l’Explorateur de packages, sélectionnez le projet auquel vous souhaitez ajouter des ressources liées. 2 Sélectionnez Fichier > Nouveau > Dossier (ou Fichier). 3 Sélectionnez le projet ou le dossier du projet auquel vous souhaitez ajouter les ressources liées. 4 Saisissez le nom du dossier ou du fichier. Il peut être différent du nom du dossier ou du fichier avec lequel vous
5 Cliquez sur le bouton Options avancées. 6 Sélectionnez Lier au dossier dans le système de fichiers. Saisissez ou recherchez l’emplacement de la ressource. 7 Cliquez sur Terminer pour lier la ressource au projet.
Vous pouvez établir des liens vers des ressources en définissant des variables de chemin. Vous évitez ainsi de devoir saisir le chemin complet d’un dossier local ou d’un dossier réseau dans lequel vous enregistrez les fichiers. Pour plus d’informations, voir « Création d’une variable de chemin » à la page 108. 1 Dans l’Explorateur de packages, sélectionnez le projet auquel vous souhaitez ajouter des ressources liées.
2 Sélectionnez Fichier > Nouveau > Dossier (ou Fichier, si vous voulez ajouter des fichiers). 3 Sélectionnez le projet ou le dossier du projet auquel vous souhaitez ajouter les ressources liées. 4 Cliquez sur le bouton Options avancées. 5 Sélectionnez Lier au dossier dans le système de fichiers. Cliquez sur le bouton Variables. 6 Sélectionnez une variable de chemin définie ou cliquez sur Nouveau pour créer une variable de chemin.
7 Saisissez le nom de la variable de chemin et saisissez ou recherchez l’emplacement du fichier ou du dossier.
8 Sélectionnez la nouvelle variable de chemin dans la boîte de dialogue Sélection d’une variable de chemin, puis
9 Cliquez sur Terminer pour terminer la création du lien vers la ressource.
(dans la boîte de dialogue Préférences, sélectionnez Général > Espace de travail > Ressources liées).
Lorsque vous travaillez avec plusieurs projets dans un espace de travail, vous pouvez déplacer des ressources d’un projet vers un autre. 1 Dans l’Explorateur de packages, sélectionnez la ressource à déplacer. 2 Effectuez l’une des opérations suivantes :
• Coupez et collez la ressource dans un autre projet. Lors du déplacement de ressources entre les projets, vous pouvez choisir de mettre à jour les références. Remarque : vous pouvez déplacer des ressources normales et des ressources liées. Pour plus d’informations sur la liaison de ressources, voir « Liaison à des ressources situées en dehors de l’espace de travail du projet » à la page 44.
Pour partager des ressources entre plusieurs projets, placez-les dans des dossiers qui pourront ensuite être reliés aux différents projets à l’aide du chemin d’accès source de ces derniers. Il s’agit de la meilleure méthode de partage de ressources, telles que les classes, les composants MXML et les images. Les mises à jour de ces ressources sont immédiatement disponibles pour tous les projets qui les utilisent. Lorsque les projets sont compilés, les ressources partagées sont ajoutées au fichier SWC. Ajout d’un dossier de ressources externes au chemin d’accès source 1 Sélectionnez un projet dans l’Explorateur de packages. 2 Sélectionnez Projet > Propriétés > Chemin d’accès à la génération Flex (ou Chemin d’accès à la génération
3 Sur la page des propriétés du chemin de génération, cliquez sur l’onglet Chemin source. 4 Cliquez sur le bouton Ajouter un dossier. 5 Saisissez ou recherchez le chemin du dossier, puis cliquez sur OK.
L’onglet de propriétés Chemin source vous permet également de modifier, supprimer ou changer l’ordre des éléments du chemin source. Les dossiers qui sont ajoutés au chemin source sont signalés dans l’Explorateur de packages. Actualisation des ressources dans l’espace de travail A mesure que vous modifiez, ajoutez ou supprimez les ressources d’un projet, le workbench actualise automatiquement les différentes vues qui affichent ces ressources. La suppression d’un fichier du projet par exemple est immédiatement répercutée dans l’Explorateur de packages. Vous pouvez également modifier des ressources situées en dehors de Flash Builder, directement dans le système de fichiers. Ces modifications ne sont visibles dans Flash Builder qu’après actualisation de l’espace de travail. Par défaut, l’espace de travail de la configuration autonome de Flash Builder est actualisé automatiquement. Cette option peut être modifiée dans les préférences de Flash Builder. Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Espace de travail. Vous pouvez également modifier le comportement par défaut de Flash Builder et désactiver l’actualisation automatique de l’espace de travail.
Désactivation de l’actualisation automatique 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Espace de travail. 2 Désélectionnez l’option Actualiser automatiquement.
Dans l’éditeur MXML, la saisie dans le cadre d’un composant MXML conduit par exemple à l’affichage d’une liste contenant toutes les propriétés de ce composant. L’exemple suivant illustre les conseils de code pour les propriétés d’un composant MXML.
Le fonctionnement de l’assistant de contenu dans les éditeurs ActionScript et CSS est analogue.
Par défaut, l’assistant de contenu affiche uniquement les indicateurs correspondant aux types recommandés. Les types recommandés sont les composants disponibles dans les espaces de noms ou autres, suivant les balises englobantes. Les composants dont vous disposez dépendent de la déclaration d’espace de noms de l’application concernée ainsi que des balises englobant le point d’insertion dans l’éditeur. Dans certains contextes par exemple, seuls les composants Spark sont autorisés. D’autres contextes autorisent les composants Spark et les composants Halo. L’assistant de contenu filtre les conseils de code en fonction du contenu. Appuyez à plusieurs reprises sur les touches Ctrl+Espace pour faire défiler les filtres pour les conseils de code affichés. Les filtres sont les suivants :
• Tous les composants • Propriétés Les conseils de code apparaissent automatiquement lorsque vous saisissez du code ActionScript dans l’éditeur ActionScript. L’assistant de contenu filtre les conseils de code en fonction du contenu. Appuyez à plusieurs reprises sur les touches Ctrl+Espace pour faire défiler les filtres pour les conseils de code affichés. Les filtres sont les suivants :
• Variables Remarque : dans les documents CSS, les conseils de code s’affichent uniquement si vous appuyez sur Ctrl+Espace.
à la classe d’habillage. Pour ce faire, appuyez sur la touche Ctrl (touche Commande sur Mac) et déplacez le curseur sur la balise. Le nom de la classe se transforme en hyperlien. Pour plus d’informations sur la navigation par hyperliens, voir « Ouverture des définitions de code » à la page 79.
1 Commencez à entrer une ligne de code qui contient une classe MXML ou ActionScript. Vous pouvez également
Au fur et à mesure que vous tapez, le résumé du guide de référence ActionScript correspondant à la classe apparaît à côté des conseils de code. Si vous survolez une classe avec le curseur de la souris, seul le résumé du guide de référence ActionScript s’affiche. 2 Cliquez à l’intérieur du résumé du guide de référence ActionScript ou appuyez sur la touche F2 pour afficher le
3 Pour afficher la vue ASDoc, appuyez sur Ctrl+3, puis saisissez asdoc et sélectionnez Vues.
Les options suivantes de l’Assistant rapide sont actuellement disponibles : Renommer dans le fichier Utilisez l’Assistant rapide pour renommer les éléments de code pour lesquels l’action Renommer/Restructurer est activée. Il peut s’agir de noms de variables, méthodes, classes, de paramètres, d’importations, d’états et du code ActionScript à l’intérieur des balises MXML. Pour renommer toutes les instances d’une variable ou méthode dans votre fichier, placez le curseur sur le nom de la variable ou méthode sélectionnée, puis appuyez sur Ctrl+1. Sélectionnez ensuite l’option Renommer dans le fichier pour renommer la variable ou la méthode. De même, vous pouvez modifier la propriété d’ID d’un composant MXML. Renommer dans l’espace de travail Utilisez l’Assistant rapide pour renommer les éléments de code pour lesquels l’action Renommer/Restructure est activée dans tous les fichiers de votre espace de travail. Pour renommer toutes les instances d’une variable ou méthode dans votre espace de travail, placez le curseur sur le nom de la variable ou méthode sélectionnée, puis appuyez sur Ctrl+1. Sélectionnez ensuite l’option Renommer dans l’espace de travail pour renommer la variable ou la méthode. Vous pouvez actualiser toutes les références à la variable ou méthode dans votre espace de travail. Organiser les importations Placez le curseur sur n’importe quelle instruction d’importation, puis appuyez sur Ctrl+1. Sélectionnez ensuite l’option d’organisation des importations. Pour plus d’informations sur l’organisation des instructions d’importation, voir « Organisation des instructions d’importation » à la page 87. Générer l’instruction d’importation Si vous avez une variable non définie, vous pouvez placer votre curseur à n’importe quel endroit sur la ligne de code, puis appuyez sur Ctrl + 1. Une option permettant d’importer le composant s’affiche. Si le composant possède des équivalents MX et Spark, les deux options apparaissent. Par exemple, si votre code comporte la variable non définie btn, comme suit : var btn:Button;
Utilisez l’Assistant rapide pour fractionner une variable en deux parties : la déclaration de la variable et l’initialisation de la variable.
Variables locales dans une fonction
Si vous possédez une fonction, comme suit : public function TestAS() { var i:int=10; Le nom de la variable qui est créée découle du nom de la fonction ou de l’identifiant dans l’expression. Si le nom dérivé existe, il est incrémenté. Par exemple, si vous avez le code suivant : var i:int; i;
Accès à la propriété
Sélectionnez ensuite l’option Attribuer l’instruction à une nouvelle variable locale. La variable locale est créée comme suit : var source:Array = ac.source;
Lorsque vous disposez de variables locales dans une fonction, l’Assistant rapide vous permet de créer un champ dans la classe. Par exemple, si vous avez une variable dans une fonction, comme suit : var i:int = 10;
Génération des méthodes get/set L’Assistant rapide vous permet de générer des méthodes get/set (fonctions d’accesseur get et set) pour les variables de classes.
L’Assistant rapide vous permet de générer des fonctions spéciales, telles que labelFunction, iconFunction, etc. Par exemple, pour créer une fonction labelFunction pour le code suivant : <mx:DataGrid labelFunction="lblfunc" dataTipFunction="tipFunc" />
{ Placez ensuite votre curseur dans "clickHandler", appuyez sur Ctrl+1, puis sélectionnez Générer un gestionnaire d’événement. Le gestionnaire d’événement et le code de remplacement sont générés comme suit : <mx:Button click="clickHandler(event)" /> protected function clickHandler(event:MouseEvent):void 1 Ouvrez la boîte de dialogue Remplacer/Implémenter des méthodes en sélectionnant l’option correspondante dans
sélectionner les méthodes à remplacer et les méthodes à implémenter. 3 Vous pouvez choisir le point d’insertion pour insérer les méthodes sélectionnées. L’option de point d’insertion par
Remplacer/Implémenter des méthodes. La variable ou la méthode la plus proche de l’emplacement du curseur apparaît comme option de point d’insertion. Flash Builder génère le code de remplacement pour les méthodes sélectionnées. Pour personnaliser le code de remplacement prédéfini généré par Flash Builder, voir « Modèles de code » à la page 56.
Les modèles de code permettent d’accélérer l’activité de codage grâce à l’insertion automatique de motifs de codage employés fréquemment. Flash Builder inclut différents modèles de code prédéfinis. Vous pouvez également définir des modèles de code supplémentaires pour les motifs de code couramment utilisés. Pour voir tous les modèles de code disponibles, ouvrez la boîte de dialogue Préférences et sélectionnez Flash Builder > Editeurs > Modèles de code. Paul Robertson, professionnel de la communauté Adobe, a publié sur son blog un article sur l’utilisation de modèles de code.
Ctrl+Espace. Vous pouvez utiliser les modèles prédéfinis fournis avec Flash Builder ou créer vos propres modèles.
Pour insérer un modèle de code dans l’éditeur de code, saisissez le nom du modèle dans l’éditeur de code et appuyez sur Ctrl+Espace. Par exemple, lors de l’écriture de code ActionScript, supposons que vous utilisez à plusieurs reprises la boucle for. Vous pouvez dans ce cas définir un modèle de code pour la boucle for de la manière suivante : for (var i:int = 0; i < array.length; i++) { }
Les modèles peuvent également contenir des variables de modèle. Les variables de modèle sont définies entre les symboles ${}. Elles sont résolues en fonction de la définition de variable correspondante dans l’éditeur. Par exemple, si vous définissez un modèle de code pour la boucle for de la manière suivante : for (var ${index}:int = 0; ${index} < ${array}.length; ${index}++) { ${cursor} }
{ var myArr:ArrayCollection = null; } 2 Les modèles de code sont classés dans les catégories ActionScript, MXML et CSS. Chaque catégorie contient un
3 Pour ajouter un nouveau modèle, sélectionnez la catégorie du modèle de code et cliquez sur Ajouter. Dans la boîte
Vous pouvez spécifier des contextes pour les modèles de code ActionScript et MXML. Vous disposez des contextes ActionScript suivants :
• ActionScript statement : insère le modèle de code dans les fonctions et dans les éléments d’une classe. • ActionScript members : insère le modèle de code uniquement dans les éléments d’une classe. • ActionScript Package Scope : insère le modèle de code dans un package, de la manière suivante : Package { /* insert code template*/ • Spark Components : insère le modèle de code dans les composants Spark disponibles pour le SDK Flex 4. • MXML attributes : insère le modèle de code pour les attributs MXML dans les composants MX et Spark. 4 Saisissez le code correspondant au modèle dans la section Motif. Pour insérer des variables dans le code, cliquez sur
Les modèles ActionScript contiennent des variables prédéfinies, notamment array, enclosing_method, enclosing_package, enclosing_type, field, local_var et var. Les modèles MXML contiennent des variables prédéfinies, notamment fx, mx, s et tag. 5 Si vous ne souhaitez pas que Flash Builder insère automatiquement le modèle de code dans votre code, désactivez
6 Pour personnaliser un modèle de code existant, sélectionnez le modèle et cliquez sur Modifier. Après avoir modifié
Pour plus d’informations sur la personnalisation des modèles de fichier et des variables de modèle, voir « Personnalisation des modèles de fichier » à la page 62 et « Variables des modèles » à la page 65. Vous pouvez à tout moment supprimer le modèle personnalisé et rétablir le modèle de code prédéfini en cliquant sur Rétablir la valeur par défaut.
Vous pouvez également importer et exporter des modèles de code. Vous pouvez sélectionner un ou plusieurs modèles et les exporter. Les modèles sont exportés sous forme de fichier XML. Paul Robertson, professionnel de la communauté Adobe, a publié sur son blog un article sur le partage de modèles de code.
Flash Builder peut générer automatiquement un code prédéfini dans les scénarios suivants :
• « Génération de fonctions d’accesseur get ou set » à la page 73 • « Génération à partir de l’utilisation » à la page 71 (code d’élément de remplacement de l’emplacement réservé pour une méthode non définie)
Vous pouvez personnaliser le modèle de code prédéfini généré par Flash Builder.
1 Ouvrez la boîte de dialogue Préférences, puis sélectionnez Flash Builder > Editeurs > Modèles de code > Flash
2 Sélectionnez le nom du modèle de code que vous souhaitez personnaliser, puis cliquez sur Editer. Par exemple, pour
3 Vous pouvez personnaliser le nom du modèle, la description et le motif de code. 4 Pour insérer une variable dans le code, cliquez sur Insérer une variable, puis sélectionnez la variable. Pour plus
5 Vous pouvez à tout moment annuler les modifications en cliquant sur Rétablir la valeur par défaut. 6 Vous pouvez aussi importer et exporter le modèle de code. Vous pouvez sélectionner un ou plusieurs modèles et
Variables de code pour les gestionnaires d’événement Variable
Si vous n’avez pas spécifié de valeurs d’ID, les valeurs générées automatiquement sont composant1, composant2, etc.
${:method_name('${component_id}_${event_name}Handler ')}(${event}:${event_type}):${return_type} Flash Builder affiche des indicateurs de remplissage du code des métadonnées que vous utilisez dans vos documents MXML et ActionScript. Dans un document MXML, les indicateurs de remplissage du code s’affichent dans les balises <fx:Metadata> et <fx:Script> intégrées. Dans un document ActionScript, les indicateurs de remplissage du code s’affichent également pour les éléments de langage ActionScript, tels que les noms de classe, les variables et les méthodes set/get.
Utilisation du remplissage du code de métadonnées dans les documents MXML Dans un document ou une classe MXML, vous pouvez utiliser le remplissage du code de métadonnées comme suit :
<fx:Metadata> [ Dernière mise à jour le 9/12/2011
1 Créez un projet de bibliothèque. L’assistant de création d’un projet de bibliothèque Flex vous guide à travers les
2 Ajoutez le fichier metadata.xml dans le dossier src, sous le dossier racine de votre projet de bibliothèque. Incluez
Ajoutez le fichier metadata.properties (le cas échéant) dans le dossier de paramètres régionaux approprié. Par exemple : locale/en_US ou locale/fr_FR. Pour plus d’informations sur les balises de métadonnées, voir About metadata tags dans la documentation Flex. 3 Incluez le fichier metadata.xml dans le fichier SWC de bibliothèque, comme suit : a Sélectionnez Projet > Propriétés > Chemin de génération de la bibliothèque Flex.
4 Sélectionnez le dossier de paramètres régionaux auquel vous avez ajouté le fichier metadata.properties (le cas
5 Une fois le fichier SWC généré, ajoutez-le au chemin de génération de votre projet, comme suit : 1 Sélectionnez Projet > Propriétés > Chemin d’accès à la génération Flex. 2 Cliquez sur Ajouter un fichier SWC. 3 Accédez à l’emplacement du fichier SWC ou saisissez-le, puis cliquez sur OK.
SWC entre vos applications ou les distribuer à d’autres développeurs.
Flash Builder vous permet de personnaliser les informations par défaut contenues dans les nouveaux fichiers MXML, ActionScript et CSS. Il peut s’agir par exemple des variables définissant l’auteur et la date, des variables pour les balises et les attributs d’ouverture et de fermeture ainsi que des variables pour différentes déclarations ActionScript, pour différents préfixes d’espace de noms et pour presque tout contenu que vous souhaitez inclure dans un modèle de fichier. Les modèles de fichier sont utiles notamment pour spécifier des commentaires d’introduction et des informations de copyright. Le contenu d’un nouveau fichier est spécifié dans un modèle de fichier accessible à partir de Préférences > Flash Builder > Modèles de fichier. Des modèles sont disponibles pour les types de fichier suivants.
3 Cliquez sur Editer et modifiez le modèle.
4 Cliquez sur OK pour enregistrer les modifications.
Exportation et importation de modèles de fichier 1 Sélectionnez Préférences > Flash Builder > Modèles de fichier. 2 Développez les types de fichier et sélectionnez un modèle. 3 Cliquez sur Exporter pour exporter le modèle vers un système de fichiers ou Importer pour importer un modèle
Les modèles sont exportés dans des fichiers XML.
Remarque : le bouton Restaurer les valeurs par défaut rétablit les valeurs par défaut de tous les modèles de fichier. Vous ne pouvez pas restaurer les valeurs par défaut d’un seul modèle. ❖ Pour restaurer les modèles par défaut, ouvrez la fenêtre Préférences > Flash Builder > Modèles de fichier et
Variables des modèles pour tous les types de fichiers Variable
${application} s’étend à « WindowedApplication ». ${component} s’étend à « Component ». ${module} s’étend à « Module ». Ces balises permettent généralement de positionner les balises d’ouverture et de fermeture d’un fichier.
${xmlns}${wizard_attributes}${min_size}> Vous ne pouvez pas modifier les valeurs par défaut de cette variable.
Lorsque vous utilisez le modèle Combobox suivant dans le contexte des composants MX : <${mx}ComboBox id="${comboBox}" rowCount="${rowCount:values(5)}" dataProvider="${dataProvider}"/> Génère la déclaration d’interface pour une nouvelle interface ActionScript.
Dernière mise à jour le 9/12/2011
L’Assistant rapide permet de générer du code de remplacement pour une méthode, une variable ou une classe non définie dans le code. Le code de remplacement généré peut être utilisé comme espace réservé pour le code que vous souhaitez implémenter plus tard sans rendre votre code incompatible. Pour personnaliser le code de remplacement prédéfini généré par Flash Builder, voir « Modèles de code » à la page 56. Pour appeler l’Assistant rapide, vous pouvez utiliser le raccourci clavier Ctrl+1(Windows) ou Commande+1 (Mac OS). Utilisez l’Assistant rapide pour générer un code de remplacement dans la classe appropriée ou un bloc de script MXML en sélectionnant une des actions suivantes : Générer la méthode : crée une méthode
{ bar(); } Dernière mise à jour le 9/12/2011
Quick Assist pour les classes externes et les interfaces. Générer un gestionnaire d’événement : génère des fonctions de gestionnaire d’événement
{ Var button:Button = new Button(); button.addEventListener(DragEvent.DRAG,dragHandlerFunction); Vous pouvez générer des instructions d’importation pour les arguments de fonction, les types de retour de fonction, etc.
Les fonctions des accesseurs get et set permettent de faire en sorte que les propriétés d’une classe restent privées pour cette classe. Les utilisateurs peuvent accéder à ces propriétés de la même manière qu’ils accèdent à une variable de classe (au lieu d’appeler une méthode de classe). Flash Builder peut générer des fonctions d’accesseur get et set ActionScript pour les variables de classe. Vous pouvez sélectionner une propriété liable et générer des fonctions d’accesseur get et set pour cette propriété. Vous pouvez également spécifier un nom d’événement personnalisé pendant la génération du code. Méthode de génération de fonctions d’accesseur get ou set 1 Ouvrez un fichier ActionScript dans l’éditeur de source, puis placez le curseur sur une variable de classe. 2 Sélectionnez Source > Générer les méthodes get/set dans le menu Flash Builder ou le menu contextuel. 3 Dans la boîte de dialogue Générer les méthodes get/set, spécifiez les informations concernant les fonctions
Remarque : pour afficher le code qui est généré, sélectionnez Aperçu avant de cliquer sur OK. Pour personnaliser le code prédéfini généré par Flash Builder, voir « Modèles de code » à la page 56. Lorsque vous générez des accesseurs get et set, Flash Builder propose les options suivantes :
En règle générale, les variables de classe ont un accès privé.
Par convention, les variables de classe privée ont un trait de soulignement au début du nom.
• Spécifier une propriété liable et un nom d’événement personnalisé. Lorsque vous spécifiez une propriété liable, une balise [Bindable] est définie au-dessus de la fonction d’accesseur générée dans le code généré.
• Spécifier la valeur de l’espace de noms pour la fonction d’accesseur.
• Après la dernière méthode • Avant les déclarations de variable • Afficher un aperçu du code qui est généré. Pour plus d’informations sur les fonctions d’accesseur get et set, voir Méthodes d’accesseur get et set dans le Guide de référence du langage ActionScript 3.0 pour la plateforme Adobe Flash.
Au cours de la rédaction de code, le compilateur Flash Builder identifie les erreurs de syntaxe et les signale pour vous permettre de les corriger avant d’exécuter l’application. Les couleurs de la syntaxe peuvent être personnalisées. Lorsqu’une erreur de syntaxe est détectée dans le code, elle vous est signalée de l’une des manières suivantes.
Cliquez deux fois sur le message d’erreur pour localiser et mettre en évidence la ligne de code dans l’éditeur, ainsi que l’illustre l’exemple suivant.
❖ Ouvrez la boîte de dialogue Préférences et sélectionnez Flash Builder > Editeurs > Couleurs pour la syntaxe.
Editeurs > Editeurs de texte).
Lorsque vous saisissez du code ActionScript, Flash Builder génère automatiquement des annotations d’erreur pour les identifiants non définis de votre code. Les annotations d’erreur sont indiquées par . Vous pouvez rapidement identifier les variables et méthodes non définies avant d’enregistrer le fichier et que le compilateur ne génère l’erreur. La mise en surbrillance des erreurs de référence non identifiées vous permet également d’identifier les endroits dans le code où vous pouvez générer du code de remplacement pour une méthode, une variable ou une classe non définie. Pour plus d’informations, voir « Génération à partir de l’utilisation » à la page 71. Flash Builder active par défaut la mise en surbrillance des erreurs de référence non identifiée. Pour la désactiver, sélectionnez Flash Builder > Editeurs dans la boîte de dialogue Préférences, puis désélectionnez Signaler les erreurs au fur et à mesure de la saisie.
Flash Builder comporte des fonctions de recherche avancées plus puissantes que les fonctions de recherche/remplacement. Afin de faciliter la compréhension de la manière dont les fonctions, variables et autres identifiants sont utilisés, Flash Builder permet de rechercher et de repérer les références ou les déclarations vers les identifiants dans les fichiers ActionScript ou MXML, les projets ou les espaces de travail. Vous pouvez utiliser la restructuration pour renommer les identifiants suivants dans votre code et mettre à jour toutes les références à ces objets :
• Fonctions 2 Dans l’éditeur, cliquez sur un identifiant. Toutes les instances sont marquées en fonction des paramètres des
Pour modifier l’apparence des références marquées, dans la boîte de dialogue Préférences, sélectionnez Général > Editeurs > Editeurs de texte > Annotations. Pour plus d’informations sur les marqueurs, voir « Utilisation de marqueurs » à la page 84. Recherche de toutes les références et de toutes les déclarations 1 En mode Source, cliquez sur un identifiant dans l’éditeur. 2 Dans le menu principal, sélectionnez Rechercher > Références ou Rechercher > Déclarations. Sélectionnez ensuite
Restructuration du code 1 En mode Source, cliquez sur un identifiant dans l’éditeur. 2 Dans le menu principal, sélectionnez Source > Restructurer > Renommer. 3 Entrez un nouveau nom.
• Tous les fichiers doivent avoir été sauvegardés. • Les projets présentant des erreurs de génération provoquent l’affichage d’un avertissement. • Le nouveau nom doit se trouver dans l’étendue, déterminée par le type de l’élément et son emplacement. Les erreurs d’occultation de noms sont également signalées.
• La référence définie dans un fichier SWC doit comprendre une connexion de la source.
restructurée, ou cliquez sur OK pour poursuivre la modification du code.
Les éditeurs Flash Builder offrent de nombreuses fonctions pour parcourir le code. Vous pouvez par exemple réduire ou développer des blocs de code, ouvrir les sources de définitions de code ainsi que rechercher et ouvrir des types. La navigation par code offre la possibilité de sélectionner un élément de code (une référence à un composant personnalisé d’un fichier d’application MXML, par exemple) et d’aller à la source de la définition du code, quel que soit son emplacement dans le projet, espace de travail ou chemin. Des blocs de plusieurs lignes peuvent être réduits et développés afin de faciliter la navigation, l’affichage et la gestion de documents présentant un code complexe. Dans Flash Builder, ces deux opérations sont désignées par les termes de développement et de réduction d’instructions de code de plusieurs lignes.
Lorsque vous saisissez du code, Flash Builder insère automatiquement des lignes de code pour améliorer la lisibilité, ajoute une couleur distinctive aux éléments de code et propose de nombreuses commandes de formatage rapide du code que vous saisissez (ajout d’un commentaire de bloc, par exemple). Pour changer le formatage par défaut, dans la boîte de dialogue Préférences, sélectionnez Flash Builder > Code MXML > Formatage. Vous pouvez modifier l’ordre et le regroupement des attributs.
Pour modifier les préférences de mise en retrait, dans la boîte de dialogue Préférences, sélectionnez Flash Builder > Editeurs. Vous pouvez spécifier le type et la taille de retrait.
1 Dans l’éditeur, cliquez sur le symbole de réduction (-) ou sur celui de développement (+) dans la marge de gauche.
(+) pour visionner l’ensemble du bloc dans une info-bulle.
L’éditeur met automatiquement en forme les lignes de code en cours de saisie, améliorant ainsi la lisibilité et facilitant la rédaction. Vous pouvez également utiliser la touche de tabulation pour mettre manuellement en retrait certaines lignes de code. Lorsque vous copiez et collez des blocs de code dans Flash Builder, ce dernier met automatiquement en retrait le code en fonction de vos préférences. Pour mettre en retrait un bloc de code en une seule opération, vous pouvez utiliser les commandes Décaler vers la droite et Décaler vers la gauche de l’éditeur. Déplacement d’un bloc de code vers la gauche ou vers la droite 1 Dans l’éditeur, sélectionnez un bloc de code. 2 Cliquez sur Source > Décaler vers la droite ou Source > Décaler vers la gauche. 3 Appuyez sur la touche de tabulation ou sur Maj et la touche de tabulation pour mettre en retrait ou annuler la mise
Définition des préférences de la mise en retrait 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Flash Builder > Mise en retrait.
• Commentaires de source pour ActionScript (//) • Commentaires de bloc pour ActionScript (/*
2 Appuyez sur Ctrl+Maj+C (Windows) ou Commande+Maj+C (Mac OS) pour ajouter ou supprimer des
3 Appuyez sur Ctrl+/ (Windows) ou Commande+/ (Mac OS) pour ajouter ou supprimer des commentaires de style C++.
1 Dans l’éditeur, sélectionnez au moins une ligne de code MXML. 2 Appuyez sur Ctrl+Maj+C (Windows) ou Commande+Maj+C (Mac OS) pour ajouter un commentaire.
1 Dans l’éditeur, sélectionnez au moins une ligne de code MXML. 2 Appuyez sur Ctrl+Maj+D (Windows) ou Commande+Maj+D (Mac OS) pour ajouter un commentaire.
Quelle que soit la complexité des applications, les projets contiennent généralement de nombreuses ressources et lignes de code. Flash Builder fournit plusieurs fonctionnalités qui facilitent la navigation et l’inspection des différents éléments du code.
Flash Builder permet d’ouvrir la source d’une définition de code externe à partir de sa référence dans le code. Si vous créez par exemple un composant MXML personnalisé et l’importez dans l’application MXML, vous pouvez sélectionner la référence au composant MXML et ouvrir le fichier source dans l’éditeur. Ouverture de la source d’une définition de code 1 Dans l’éditeur, sélectionnez la référence du code. 2 Dans le menu Naviguer, sélectionnez Accéder à la définition.
Flash Builder prend également en charge la navigation dans le code par hyperliens. Ouverture de la source d’une définition de code en utilisant la navigation par hyperliens 1 Localisez la référence du code dans l’éditeur. 2 Appuyez sur la touche Ctrl (Windows) ou la touche Commande (Mac OS) et maintenez-la enfoncée, puis
3 Pour atteindre la référence du code, cliquez sur l’hyperlien.
La vue Structure appartient à la perspective Développement Flash (voir « Perspective Développement Flash » à la page 8). Elle est donc disponible au cours de la modification du code et de la création de l’application. Cette vue permet d’examiner et de parcourir plus facilement la structure des documents MXML, ActionScript et CSS. Elle présente trois modes : le mode Classe, le mode MXML et le mode CSS. En mode Classe, cette vue affiche la structure du code (classes, variables des membres, fonctions, etc.). En mode MXML, elle affiche la structure MXML (balises, composants, contrôles, etc.). En mode CSS, elle affiche les sélecteurs CSS et les propriétés imbriquées qu’ils contiennent. La sélection d’un élément dans la vue Structure permet de le localiser et de le mettre en évidence dans l’éditeur, facilitant ainsi considérablement la navigation à l’intérieur du code. Vue Structure en mode Classe Lorsque vous éditez un document ActionScript (ou un code ActionScript contenu dans un document MXML), la vue Structure affiche la structure du code. Cette structure comporte les instructions d’importation, les packages, les classes, les interfaces, les variables non contenues dans les fonctions et les fonctions. En revanche, elle ne contient aucune métadonnée, aucun commentaire, aucune déclaration d’espace de noms et aucun contenu de fonction.
éléments publics ; les icônes jaunes indiquent que l’élément n’est ni privé, ni public.
En mode MXML, chaque élément de la vue représente une balise MXML. Les types de balise affichés sont les suivants : les composants, les contrôles, les balises non visuelles (WebService ou State), les propriétés des composants exprimées sous forme de balises enfant (contraintes de présentation, par exemple) et les balises de compilateur (Model, Array et Script).
Barre d’outils de la vue Structure en mode MXML En mode MXML, la barre d’outils de la vue Structure contient des commandes supplémentaires permettant de basculer de la vue MXML à la vue des classes.
Vous pouvez ouvrir la vue Structure rapide à partir des éditeurs ActionScript et MXML pour afficher la vue Structure en mode Classe. La vue Structure rapide apparaît dans une fenêtre contextuelle à l’intérieur de l’éditeur et ne se présente donc pas sous forme de vue distincte. Elle permet de parcourir et d’examiner rapidement le code.
Structure rapide afin de limiter l’affichage aux éléments contenant les caractères saisis.
De même que dans la vue Structure, vous pouvez sélectionner un élément afin de le localiser et de le mettre en évidence dans l’éditeur. Ouverture de la vue Structure rapide ❖ Ouvrez un document ActionScript ou MXML dans l’éditeur. Dans le menu Naviguer, sélectionnez Structure rapide. Vous pouvez également utiliser le raccourci clavier Ctrl+O.
❖ L’accès à tout emplacement situé en dehors de la vue Structure rapide conduit à la fermeture de cette dernière. Elle peut également être fermée en appuyant sur la touche Echap.
La boîte de dialogue Ouvrir un type permet de parcourir toutes les classes disponibles (y compris les classes de la structure Flex) du projet. Dans la boîte de dialogue Ouvrir un type, sélectionnez une classe pour afficher l’implémentation.
La boîte de dialogue Ouvrir un type vous permet de filtrer les classes affichées en fonction du texte et des caractères génériques que vous spécifiez. La boîte de dialogue fait appel à différentes couleurs pour signaler les types recommandés et les types exclus. Les types recommandés sont affichés en gris. Les types exclus sont affichés en marron. Les types recommandés sont les classes disponibles dans l’espace de noms par défaut d’un projet. Dans certains contextes par exemple, seuls les composants Spark sont autorisés. D’autres contextes autorisent les composants Spark et les composants Halo. Les types exclus sont les classes qui ne sont pas disponibles dans l’espace de noms par défaut pour un projet. Ouverture de la boîte de dialogue Ouvrir un type • (Parcourir les classes) Pour parcourir les classes et visionner leur implémentation : 1 Dans le menu Flash Builder, sélectionnez Navigation > Ouvrir un type. 2 (Facultatif) Saisissez du texte ou sélectionnez des filtres pour modifier les classes visibles dans la liste. 3 Sélectionnez une classe pour en afficher le code source.
1 Sélectionnez Fichier > Nouveau > Classe ActionScript. 2 En regard du champ Superclasse, cliquez sur Parcourir.
4 Sélectionnez une classe de base dans la liste.
1 Sélectionnez Fichier > Nouveau > Composant MXML. 2 Dans la liste des projets de l’espace de travail, sélectionnez un projet pour un nouveau composant MXML et
Les composants de base disponibles varient en fonction des espaces de noms configurés pour un projet. 3 En regard du champ Basé sur, cliquez sur Parcourir.
4 (Facultatif) Saisissez du texte ou sélectionnez des filtres pour modifier les classes visibles dans la liste. 5 Sélectionnez un composant de base dans la liste.
Vous pouvez ajouter des numéros de ligne dans l’éditeur afin de faciliter la lecture et la consultation du code. ❖ Dans le menu contextuel de la marge de l’éditeur, sélectionnez Afficher les numéros de ligne.
Les marqueurs sont des raccourcis vers les lignes de code d’un document, vers un document ou vers un dossier. Ils représentent des tâches, des signets et des problèmes. Ils sont affichés et peuvent être gérés. La sélection de marqueurs provoque l’ouverture du document associé dans l’éditeur et met éventuellement en évidence la ligne concernée du code. Pour mettre à jour les marqueurs de problèmes dans Flash Builder, vous devez enregistrer le fichier. Seuls les fichiers auxquels l’application fait référence sont vérifiés. La syntaxe d’une classe isolée qui n’est pas utilisée dans le code n’est pas contrôlée. Le workbench génère automatiquement les marqueurs de tâches et de problèmes suivants. Vous pouvez ajouter des tâches et des signets manuellement. Tâches : les marqueurs de tâches représentent un élément de travail. Les éléments de travail sont générés automatiquement par le workbench. Vous pouvez ajouter manuellement une tâche à une ligne de code du document
« Ajout de tâches » à la page 85. Erreurs : les marqueurs d’erreurs sont générés par le compilateur et signalent différents types d’états non valides. Par exemple, les erreurs de syntaxe et les avertissements générés par le compilateur sont affichés comme marqueurs dans la vue Erreurs. Pour plus d’informations, voir « Vue Erreurs » à la page 10. Signets : vous pouvez ajouter manuellement des signets à une ligne de code ou à une ressource (dossier ou document).
Remarque : les vues Tâches et Signets ne sont pas affichées par défaut dans la perspective Développement Flash. Pour plus d’informations sur l’ajout de ces vues, voir « Utilisation de vues » à la page 19.
Les marqueurs sont à la fois des descriptions et des liens vers des éléments des ressources d’un projet. Les marqueurs sont générés automatiquement par l’ordinateur pour indiquer des problèmes au niveau du code ou sont ajoutés manuellement pour vous aider à suivre les tâches ou les bouts de code. Les marqueurs sont affichés et gérés dans les vues associées. Les marqueurs d’un projet sont facilement repérables dans les vues Signets, Erreurs et Tâches, à partir desquelles ils sont accessibles. Accès à l’emplacement d’un marqueur ❖ Sélectionnez un marqueur dans les vues Signets, Erreurs ou Tâches. Le fichier contenant le marqueur est localisé et affiché dans l’éditeur. Si l’emplacement du marqueur est une ligne de code, cette dernière est mise en surbrillance.
Les tâches sont des éléments de l’espace de travail créés automatiquement ou manuellement. Toutes les tâches sont affichées et gérées dans la vue Tâches (Fenêtre > Autres vues > Généralités > Tâches), comme illustré dans l’exemple suivant :
1 Ouvrez un fichier dans l’éditeur, puis repérez et sélectionnez la ligne de code à laquelle vous souhaitez ajouter une tâche. Vous pouvez également sélectionner une ressource dans l’Explorateur de packages. 2 Dans la vue Tâches, cliquez sur le bouton Ajouter une tâche dans la barre d’outils. 3 Entrez le nom de la tâche et sélectionnez une priorité (Elevée, Normale, Faible), puis cliquez sur OK.
Ajout et suppression de signets Les signets permettent de repérer et rechercher facilement des éléments au sein des projets. Tous les signets sont affichés et gérés dans la vue Signets (Fenêtre > Autres vues > Généralités > Signets), comme illustré dans l’exemple suivant :
1 Ouvrez un fichier dans l’éditeur, puis localisez et sélectionnez la ligne de code à laquelle vous souhaitez ajouter un signet. 2 Dans le menu principal, sélectionnez Editer > Ajouter un signet. 3 Saisissez le nom du signet et cliquez sur OK.
Remarque : comme vous pouvez le constater dans l’Explorateur de packages Flex, la ressource ne signale pas qu’elle contient un marqueur. Vous pouvez visionner et gérer tous les signets dans la vue Signets. Suppression d’un signet 1 Dans la vue Signets, sélectionnez le signet à supprimer. 2 Cliquez sur le signet avec le bouton droit de la souris (Windows) ou en appuyant sur la touche Ctrl (Mac OS), puis
L’utilisation de l’assistant de contenu dans les éditeurs MXML et ActionScript conduit à l’importation automatique dans le document des packages dans lesquels les classes se situent. Les packages sont ajoutés dans l’ordre dans lequel ils ont été saisis dans le code. Les importations qui ne sont pas utilisées ou ne sont pas nécessaires sont automatiquement supprimées. Afin de faciliter l’organisation du code dans les documents ActionScript, vous pouvez trier les instructions d’importation par ordre alphabétique. Pour ce faire, ouvrez la boîte de dialogue Préférences, sélectionnez Flash Builder > Editeurs > Code ActionScript, puis Garder les importations organisées. Tri des instructions d’importation ❖ Dans l’éditeur, ouvrez un document ActionScript contenant les instructions d’importation. Dans le menu Source, sélectionnez Organiser les importations. Vous pouvez également utiliser le raccourci clavier suivant : Ctrl+Maj+ O (Windows) ou Commande+Maj+O (Mac OS).
également utiliser différentes versions du SDK Flex d’Adobe directement dans Flash Builder.
Flash Builder permet de créer différents types de projets tels que Flex, Flex mobile, ActionScript et AIR, ainsi que d’autres types de projets. Flash Builder fournit un assistant de création de projet qui vous guide à travers les différentes étapes en vous demandant le type de projet que vous souhaitez créer, le nom du projet, son emplacement, le type d’application (Web ou d’ordinateur), les version du SDK ainsi que d’autres options. Pour plus d’informations sur la création d’un projet ActionScript, voir « Projets ActionScript » à la page 91. Pour plus d’informations sur la création de projets de bibliothèque, voir « Utilisation de projets de bibliothèque Flex » à la page 228. Pour plus d’informations sur la création de projets Flash Professional, voir « Utilisation de Flash Builder avec Flash Professional » à la page 245.
Vous pouvez utiliser les projets Flex afin de créer des applications Web (dans Flash Player) ou des applications d’ordinateur (dans Adobe AIR). Des options permettent de créer des projets Flex MX uniquement ou des projets Flex Spark uniquement, n’utilisant que des composants Spark.
Utilisez cette procédure pour créer des applications Web ou d’ordinateur. 1 Sélectionnez Fichier > Nouveau > Projet Flex. 2 Entrez un nom de projet et un emplacement.
3 Sélectionnez Web ou Bureau comme type d’application. 4 Utilisez le SDK Flex par défaut ou accédez à un autre SDK installé. Cliquez sur Suivant. 5 (Facultatif) Indiquez les paramètres du serveur.
6 Spécifiez un dossier de sortie.
Si vous spécifiez un serveur d’applications, le serveur de sortie se trouve hors du dossier du projet. En général, vous placez le dossier de sortie avec vos fichiers de service.
9 Cliquez sur Terminer.
Vous pouvez convertir un projet Flex en projet MX uniquement. Gardez cependant à l’esprit que Flash Builder ne réécrit pas le code du projet. Mettez manuellement à jour le code afin d’en supprimer toute référence aux composants Spark. Création d’un projet Flex MX uniquement 1 Sélectionnez Fichier > Nouveau > Projet Flex. 2 Spécifiez l’emplacement du projet et les paramètres du serveur, comme décrit dans « Chemins de génération, 3 Sur la page des chemins de génération de l’assistant Nouveau projet Flex, spécifiez MX uniquement. 4 Indiquez d’autres paramètres de génération de chemin, comme le décrit la section « Chemins de génération,
Conversion d’un projet Flex en projet Flex MX uniquement 1 Rendez le projet actif dans Flash Builder : Pour ce faire, vous devez généralement ouvrir un fichier source du projet. 2 Sélectionnez Projet > Propriétés > Chemin d’accès à la génération Flex. 3 Pour le paramètre Jeu de composants, sélectionnez l’option MX uniquement. Cliquez sur OK. 4 Modifiez tout code d’application du projet accédant à des composants Spark.
L’option Spark Only est utile pour créer des applications qui utilisent les fonctionnalités Flex et Flash Builder, telles que la nouvelle syntaxe d’états, les fonctionnalités CSS avancées, des fonctions de compilation améliorées ainsi que d’autres fonctionnalités de langage.
3 Utilisez le SDK Flex 4.6 par défaut qui prend en charge le développement d’applications mobiles. Cliquez sur
4 Spécifiez les paramètres mobiles :
Pour plus d’informations, voir Choix des autorisations d’une application mobile.
Les paramètres de plateforme vous permettent de sélectionner une gamme de périphériques cibles. Selon la plateforme sélectionnée, vous pouvez choisir le périphérique cible ou une gamme de périphériques cibles. Remarque : il n’existe aucun paramètre spécifique aux plateformes Google Android et BlackBerry Tablet OS. Pour plus d’informations, voir Choix des paramètres de plateforme.
Pour plus d’informations, voir Choix des paramètres d’application. 5 Cliquez sur Terminer ou Suivant pour spécifier les paramètres du serveur. 6 (Facultatif) Indiquez les paramètres du serveur.
7 Spécifiez un dossier de sortie.
Si vous spécifiez un serveur d’applications, le serveur de sortie se trouve hors du dossier du projet. En général, vous placez le dossier de sortie avec vos fichiers de service. 8 Cliquez sur Terminer ou sur Suivant pour indiquer d’autres options de configuration. 9 (Facultatif) Spécifiez des chemins d’accès à la génération et d’autres options de configuration.
10 Cliquez sur Terminer.
Pour plus d’informations sur le développement mobile avec Flex et Flash Builder, voir Développement d’applications mobiles avec Flex et Flash Builder.
« Projets Flex mobiles » à la page 34
3 Sélectionnez Web ou Bureau comme type d’application. 4 Spécifiez les chemins de génération.
5 Cliquez sur Terminer.
Utilisez cette procédure afin de créer des applications AIR basées sur Flex exécutables sur les périphériques Apple iOS, BlackBerry Tablet OS et Google Android. 1 Sélectionnez Fichier > Nouveau > Projet ActionScript mobile. 2 Entrez un nom de projet et un emplacement.
3 Utilisez le SDK Flex 4.6 par défaut qui prend en charge le développement d’applications mobiles. Cliquez sur
4 Spécifiez les paramètres mobiles :
Pour plus d’informations, voir Choix des autorisations d’une application mobile.
Pour plus d’informations, voir Choix des paramètres de plateforme.
Sélectionnez Réorientation automatique pour que l’application pivote lorsque le périphérique subit une rotation. Sélectionnez Plein écran pour que l’application s’affiche en mode plein écran sur le périphérique. 5 Cliquez sur Terminer ou sur Suivant pour indiquer d’autres options de configuration. 6 (Facultatif) Indiquez les chemins de génération.
7 Cliquez sur Terminer.
« Projets ActionScript mobiles » à la page 35 « Gestion des configurations de lancement » à la page 120
Vous pouvez créer un projet Flex compatible avec Flash Catalyst. Lorsque vous créez un projet compatible avec Flash Catalyst, xmlns:fc="http://ns.adobe.com/flashcatalyst/2009" l’espace de noms est ajouté. Cet espace de noms vous permet de créer des composants dans Flash Builder qui peuvent être utilisés dans Flash Catalyst. Flash Catalyst CS5.5 prend en charge un jeu partiel de composants disponibles dans Flex 4.5 ou version supérieure.
Catalyst (Projet > Flash Catalyst > Vérifier automatiquement la compatibilité). Si vous utilisez des ressources incompatibles ou introduisez des incompatibilité dans le projet, Flash Builder affiche les erreurs de compatibilité dans la vue Erreurs. Pour plus d’informations sur la création d’un projet compatible avec Flash Catalyst, voir Directives sur la création d’un projet compatible avec Flash Catalyst.
FXPL. Vous pouvez par ailleurs modifier un projet compatible avec Flash Catalyst directement dans Flash Builder. utilisez ce flux de travail si Flash Builder et Flash Catalyst sont tous les deux installés sur le même ordinateur. Pour plus d’informations, voir « Utilisation de Flash Builder avec Flash Catalyst » à la page 250.
Présentation des flux de travaux Flash Catalyst et Flash Builder
4 Cliquez sur Terminer.
Vous pouvez exécuter les étapes suivantes pour vérifier que votre projet demeure compatible avec Flash Catalyst.
• Sélectionnez Projet > Propriétés > Flash Catalyst. Activez Exécuter automatiquement le vérificateur de compatibilité Flash Catalyst pour ce projet.
3 Une fois que vous avez modifié le projet dans Flash Catalyst, enregistrez les modifications, puis quittez Flash
Lorsque vous sélectionnez cette option, vous êtes invité à enregistrer les modifications effectuées dans Flash Catalyst. Cela ramène le projet récemment enregistré dans Flash Builder. En arrière plan, la version du projet exportée initialement à partir de Flash Builder est supprimée lorsque la version récemment enregistrée du projet est importée avec succès à partir de Flash Catalyst. 5 A tout moment au cours de l’édition du projet dans Flash Catalyst, vous pouvez ignorer les modifications et
6 Sélectionnez le dossier dans lequel vous souhaitez créer l’application. Le dossier affiché par défaut est bin-debug.
7 Modifiez si nécessaire les chemins source et d’accès à la bibliothèque, puis cliquez sur Terminer pour créer le projet AIR.
Lorsque vous créez un projet Flex, vous pouvez en personnaliser la configuration. Toutes les étapes de configuration supplémentaires sont facultatives. Remarque : vous pouvez modifier la configuration d’un projet après sa création. Pour ce faire, accédez au mode Source de l’éditeur de Flash Builder, puis sélectionnez Projet > Propriétés. Chemin source : cliquez sur l’onglet Chemin source pour ajouter des dossiers source supplémentaires à un projet. Vous pouvez réorganiser les dossiers source, en modifier l’emplacement ou les supprimer du chemin source. Dossier source principal, Fichier de l’application principale et URL du dossier de sortie : par défaut, Flash Builder place
Lorsque vous créez un projet, Flash Builder exécute les fichiers d’application à partir d’une URL par défaut, en fonction des paramètres du projet. Spécifiez une URL de dossier de sortie pour remplacer les paramètres par défaut. L’URL de dossier de sortie est utile lorsque vous créez et déployez l’application sur le serveur de votre projet, mais que vous déboguez l’application sur un serveur Web. Vous spécifiez ensuite l’URL du serveur Web comme URL de dossier de sortie. Par exemple, si vous indiquez http://myserver/test.swf comme URL de dossier de sortie, une configuration de lancement est créée avec cette URL. Voir « Définition d’un dossier de sortie de projet » à la page 107 et « Exécution et débogage des applications » à la page 120.
bibliothèques de chemins d’accès à la génération.
En règle générale, tous les composants sont disponibles. Dans certains cas, vous pouvez ne spécifier que les composants MX. Voir « Jeu de composants (MX + Spark, Spark uniquement ou MX uniquement) » à la page 105.
Par défaut, les classes d’application pour Flex 4.5 ou version supérieure de la structure Flex utilisent la liaison dynamique. Les options suivantes sont également activées par défaut :
• Supprimer les RSL non utilisées Remarque : cette option n’est pas disponible dans les structures Flex antérieures à Flex 4.5.
• Déterminer automatiquement l’ordre de la bibliothèque, en fonction des dépendances Pour plus d’informations, voir « Liaison de la structure des applications » à la page 106.
Vous pouvez ajouter au chemin de génération des bibliothèques de projet, des dossiers de bibliothèque SWC ou des fichiers SWC ; vous pouvez également les en supprimer. Vous pouvez en outre modifier l’ordre du chemin de génération. Cliquez sur le bouton Editer pour modifier l’emplacement des bibliothèques ou des dossiers ajoutés. Utilisez le bouton Ajouter un SDK Flex pour rétablir le SDK par défaut d’un projet dont vous avez supprimé le SDK Flex du chemin de génération. Extensions natives : utilisez l’onglet Extensions natives afin d’inclure les fichiers ANE (ActionScript Native Extension)
Important : vous pouvez créer des extensions ActionScript pour les projets d’application mobiles et d’ordinateur qui prennent en charge AIR 3.0. Pour plus d’informations, voir Ajout d’extensions natives à un projet.
Flash Builder permet d’exporter et importer des projects aux formats FXP et ZIP et depuis des répertoires de fichier ouverts. Le format FXP est un format d’archive contenant les dossiers, les fichiers et les métadonnées d’un projet. Flash Builder exporte les projets Flex au format FXP et les projets de bibliothèque Flex au format FXPL. Les projets ActionScript peuvent être exportés uniquement vers des fichiers archive, généralement au format ZIP. L’importation et l’exportation de projets permet de transférer des projets de façon sûre et sécurisée entre différents ordinateurs et utilisateurs. Remarque : vous pouvez également faire appel à l’assistant d’exportation Eclipse pour exporter des projets Flex et des projets de bibliothèque Flex au format ZIP (utilisés dans Flex Builder 3) ou vers un autre format d’archive.
Sélectionnez cette option pour obtenir confirmation que le projet sera compilé sans erreurs. La présence d’erreurs ne vous empêchera pas de poursuivre l’exportation. 5 Cliquez sur Terminer.
1 Dans Flash Builder, sélectionnez Fichier > Exporter > Autre. 2 Dans l’assistant d’exportation, sélectionnez Général > Fichier archive et cliquez sur Suivant. 3 Sélectionnez le projet et les fichiers à exporter :
• Dans le volet de droite, indiquez pour chaque dossier sélectionné les fichiers à exporter. 4 Recherchez un emplacement dans lequel enregistrer le projet exporté et attribuez un nom au fichier. 5 Définissez les options pour le fichier archive, puis cliquez sur Terminer.
Flash Builder peut importer des projets Flex, des projets de bibliothèque Flex ainsi que des projets ActionScript précédemment exportés de Flash Builder. Vous pouvez importer plusieurs versions d’un même projet Flex ou d’un même projet de bibliothèque Flex.
Vous pouvez importer un projet à partir d’un fichier FXP exporté ou en accédant au dossier contenant le projet. 1 Dans le menu de Flash Builder, sélectionnez Fichier > Importer.
Si le fichier FXP contient plusieurs projets, vous pouvez sélectionnez individuellement les projets à importer. 4 (Projet de bibliothèque ou projet FXPL) Si vous importez un projet de bibliothèque ou un projet FXPL Catalyst,
5 (Fichier FXP) Si un projet du même nom existe dans l’espace de travail, spécifiez la méthode d’importation.
Dans le champ Extraire le nouveau projet vers, spécifiez l’emplacement dans lequel vous souhaitez extraire le fichier. Cet emplacement est généralement un répertoire de l’espace de travail de Flash Builder représentant un dossier du projet. Vous pouvez spécifier un nouveau dossier de projet ou remplacer un projet existant.
6 (Variables de chemin) Si vous importez un projet définissant des variables de chemin, mettez à jour les variables de
Les projets compilés pour ColdFusion, PHP, ADEP Data Services ou d’autres technologies de serveur font appel aux variables de chemin pour accéder au serveur Web et aux ressources du serveur. D’autres projets peuvent présenter des variables de chemin personnalisées. Sélectionnez chaque variable de chemin et attribuez-lui une valeur valide. 7 (Références aux polices) Si vous importez un fichier FXP exporté par Catalyst, le projet peut contenir des références
Voir « Résolution des références aux polices lors de l’importation de projets Catalyst » à la page 100. 8 Cliquez sur Terminer. 9 (Projets pour serveurs PHP) Si vous importez un projet pour serveur d’applications de type PHP, installez ou
La boîte de dialogue Zend vous guide au long du processus. Remarque : si vous annulez le processus dans la boîte de dialogue Zend, installez ou mettez à jour manuellement Zend Framework. L’accès aux services PHP est impossible tant que Zend Framework n’est pas installé et configuré correctement. Pour plus d’informations sur l’installation, la configuration et le dépannage de votre installation Zend Framework, voir Installation de Zend Framework. 10 (Projets pour serveurs) Déployez des services. a Placez manuellement des services sous la racine Web du serveur. Utilisez la structure de répertoire utilisée dans
Vous pouvez importer un projet Flex 3 dans Flash Builder 4.6 en utilisant le mode de compatibilité Flex 3. Dans ce cas, les espaces de noms et les composants Flex 3 demeureront inchangés. Vous pourrez cependant profiter du compilateur disponible avec Flex 4.6.
Utiliser le mode de compatibilité Flex 3. 5 Cliquez sur OK.
Utilisez l’assistant Eclipse pour importer un projet ActionScript. 1 Dans Flash Builder, sélectionnez Fichier > Importer > Autre > Général > Fichier archive. Importation de projets exportés avec l’assistant d’exportation Eclipse Un projet exporté à l’aide de l’assistant d’exportation Eclipse devra être importé avec l’assistant d’importation Eclipse. Sélectionnez Fichier > Importer > Général. Recherchez le format correspondant à votre projet. Pour plus d’informations, voir la documentation Eclipse sur l’importation de projets. Cette documentation est disponible dans l’aide des assistants d’importation et d’exportation Eclipse. Les services d’un projet créés avec les outils Flash Builder d’accès aux services de données devront être ajoutés manuellement. Copiez les fichiers de serveur dans le dossier services du serveur approprié. Dans la vue Données/Services, utilisez les propriétés du service pour un serveur afin de déterminer l’emplacement du service. Si vous avez exporté un projet PHP basé sur la structure Zend Framework, il vous faut installer cette dernière sur le serveur cible. Modifiez le fichier amf-config.ini qui configure la structure Zend Framework. Pour zend_path, spécifiez le chemin absolu du répertoire d’installation de Zend Framework. Pour plus d’informations sur l’installation, la configuration et le dépannage de l’installation de la structure Zend Framework, voir Installation de Zend Framework.
Flash Builder importe les projets dans ses espaces de travail. Un projet peut être importé dans plusieurs espaces de travail. Dans ce cas, les fichiers du projet se trouvent dans un seul emplacement sur le disque, mais sont référencés par chaque espace de travail. Les modifications apportées au projet se répercutent dans tous les espaces de travail.
Vous pouvez créer un projet dans lequel importer les fichiers source et les ressources situés sur votre système de fichiers mais n’appartenant à aucun projet. 1 Dans le menu Flash Builder, sélectionnez Fichier > Nouveau > Projet.
2 Dans l’assistant Nouveau projet Flex, spécifiez la source et le dossier de sortie.
Si vous importez plusieurs versions d’un projet, vous pouvez comparer, copier ou fusionner les contenus des versions. Vous pouvez uniquement comparer des versions différentes d’un même projet. 1 Dans l’Explorateur de packages, sélectionnez l’un des projets que vous souhaitez comparer. 2 Ouvrez le menu contextuel et sélectionnez Comparer le projet avec la version.
3 Sélectionnez la version avec laquelle vous souhaitez effectuer la comparaison. L’éditeur de comparaison Eclipse
4 Dans l’éditeur de comparaison, accédez au fichier que vous souhaitez comparer et sélectionnez Afficher la
L’éditeur de comparaison affiche les deux versions du fichier et en met en évidence les différences. Vous pouvez utiliser les options de l’éditeur de comparaison pour copier ou fusionner les différences dans le fichier. Pour plus d’informations, voir la documentation Eclipse sur l’éditeur de comparaison.
Flash Builder prend en charge le développement des applications conçues dans Adobe® Flash® Catalyst™. Flash Catalyst exporte un projet au format FXP et exporte des composants au format FXPL. Les fichiers FXP et FXPL peuvent être ensuite importés dans Flash Builder à des fins de développement. Pour les fichiers FXP, il en résulte un projet Web Flex exécuté dans Adobe Flash Player. Un fichier FXPL contient un fichier de bibliothèque. Vous pouvez importer un fichier FXPL sous la forme d’un projet de bibliothèque Flex ou importer le contenu dans un projet Flex existant.
Importer un projet Flash Catalyst.
Exporter un projet Flash Catalyst. Au moment de l’exportation d’un projet Flex, vous pouvez valider a compatibilité du projet Flex avec Flash Catalyst. Vous pouvez créer un projet Adobe AIR à partir d’un projet Flash Catalyst. Importez le fichier FXP du projet Catalyst dans Flash Builder. Convertissez le type d’application du projet d’application Web (exécutée dans Flash Player) en application d’ordinateur (exécutée dans Adobe AIR). Voir « Modification d’un projet d’application Web en projet d’application d’ordinateur » à la page 129. Pour plus d’informations sur les flux de travail entre Flash Builder et Flash Catalyst, voir « Utilisation de Flash Builder avec Flash Catalyst » à la page 250.
Lors de l’importation d’un projet FXP créé avec Adobe Catalyst, ce projet peut contenir des références à des polices qui ne sont pas disponibles sur votre système. L’assistant d’importation permet de corriger les références aux polices à l’aide de CSS. Si vous sélectionnez l’option correspondante, Flash Builder importe la feuille de style Catalyst Main.css. Main.css contient les références aux polices utilisées dans le projet. Si vous obtenez des erreurs de compilation provenant des polices référencées dans la feuille de style, corrigez les références de la feuille de style avec les polices disponibles sur votre système. Les projets FXPL Catalyst ne contiennent pas de feuilles de style. Flash Builder tente de corriger les références aux polices lors de l’importation d’un fichier FXPL. S’il ne trouve pas de police correspondante sur le système cible, les références aux polices d’origine sont conservées. Pour les projets FXPL, les références aux polices que Flash Builder ne parvient pas à résoudre sont détectées à l’exécution. Les références aux polices non résolues entraînent une substitution de police ou une erreur d’exécution. Remarque : pour les fichiers FXPL, Flash Builder modifie l’attribut fontFamily dans les fichiers MXML lorsqu’il tente de résoudre les références aux polices.
Certains projets Flex devront faire l’objet d’un traitement spécial lors de l’importation et de l’exportation. Par exemple :
• le projet fait référence à des fichiers de service pour l’accès aux données côté serveur ; • la configuration Zend Framework pour l’accès aux services PHP doit être mise à jour ; • le projet utilise des liens ADEP Data Services vers un fichier de modèle de données. Lors de l’exportation ou de l’importation d’un projet Flex, certains contenus du projet nécessiteront un traitement spécial.
Vous pouvez importer un projet Flex faisant référence à une version du SDK Flex qui n’a pas été installée avec Flash Builder. Pour plus d’informations sur le téléchargement et l’installation de versions supplémentaires du SDK Flex, voir « SDK Flex installés » à la page 269. Si Flash Builder ne peut pas trouver de version spécifique du SDK, recherchez l’emplacement du SDK.
Les projets de serveur Flex qui se connectent aux services de données, tels que ColdFusion ou BlazeDS, contiennent un dossier services dont la référence de classe ActionScript a déployé les fichiers de serveur. Lors de l’exportation du projet, Flash Builder exporte le dossier de services, mais vous devez vous assurer qu’un serveur et les fichiers côté serveur correspondants existent lors de l’importation. Au moment de l’importation, vous devrez peut-être déployer les fichiers côté serveur et mettre à jour les adresses du serveur dans les classes dans les fichiers côté serveur à l’aide d’ADEP Data Services ou BlazeDS ; assurez-vous que les destinations de service sont disponibles sur le serveur cible.
Les projets Flex qui se connectent à des services de données en utilisant PHP et la structure Zend Framework contiennent deux fichiers de configuration. A l’importation, examinez ces fichiers afin de vérifier qu’ils ont été correctement configurés pour votre système : amf-config.ini
Adobe® Flash® Builder™ génère et exporte automatiquement les projets vers des applications. Cette opération comporte la création de fichiers d’application et de bibliothèque, le placement des fichiers de sortie dans les emplacements appropriés et la signalisation de toute erreur survenue en cours de compilation. Différentes options permettent d’ajuster les paramètres de génération. Vous pouvez ainsi déterminer la manière dont les projets sont intégrés aux applications. Par exemple, vous pouvez définir des préférences de génération sur des projets individuels ou sur tous les projets de l’espace de travail. Vous pouvez également modifier le chemin de résultat de la création, modifier l’ordre de la génération, etc. Vous pouvez en outre créer des instructions de génération personnalisées à l’aide d’outils tiers tels qu’Apache Ant. Lorsque les applications sont prêtes à être publiées, vous pouvez en publier l’ensemble du code source ou uniquement certaines parties. A l’instar du code source HTML, le code source de l’application peut être visualisé dans un navigateur Web.
Un flux de travail se compose de la génération de projets Flex et ActionScript, l’option Générer automatiquement étant activée. Au cours du développement, Flash Builder affiche les erreurs et les avertissements dans la vue Erreurs. A l’exécution de l’application, une version de débogage du fichier SWF est placée dans le dossier de sortie (bin) du projet avec les ressources requises et une enveloppe HTML. Cette génération contient des informations de débogage et n’est destinée qu’à l’usage des développeurs. Pour plus d’informations sur l’exportation de projets, voir « Exportation et importation de projets » à la page 95. Une fois l’application prête à être déployée, l’assistant Exporter vers une version validée vous permet de créer une version optimisée de qualité finale de l’application. Cette opération enregistre le fichier SWF dans le dossier binrelease. Les informations de débogage étant supprimées, la taille du fichier diminue. Cette version est destinée à être consultée par l’utilisateur final. Pour les projets Adobe AIR, les applications AIR sont exportées dans un fichier AIR. La fonction Exporter vers une version validée permet de créer un fichier AIR signé numériquement que les utilisateurs doivent installer avant d’exécuter une application (à l’instar d’un fichier install.exe). Aucune exportation n’est requise pour les projets de bibliothèque. Le fichier SWC créé par un projet de bibliothèque Flex se prête à la fois au développement et à la production. Pour plus d’informations, voir « Utilisation de projets de bibliothèque Flex » à la page 228.
MXML et ActionScript 3.0 sont des langages compilés. Les langages compilés sont différents des langages interprétés, tels que JavaScript, qui peuvent être exécutés par leur propre environnement d’exécution. En d’autres termes, MXML et ActionScript 3.0 doivent être convertis dans un format compilé afin d’être exécutés par Flash Player. Ce processus, ainsi que la création des fichiers de sortie correspondants, est désigné par le terme de génération. Flash Builder génère automatiquement un projet à chaque modification ou enregistrement de l’un de ses fichiers. Vous avez par ailleurs la possibilité de générer manuellement vos applications. Comprendre le processus de génération et les fichiers de sortie qui sont générés vous aide à diagnostiquer et résoudre les erreurs de configuration du projet, lorsqu’elles se présentent. Projets Flex : les fichiers source et les éléments incorporés (tels que les images) sont compilés dans un seul fichier SWF de sortie. Le fichier SWF peut s’exécuter directement dans le lecteur autonome Flash Player ou dans un navigateur Web via un fichier d’enveloppe HTML qui est également issu de la génération. Ces fichiers sont générés dans le dossier de sortie du projet. Le dossier de sortie s’appelle bin par défaut, mais vous pouvez le renommer. Projets ActionScript 3.0 : à l’instar des projets Flex, les projets ActionScript 3.0 compilent les fichiers source et les
Projets de bibliothèque Flex : pour les projets de bibliothèque, les fichiers source sont des composants et des
Dans une configuration autonome de Flash Builder, l’option Générer automatiquement est sélectionnée par défaut et vos applications sont générées automatiquement. En configuration plug-in, sélectionnez l’option Générer automatiquement. Le fait de désélectionner l’option Générer automatiquement empêche le compilateur d’identifier les erreurs de syntaxe. La vue Erreurs n’affiche alors pas de messages d’avertissement et d’erreur lorsque vous saisissez du code. La vue Erreurs affiche des messages d’avertissement et d’erreur uniquement lorsque vous compilez le projet. Il est par conséquent recommandé de définir Flash Builder sur la génération automatique.
Les options avancées permettent de définir la durée et l’étendue des générations. Vous pouvez par exemple générer un seul projet ou un ensemble de projets dans l’espace de travail ou encore définir un jeu de documents (une collection) de projets à générer. Toutes les commandes de génération se situent dans le menu Projet, ainsi que l’illustre l’exemple suivant.
En présence de dépendances entre des projets distincts de l’espace de travail, le compilateur détermine automatiquement l’ordre dans lequel les projets ont été générés afin de résoudre correctement les dépendances. Vous pouvez toutefois remplacer l’ordre de génération par défaut en définissant manuellement l’ordre dans lequel les projets de l’espace de travail sont générés. Vous pouvez en outre modifier le chemin de génération, la liste des applications et les paramètres du compilateur pour chaque projet de l’espace de travail.
« Création manuelle de projets » à la page 109 « Gestion des fichiers d’application du projet » à la page 38 « Options de génération avancées » à la page 109
Les erreurs détectées par le compilateur au cours de la génération s’affichent dans la vue Erreurs des perspectives Développement et Débogage, ainsi que dans l’éditeur de code, dans lequel les lignes contenant des erreurs sont signalées par un x, comme l’illustre l’exemple suivant.
« Vue Erreurs » à la page 10
Des erreurs générées par l’environnement Eclipse sont susceptibles de se produire. Elles surviennent généralement lorsque des ressources (des fichiers SWC, par exemple) ne sont pas trouvées à l’exécution. Dans ce cas, les messages d’erreur apparaissent dans le fichier journal des erreurs Eclipse. L’emplacement par défaut de ce fichier journal sous Windows est le suivant : \Documents and Settings\nom_utilisateur\workspace\.metadata\.log. Sous Mac, l’emplacement par défaut se trouve également dans le répertoire de l’espace de travail. Les fichiers et dossiers commençant par un point y sont toutefois masqués par défaut.
Vous pouvez modifier et étendre le processus de génération standard en faisant appel à Apache Ant, outil de génération Java à code source libre. Pour plus d’informations sur la création de générateurs personnalisés, voir « Personnalisation des générations avec Apache Ant » à la page 111.
Vous pouvez définir comme paramètre par défaut un SDK Flex spécifique ou vous pouvez définir que la compilation soit effectuée en utilisant la compatibilité avec Flex 3. La spécification de la compatibilité ascendante affecte certains comportements, tels que les règles de présentation, les marges intérieures et les espaces, les habillages ainsi que d’autres paramètres de style. Elle a également une incidence sur les règles d’analyse des fichiers de propriétés. La définition de la version de compatibilité n’applique pas toutes les différences existant entre les versions.
La version par défaut de Flash Player utilisée par le compilateur est la version minimale requise par le SDK Flex utilisé pour la compilation. Vous pouvez définir une version spécifique de Flash Player pour l’application. Les fonctionnalités nécessitant une version ultérieure de Flash Player ne seront pas compilées dans l’application.
Flash Builder fournit des cases à cocher pour les options suivantes du compilateur :
Certains contrôles MX fournissent une prise en charge de FTE. Les contrôles MX prenant en charge FTE utilisent les mêmes polices intégrées que les composants Spark utilisant FTE. Voir Using FTE in MX controls.
• Générer un fichier SWF accessible Cette option active les fonctionnalités d’accessibilité lors de la compilation de l’application ou du fichier SWC. Pour plus d’informations sur l’utilisation des fonctionnalités d’accessibilité avec Flex, voir Accessible applications.
Lorsque la vérification stricte est activée, le compilateur imprime des appels de propriété et de fonction non définis. Il effectue également une vérification de type au moment de la compilation pour les affectations et les options fournies aux appels de méthode.
Cette option active des avertissements spécifiques. Pour plus d’informations, voir Viewing warnings and errors. Vous pouvez aussi spécifier des arguments de compilateur à plusieurs lignes qui sont disponibles avec la ligne de commande sur le compilateur mxmlc. Vous pouvez définir les valeurs de la plupart des options du champ Arguments de compilateur supplémentaires en utilisant la syntaxe de la ligne de commande. Pour plus d’informations sur la syntaxe pour la définition des options dans la boîte de dialogue Compilateur Flex, voir About the command-line compilers.
• Vérifier la version du lecteur cible Lorsque cette option est activée, l’application compilée vérifie que la version de Flash Player est correcte. Si l’option d’utilisation de l’installation rapide est activée, l’application exécute un fichier SWF dans le lecteur Flash Player existant pour mettre à niveau les utilisateurs vers la dernière version du lecteur.
Cette option active la liaison profonde. La liaison profonde permet aux utilisateurs de parcourir leurs interactions avec l’application en utilisant les boutons Précédent et Suivant de leur navigateur.
Vous pouvez accéder directement par ligne de commande aux compilateurs de structure Flex (mxmlc et compc). Pour plus d’informations, voir About the command-line compilers dans Using Adobe Flex 4.6.
Flash Builder vous permet de générer des applications automatiquement en utilisant les paramètres de projet par défaut. L’utilisation des paramètres de projet par défaut est l’approche recommandée pour générer vos applications. Vous pouvez toutefois personnaliser la génération de projets en fonction de vos besoins. Vous pouvez ainsi par exemple sélectionner un autre dossier de sortie par défaut ou modifier les options du compilateur.
Par défaut, les projets Flex mettent à la disposition des applications l’ensemble des composants, c’est-à-dire les composants Spark fournis avec Flex 4 et les composants MX livrés avec Flex 3. Dans certains cas, vous pouvez utiliser uniquement les composants MX rendus disponibles avec Flex 3, ou uniquement les composants Spark livrés avec Flex 4. Vous pouvez par exemple disposez d’un projet Flex 3 dans lequel vous ne voulez pas introduire les nouveaux composants Spark mais pour lequel vous souhaitez toutefois bénéficier des avantages des fonctionnalités introduites avec Flex 4 et Flash Builder 4 (nouvelle syntaxe d’états, fonctions de compilation améliorées et autres fonctionnalités de langage). Dans ce cas, activez l’option MX uniquement pour le jeu de composants. L’activation de cette option supprime du chemin de génération toutes les bibliothèques associées à Spark. Lors de la conversion d’un projet Flex 4 en projet MX uniquement, Flash Builder n’apporte aucune modification au code du projet. Vous devrez mettre à jour le code manuellement afin d’en supprimer toute référence aux composants et aux bibliothèques Spark. De même, si vous sélectionnez le jeu de composants Spark uniquement, seuls les composants Spark sont utilisés et les bibliothèques de type MX sont supprimées du chemin de génération.
Par défaut, les classes d’application pour Flex 4 ou version supérieure de la structure Flex utilisent la liaison dynamique. Au lieu de compiler toutes les classes dans le fichier SWF de l’application (liaison statique), certaines classes sont chargées à partir de la bibliothèque partagée à l’exécution (Runtime Shared Library, RSL). Les applications créées avec une liaison dynamique sont dotées de fichiers SWF plus petits, ce qui permet de les télécharger plus rapidement. En revanche, ces applications utilisent plus de mémoire, toutes les classes de la structure étant chargées, y compris celles dont vous n’avez pas besoin. Pour plus d’informations, voir Bibliothèque partagée à l’exécution. Vous pouvez modifier les propriétés d’un projet afin de personnaliser ce comportement pour toutes les applications d’un projet. Après avoir sélectionné un projet, dans le menu de Flash Builder, choisissez Projet > Propriétés > Chemin de génération Flex > Chemin d’accès à la bibliothèque. Par défaut, Flash Builder utilise le comportement par défaut du SDK Flex pour la liaison de la structure. Pour Flex 4 et versions supérieures, le comportement par défaut est la liaison dynamique des RSL. pour Flex 3, de la liaison statique. Utilisez la liste déroulante Liaison de structure pour remplacer le comportement par défaut. Pour le SDK Flex 4.5 et versions supérieures de la structure Flex, les options suivantes sont activées par défaut :
Vérifie que le condensé de la bibliothèque RSL correspond à celui stocké dans l’application au moment de la compilation lorsque l’application a été liée à la bibliothèque RSL interdomaines. Pour plus d’informations, voir About RSL digests.
Supprime les RSL qui ne sont pas utilisées au moment de la compilation. Seules les RSL utilisées sont copiées dans le dossier de sortie. Cette option est uniquement disponible pour le SDK Flex 4.5 et versions supérieures de la structure Flex, et non pour les structures Flex antérieures. Vous pouvez toutefois charger de force un fichier RSL inutilisé au moment de la compilation en cliquant deux fois sur le chemin d’accès à la bibliothèque du projet. Sélectionnez ensuite Charger de force le fichier RSL dans la boîte de dialogue Options de l’élément de chemin d’accès à la bibliothèque. Vous pouvez spécifier le domaine d’application dans lequel les bibliothèques RSL interdomaines doivent être chargées. Vous pouvez sélectionner Par défaut, Actif, Parent ou Supérieur comme domaine d’application. Par exemple, si un module utilise une bibliothèque RSL spécifique, vous pouvez sélectionner Actif comme domaine d’application. Ensuite, la bibliothèque RSL spécifiée est accessible seulement à ce module et pas à l’application qui charge le module. Le déchargement du module décharge automatiquement également la bibliothèque RSL associée. Remarque : les RSL interdomaines et les domaines d’application sont uniquement pris en charge dans le SDK Flex 4.5 et versions supérieures de la structure Flex, et non dans les structures Flex antérieures. Si vous importez un projet qui a été créé avec une structure Flex faisant appel à des fichiers RSL standard, Flash Builder convertit automatiquement ces fichiers RSL standard en fichiers RSL interdomaines. Pour plus d’informations, voir Compilation avec des bibliothèques RSL standard ou interdomaines dans Flash Builder.
Utilise les bibliothèques RSL locales lors du débogage de l’application. L’utilisation des bibliothèques RSL locales vous permet d’intervenir dans les fichiers RSL de débogage. Cette option est ignorée lors de l’exportation d’une version validée.
Activation et désactivation des générations automatiques En configuration autonome, Flash Builder génère vos projets automatiquement. Dans la configuration du plug-in, sélectionnez vous-même cette option. Flash Builder est conçu pour générer les projets automatiquement. La désactivation de cette option empêche le compilateur de détecter les erreurs de syntaxe et d’afficher les avertissements et les messages d’erreur au fur et à mesure de la saisie du code. Pour plus d’informations sur la génération manuelle de projets, voir « Création manuelle de projets » à la page 109. Effectuez l’une des opérations suivantes :
• Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Espace de travail. Sélectionnez ou désélectionnez l’option Générer automatiquement. Cette option a une incidence sur tous les projets de l’espace de travail.
Lorsque vous créez un projet dans Flash Builder, le résultat de la création est généré par défaut dans le dossier de sortie. Vous pouvez modifier le nom de ce dossier à la création du projet ou une fois le projet créé. Vous avez en outre la possibilité de créer un dossier ou de sélectionner un dossier existant de l’espace de travail. 1 Dans l’Explorateur de packages Flex, sélectionnez un projet. 2 Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl enfoncée (Macintosh), puis
La boîte de dialogue des propriétés du projet s’affiche. 3 Sélectionnez la page Chemin de génération Flex. 4 Modifiez le dossier de sortie spécifié en saisissant un nouveau nom ou en recherchant et sélectionnant le dossier
Remarque : le dossier de sortie d’une application ADEP Data Services ES ne peut pas être modifié de cette manière. Son emplacement est en effet contrôlé par le serveur et il est accessible uniquement par le biais du fichier Flexconfig.xml du projet. 5 Cliquez sur OK.
Important : la modification du nom du dossier de sortie entraîne la suppression du dossier de sortie d’origine ainsi que de l’ensemble de son contenu. Régénérez le projet afin de recréer le fichier d’application SWF et les fichiers d’enveloppe HTML.
Chaque projet possède son propre chemin de génération composé du chemin source et du chemin de bibliothèque (les chemins de génération de projet de bibliothèque sont légèrement plus complexes. Pour plus d’informations, voir « Projets de bibliothèque Flex » à la page 35.) Le chemin source correspond à l’emplacement des fichiers source MXML et ActionScript du projet. Le chemin de bibliothèque correspond à l’emplacement des classes de la structure Flex de base ainsi que des composants Flex personnalisés que vous avez créés (sous la forme de fichiers SWC).
2 Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl enfoncée (Macintosh), puis
3 Sélectionnez la page Chemin de génération Flex (dans le cadre d’un projet ActionScript, sélectionnez la page
4 Cliquez sur le bouton Ajouter un dossier pour ajouter un dossier au chemin source. 5 Saisissez le nom du dossier ou cliquez sur le bouton Parcourir pour rechercher l’emplacement des classes
Vous pouvez également utiliser des variables de chemin afin d’éviter de saisir le chemin complet du système de fichiers. Vous pouvez saisir le nom d’une variable existante ou en créer une. Pour plus d’informations, voir « Création d’une variable de chemin » à la page 108. 6 Apportez les modifications nécessaires au chemin source, puis cliquez sur OK.
1 Répétez les étapes 1 à 3 de la procédure précédente afin d’accéder à la page des propriétés Chemin de génération Flex. 2 Cliquez sur l’onglet Chemin d’accès à la bibliothèque.
SWC. Un fichier SWC est un fichier archive pour les composants Flex et les autres ressources. Pour plus d’informations, voir « Utilisation des fichiers SWC dans le cadre des projets » à la page 231. Vous pouvez modifier le chemin vers la structure ou, si vous avez créé des composants Flex personnalisés, ajouter de nouveaux dossiers ou fichiers SWC au chemin de la bibliothèque. Vous avez également la possibilité de supprimer des éléments du chemin. 3 Apportez les modifications nécessaires au chemin de la bibliothèque, puis cliquez sur OK.
Vous pouvez établir des liens vers des ressources en définissant des variables de chemin. Vous évitez ainsi de devoir saisir le chemin complet d’un dossier local ou d’un dossier réseau dans lequel vous enregistrez les fichiers. Définissez par exemple une variable de chemin nommée Classes, puis spécifiez le chemin vers un dossier du système de fichiers. La variable Classes peut ensuite être sélectionnée comme étant l’emplacement du nouveau dossier auquel la relation a été établie. Si le dossier est déplacé, il vous suffit de mettre à jour l’emplacement dans la variable de chemin définie pour que tous les projets reliés à la variable Classes puissent continuer à accéder aux ressources. Définition ou création d’une variable de chemin 1 Sélectionnez un projet dans l’Explorateur de packages. 2 Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl enfoncée (Macintosh), puis
3 Sélectionnez la page Chemin de génération Flex (dans le cadre d’un projet ActionScript, sélectionnez la page
4 Vous pouvez créer une variable pour chaque élément du chemin (dont les dossiers du chemin source et les dossiers
Flash Builder offre des options avancées pour la personnalisation des générations de projet. Vous pouvez par exemple générer des projets manuellement, modifier l’ordre par défaut de génération des projets dans l’espace de travail et créer des générateurs personnalisés avec l’utilitaire Apache Ant.
La génération manuelle de projets vous permet de contrôler la durée et l’étendue de la génération. Vous pouvez par exemple générer un seul projet ou un ensemble de projets dans l’espace de travail. Vous pouvez également définir un jeu de documents de projets ou de ressources de projet et ne générer que ces projets et ces ressources. Un jeu de documents est une collection de ressources d’espace de travail (projets, fichiers et dossiers) pouvant être sélectionnées et groupées en fonction de l’utilisation qui en est faite. Pour plus d’informations sur les jeux de documents, voir « Création de jeux de documents » à la page 40. Génération d’un projet unique 1 Dans l’Explorateur de packages, sélectionnez le projet que vous souhaitez générer. 2 Sélectionnez Projet > Générer le projet dans le menu principal.
Remarque : le programme vous invite à enregistrer les fichiers de projet qui ne l’ont pas encore été avant le début de la génération. Pour éviter l’affichage de cette invite, activez l’enregistrement automatique des fichiers avant le début de la génération dans les préférences de l’espace de travail. Génération de tous les projets dans l’espace de travail ❖ Sélectionnez Projet > Générer tout dans le menu principal. Tous les projets de l’espace de travail sont générés. Les fichiers d’application sont ajoutés aux dossiers de sortie des projets respectifs. Dans la mesure où vous n’avez pas défini l’enregistrement automatique des fichiers avant le début de la génération, le programme vous invite à les enregistrer. Génération d’un jeu de documents Utilisez l’une des méthodes suivantes :
Cliquez sur Nouveau pour créer un jeu de documents. Pour plus d’informations sur la création d’un jeu de documents, voir « Création de jeux de documents » à la page 40.
Tous les projets du jeu de documents sont générés. Les fichiers d’application sont ajoutés au dossier de sortie du projet.
Lorsque vous générez des projets manuellement, le programme vous invite à enregistrer toutes les ressources avant de débuter la génération. Pour éviter l’affichage de cette invite, activez l’enregistrement automatique des ressources du projet dans les préférences de l’espace de travail. 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Espace de travail. 2 Sélectionnez l’option Sauvegarder automatiquement avant la génération. 3 (Facultatif) Vous pouvez modifier la fréquence d’enregistrement des ressources en saisissant une valeur (en
Une fois un projet créé, les générations ultérieures n’impliqueront que les ressources ajoutées ou modifiées. Une génération nettoyée permet de forcer le compilateur Flash Builder à régénérer toutes les ressources d’un projet. Vous pouvez y recourir par exemple pour éliminer toutes les sources potentielles d’un problème survenu au cours du test de l’application. 1 Sélectionnez Projet > Nettoyer dans le menu principal. 2 Choisissez le ou les projets dont vous souhaitez éliminer les fichiers de génération pour les régénérer. 3 Cliquez sur OK.
Flash Builder permet de créer des relations entre les projets ouverts dans l’espace de travail. Vous pouvez par exemple importer les classes ActionScript d’un projet à l’autre. La création de relations entre les projets a une incidence sur l’ordre dans lequel les projets sont générés. Par défaut, le compilateur génère des projets reliés dans l’ordre garantissant la génération correcte de tous les projets. Prenons l’exemple de deux projets, dont le premier fait référence à des classes contenues dans le second : le second projet est généré en premier. Dans la plupart des cas, le compilateur génère les projets dans l’ordre requis et les applications sont créées correctement sans qu’aucune intervention ne soit nécessaire. Vous avez cependant la possibilité de modifier l’ordre de génération. Cette modification peut s’avérer nécessaire par exemple si vous avez créé un générateur personnalisé Ant et que vous l’avez associé à un projet de l’espace de travail que vous devez générer avant les autres projets. Pour plus d’informations sur la création de générateurs personnalisés, voir « Personnalisation des générations avec Apache Ant » à la page 111. 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Espace de travail > Ordre de génération.
Utiliser l’ordre de génération par défaut : l’ordre de génération par défaut dépend des dépendances entre les
Ordre de génération du projet : vous pouvez définir manuellement l’ordre dans lequel tous les projets de l’espace
Itérations maximales lors de la génération avec des cycles : en présence de références cycliques dans un projet (ce
2 Modifiez si nécessaire l’ordre de génération, puis cliquez sur OK.
La création d’un générateur personnalisé vous permet de modifier et d’étendre le processus de génération standard. Flash Builder comporte un script de génération standard intervenant dans la compilation des applications. Vous pouvez, le cas échéant, créer des scripts de génération personnalisés grâce à Apache Ant, outil de génération Java à code source libre. Vous pouvez appliquer les générateurs personnalisés à tous les types de projet Flash Builder. Création d’un générateur 1 Dans l’Explorateur de packages, sélectionnez un projet. Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl enfoncée (Macintosh) pour afficher le menu contextuel et sélectionnez Propriétés. 2 Sélectionnez la page de propriétés Générateurs. La liste sera plus ou moins longue en fonction du nombre de plug-
3 Sélectionnez Nouveau. 4 Dans la boîte de dialogue Sélection d’un type de configuration, choisissez le type de configuration approprié. Flash
5 Cliquez sur OK pour appliquer les valeurs définies au projet.
Flash Builder permet de modifier la version du SDK utilisé pour la compilation des projets. Vous pouvez sélectionner le SDK à la création ou en cours de développement du projet. Le SDK se compose d’une structure et du compilateur. Le SDK Flex 4 signifie que vous utilisez la version 4 des fichiers SWC de la structure Flex et la version 4 du compilateur Flex. Vous ne pouvez pas utiliser le compilateur Flex 4 avec les fichiers SWC de la structure Flex 3, par exemple. La possibilité de modifier le SDK est utile en présence d’un projet développé avec Flex Builder 3 (qui utilise le SDK Flex 3) alors que vous exécutez la version 4 de Flash Builder (qui utilise par défaut le SDK Flex 4). En sélectionnant un SDK antérieur pour la génération, vous pouvez préserver la compatibilité avec la dernière version du SDK des projets qui n’ont pas été mis à jour. En outre, si vous travaillez actuellement sur un projet destiné au SDK Flex 3, mais souhaitez utiliser les fonctionnalités de Flash Builder 4, vous pouvez mettre à niveau votre version de Flash Builder, mais sélectionnez dans ce cas le SDK antérieur comme SDK par défaut. La modification du SDK après le développement d’un projet entraîne une régénération complète, et non une génération incrémentielle. Flash Builder signale alors toute différence qui aurait généré des erreurs de compilateur, tout comme si le projet avait été développé avec le SDK d’origine. Flash Builder régénère également tous les fichiers de prise en charge des projets, dont les fichiers de gestion de l’historique et de liaisons profondes utilisés par l’enveloppe HTML. Pour les projets SDK Flex 4, Flash Builder crée les fichiers compatibles de gestion des historiques history.swf, history.html et history.js dans le répertoire des modèles HTML. Pour les projets SDK Flex 3, Flash Builder crée les fichiers compatibles de liaisons profondes history.htm et history.js et historyFrame.html dans le répertoire html-templates/history. Les options présentes dans Flash Builder varient en outre en fonction du SDK sélectionné. Si vous ajoutez par exemple un module à un projet utilisant le SDK Flex 3, Flash Builder ne vous propose pas d’optimiser le module. Cette opération devra être effectuée manuellement. Pour plus d’informations sur les différences entre les SDK Flex 4 et Flex 3, voir Compatibilité ascendante.
Lorsque vous créez un projet de bibliothèque Flex ou un projet ActionScript, vous pouvez sélectionner le SDK à utiliser dans les boîtes de dialogue Nouveau projet de bibliothèque Flex et Nouveau projet ActionScript. Ajout d’un nouveau SDK Flex à la liste des SDK disponibles 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Flash Builder > SDK Flex installés. Elle répertorie les SDK installés. Le nom du SDK par défaut est coché. 2 Cliquez sur Ajouter. 3 Saisissez l’emplacement du SDK dans le champ Emplacement du SDK Flex. 4 Attribuez-lui un nom dans le champ Nom du SDK Flex. Ne saisissez pas le nom d’un SDK existant. 5 Cliquez sur OK pour enregistrer vos modifications. 6 Cliquez de nouveau sur OK pour ajouter le nouveau SDK à la liste des SDK disponibles. Cette liste est gérée dans
Modification de la version de SDK du projet en cours 1 Sélectionnez Projet > Propriétés. 2 Choisissez Compilateur Flex. 3 Cliquez sur Utiliser un SDK spécifique. 4 Sélectionnez un SDK dans la liste déroulante. Si elle ne contient pas le SDK recherché, cliquez sur le lien Configurer
Sélection d’un nouveau SDK par défaut 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Flash Builder > SDK Flex installés. Le nom du SDK par défaut est coché. 2 Cochez la case correspondant à un autre SDK pour le définir comme SDK par défaut. Ce SDK sera appliqué à tout
3 Cliquez sur OK pour enregistrer vos modifications. 4 Cliquez à nouveau sur le bouton OK.
Les références de projet pouvant avoir une incidence sur l’ordre de génération, Flash Builder propose une alternative à leur utilisation. Projets de bibliothèque Flex : méthode privilégiée de création d’une bibliothèque réutilisable. Flash Builder crée une
Chemin source : méthode recommandée pour inclure du code dans le projet ne se trouvant pas sous la même structure de dossier. Elle active les conseils de code dans les fichiers du projet et dans les classes situées dans des fichiers liés. Le compilateur sait où trouver le code source. Vous pouvez ajouter au projet un nombre quelconque de chemins source. Ils s’affichent en tant que dossiers liés dans l’Explorateur de packages.
Flash Builder fournit la tâche Ant <fb.exportReleaseBuild>. Utilisez-la pour implémenter des générations par ligne de commande qui synchronisent les paramètres de génération d’un développeur avec une génération nocturne. Vous pouvez également utiliser la tâche <mxmlc> dans les scripts personnalisés pour la génération nocturne. Remarque : la prise en charge de la génération par ligne de commande n’est disponible que sur Flash Builder Premium.
La tâche <fb.exportReleaseBuild> garantit que les paramètres de génération nocturne correspondent exactement à ceux utilisés par les développeurs pendant leur travail de la journée. Par exemple, si un développeur modifie le chemin de la bibliothèque d’un projet Flex, le nouveau chemin est écrit dans le projet Flash Builder. A son exécution par l’ordinateur de génération nocturne, la tâche <fb.exportReleaseBuild> charge le projet Flash Builder et tous ses paramètres. La tâche <fb.exportReleaseBuild> présente un autre avantage : elle prend automatiquement en charge les tâches de maintenance supplémentaires qui font normalement partie d’une génération Flash Builder. Par exemple :
• La copie de ressources, telles que les fichiers JPEG, dans le répertoire de sortie • La copie du modèle HTML, y compris le remplacement des macros en fonction des résultats de compilation (comme la largeur et la hauteur) Remarque : la tâche <fb.exportReleaseBuild> nécessite l’installation de Flash Builder sur l’ordinateur de génération nocturne.
Si vous écrivez un script personnalisé qui fait appel à la tâche <mxmlc> (un script Ant, par exemple), vous n’avez pas besoin d’installer Flash Builder sur l’ordinateur de génération. Le SDK Flex doit toutefois s’y trouver. L’ordinateur de génération peut par conséquent se trouver sur une plateforme Linux. Toutefois, l’inconvénient de cette approche réside dans le fait que vous avez deux jeux de paramètres de génération à synchroniser. En d’autres termes, vous avez un jeu dans Flash Builder, utilisé par les développeurs dans leur travail quotidien, et un autre jeu sur votre ordinateur de génération nocturne.
1 Installez Flash Builder sur un ordinateur de génération. 2 Ecrivez build.xml avec fb.exportReleaseBuild comme cible. Par exemple :
sa cible. Les exemples suivants indiquent build.xml comme fichier de génération, qui exécute MyTarget. Si le script de la génération nocturne se trouve sur une plateforme Macintosh, vous pouvez exécuter le script suivant : WORKSPACE="$HOME/Documents/Adobe Flash Builder" # works with either FlashBuilder.app or Eclipse.app "/Applications/Adobe Flash Builder/FlashBuilder.app/Contents/MacOS/FlashBuilder" \ Paramètres de la tâche fb.exportReleaseBuild Attribut
Application par défaut du projet.
Spécifie le dossier de sortie dans lequel exporter le Non package validé. Le dossier peut être un chemin relatif ou absolu. Si vous spécifiez un chemin relatif, il est relatif par rapport à la racine du projet.
«» (indique la racine du projet) pour tous les autres types de projets
« air », « airi » ou « platform ». Si vous spécifiez « air », un seul fichier AIR commun à toutes les plateformes est généré. Si vous spécifiez « airi », un fichier airi est généré pour chaque plateforme. Si vous spécifiez « platform », un fichier spécifique est généré pour chaque plateforme. Par exemple, un fichier APK est généré pour la plateforme Android et un fichier IPA est généré pour la plateforme iOS. Dans le cas de projets de bureau AIR, vous pouvez spécifier les types de package « air », « airi » ou « native ». Chaque option génère un seul fichier.
Vous pouvez spécifier la plateforme en tant que « android », « ios » ou « qnx ». Utilisez une liste séparée par des virgules pour spécifier plusieurs plateformes.
Oui l’espace de travail Flash Builder, sans chemin d’accès. Par exemple : « MonProjetFlex ».
.actionScriptProperties du projet, la valeur par défaut « false » est utilisée. verbose
« android.certificate » et pour la plateforme iOS, spécifiez « ios.certificate ».
Chemin du certificat utilisé pour signer le fichier APK.
Vous spécifiez cet attribut lorsque vous définissez l’attribut correspondant à la plateforme « packagetype » sur « platform » et que l’une des plateformes cibles Android dans le fichier est Android. .actionScriptProperties.
Oui, si vous n’avez pas défini le fichier de configuration dans le fichier .actionScriptProperties.
Lorsque vous exécutez l’assistant Exporter vers une version validée (Projet > Exporter vers une version validée), les paramètres que vous définissez dans l’assistant sont enregistrés dans le fichier .actionScriptProperties. Une génération par ligne de commande qui utilise la tâche fb.exportReleaseBuild récupère les paramètres de l’assistant. L’assistant Exporter vers une version validée enregistre les paramètres suivants :
Les fichiers source que vous spécifiez pour l’option Afficher la source sont enregistrés. Si vous définissez le paramètre publishsource sur fb.exportReleaseBuild, l’assistant inclut ces fichiers comme fichiers source pouvant être affichés. Important : pour les projets pour serveurs, vous pouvez sélectionner le dossier des services à l’exportation des fichiers source. L’exportation de fichiers implémentant des services a des implications en termes de sécurité. Ces fichiers peuvent donner accès à votre base de données, noms d’utilisateurs et mots de passe inclus. Voir Exportation des fichiers source vers la version validée d’une application.
La tâche <fb.exportReleaseBuild> est uniquement prise en charge sur des plateformes Windows et Mac. Si vous rédigez toutefois un script de génération pour une autre plateforme, utilisez l’option -dump-config dans le compilateur mxmlc ou compc pour écrire les paramètres de configuration du compilateur dans un fichier. L’option load-config vous permettra ensuite de lire les options de configuration. Modifiez les paramètres de configuration du fichier en fonction de vos besoins. Par exemple, changez <debug>true</debug> en <debug>false</debug> pour que la génération nocturne génère une version validée. Exécution d’une génération par ligne de commande à l’aide des paramètres du compilateur Flash Builder 1 Dans Flash Builder, sélectionnez Projet > Propriétés > Compilateur Flex. 2 Dans le champ Arguments de compilateur supplémentaires, indiquez l’argument suivant :
3 Appliquez les modifications dans la fenêtre du projet.
4 Modifiez les paramètres de configuration comme il convient. 5 Dans le script de génération, exécutez le compilateur afin qu’il intègre les paramètres enregistrés du compilateur :
Certaines restrictions s’appliquent à l’exécution des générations par ligne de commande à l’aide de la tâche <fb.exportReleaseBuild>. Exécution des générations par ligne de commande sur des plateformes 64 bits Flash Builder s’exécute sur des plateformes qui implémentent Java 32 bits. Pour exécuter une génération par ligne de commande sur des plateformes prenant en charge Java 64 bits (Mac OS X Snow Leopard, par exemple), ajoutez -d32 aux options de ligne de commande qui sont transmises à Java. Par exemple : java -d32 ...
Une fois qu’une application est prête à être publiée, Flash Builder vous permet de définir si les utilisateurs peuvent visionner le code source ainsi que les ressources de l’application. A l’instar du langage HTML, les utilisateurs peuvent accéder à la source et la visionner dans un navigateur Web en sélectionnant Afficher la source dans le menu contextuel. Le visualiseur de source met en forme et colore le code afin d’en faciliter la lecture. Il constitue également un moyen pratique de partager le code avec d’autres développeurs Flex et ActionScript 3.0. Activation de l’option d’affichage de la source 1 Ouvrez l’ensemble du projet d’application dans l’éditeur, puis sélectionnez Projet > Exporter vers une version validée. 2 Sélectionnez Activer l’affichage de la source ou, pour les projets ActionScript, Inclure la source. 3 Cliquez sur Choisir des fichiers source. 4 Dans la boîte de dialogue Publier la source de l’application, sélectionnez le ou les fichiers de l’application à inclure
5 (Facultatif) Modifiez le dossier de sortie de la source. Par défaut, un dossier d’affichage de la source est ajouté au
Sélectionnez un élément source pour en afficher le code dans le navigateur. Les utilisateurs peuvent également télécharger tous les fichiers source en cliquant sur le lien vers le fichier Download.zip. Remarque : les restrictions de sécurité d’Internet Explorer risquent d’entraver l’affichage du code source sur votre ordinateur local. Dans ce cas, déployez l’application sur un serveur Web pour afficher la source.
Dans les projets Flex, l’ajout de l’option Afficher la source à l’application s’effectue par l’intermédiaire de l’assistant Exporter vers une version validée. Dans les applications ActionScript, ajoutez cette option manuellement. La fonction suivante, contenue dans la structure Flex, peut être utilisée dans un constructeur d’application ActionScript pour activer le menu d’affichage de la source : com.adobe.viewsource.ViewSource.addMenuItem(obj:InteractiveObject, url:String, hideBuiltins:Boolean = true)
{ public function MyASApp() Pour plus d’informations, voir « Création de configurations de lancement personnalisées » à la page 123. L’exécution des projets dans Flash Builder peut être effectuée de différentes manières. Vous pouvez par exemple utiliser la commande d’exécution à partir de la barre d’outils et du menu principal du workbench, de la vue Explorateur de packages et des menus contextuels de l’éditeur de code. Remarque : le bouton Exécuter comporte deux éléments : le bouton d’action principal et la liste déroulante affichant les fichiers d’application du projet pouvant être exécutés ou débogués. Cliquez sur le bouton d’action principal pour exécuter le fichier d’application par défaut. Vous pouvez également activer la liste déroulante et sélectionner l’un des fichiers d’application du projet ainsi que créer ou modifier une configuration de lancement dans la boîte de dialogue Création, gestion et exécution d’une configuration.
Les configurations de lancement permettent d’exécuter et de déboguer des applications. Flash Builder comporte une configuration de lancement par défaut pour les applications Flex et ActionScript. Une configuration de lancement définit le nom du projet, le fichier de l’application principale et le chemin des versions d’exécution et de débogage de l’application. Flash Builder contient une configuration de lancement d’application par défaut. Cette configuration est utilisée pour créer automatiquement des configurations de lancement pour chacun de vos projets.
Un projet créé et généré est prêt à être exécuté ou débogué. L’exécution et le débogage des applications du projet sont contrôlés par une configuration de lancement. Par défaut, Flash Builder crée une configuration de lancement pour chaque fichier d’application du projet exécuté ou débogué pour la première fois. Les configurations se basent sur la configuration d’application par défaut et peuvent être modifiées.
1 Dans l’Explorateur de packages Flex, sélectionnez un projet. 2 Ouvrez un fichier de projet dans l’éditeur de code, puis sélectionnez Exécuter > Exécuter les configurations. 3 Sélectionnez la configuration de lancement que vous souhaitez modifier. 4 Adaptez les paramètres de la configuration, puis cliquez sur Exécuter ou Déboguer.
« Modification du navigateur Web par défaut » à la page 125 « Exécution du fichier SWF de l’application dans la version autonome de Flash Player » à la page 125
Pour les applications d’ordinateur, vous pouvez créer des configurations de lancement qui remplaceront les configurations par défaut fournies par Flash Builder. Lors de la création ou de la modification d’une configuration de lancement pour une application d’ordinateur, vous devez spécifier des arguments de ligne de commande, un ID d’éditeur, un profil et des paramètres de format d’écran. Pour les applications d’ordinateur, la valeur de Profil peut être soit desktop, soit extendedDesktop.
2 Sélectionnez le projet de bureau. Cliquez sur le bouton de création d’une configuration de lancement.
3 Sélectionnez Exécuter, Déboguer ou Profiler pour exécuter l’application avec les paramètres définis.
Avant d’exécuter ou de déboguer une application mobile pour la première fois, ouvrez la fenêtre Configurations de lancement pour définir une configuration de lancement. Vous pouvez créer une ou plusieurs configurations de lancement pour une application. Le jeu de configurations de lancement que vous définissez est partagé entre l’exécution et le débogage de l’application. 1 Sélectionnez Exécuter > Exécuter les configurations pour ouvrir la boîte de dialogue d’exécution des
Pour ouvrir la boîte de dialogue Configurations de débogage, sélectionner Exécuter > Configurations de débogage. Voir Exécution et débogage d’une application mobile sur un périphérique.. Vous pouvez également accéder au menu Exécuter ou Déboguer les configurations dans la liste déroulante du bouton Exécuter ou Déboguer de la barre d’outils Flash Builder. 2 Développez le nœud des applications mobiles. Cliquez sur le bouton Crée une configuration de lancement dans la
3 Sélectionnez une plateforme cible dans la liste déroulante. 4 Spécifiez une méthode de lancement :
Voir Prévisualisation des applications avec ADL. Cliquez sur Configurer pour modifier les configurations du périphérique. Voir Définition des configurations des périphériques.
Flash Builder installe l’application sur votre périphérique et lance l’application. Flash Builder accède au périphérique connecté au port USB de l’ordinateur. Pour plus d’informations, voir Exécution et débogage d’une application mobile sur un périphérique. Les plateformes Windows nécessitent un pilote USB pour connecter un périphérique Android à l’ordinateur. Pour plus d’informations, voir Installation de pilotes de périphériques USB pour les périphériques Android (Windows).
• Plusieurs périphériques connectés trouvés La boîte de dialogue Choisir un périphérique répertorie les périphériques et leur état (en ligne ou déconnecté). Sélectionnez le périphérique à lancer. Débogage des applications mobiles Vous pouvez déboguer une application mobile à partir de votre ordinateur de développement ou d’un périphérique. Avant de déboguer une application mobile, créez une configuration de lancement. Voir « Gestion des configurations de lancement » à la page 120. Le débogage d’un périphérique Android nécessite l’installation d’Android 2.2 ou d’une version ultérieure. Lorsque vous exécutez une application sur un périphérique à partir de Flash Builder, Flash Builder installe une version déboguée de l’application sur le périphérique. Pour plus d’informations, voir Débogage d’une application mobile sur un périphérique Google Android. Le débogage d’une application sur un périphérique Apple iOS nécessite de grouper l’application sous forme de fichier IPA (iOS Package) de débogage et d’installer manuellement l’application sur le périphérique connecté. Pour plus d’informations, voir Débogage d’une application sur un périphérique Apple iOS. Remarque : si vous exportez une version validée vers un périphérique, vous installez une version non déboguée de l’application. Toutefois, la version non déboguée ne convient pas pour le débogage.
Les configurations de lancement diffèrent selon que vous exécutez une application Web, d’ordinateur ou mobile. Vous pouvez personnaliser les configurations de lancement que Flash Builder crée automatiquement pour vous. 1 Dans le menu Flash Builder, sélectionnez Exécuter > Exécuter les configurations. 2 Dans la boîte de dialogue Création, gestion et exécution des configurations, sélectionnez le type d’application à
3 Spécifiez un nom, un projet et un fichier d’application pour la configuration de lancement. 4 Modifiez les propriétés de configuration requises pour le type d’application que vous configurez. 5 Cliquez sur Appliquer pour enregistrer les paramètres ou sur Exécuter pour lancer l’application.
Lorsque vous exécutez l’application, Flash Builder lance automatiquement le navigateur. Vous pouvez, toutefois, décider de lancer manuellement le navigateur à la place de Flash Builder. Pour ce faire : 1 Dans la liste des configurations, sélectionnez la configuration de lancement du projet. 2 Dans l’onglet Principal, désélectionnez l’option Utiliser la valeur par défaut. 3 Modifiez l’URL ou le chemin par défaut pour effectuer le lancement sur about:blank.
Si une configuration de lancement doit être créée, Flash Builder ouvre la boîte de dialogue Configurations de lancement.
« Création ou modification des configurations de lancement pour les applications Web » à la page 120 « Création ou modification des configurations de lancement pour les applications d’ordinateur » à la page 121 « Création ou modification des configurations de lancement pour les applications mobiles » à la page 122
La version déboguée de l’application contient des informations de débogage qui servent au débogage de l’application. La version validée résultant de l’exportation ne contient aucune information de débogage. La taille de son fichier est donc inférieure à celle du fichier de la version déboguée. Un fichier d’enveloppe HTML contient un lien vers le fichier SWF de l’application. Il intervient dans l’exécution ou le débogage de l’application dans un navigateur Web. Remarque : les commandes Exécuter et Déboguer lancent la version de développement dans le dossier bin-debug (et non dans le dossier de version validée, bin-release). Dans une application standard, le dossier de sortie ressemble à l’exemple suivant.
« Débogage de l’application » à la page 137
Par défaut, Flash Builder exécute la version de débogage de Flash Player. Cette version est disponible sous forme de plug-in ou de contrôle ActiveX pour navigateur ou en tant que version autonome. Elle est installée avec Flash Builder mais peut également être téléchargée à partir du site Web d’Adobe. Les programmes d’installation de la version de débogage de Flash Player se trouvent dans le répertoire Installation d’Adobe Flash Builder/player de votre ordinateur. Vous pouvez déterminer par programmation la version de Flash Player exécutée en utilisant la méthode Capabilities.isDebugger(). Pour plus d’informations, voir Determining Flash Player version in Flex. Lorsque vous lancez ou déboguez une application à partir de Flash Builder, vous pouvez spécifier la version de Flash Player à utiliser.
« Gestion de la version du lecteur Flash Player autonome » à la page 262
Par défaut, les chemins d’exécution et de débogage de la configuration de lancement des applications Web dirigent vers les fichiers d’enveloppe HTML situés dans le dossier de sortie du projet. Les applications sont donc exécutées et déboguées dans la version Flash Player intégrée dans le navigateur Web utilisé. Vous avez également la possibilité d’exécuter et de déboguer les applications dans la version autonome de Flash Player (voir « Exécution du fichier SWF de l’application dans la version autonome de Flash Player » à la page 125). Vous pouvez en outre remplacer le navigateur Web standard par tout autre navigateur installé sur votre ordinateur (voir « Modification du navigateur Web par défaut » à la page 125).
L’exécution et le débogage des applications sont effectués dans le navigateur Web défini par défaut. Vous ne pouvez pas définir un navigateur Web différent pour chaque configuration de lancement. Vous pouvez toutefois modifier le navigateur Web défini pour le workbench, ce qui aura une incidence sur l’exécution et le débogage de toutes les applications. 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Navigateur Web. 2 Sélectionnez un navigateur dans la liste de ceux installés sur le système.
Vous pouvez également ajouter des navigateurs à la liste, en supprimer ou éditer ceux qui y sont répertoriés. 3 Cliquez sur OK pour appliquer les modifications.
Player Les applications peuvent être exécutées ou déboguées dans la version autonome de Flash Player. Il vous suffit pour ce faire de modifier légèrement la configuration de lancement. Vous pouvez spécifier la version de Flash Player à utiliser lorsque vous exécutez et déboguez vos applications. Pour plus d’informations, voir « Gestion de la version du lecteur Flash Player autonome » à la page 262.
1 Dans la boîte de dialogue Création, gestion et exécution des configurations, sélectionnez la configuration de lancement que vous souhaitez modifier. 2 Dans l’onglet Principal, désélectionnez l’option Utiliser la valeur par défaut. 3 Cliquez sur le bouton Parcourir du champ Exécuter et/ou du champ Déboguer.
4 Sélectionnez le fichier d’application SWF du répertoire bin-debug. Ne sélectionnez pas le fichier SWF de l’éventuel
5 Cliquez sur Ouvrir pour sélectionner le fichier et retourner à la boîte de dialogue de configuration. 6 Validez les modifications apportées et exécutez ou déboguez l’application en utilisant la configuration modifiée.
Par défaut, Flash Builder génère des versions déboguées du fichier SWF de l’application Flex et les enregistre dans le répertoire bin-debug du projet. Le volume de cette application est supérieur à celui d’une version non déboguée car il contient du code et des métadonnées supplémentaires utilisées par le débogueur. Pour générer une version non déboguée de l’application, effectuez l’une des opérations suivantes :
Après avoir terminé la création de votre application, si vous souhaitez la publier, vous pouvez exporter une version validée de votre application. L’assistant Exporter une version validée de Flash Builder crée une version validée optimisée (fichier SWF ou AIR sans débogage) de votre application. En fonction du type d’application, l’assistant vous guide à travers les étapes de personnalisation et d’optimisation de la création de package. Une fois l’assistant exécuté, vous devrez procéder à des opérations supplémentaires pour déployer l’application sur un serveur.
1 Sélectionnez Projet > Exporter vers une version validée pour ouvrir l’assistant correspondant. 2 Sélectionnez le projet et l’application que vous souhaitez exporter. 3 (Facultatif) Sélectionnez Activer l’affichage de la source pour permettre l’accès aux fichiers source à partir de
Cliquez sur Choisir des fichiers source pour spécifier les fichiers source à inclure. Outre les fichiers source spécifiés, l’assistant génère un fichier archive ZIP contenant les fichiers source.
5 Copiez le dossier contenant la version exportée vers la racine Web du serveur hébergeant l’application. 6 (Projets pour serveurs) Si vous exportez la version d’un projet spécifiant un type de serveur d’applications, déployez
Conservez la structure de répertoire utilisé lors du développement. Cette étape s’applique aux services ColdFusion, PHP, BlazeDS et Data Services. Le type de serveurs d’applications est défini à la création du projet dans Flash Builder. Si le serveur d’applications se trouve sur un hôte différent que l’application déployée, un fichier de régulation interdomaines est nécessaire pour accéder à ces services. Cette manière de procéder s’applique aux projets accédant à des fichiers de service XML statiques ou à des fichiers locaux pour des services HTTP ou Web. Voir Utilisation de fichiers de régulation interdomaines. 7 (Projets pour serveurs PHP uniquement) Exécutez les étapes supplémentaires suivantes : a Installez la structure Zend Framework sur le serveur. Voir Installation de Zend Framework. b Modifiez le fichier amf-config.ini qui se trouve dans le dossier de sortie de la version exportée.
Définissez amf.production sur true. Saisissez pour webroot le chemin absolu vers la racine Web du serveur.
1 (Facultatif) Modifiez les paramètres du serveur dans les propriétés du projet.
Si vous souhaitez modifier le serveur pour l’application d’ordinateur exportée, modifiez les paramètres du projet. 2 Sélectionnez Projet > Exporter vers une version validée pour ouvrir l’assistant correspondant. 3 Sélectionnez le projet et l’application que vous souhaitez exporter.
à partir de l’application exportée. 4 Indiquez l’emplacement vers lequel exporter le projet. L’emplacement par défaut est le dossier de votre projet. 5 Pour exporter votre application AIR, vous devez ajouter une signature numérique à votre création en sélectionnant
• Signed Native Installer pour créer un programme d’installation à signature numérique pour la plateforme cible, à savoir Windows ou Mac OS X.
Cliquez sur Suivant.
7 Dans la page Contenu du package, sélectionnez les fichiers de sortie à inclure dans le fichier AIR ou AIRI. 8 Cliquez sur Terminer. 9 Copiez le projet .air vers l’ordinateur cible. 10 (Projets pour serveurs) Si vous exportez la version d’un projet spécifiant un type de serveurs d’applications,
Cette étape s’applique aux services ColdFusion, PHP, BlazeDS et LCDS. Le type de serveurs d’applications est défini à la création du projet dans Flash Builder. 11 (Projets pour serveurs PHP uniquement) Exécutez les étapes supplémentaires suivantes : a Installez la structure Zend Framework sur le serveur. Voir Installation de Zend Framework. b Modifiez le fichier amf-config.ini qui se trouve dans le dossier de sortie de la version exportée.
Définissez amf.production sur true. Saisissez pour webroot le chemin absolu vers la racine Web du serveur.
Vous pouvez créer un fichier AIR intermédiaire et le signer ultérieurement. Utilisez cette option uniquement lorsque vous procédez à des tests. 1 Sélectionnez Projet > Exporter vers une version validée. Cliquez sur Suivant. 2 Sélectionnez l’option Exporter un fichier AIRI intermédiaire qui sera signé ultérieurement. 3 (Facultatif) Cliquez sur Suivant. Sélectionnez les fichiers de sortie qui devront être inclus dans le fichier AIRI
Par défaut, tous les fichiers sont inclus. 4 Cliquez sur Terminer.
Pour plus d’informations à propos de l’utilisation de l’outil AIR Developer Tool (ADT), voir la documentation Adobe AIR à l’adresse www.adobe.com/go/learn_fbairdevelopertool_fr.
Les procédures d’exécution de l’application à l’issue du déploiement final diffèrent selon si le package est exporté vers Windows ou Mac.
• Les paramètres des enveloppes HTML sont supprimés. • Les paramètres personnalisés de Flash Player sont supprimés. • Le chemin d’accès à la bibliothèque est modifié pour inclure le fichier airglobal.swc au lieu du fichier playerglobal.swc. Au cours de la conversion, vous pouvez définir pour chaque application du projet si vous souhaitez modifier les balises Application de base en balises WindowedApplication. Si vous décidez de convertir ces balises, cette modification sera la seule à intervenir dans le code d’application au cours de la conversion. Après la conversion, examinez les attributs des balises de base pour vérifier que l’application est exécutée correctement dans Adobe AIR.
1 Sélectionnez le projet que vous souhaitez convertir.
2 Dans le menu contextuel du projet, sélectionnez Ajouter/Modifier le type de projet > Convertir en projet
3 Dans la boîte de dialogue Convertir en projet Bureau/Adobe AIR, spécifiez si vous souhaitez apporter des
Les balises Application de toutes les applications existantes du projet sont converties en balises WindowedApplication. Aucune autre modification ne sera apportée au code. Examinez les attributs des balises de base pour vérifier que l’application est exécutée correctement dans Adobe AIR. Les nouvelles applications créées dans le projet sont des applications d’ordinateur pouvant être exécutées dans Adobe AIR.
Aucune modification n’est apportée au code. Modifiez les applications dans le projet avant de pouvoir les exécuter dans Adobe AIR. Les nouvelles applications créées dans le projet sont des applications d’ordinateur pouvant être exécutées dans Adobe AIR. Remarque : cette procédure ne peut pas être annulée.
2 Sélectionnez le projet et l’application que vous souhaitez exporter. 3 Sélectionnez les plateformes cibles. 4 Indiquez l’emplacement vers lequel exporter le projet. Vous pouvez exporter le projet vers un ordinateur cible ou
5 Par défaut, le nom du fichier de base est le nom du projet. Vous pouvez modifier le nom du fichier, le cas échéant. 6 Pour grouper votre application avec une signature numérique pour chaque plateforme cible, sélectionnez Packages
Pour grouper votre application en tant qu’application AIR à signature numérique pour l’ordinateur, sélectionnez Package AIR signé pour l’installation sur l’ordinateur. Pour exporter un fichier dont la signature peut être effectuée ultérieurement, exportez un fichier intermédiaire AIRI. Pour générer un certificat auto-signé, cliquez sur Créer et saisissez les données dans les champs obligatoires. Cliquez sur Suivant. Pour plus d’informations sur la signature numérique, voir la documentation de Adobe Flash Builder « Signature numérique des applications AIR » à la page 132. 7 Dans la page Paramètres de packages, vous pouvez spécifier le certificat numérique et le contenu du package. Selon
Dans la page Signature numérique, spécifiez le certificat numérique P12 qui représente l’identité de l’éditeur de l’application. Vous pouvez aussi spécifier un mot de passe pour le certificat sélectionné. Pour la plateforme Apple iOS, convertissez le certificat Apple iPhone au format de fichier P12 et sélectionnez un fichier de configuration. Pour ce faire, vous devez d’abord obtenir un certificat de développement iPhone et un profil de configuration mobile auprès d’Apple. Pour plus d’informations, voir Préparation à la génération, au débogage et au déploiement d’une application iOS. Vous pouvez ensuite choisir de déployer le package de la version finale dans le magasin Apple App ou en tant que package ad-hoc pour une distribution limitée. Dans la page Contenu du package, sélectionnez les fichiers de sortie que vous souhaitez inclure dans la version finale de votre application. Remarque : vous ne pouvez pas exclure le fichier SWF et le fichier descripteur de l’application, car ils sont requis pour exporter un package valide. Les fichiers suivants ne sont pas nécessaires et sont par conséquent automatiquement désélectionnés ou masqués :
• Fichiers de certificat (.p12, .pfx, .provisioning) • Sélection d’un fichier AIR générique ou d’un programme d’installation natif pour l’installation de l’application • Signature numérique de l’application AIR par un certificat commercial de signature de code ou par la création et l’application d’une signature autosignée
4 Vous pouvez également sélectionner Activer l’affichage de la source pour permettre aux utilisateurs de visionner le
Important : pour les projets pour serveurs, vous pouvez sélectionner le dossier des services à l’exportation des fichiers source. L’exportation de fichiers implémentant des services a des implications en termes de sécurité. Ces fichiers peuvent donner accès à votre base de données, noms d’utilisateurs et mots de passe inclus. Voir Exportation des fichiers source vers la version validée d’une application. 5 Sélectionnez l’option Exporter vers un fichier AIR ou l’option Exporter vers le programme d’installation natif.
L’option Exporter vers un fichier AIR crée un fichier de programme d’installation générique permettant l’installation de l’application sur les plateformes Windows ou Mac OS X. L’option Exporter vers le programme d’installation natif crée un programme d’installation pour la plateforme cible (Windows ou Mac OS X). 6 Vous avez également la possibilité de renommer le fichier AIR généré. Dès que vous êtes prêt à poursuivre, cliquez
Vous pouvez gérer le certificat numérique du package et son contenu en sélectionnant un projet et en visualisant ses propriétés. 1 Dans l’Explorateur de packages, sélectionnez un projet. 2 Sélectionnez Projet > Propriétés dans le menu principal ou sélectionnez Propriétés dans le menu contextuel. 3 Dans la boîte de dialogue Propriétés du projet, sélectionnez Paquet de génération Flex. 4 A la page Signature numérique, procédez comme suit :
5 Sur la page Contenu du groupement :
Vous pouvez gérer le certificat numérique du package et son contenu en sélectionnant un projet et en visualisant ses propriétés. 1 Dans l’Explorateur de packages, sélectionnez un projet. 2 Sélectionnez Projet > Propriétés dans le menu principal ou sélectionnez Propriétés dans le menu contextuel. 3 Dans la boîte de dialogue Propriétés du projet, sélectionnez Paquet de génération Flex, puis sélectionnez la
4 Dans la page Signatures numériques :
Pour la plateforme Apple iOS, sélectionnez un fichier de configuration. Pour plus d’informations, voir Processus de développement Apple iOS à l’aide de Flash Builder. Pour la plateforme Google Android, vous pouvez sélectionner un certificat numérique ou générer un certificat auto-signé. Pour générer un certificat auto-signé, cliquez sur Créer et saisissez les données dans les champs obligatoires. 5 Dans la page Contenu du groupement :
6 Dans la page Autorisations :
Les possibilités suivantes s’offrent à vous :
Les certificats numériques émis par les autorités de certification, telles que VeriSign, Thawte, GlobalSign et ChosenSecurity garantissent aux utilisateurs votre identité en tant qu’éditeur. Les certificats numériques vérifient en outre que le fichier d’installation n’a pas été modifié depuis que vous l’avez signé. Les certificats numériques autosignés sont utilisés dans le même but, mais se distinguent par le fait qu’ils ne présentent aucune validation par un tiers. Vous pouvez également assembler l’application AIR sans signature numérique en créant un fichier AIR intermédiaire (.air). La validité de ce type de fichier est limitée. Il ne peut en effet pas être installé. Il est utilisé dans les procédures de test (effectuées par les développeurs) et peut être lancé avec l’outil de ligne de commande AIR ADT. AIR destine cette fonctionnalité aux environnements de développement au sein desquels la signature est prise en charge par un développeur ou une équipe spécifique. Cette manière de procéder augmente le degré de sécurité de gestion des certificats numériques. Pour plus d’informations sur la signature d’applications, voir Signature d’applications AIR dans la documentation d’Adobe AIR. Signature numérique d’une application AIR Vous pouvez apposer une signature numérique sur une application AIR en sélectionnant le certificat numérique existant ou en créant un nouveau certificat autosigné. 1 Sélectionnez Projet > Exporter vers une version validée.
Cliquez sur Suivant. 2 Sélectionnez l’option Exporter et signer un fichier AIR avec un certificat numérique. 3 Si vous disposez déjà d’un certificat numérique, cliquez sur Parcourir pour y accéder, puis sélectionnez-le. 4 Pour créer un certificat numérique autosigné, cliquez sur Créer. 5 Spécifiez les informations requises et cliquez sur OK. 6 (Facultatif) Cliquez sur Suivant. Sélectionnez les fichiers de sortie qui devront être inclus dans le fichier AIRI
Par défaut, tous les fichiers sont inclus. 7 Cliquez sur Terminer pour créer le fichier AIR.
• d’avancer d’un pas avec et sans entrée dans le code ; • de contrôler des variables ; • d’évaluer des expressions.
La vue Débogage (dans d’autres débogueurs, cette option porte le nom pile des appels) affiche l’élément de pile du thread suspendu de l’application que vous déboguez.
La vue Débogage affiche la liste des fonctions appelées jusqu’à ce point, dans l’ordre de leur appel. Par exemple, la première fonction appelée apparaît en bas de la liste. Vous pouvez cliquer deux fois sur une fonction pour la déplacer dans le script ; Flash Builder met à jour les informations de la vue Variables conformément au nouvel emplacement de la fonction dans le script.
La vue Points d’arrêt répertorie tous les points d’arrêt définis dans le projet. Cliquez deux fois sur un point d’arrêt pour afficher son emplacement dans l’éditeur. Vous pouvez également désactiver, ignorer et supprimer des points d’arrêt.
Tous les membres de super-classes sont groupés dans un nœud d’arborescence distinct. Par défaut, seuls les membres de la classe actuelle sont affichés. Ce regroupement permet de limiter le nombre de variables affichées dans la vue.
La vue Expressions permet de surveiller un ensemble de variables critiques. Vous pouvez choisir les variables que vous jugez critiques dans la vue Variables et les ajouter à la vue Expressions afin de les surveiller. Vous pouvez également ajouter et évaluer des expressions de contrôle. Il s’agit d’expressions de code évaluées à chaque interruption du débogage.
Une fois les projets générés en applications (voir « Création de projets » à la page 101), vous pouvez les déboguer dans Flash Builder. Le débogage est similaire à l’exécution des applications. Toutefois, lorsque vous déboguez, vous déterminez le moment où l’application s’arrête à des points spécifiques du code. Vous pouvez également définir si vous souhaitez contrôler les variables importantes et vous pouvez tester des corrections sur votre code. L’exécution et le débogage font appel à une configuration pour contrôler la manière dont les applications sont lancées. Le débogage d’une application consiste à exécuter la version déboguée du fichier d’application. Voir « Version déboguée de l’application » à la page 124. Vous pouvez modifier le fichier de l’application principale par défaut spécifié dans la configuration de lancement de même que le chemin de lancement par défaut, afin que l’application soit exécutée ou déboguée dans la version autonome de Flash Player plutôt que dans un navigateur Web. Voir « Exécution du fichier SWF de l’application dans la version autonome de Flash Player » à la page 125. Lors du débogage d’applications mobiles, utilisez la configuration de lancement pour spécifier s’il faut lancer l’application sur l’ordinateur ou sur un périphérique connecté à votre ordinateur.
Lancement d’une session de débogage Pour lancer une session de débogage, exécutez la configuration de lancement de l’application dans la perspective Débogage Flash. Débogage d’une application 1 Dans l’Explorateur de packages, sélectionnez le projet que vous souhaitez déboguer. 2 Cliquez sur le bouton
Vous pouvez également sélectionner Exécuter > Déboguer. Si le projet n’a pas encore été généré, Adobe® Flash® Builder™ le génère et l’exécute en mode de débogage. 3 L’application est affichée dans le navigateur Web par défaut ou dans la version autonome de Flash Player. Vous
4 La perspective Débogage Flash est activée dans le workbench à chaque point d’arrêt rencontré.
L’action de la commande Déboguer de la version plug-in de Flash Builder est légèrement différente. Elle n’exécute pas le projet sélectionné, mais débogue la dernière configuration à avoir été lancée. Vous pouvez également sélectionner une configuration parmi la liste de celles à avoir été lancées en dernier. Débogage d’une application AIR Flash Builder prend entièrement en charge le débogage des applications AIR. 1 Dans Flash Builder, ouvrez un fichier source pour l’application (un fichier MXML, par exemple). 2 Cliquez sur le bouton
Vous pouvez également déboguer une application à partir de la ligne de commande en utilisant l’outil de ligne de commande de l’application de débogage du lanceur AIR. Pour plus d’informations, voir Utilisation de l’application de débogage du lanceur AIR (ADL) dans la documentation AIR.
Ils sont placés au niveau des lignes de code exécutables. Le débogueur ne s’arrête qu’aux points d’arrêt situés sur les lignes présentant les éléments suivants :
• Toute ligne de code exécutable dans un fichier ActionScript Vous pouvez définir des points d’arrêt en cours de rédaction du code ou pendant le débogage. Positionnement d’un point d’arrêt dans l’éditeur de code 1 Ouvrez un fichier de projet contenant du code ActionScript. 2 Localisez la ligne de code sur laquelle vous souhaitez placer un point d’arrêt et cliquez deux fois sur la barre de
La barre de repère longe le côté gauche de l’éditeur de code. Un point d’arrêt est ajouté à la barre de repère ainsi qu’à la liste de la vue Points d’arrêt de la perspective Débogage Flash. A chaque fois que le débogueur rencontre un point d’arrêt, l’application est interrompue et la perspective Débogage Flash est affichée. La ligne de code est signalée par un point d’arrêt et mise en surbrillance dans l’éditeur de code. Vous pouvez ensuite utiliser les commandes de débogage de la barre d’outils de la vue Points d’arrêt pour interagir avec le code. Voir « Vue Points d’arrêt » à la page 135. Suppression d’un point d’arrêt dans l’éditeur de code ❖ Dans la barre de repère, cliquez deux fois sur un point d’arrêt. Le point d’arrêt est supprimé de la barre de repère ainsi que de la vue Points d’arrêt de la perspective Débogage Flash. Suppression de points d’arrêt de la vue Points d’arrêt Vous pouvez supprimer un seul, plusieurs ou tous les points d’arrêt de la vue en utilisant les commandes de la barre d’outils.
• Pour supprimer tous les points d’arrêt en une seule action, cliquez sur Supprimer tous les points d’arrêt. Vous pouvez également désactiver les points d’arrêt et les réactiver ultérieurement.
2 Dans la boîte de dialogue qui s’ouvre, spécifiez les paramètres suivants :
Activez ou désactivez le point d’arrêt.
Sélectionnez l’option Activer la condition et saisissez une expression ActionScript à évaluer. Pour plus d’informations sur les types d’expressions dont l’évaluation est prise en charge, voir « Exemples d’expressions » à la page 141. Remarque : Flash Builder vérifie la syntaxe de l’expression et vous en signale les erreurs. La présence d’un opérateur d’affectation dans l’expression déclenche l’affichage d’un avertissement.
Spécifiez à quel moment l’exécution doit être interrompue : lorsque la condition a la valeur « true » ou lorsque la valeur de la condition change.
Modification de la valeur d’une variable 1 Sélectionnez la variable que vous souhaitez modifier. 2 Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl enfoncée (Mac OS) pour
3 Saisissez la nouvelle valeur et cliquez sur OK.
Les variables modifiées sont affichées en rouge.
à saisir le nom de la variable recherchée. Vous pouvez utiliser le caractère générique (*) pour rechercher les mots figurant dans le nom d’une variable (« *couleur », par exemple).
En cours de débogage, vous pouvez analyser et modifier la valeur des variables contrôlées. Vous pouvez également ajouter des expressions de contrôle. Il s’agit d’expressions de code évaluées à chaque interruption du débogage. Les expressions de contrôle sont utiles pour contrôler les variables susceptibles de dépasser l’étendue et de ne pas être visibles dans la vue lorsque vous avancez d’un pas avec entrée dans une fonction différente. Vous pouvez aussi placer le pointeur sur une expression ou une variable dans l’éditeur source afin d’afficher la valeur de cette expression ou de cette variable dans une infobulle. Vous pouvez ajouter l’expression à la vue correspondante en cliquant avec le bouton droit de la souris, puis en sélectionnant la commande de contrôle dans le menu contextuel.
Le débogueur de Flash Builder prend en charge une large gamme d’expressions simples et complexes. Le tableau suivant répertorie des exemples d’expressions pouvant être évaluées en cours de session de débogage. Cette liste d’expressions prises en charge n’est pas exhaustive et est fournie uniquement à titre indicatif.
• Les espaces de noms ne sont pas pris en charge. • Les objets insérés ne sont pas pris en charge. • Le mot-clé super n’est pas pris en charge. • Les noms de classe complets ne sont pas pris en charge. Par exemple, vous ne pouvez pas évaluer mx.controls.Button. Vous pouvez faire référence au nom de classe non qualifié. Par exemple, vous pouvez spécifier que Button fait référence à mx.controls.Button. En présence d’un nom de classe ambigu (deux classes portant le même nom dans deux packages différents), il vous est impossible de contrôler quelle classe est évaluée. Vous pouvez cependant spécifier : getDefinitionByName("mx.controls.Button")
• Vous ne pouvez pas appeler des fonctions définies en tant que variables.
Au cours du débogage d’une application, vous pouvez définir des points de contrôle pour des instances spécifiques de variables. Ils auront pour tâche d’interrompre l’exécution à tout changement de valeur de la variable contrôlée. Les points de contrôle étant définis pour l’instance spécifique d’une variable, ils ne peuvent pas être placés dans l’éditeur de code. Ils sont donc définis à partir de la vue Variables au cours de la session de débogage. Pour la définition des points de contrôle, veillez aux points suivants :
• Vous ne pouvez pas définir des points de contrôle sur les getter, mais vous pouvez en définir sur les champs des getter. Par exemple, vous ne pouvez pas définir un point de contrôle sur width, mais vous pouvez en définir un sur _width.
{ ❖ Deux méthodes permettent de définir un point de contrôle au cours d’une session de débogage :
Dans la boîte de dialogue d’ajout d’un point de contrôle, sélectionnez la variable que vous souhaitez contrôler. La vue Variables affiche une icône représentant un crayon en regard de la variable pour laquelle un point de contrôle a été défini.
Utilisation de la commande Exécuter jusqu’à la ligne La commande Exécuter jusqu’à la ligne permet de quitter une boucle au cours d’une session de débogage. Au cours du débogage, vous constaterez parfois que votre code exécute une boucle répétitive. Pour quitter cette boucle, faites appel à la commande Exécuter jusqu’à la ligne située dans le menu Exécuter.
Le profileur se compose de plusieurs vues (ou panneaux) présentant de différentes manières les données de profilage. Le tableau suivant présente chacune de ces vues : Vue
Données de profilage enregistrées
Pour plus d’informations, voir « Enregistrement et chargement des données de profilage » à la page 166.
Pour plus d’informations, voir « Affichage des informations dans la vue Objets actifs » à la page 146.
Deux instantanés de la mémoire pris à des moments différents sont comparés en vue de déterminer les fuites de mémoire qui existent entre les deux moments. Vous pouvez afficher la vue Instantané de la mémoire en cliquant sur le bouton Prendre un instantané de la mémoire puis en cliquant deux fois sur l’instantané de mémoire dans la vue Profiler. Pour plus d’informations, voir « Vue Instantané de la mémoire » à la page 147.
Vous pouvez afficher la vue Objets vagabonds en sélectionnant deux instantanés de mémoire et en cliquant sur le bouton Objets vagabonds. Pour plus d’informations, voir « Vue Objets vagabonds » à la page 157.
Vous pouvez afficher la vue Suivi des allocations en sélectionnant deux instantanés de mémoire et en cliquant sur le bouton Afficher le suivi des allocations. Pour plus d’informations, voir « Vue Suivi des allocations » à la page 151.
Vous pouvez afficher la vue Références de l’objet en cliquant deux fois sur le nom d’une classe dans la vue Instantané de la mémoire ou Objets vagabonds. Pour plus d’informations, voir « Vue Références de l’objet » à la page 149.
Vous pouvez afficher la vue Statistiques de l’objet en cliquant deux fois sur une entrée de la vue Suivi des allocations. Pour plus d’informations, voir « Vue Statistiques de l’objet » à la page 152.
Vous pouvez afficher la vue Profil de performance en cliquant deux fois sur l’un des instantanés des performances dans la vue Profiler. Pour plus d’informations, voir « Vue Profil de performance » à la page 154.
Vous pouvez afficher la vue Statistiques de la méthode en cliquant deux fois sur une ligne de la vue Profil de performance ou en y sélectionnant une méthode et en cliquant sur le bouton Ouvrir les statistiques de la méthode. Pour plus d’informations, voir « Identification des caractéristiques des performances des méthodes » à la page 156.
Pour plus d’informations, voir « Graphique Utilisation de la mémoire » à la page 158.
La vue Objets actifs affiche des informations concernant les classes utilisées par l’application en cours. Cette vue montre les classes qui sont instanciées, le nombre créé, combien se trouvent dans la mémoire et la quantité de mémoire que les objets actifs occupent. Le profileur met à jour en continu les données dans la vue Objets actifs à mesure que vous profilez l’application. Vous n’avez pas besoin d’actualiser la vue ou de garder le focus dessus pour mettre à jour les données. Pour pouvoir utiliser la vue Objets actifs, activez le profilage de la mémoire au démarrage du profileur. C’est la valeur par défaut. Si vous fermez la vue Objets actifs et que vous voulez la rouvrir, déployez la liste déroulante dans la vue Profiler et sélectionnez Surveiller les objets actifs.
Vous utilisez généralement les données contenues dans la vue Objets actifs pour voir la quantité de mémoire que les objets utilisent. A mesure que les objets sont nettoyés de la mémoire, l’utilisation du nombre d’occurrences et de la mémoire diminue, mais l’utilisation des occurrences cumulées et de la mémoire cumulée augmente. Cette vue indique également la façon dont la mémoire est utilisée lors de l’exécution de l’application. Pour plus d’informations sur l’exécution et l’analyse des résultats du nettoyage de la mémoire, voir « Récupération de place » à la page 168. Vous pouvez limiter les données affichées dans la vue Objets actifs grâce aux filtres du profileur. Pour plus d’informations, voir « Filtres du profileur » à la page 172.
La vue Instantané de la mémoire propose des informations concernant l’utilisation des objets et de la mémoire de l’application à un moment donné. A la différence de la vue Objets actifs, les données de la vue Instantané de la mémoire ne sont pas mises à jour en continu.
Création et affichage d’un instantané de la mémoire 1 Démarrez une session de profilage. 2 Interagissez avec votre application jusqu’à atteindre un point dans l’état de l’application où vous voulez prendre un
3 Sélectionnez l’application dans la vue Profiler. 4 Cliquez sur le bouton Prendre un instantané de la mémoire.
5 Pour afficher les données dans l’instantané de mémoire, cliquez deux fois sur l’instantané de mémoire dans la vue
L’exemple suivant illustre la vue Instantané de la mémoire :
Si le champ Package est vide, la classe se trouve dans le package global ou le package non nommé.
Vous pouvez enregistrer des instantanés de la mémoire pour comparer l’état d’une application au cours d’une session de profilage différente. Pour plus d’informations, voir « Enregistrement et chargement des données de profilage » à la page 166.
Vous pouvez également spécifier quelles données afficher dans la vue Instantané de la mémoire grâce aux filtres du profileur. Pour plus d’informations, voir « Filtres du profileur » à la page 172.
La vue Références de l’objet affiche les traces de pile pour les classes qui ont été instanciées dans l’application. La vue Références de l’objet affiche des informations sur les occurrences de la classe sélectionnée sous forme d’arborescence. La vue Références de l’objet affiche également les chemins d’accès aux références arrière de l’objet, menant à la racine de la RP. S’il existe plusieurs occurrences d’un chemin d’accès à une référence d’objet, le chemin d’accès n’est pas répété. Pour ouvrir la vue Références de l’objet, cliquez deux fois sur le nom d’une classe dans les vues Instantané de la mémoire ou Objets vagabonds. La vue Références de l’objet affiche les données dans deux tables : Occurrences et Suivi des allocations. La table Occurrences répertorie tous les objets contenant des références à l’objet actuel. Le numéro entre parenthèses figurant après chaque nom de classe est représenté en tant que nœud dans l’arborescence. Il représente le nombre de chemins d’accès menant à la racine de la RP à partir de ce nœud. Vous ne pouvez pas voir le nombre de références futures d’un objet. Un objet sans références n’est pas listé dans cette table. Cela ne devrait pas se produire, car l’objet en question doit être nettoyé de la mémoire s’il ne possède aucune référence. L’exemple suivant illustre la table Occurrences de la vue Références de l’objet :
ID Identifiant de référence de l’objet contenant la référence à l’objet sélectionné.
Développez un nœud d’objet dans l’arborescence pour afficher s’il existe une référence arrière à la racine de la RP.
La table Suivi des allocations affiche la trace de la pile de l’occurrence sélectionnée dans la table Occurrences. Lorsque vous sélectionnez une occurrence dans la table Occurrences, le profileur affiche la pile d’appels de cette occurrence dans la table Suivi des allocations. L’exemple suivant illustre la table Suivi des allocations de la vue Références de l’objet :
Vous pouvez ouvrir le code source de la classe sélectionnée en cliquant deux fois sur une classe dans cette table.
Le résultat de la comparaison des instantanés de la mémoire est une liste de méthodes que Flash Player a exécutées entre les deux instantanés de mémoire. Pour chacune de ces méthodes, le profileur indique le nombre d’objets créés dans cette méthode. Ces informations peuvent vous aider à optimiser les performances. Une fois que vous avez identifié des méthodes qui créent un nombre excessif d’objets, vous pouvez optimiser ces zones à problème. Pour pouvoir utiliser la vue Suivi des allocations, activez le suivi des allocations au démarrage du profileur. Cette option est désactivée par défaut. L’exemple suivant illustre la vue Suivi des allocations :
Vous pouvez limiter les données affichées dans la vue Suivi des allocations grâce aux filtres du profileur. Pour plus d’informations, voir « Filtres du profileur » à la page 172.
La vue Statistiques de l’objet propose des statistiques concernant les performances du groupe d’objets sélectionné. Cette vue permet d’identifier quelles méthodes appellent un nombre disproportionné d’autres méthodes. Elle indique également la quantité de mémoire que les objets instanciés dans ces appels de méthode consomment. Vous pouvez faire appel à la vue Statistiques de l’objet pour identifier d’éventuelles fuites de mémoire et d’autres sources de problèmes de performances dans votre application. Pour accéder à la vue Statistiques de l’objet, sélectionnez deux instantanés de mémoire dans la vue Profiler et affichez la comparaison dans la vue Suivi des allocations. Cliquez ensuit deux fois sur une ligne pour afficher les informations dans la vue Statistiques de l’objet. La vue comporte trois sections :
Le nombre d’objets dans cette liste correspond au nombre d’objets spécifié dans la colonne Occurrences propres de la vue Suivi des allocations.
Suivi des allocations.
Le tableau suivant répertorie les champs de la table Occurrences propres de la vue Statistiques de l’objet : Colonne
La vue Profil de performance est la principale vue à utiliser lors du profilage des performances. Elle propose des statistiques telles que le nombre d’appels, la durée propre et la durée cumulée pour les méthodes appelées au cours d’un intervalle d’échantillonnage particulier. Ces données permettent d’identifier les goulets d’étranglement des performances. Le processus de profilage des performances conserve une liste des méthodes et des informations concernant ces méthodes qui ont été appelées entre le moment où vous supprimez les données de performances et le moment où vous capturez les nouvelles données. Cet écart de temps est désigné par le terme de période d’interaction. Pour pouvoir utiliser la vue Profil de performance, activez le profilage des performances au démarrage du profileur. C’est la valeur par défaut. Génération d’un profil de performance 1 Activez le profilage des performances et démarrez une session de profilage. 2 Interagissez avec l’application jusqu’à atteindre le point où vous voulez commencer le profilage. 3 Cliquez sur le bouton Réinitialiser les données de performance. 4 Interagissez avec l’application et effectuez les actions à profiler. 5 Cliquez sur le bouton Capturer le profil de performance.
Réinitialiser les données de performance, le profil de performance contiendra toutes les données capturées depuis le premier démarrage de l’application. 6 Cliquez deux fois sur le profil de performance dans la vue Profiler.
à la page 156. Vous pouvez limiter les données affichées dans la vue Profil de performance grâce aux filtres du profileur. Pour plus d’informations, voir « Filtres du profileur » à la page 172. Vous pouvez enregistrer les profils de performances pour une utilisation ultérieure. Pour plus d’informations, voir « Enregistrement et chargement des données de profilage » à la page 166.
La vue Statistiques de la méthode présente les caractéristiques des performances de la méthode sélectionnée. Vous pouvez faire appel à la vue Statistiques de la méthode pour identifier des goulets d’étranglement dans l’application. En affichant, par exemple, les temps d’exécution d’une méthode, vous pouvez voir les méthodes qui prennent un temps disproportionné pour s’exécuter. Vous pouvez ensuite optimiser de manière sélective ces méthodes. Pour plus d’informations, voir « Vue Profil de performance » à la page 154. Affichage des informations concernant les méthodes dans la vue Statistiques de la méthode 1 Cliquez deux fois sur une ligne dans la vue Profil de performance ou sélectionnez une méthode dans cette même
2 Cliquez sur le bouton Ouvrir les statistiques de la méthode.
L’exemple suivant illustre le récapitulatif de méthodes et les tables Appelants et Appelés de la vue Statistiques de la méthode :
Vous pouvez aussi utiliser les boutons Précédent, Suivant et Valeur par défaut du profileur pour parcourir la pile d’appels. Vous pouvez limiter les données affichées dans la vue Statistiques de la méthode grâce aux filtres du profileur. Pour plus d’informations, voir « Filtres du profileur » à la page 172.
La vue Objets vagabonds présente les différences entre deux instantanés de mémoire de l’application que vous profilez. Les différences que cette vue illustre sont le nombre d’occurrences d’objets dans la mémoire et la quantité de mémoire que ces objets utilisent. Ces données sont utiles pour identifier les fuites de mémoire. Le laps de temps écoulé entre deux instantanés de la mémoire est l’intervalle d’instantanés. Pour ouvrir la vue Objets vagabonds, sélectionnez deux instantanés de mémoire et cliquez sur le bouton Objets vagabonds. Pour plus d’informations sur l’enregistrement d’un instantané de la mémoire, voir « Vue Instantané de la mémoire » à la page 147.
Pour plus d’informations sur l’identification de fuites de mémoire, voir « Localisation des fuites de mémoire » à la page 169.
Le graphique Utilisation de la mémoire présente la mémoire utilisée par l’application que vous profilez. Cette valeur est différente de l’utilisation de la mémoire de Flash Player et son navigateur. La raison en est que cette valeur ne comprend pas l’utilisation de la mémoire de l’agent du profileur ou du navigateur. Elle correspond uniquement à la somme des objets actifs de l’application profilée. En conséquence, si vous comparez la valeur de l’utilisation de la mémoire dans ce graphique à la quantité de mémoire que le navigateur utilise telle qu’indiquée, par exemple, dans le Gestionnaire des tâches de Windows, vous obtenez des résultats différents.
La valeur de Mémoire actuelle est égale à la somme des totaux de la colonne Mémoire de la vue Objets actifs, en supposant que tous les filtres soient désactivés. La valeur de Mémoire maximale correspond à la quantité la plus élevée de mémoire que cette application a utilisée au cours de la session de profilage en cours. Le graphique Utilisation de la mémoire montre l’état de la mémoire de l’application au cours des 100 dernières secondes. Vous ne pouvez pas configurer ce nombre et vous ne pouvez pas enregistrer de données historiques pour le diagramme. Si vous fermez le graphique Utilisation de la mémoire et que vous voulez le rouvrir, cliquez sur la liste déroulante dans la vue Profiler et sélectionnez Utilisation de la mémoire.
Le profileur permet d’identifier les problèmes de performance et les fuites de mémoire des applications. Vous le lancez dans Adobe Flash Builder, et comme vous interagissez avec votre application, le profileur enregistre les données concernant l’état de l’application. Les données enregistrées incluent le nombre d’objets, la taille de ces objets, le nombre d’appels de méthodes et le temps passé dans ces appels de méthodes. Le profilage d’une application peut vous aider à comprendre les éléments suivants : Fréquence des appels : dans certains cas, les méthodes faisant appel à un grand nombre de ressources sont appelées plusieurs fois, alors qu’un seul appel est nécessaire. En identifiant les méthodes les plus fréquemment appelées, vous pouvez concentrer le temps que vous passez à ajuster les performances sur une zone plus réduite de l’application, où l’impact sur les performances peut être plus important. Durée de la méthode : le profileur peut vous indiquer le temps passé dans une méthode particulière ou, si la méthode
Piles d’appels : en suivant la pile d’appels d’une méthode, vous pouvez voir l’intégralité du chemin que poursuit
Nombre d’occurrences (allocation d’objet) : si vous constatez que le même objet est créé plusieurs fois alors que seul un nombre spécifique d’occurrences est requis, vous pouvez implémenter un motif Singleton si vous n’avez réellement besoin que d’un seul de ces objets. Vous pouvez également appliquer d’autres techniques permettant de réduire
Récupération de place : lorsque vous comparez des instantanés de profilage, vous pouvez constater que certains objets
Le profilage est un processus d’itération et constitue une partie de chaque étape du développement de l’application. Pour identifier rapidement les zones d’erreur et tirer le meilleur profit du profilage, il est conseillé de profiler l’application aussi tôt et aussi souvent que possible dans le cycle de développement.
Avant de faire appel au profileur, décidez du type de profilage que vous allez effectuer : profilage des performances ou profilage de la mémoire. Le profilage des performances est le processus de recherche de méthodes de l’application qui s’exécutent lentement et peuvent être améliorées. Une fois identifiées, ces zones à problèmes peuvent être optimisées pour accélérer l’exécution de l’application et pour que celle-ci réponde plus rapidement aux interactions de la part de l’utilisateur. Lors du profilage des performances, vous cherchez généralement deux choses : une méthode appelée une seule fois mais qui met plus de temps à s’exécuter que des méthodes similaires, ou une méthode qui ne met pas autant de temps à s’exécuter, mais qui est appelée de nombreuses fois. Les données de profilage des performances permettent d’identifier les méthodes que vous optimisez par la suite. Vous trouverez peut-être que le fait de réduire le nombre d’appels à une méthode est plus efficace que la restructuration du code au sein de la méthode. Le profilage de la mémoire est l’examen de la quantité de mémoire qu’utilise chaque objet ou type d’objet de l’application. Les données de profilage de la mémoire s’utilisent de diverses façons : pour voir si des objets sont plus volumineux que nécessaire, pour voir si trop d’objets d’un même type existent et pour identifier des objets qui ne sont pas nettoyés dans la mémoire (fuites de mémoire). Grâce aux données de profilage de la mémoire, vous pouvez tenter de réduire la taille des objets, le nombre des objets créés ou permettre le nettoyage des objets dans la mémoire en supprimant les références à ces objets. Le profilage de la mémoire peut ralentir les performances de l’application car il fait appel à une plus grande quantité de mémoire que le profilage des performances. Ne faites appel au profilage de la mémoire qu’en cas de nécessité. Il convient souvent d’effectuer à la fois un profilage des performances et un profilage de la mémoire pour trouver la source des problèmes de performances. Le profilage des performances permet d’identifier les méthodes qui entraînent une allocation de mémoire excessive et un allongement des temps d’exécution. Vous pouvez ensuite recourir au profilage de la mémoire afin d’identifier les fuites de mémoire dans ces méthodes. Lorsque vous savez quel profilage vous allez effectuer, vous pouvez démarrer le profileur.
Le profileur seul n’améliore ni la taille, ni la vitesse, ni les performances perçues d’une application. Après avoir utilisé le profileur pour identifier les méthodes et classes qui posent problèmes, consultez les ressources suivantes dans la documentation Flex, qui vous aideront à améliorer l’application :
L’échantillonnage vous permet de profiler sans ralentir notablement l’application. L’intervalle écoulé s’appelle la fréquence d’échantillonnage, qui survient environ toutes les millisecondes pendant la période de profilage. Cela signifie que les opérations ne sont pas toutes enregistrées et que les instantanés ne sont pas tous précis à une fraction de milliseconde près. Cela vous permet toutefois d’avoir une idée plus précise des opérations qui prennent plus de temps que les autres. En analysant les données d’échantillonnage, le profileur peut afficher toutes les opérations effectuées dans l’application et enregistrer leur délai d’exécution. Il consigne également l’utilisation de la mémoire et les traces de pile et affiche les données dans une série de vues, ou panneaux. Les appels de méthode sont classés par durée d’exécution et nombre d’appels, ainsi que par nombre d’objets créés dans la méthode. Le profileur calcule également les valeurs cumulées des données. Par exemple, si vous consultez des statistiques liées aux méthodes, les données cumulées comprennent le temps et la mémoire alloués au cours de cette méthode, ainsi que le temps et la mémoire alloués au cours de toutes les méthodes appelées à partir de cette méthode. Vous pouvez effectuer une analyse plus poussée des appels de méthode suivants, jusqu’à trouver la source des problèmes de performances.
StackFrame, NewObjectSample et DeleteObjectSample. Vous pouvez faire appel aux méthodes et aux classes contenues dans ce package pour écrire votre propre application de profileur ou pour inclure un sous-ensemble de fonctionnalités de profilage dans vos applications. Outre les classes du package flash.sampler.*, le profileur utilise les méthodes contenues dans la classe System.
Le profileur enregistre généralement des données sur les méthodes de la classe dont l’exécution était en cours au moment de l’instantané d’échantillonnage. Il arrive toutefois que le profileur enregistre également des actions internes de Flash Player. Ces actions, consignées entre crochets, sont notamment [keyboardEvent], [mark] et [sweep]. Par exemple, si [keyboardEvent] se trouve dans la liste des méthodes avec une valeur de 100, vous savez que le lecteur a effectué une action interne liée à cet événement au moins 100 fois au cours de la période d’interaction. Le tableau suivant décrit les actions internes de Flash Player qui apparaissent dans les données de profilage :
Utilisation du profileur Le profileur nécessite Flash Player version 9.0.124 ou une version ultérieure. Vous pouvez profiler des applications qui ont été compilées pour Flex 2, Flex 2.0.1 et Flex 3. Vous pouvez utiliser le profileur pour profiler des applications ActionScript 3.0 créées avec Flash Authoring, ainsi que des applications d’ordinateur exécutées sur Adobe® AIR™. Le profileur a besoin d’informations de débogage dans l’application que vous êtes en train de profiler. Lorsque vous compilez une application et que vous lancez le profileur, Flash Builder inclut par défaut les informations de débogage dans l’application. Vous pouvez inclure explicitement les informations de débogage dans n’importe quelle application en définissant l’option débug du compilateur sur true. Si vous exportez une application par le biais de l’option Exporter vers une version validée, l’application ne contient aucune information de débogage.
Le tableau suivant présente les boutons de la barre d’outils du profileur : Bouton
Pour plus d’informations sur la récupération de place, voir « Récupération de place » à la page 168.
Cette option est active uniquement si le nom d’une application est sélectionné, que celle-ci est en cours d’exécution et si vous sélectionnez Activer le profilage de la mémoire dans la boîte de dialogue de lancement. Le profileur ajoute de nouveaux instantanés de la mémoire en tant qu’enfants de l’application sélectionnée dans la vue Profiler. Pour ouvrir le nouvel instantané de mémoire dans la vue Instantané de la mémoire, cliquez deux fois sur l’entrée d’instantané de la mémoire. La récupération de place se fait implicitement avant l’enregistrement d’instantanés de la mémoire. En d’autres termes, un clic sur le bouton Prendre un instantané de la mémoire équivaut à un clic sur le bouton Lancer la récupération de place puis à un clic sur le bouton Prendre un instantané de la mémoire. Pour plus d’informations sur l’utilisation des instantanés de mémoire, voir « Vue Instantané de la mémoire » à la page 147.
Cette option est active uniquement si deux instantanés de mémoire sont sélectionnés et que l’option Activer le profilage de la mémoire est sélectionnée dans la boîte de dialogue de lancement. Pour plus d’informations sur la vue Objets vagabonds, voir « Vue Objets vagabonds » à la page 157.
Cette option est active uniquement si deux instantanés de mémoire sont sélectionnés et que l’option Activer le profilage de la mémoire est sélectionnée dans la boîte de dialogue de lancement. Pour plus d’informations sur la vue Suivi des allocations, voir « Vue Suivi des allocations » à la page 151. Réinitialiser les données de performance
Cette option est active uniquement si le nom d’une application est sélectionné, que celle-ci est en cours d’exécution, et si vous sélectionnez Activer le profilage de la mémoire dans la boîte de dialogue de lancement. Généralement, vous cliquez sur ce bouton, vous interagissez avec l’application, puis vous cliquez sur le bouton Capturer le profil de performance pour obtenir un instantané des performances de l’application à partir du moment où vous réinitialisez les données. Pour plus d’informations sur la vue Profil de performance, voir « Vue Profil de performance » à la page 154.
Cette option est active uniquement si le nom d’une application est sélectionné, que celle-ci est en cours d’exécution, et si vous sélectionnez Activer le profilage des performances dans la boîte de dialogue de lancement. Pour ouvrir la vue Profil de performance, cliquez deux fois sur l’entrée d’instantané des performances. Pour plus d’informations sur la vue Profil de performance, voir « Vue Profil de performance » à la page 154.
Cette option est activée uniquement si un instantané de performances ou de mémoire est sélectionné.
L’option Enregistrer est également disponible à partir du menu de la vue Profiler. Cette option est active uniquement si le nom d’une application est sélectionné.
Vous pouvez profiler des applications que vous êtes en train de créer dans Flash Builder. Flash Builder inclut des informations de débogage lors de la compilation et de l’exécution d’une application lors d’une session de débogage. Vous pouvez également profiler dans Flash Builder des applications externes que vous n’êtes pas en train de développer, mais dont le fichier SWF est disponible avec une URL ou dans le système de fichiers. Le fichier SWF d’une application doit contenir des informations de débogage pour que vous puissiez la profiler. Pour plus d’informations, voir « Profilage des applications externes » à la page 167.
1 Fermez toutes les occurrences du navigateur. 2 Ouvrez l’application dans Flash Builder.
4 Cliquez sur OK. Flash Builder compile l’application et la lance dans une fenêtre de navigateur distincte. Flash
5 Sélectionnez les options de la boîte de dialogue Configurer le profileur puis cliquez sur Reprendre. Pour profiler
Le tableau suivant présente les options : Paramètre
Vous pouvez toutefois profiler une application s’exécutant sur un ordinateur distinct. Voir « Profilage des applications externes » à la page 167.
Si vous êtes en train d’effectuer le profilage des performances, vous pouvez désélectionner cette option. L’option Activer le profilage de la mémoire est sélectionnée par défaut.
Activer le profilage de la mémoire. L’option Surveiller les données de mémoire active est sélectionnée par défaut.
L’option Générer des traces de pile d’allocation d’objets est désactivée par défaut. Elle doit être activée pour pouvoir afficher les informations liées au suivi des allocations dans la vue Références de l’objet ou Suivi des allocations.
Si vous êtes en train d’effectuer le profilage de la mémoire, vous pouvez désélectionner cette option. L’option Activer le profilage des performances est sélectionnée par défaut.
6 Vous pouvez maintenant commencer à interagir avec l’application et à examiner les données du profileur.
Une fois que vous avez démarré le profileur, vous pouvez interrompre et redémarrer les applications dans la vue Profiler. Sélectionnez une application puis sélectionnez l’action à effectuer sur cette application. L’exemple suivant illustre la vue Profiler avec plusieurs applications. Une application est en cours d’exécution ; toutes les autres sont fermées.
1 Sélectionnez l’application dans la vue Profiler. 2 Cliquez sur le bouton Arrêter pour mettre fin manuellement à la session de profilage. Cette opération ne ferme pas
3 Pour retourner à la perspective Développement Flex, sélectionnez Développement Flex dans la liste déroulante de
Une fois le profileur exécuté, vous pouvez enregistrer les données afin de comparer un instantané de la session de profilage en cours avec un instantané pris après avoir modifié le code. Vous pouvez ainsi déterminer si vous avez identifié les causes responsables des problèmes et si les modifications apportées améliorent les performances et l’utilisation de la mémoire par l’application. Lors de l’enregistrement des données de profilage, vous enregistrez toutes les données de l’application dans ce profil, à savoir tous les profils de performance, les instantanés de la mémoire et le suivi des allocations. Flash Builder enregistre ces informations dans un groupe de fichiers binaires à l’emplacement que vous spécifiez. Enregistrement des données de profilage 1 Sélectionnez l’application dans la vue Profiler. 2 Ouvrez la liste déroulante dans la vue Profiler et sélectionnez Enregistrer. La boîte de dialogue de sélection de
3 Choisissez un emplacement pour enregistrer les données de profil et cliquez sur OK. Créez un dossier pour chaque
Récupération des données de profilage enregistrées 1 Sélectionnez la vue Données de profilage enregistrées. 2 Cliquez sur le bouton Ouvrir. La boîte de dialogue Rechercher un dossier apparaît. 3 Recherchez le dossier contenant les données de profilage de l’application, puis cliquez sur OK. Flash Builder affiche
Vous ne pouvez pas supprimer les données d’application enregistrées depuis Flash Builder. Suppression des données de profilage 1 Sélectionnez l’instantané de l’application dans la vue Profiler. 2 Cliquez sur le bouton Supprimer.
Vous pouvez définir certaines préférences du profileur de manière telle à ce que les paramètres s’appliquent à toutes les sessions de profilage. Ces paramètres vous permettent de définir le Flash Player/navigateur dans lequel vous profilez l’application, ainsi que les filtres par défaut et le numéro de port sur lequel l’application est disponible, si l’application profilée s’exécute sur un serveur. Définition des préférences de Flash Builder pour plusieurs sessions de profilage ❖ Ouvrez la boîte de dialogue Préférences et sélectionnez Flash Builder > Profileur. Sélectionnez les options du menu Profileur pour y accéder. Le tableau suivant répertorie les préférences que vous pouvez définir : Option de menu
Si vous spécifiez un emplacement de système de fichiers pour le fichier SWF, Flash Builder ouvre l’application dans la version débogueur du Flash Player autonome. En règle générale, utilisez une URL pour demander le fichier. L’exécution des applications dans la version autonome de Flash Player peut produire des résultats inattendus, plus particulièrement si l’application utilise des services distants ou des appels réseau. Profilage d’une application externe 1 Placez-vous dans la perspective Profil Flash. 2 Sélectionnez Profiler > Profiler une application externe. La boîte de dialogue Profiler une application externe
3 Sélectionnez l’option (par défaut) Lancer l’application sélectionnée puis cliquez sur le bouton Nouveau. La boîte de lance l’application à partir du navigateur par défaut. Si vous avez spécifié un emplacement de système de fichiers pour l’application, Flash Builder ouvre l’application dans la version autonome de Flash Player. Si vous avez spécifié un fichier SWF qui a été compilé sans informations de débogage, Flash Builder retourne une erreur. Recompilez l’application avec l’option debug du compilateur définie sur true, puis relancez-la.
La récupération de place est l’action de supprimer de la mémoire des objets qui ne sont plus nécessités. La mémoire utilisée par des occurrences n’ayant plus de références à ces objets doit être désallouée pendant ce processus. Flash Player nettoie la mémoire en fonction des besoins au cours du cycle de vie d’une application. Le déréférencement d’un objet ne déclenche pas le nettoyage de la mémoire. Ainsi, lorsque vous supprimez toutes les références à un objet, le nettoyage de la mémoire ne désalloue pas nécessairement la mémoire pour cet objet. Cet objet devient une cible potentielle du nettoyage de la mémoire. Le fait de cliquer sur le bouton Lancer la récupération de place ne garantit pas que tous les objets susceptibles d’être nettoyés le soient. La récupération de place est généralement déclenchée par l’allocation de mémoire à de nouvelles ressources. En effet, lorsque de nouvelles ressources nécessitent de la mémoire qui n’est pas disponible dans l’allocation actuelle, la fonction de récupération de place s’exécute et libère de la mémoire signalée pour la désallocation. Par conséquent, la suppression de toutes les références à la mémoire ne signifie pas qu’elle sera nettoyée immédiatement, mais bien qu’elle le sera probablement lors de la création et de l’utilisation d’autres occurrences. Si une application est inactive, vous pouvez consulter l’allocation de sa mémoire. Même si certains objets sont marqués pour le nettoyage, l’utilisation de la mémoire d’une application inactive ne change pas tant que vous ne commencez pas à interagir avec elle. Flash Player alloue la mémoire en blocs de plusieurs octets, et non octet par octet. Si une partie d’un bloc est marquée pour le nettoyage sans que d’autres parties le soient, le bloc n’est pas libéré. La récupération de place tente d’associer les parties de la mémoire non utilisées dans des blocs plus volumineux pouvant être nettoyés, mais cela ne se produit pas systématiquement à chaque tentative de récupération. La récupération de place se fait implicitement avant l’enregistrement d’instantanés de la mémoire. En d’autres termes, un clic sur le bouton Prendre un instantané de la mémoire équivaut à un clic sur le bouton Lancer la récupération de place puis à un clic sur le bouton Prendre un instantané de la mémoire. Exécution de la récupération de place pendant le profilage d’une application ❖ Sélectionnez l’application dans la vue Profiler, puis cliquez sur le bouton Lancer la récupération de place. Vous pouvez analyser l’efficacité de ce processus en comparant deux instantanés de mémoire, avant et après le nettoyage de la mémoire.
Le profileur propose différentes techniques d’identification des zones à problèmes des applications.
L’une des façons de les identifier consiste à observer le nombre de références à un objet dans la table Occurrences de la vue Références de l’objet. Vous pouvez généralement ignorer les références provenant de propriétés et de liaisons d’un document et rechercher des références inattendues ou inhabituelles, plus particulièrement des objets qui ne sont pas des enfants de l’objet. Pour plus d’informations, voir « Vue Références de l’objet » à la page 149. Vous pouvez également examiner les chemins menant aux occurrences d’un objet pour déterminer si un chemin possède une référence arrière à la récupération de place (racine de la RP). Une occurrence dont la libération était attendue mais qui possède des références à la racine de la RP indique une perte de mémoire. Dans ce cas, modifiez le code de l’application de manière à supprimer toute référence à la racine de la RP. Une occurrence ne possédant plus aucune référence à la racine de la RP est prête à faire l’objet d’une récupération de place. Flash Player libère finalement cette mémoire. Une autre façon de localiser les pertes de mémoire consiste à comparer deux instantanés de mémoire dans la vue Objets vagabonds, afin de déterminer quels objets se trouvent toujours dans la mémoire après une série particulière d’événements. Il est courant, pour nettoyer les liens de la mémoire, de faire appel aux méthodes disconnect(), clearInterval() et removeEventListener(). Recherche d’une référence arrière à la racine de la RP pour une occurrence 1 Créez un instantané de la mémoire. Voir « Création et affichage d’un instantané de la mémoire » à la page 148. 2 Spécifiez le nombre de chemins de référence arrière à rechercher.
Afficher tous les chemins de références arrière. 3 Cliquez deux fois sur une classe dans la vue Instantané de la mémoire pour ouvrir la vue Références de l’objet. 4 Développez les chemins répertoriés et regardez s’il existe une référence arrière à la racine de la RP.
1 Créez deux instantanés de la mémoire. Voir « Création et affichage d’un instantané de la mémoire » à la page 148. 2 Sélectionnez les deux instantanés de mémoire à comparer.
Vous pouvez seulement comparer deux instantanés de mémoire en même temps. 3 Cliquez sur le bouton Rechercher les objets vagabonds.
à voir créée pendant ce laps de temps ou une classe que vous pensiez voir détruite pendant ce laps de temps, examinez l’application pour détecter si ces éléments peuvent être à l’origine d’une fuite de mémoire.
sur l’objet dans la vue. La vue Références de l’objet présente la trace de pile de chaque occurrence que vous avez sélectionnée. Un moyen d’identifier une fuite de mémoire consiste dans un premier temps à déterminer un ensemble d’étapes que vous pouvez répéter de nombreuses fois avec l’application, là où l’utilisation de la mémoire ne cesse d’augmenter. Il est important d’effectuer ces étapes au moins une fois dans l’application avant de prendre le premier instantané de la mémoire, de manière que tous les objets mis en mémoire cache ou que toute autre occurrence soient inclus dans cet instantané. Répétez ces étapes un certain nombre de fois (3, 7 ou un autre nombre premier) dans l’application. Prenez un second instantané de mémoire pour le comparer à l’instantané de départ. Dans la vue Rechercher les objets vagabonds, vous trouverez peut-être des objets vagabonds dotés d’occurrences au nombre de multiples de 3 ou de 7. Ces objets présentent probablement des fuites. Cliquez deux fois sur les classes pour consulter les traces de pile de chacune des occurrences. Un autre moyen consiste à répéter la séquence d’étapes sur une longue période et d’attendre que l’utilisation de la mémoire atteigne son maximum. Si elle n’augmente pas après cela, il n’y a aucune fuite de mémoire pour cet ensemble d’étapes. Parmi d’autres causes, les écouteurs d’événement en attente sont souvent à l’origine de fuites de mémoire. La méthode removeEventListener() permet de supprimer un écouteur d’événement qui n’est plus utilisé. Pour plus d’informations, voir Création et destruction d’objets dans Utilisation de Flex 4.6.
En analysant les temps d’exécution des méthodes et la quantité de mémoire allouée pendant ces appels de méthode, vous pouvez déterminer à quels niveaux les ralentissements des performances surviennent. Cette opération est utile notamment pour identifier le temps d’exécution des méthodes appelées fréquemment, plutôt que celui des méthodes qui le sont rarement. Détermination de la fréquence des appels de méthodes 1 Démarrez une session de profilage et veillez à activer le profilage des performances lors de la configuration du profileur sur l’écran de démarrage. 2 Sélectionnez l’application dans la vue Profiler. 3 Interagissez avec l’application jusqu’à atteindre le point où vous voulez commencer à analyser le nombre d’appels
4 Cliquez sur le bouton Réinitialiser les données de performance. Toutes les données de performance sont alors
5 Interagissez avec l’application jusqu’à atteindre le point où vous voulez vérifier le nombre d’appels de méthode
6 Cliquez sur le bouton Capturer le profil de performance. 7 Cliquez deux fois sur le profil de performance dans la vue Profiler. 8 Dans la vue Profil de performance, triez les données selon la colonne Méthode et localisez votre méthode dans la
Réinitialiser les données de performance et le moment où vous avez cliqué sur Capturer le profil de performance. Examinez les valeurs contenues dans les colonnes Durée cumulée, Durée propre, Durée cumulée moyenne et Durée propre moyenne de la vue Profil de performance. Elles indiquent le temps d’exécution des méthodes. Comparez le temps mis par chaque méthode pour s’exécuter au temps que mettent à s’exécuter toutes les méthodes appelées par une méthode particulière. En règle générale, si la durée propre ou la durée propre moyenne d’une méthode est élevée ou élevée par rapport à celle d’autres méthodes, observez de plus près la façon dont la méthode est implémentée et tentez de réduire le temps d’exécution. De la même façon, si la durée propre ou la durée propre moyenne d’une méthode est faible, mais que la durée cumulée ou la durée cumulée moyenne est élevé, observez les méthodes que cette méthode appelle pour localiser les goulets d’étranglement.
Un moyen d’identifier les zones à problèmes d’une application consiste à déterminer à quels niveaux un nombre excessif d’objets est créé. La création d’une occurrence d’un objet peut consommer un grand nombre de ressources, plus particulièrement si cet objet se trouve dans la liste d’affichage. L’ajout d’un objet à la liste d’affichage peut engendrer un grand nombre d’appels à des méthodes de style et de mise en forme, ce qui peut ralentir une application. Dans certains cas, vous pouvez restructurer le code afin de réduire le nombre d’objets créés. Une fois que vous avez déterminé si la création de certains objets est superflue, vous pouvez décider s’il est raisonnable ou utile de réduire le nombre d’occurrences de cette classe. Vous pouvez par exemple déterminer la taille des objets, car les objets volumineux présentent généralement le plus grand potentiel d’optimisation. Pour savoir quels objets sont créés en nombre important, vous pouvez comparer les instantanés de mémoire de l’application à deux moments. Affichage du nombre d’occurrences d’une classe spécifique 1 Démarrez une session de profilage et veillez à activer le profilage de la mémoire lors de la configuration du profileur sur l’écran de démarrage. 2 Interagissez avec l’application jusqu’à atteindre l’endroit dont vous souhaitez prendre un instantané de la mémoire. 3 Cliquez sur le bouton Prendre un instantané de la mémoire. Le profileur ajoute un nouvel instantané de la mémoire
4 Dans la vue Profiler, cliquez deux fois sur l’instantané de la mémoire pour l’ouvrir. 5 Pour afficher le nombre d’occurrences d’une classe particulière, ainsi que la quantité de mémoire que ces
Pour plus d’informations sur la vue Instantané de la mémoire, voir « Vue Instantané de la mémoire » à la page 147. Localisation d’occurrences d’allocation excessive d’objets 1 Démarrez une session de profilage et veillez à activer le profilage de la mémoire lors de la configuration du profileur sur l’écran de démarrage. 2 Interagissez avec l’application jusqu’à atteindre le premier endroit dont vous souhaitez prendre un instantané de la
Le profileur enregistre l’instantané de la mémoire dans la vue Profiler en indiquant la date et l’heure. 4 Interagissez avec l’application jusqu’à atteindre le deuxième endroit dont vous souhaitez prendre un instantané de
5 Cliquez à nouveau sur le bouton Prendre un instantané de la mémoire.
6 Sélectionnez les deux instantanés de mémoire à comparer.
Vous ne pouvez comparer que deux instantanés de mémoire à la fois. 7 Cliquez sur le bouton Afficher le suivi des allocations.
La quantité de données contenue dans une vue du profileur peut quelquefois être considérable et le niveau de détail trop important. Les actions internes de Flash Player peuvent occulter les données qui vous intéressent véritablement, telles que vos propres méthodes et classes. En outre, Flash Player crée et détruit de nombreux objets sans votre intervention directe. Vous pouvez par conséquent constater que des milliers de chaînes ou de tableaux sont utilisés dans votre application. Vous pouvez définir des filtres dans les vues suivantes :
• Instantané de la mémoire • Profil de performance • Statistiques de la méthode • Suivi des allocations Les filtres du profileur permettent de définir quels packages apparaissent dans les vues du profileur. Il existe deux types de filtres : Filtres d’exclusion : les filtres d’exclusion indiquent au profileur qu’il doit exclure de ses vues les packages qui
Vous pouvez également exclure des éléments intégrés globaux, ce qui comprend les classes globales String et Array. Filtres d’inclusion : les filtres d’exclusion indiquent au profileur qu’il doit inclure dans ses vues uniquement les
Les exclusions par défaut sont les classes flash.*.*, spark.*.*, mx.*.*, ainsi que les classes d’infrastructure Flex dans le package global ou non nommé, ce qui comprend les classes globales String et Array. Cela signifie que les inclusions par défaut sont des classes personnalisées se trouvant dans le package non nommé et des classes personnalisées dans des packages hors infrastructure (telles que com.mycompany.MyClass).
Nombre maximal de lignes visibles : l’option Nombre maximal de lignes visibles définit le nombre de rangées de données qui peuvent être affichées dans une vue. Augmentez cette valeur si les données que vous recherchez ne s’affichent pas dans la vue. Réduisez cette valeur pour améliorer les performances du profileur. Utilisez d’autres filtres pour vérifier que vous affichez les données qui vous intéressent. Nombre maximal de chemins de références arrière à rechercher : l’option Nombre maximal de chemins de références
Définition de préférences de filtres par défaut ❖ Ouvrez la boîte de dialogue Préférences et sélectionnez Flash Builder > Profileur > Filtres d’inclusion ou Filtres
Lors de l’affichage des données du profileur, celui-ci applique d’abord les filtres d’exclusion, puis les filtres d’inclusion. Supposons que vous définissiez le filtre d’exclusion sur mx.controls.*, mais que vous définissiez le filtre d’inclusion sur mx.*.*. Le profileur n’affiche aucune information concernant les classes du package mx.controls, même si leur motif correspond à la liste de motifs d’inclusion, car ce package est exclu. Supposons également que vous définissiez le filtre d’exclusion sur mx.*.* et le filtre d’inclusion sur mx.controls.*. Le profileur n’affiche aucune information concernant les classes du package mx.controls.* car elles ont été exclues avant l’inclusion du package. Lorsque vous filtrez certains points de données, les valeurs de pourcentage des colonnes sont ajustées afin de refléter uniquement le pourcentage de données non filtrées. Le profileur conserve les filtres d’une session de profilage à l’autre pour la même application. Les paramètres de filtres ne sont pas hérités par les vues secondaires. Par exemple, si vous appliquez un filtre aux données contenues dans la vue Instantané de la mémoire, puis accédez à la vue Références de l’objet en cliquant deux fois sur une méthode, la vue Références de l’objet n’applique pas le même filtre. Déterminer si les données sont filtrées 1 Cliquez sur le bouton Filtres ou examinez le titre des tables de données. Si des filtres sont appliqués, l’en-tête de la colonne Package est Package (filtré). 2 (Facultatif) Réinitialisez les filtres aux valeurs par défaut en cliquant sur le bouton Restaurer les valeurs par défaut.
Les assistants de Flash Builder vous guident tout au long de la création de scripts et de suites de tests en générant du code stub pour les tests.
Vous pouvez exécuter des scripts et des suites de tests de différentes manières à partir de Flash Builder ou en dehors de l’environnement Flash Builder. Les résultats des tests sont affichés dans une application de test. Flash Builder ouvre la vue Résultat des tests unitaires FlexUnit permettant d’analyser l’exécution du test.
Dans le panneau Résultats des tests, cliquez deux fois sur un test pour en ouvrir l’implémentation. Le panneau Détails des tests ayant échoué répertorie la source et le numéro de la ligne correspondant à l’échec. S la source répertoriée se trouve dans l’espace de travail en cours d’utilisation, cliquez deux fois sur son nom pour accéder directement à l’échec. Pour comprendre les principes de base de Test Driven Development (TDD) et utiliser l’environnement de test de FlexUnit, reportez-vous à l’article publié dans l’Adobe Dev Center par Elad Elrom, professionnel de la communauté Adobe.
Vous pouvez créer des classes de scripts de tests et des suites de scripts de tests unitaires FlexUnit pour les types de projets suivants :
• Projet Flex Mobile • Projet de bibliothèque Flex • Un package pour la classe
• Les méthodes à tester pour chaque classe spécifiée Une suite de scripts de tests unitaires FlexUnit est une série de tests basés sur des classes de scripts déjà créées, des méthodes spécifiées dans ces classes et d’autres suites de scripts de tests.
Lors de la création d’une classe de scripts de tests unitaires FlexUnit, Flash Builder génère un fichier ActionScript pour la classe de scripts de tests et le place dans un package de scripts de tests. La procédure suivante part du principe que vous avez créé un projet Flash Builder, dans lequel vous souhaitez générer et exécuter des tests unitaires FlexUnit. 1 Sélectionnez le projet Flex, puis Nouveau > Classe de script de tests dans le menu contextuel.
2 Dans l’assistant de création d’une classe de script de tests, indiquez si vous souhaitez créer une classe de style
3 Attribuez-lui un nom. 4 (Facultatif) Spécifiez un dossier source et un package pour la classe de script de tests ou validez les paramètres par
Le dossier source par défaut est le dossier src du projet en cours. Le package par défaut est flexUnitTests, qui correspond au niveau supérieur de la structure de packages par défaut du projet. 5 (Facultatif) Activez la case Sélectionner la classe à tester et recherchez la classe voulue. Cliquez sur Suivant. 6 (Facultatif) Sélectionnez les méthodes que vous souhaitez tester. 7 Cliquez sur Terminer.
Cette procédure part du principe que vous avez déjà créé des classes de script de tests. 1 Sélectionnez le projet Flex, puis créez une suite de script de tests à partir des menus contextuels en sélectionnant
2 Dans l’assistant de création d’une classe de suite de tests, indiquez si vous souhaitez créer une classe de style
3 Nommez la suite de tests. 4 Recherchez ensuite, dans les suites et les scripts de tests, les classes et les méthodes à inclure dans la suite de tests.
Vous pouvez personnaliser les classes et les scripts de test FlexUnit créés par Flash Builder. Flash Builder fait appel à des modèles de fichiers pour créer les versions par défaut de ces fichiers.
Modèles de fichier > FlexUnit. Les classes de suite et de script de tests FlexUnit 1 et FlexUnit 4 correspondent à des modèles distincts. Pour plus d’informations sur la modification des modèles de fichiers par défaut, voir « Personnalisation des modèles de fichier » à la page 62. Remarque : FlexUnitCompilerApplication.mxml et FlexUnitApplication.mxml dérivent du modèle pour applications MXML Web ou d’ordinateur. Le modèle utilisé dépend de la configuration du projet Flex : pour une application Web (s’exécute dans Adobe® Flash® Player) ou une application d’ordinateur (s’exécute dans Adobe AIR®).
Référence de langage « open source » pour FlexUnit Documentation « open source » pour FlexUnit SWF générés pour le test unitaire FlexUnit. Dans les deux cas, les résultats des tests s’affichent dans la vue Résultat des tests unitaires FlexUnit. Vous pouvez également configurer et enregistrer un test unitaire FlexUnit avant de l’exécuter. Par défaut, les tests FlexUnit sont exécutés dans la perspective Débogage Flash. Vous pouvez les lancer à partir des perspectives de développement et de profilage Flash. Dans ce cas, Flash Builder basculera toutefois vers la perspective de débogage à l’exécution du test. Vous pouvez modifier la perspective par défaut des tests FlexUnit. Ouvrez la fenêtre des préférences et accédez à Flash Builder > FlexUnit.
Lorsque vous créez un script de test FlexUnit, Flash Builder crée l’application de compilation FlexUnit suivante et une application FlexUnit :
• FlexUnitApplication.mxml Flash Builder utilise ces applications lors de la compilation et de l’exécution des tests FlexUnit. Flash Builder place les applications dans le répertoire src du projet. Cette application contient des références à tous les scripts et à toutes les suites de tests FlexUnit générés par Flash Builder. Ce dernier place tous les tests FlexUnit à l’intérieur des balises <fx:Declarations> de cette application. Vous ne serez généralement pas amené à éditer ou à modifier ce fichier directement. Actualisez l’application de compilation FlexUnit dans les circonstances suivantes :
Si vous créez une classe de script de tests sans utiliser l’assistant de création de script de tests, actualisez FlexUnitCompilerApplication.mxml. Placez le nouveau script de tests dans le package avec les autres scripts.
Vous pouvez exécuter des tests FlexUnit pour un projet dans son ensemble ou pour des scripts de tests individuels. Vous lancerez généralement l’exécution à partir du menu contextuel d’un projet ou d’un script de test individuel. Vous pouvez toutefois également lancer les tests en accédant au menu Exécuter, en cliquant sur le bouton Exécuter ou en sélectionnant le bouton Exécuter des tests unitaires FlexUnit dans la vue Résultat des tests unitaires FlexUnit. L’exécution à partir du menu Exécuter de Flash Builder entraîne l’ouverture d’une boîte de dialogue de configuration du test, dans laquelle vous pouvez sélectionner les classes de test et les méthodes à exécuter. Les scripts de tests pour les projets de bibliothèque ne peuvent pas être exécutés à partir du menu Exécuter de Flash Builder. Flash Builder fournit les raccourcis clavier suivants pour faciliter le lancement des tests FlexUnit :
Dans le menu Exécuter ou dans la liste déroulante du bouton Exécuter de Flash Builder, sélectionnez Exécuter > Tests FlexUnit. 2 (Menu Exécuter de Flash Builder) Dans la boîte de dialogue Exécution d’une configuration de test unitaire
3 Visionnez les résultats des tests.
Une application s’ouvre pour afficher des informations sur les tests et en indiquer la fin. Le panneau Résultat des tests unitaires FlexUnit s’ouvre et affiche les résultats des tests. Voir « Affichage des résultats de l’exécution d’un test FlexUnit » à la page 179. Exécution de tests FlexUnit individuels : 1 Dans l’Explorateur de projets, accédez au package flexUnitTest :
2 Visionnez les résultats des tests.
Le panneau Résultat des tests unitaires FlexUnit s’ouvre et affiche les résultats des tests. Voir « Affichage des résultats de l’exécution d’un test FlexUnit » à la page 179.
Builder Cette procédure part du principe que vous avez déjà exécuté un test unitaire FlexUnit dans Flash Builder et que Flash Builder est en cours d’exécution. 1 Copiez le fichier SWF généré pour un test du dossier bin-debug du projet vers un dossier situé en dehors de votre
Vous pouvez copier le fichier SWF généré automatiquement ou un fichier SWF provenant d’un test unitaire FlexUnit que vous avez précédemment enregistré et configuré. 2 Exécutez la copie du fichier SWF.
La vue Résultat des tests unitaires FlexUnit s’ouvre dans Flash Builder et affiche les résultats du test.
1 Ouvrez la boîte de dialogue Exécution d’une configuration de test unitaire FlexUnit.
Si cette vue n’est pas ouverte, vous pouvez y accéder en sélectionnant Fenêtre > Affichage d’une vue > Autres > Flash Builder > Résultat des tests unitaires FlexUnit. 2 Dans la boîte de dialogue Configuration de test, sélectionnez les scripts et les méthodes à enregistrer comme
Remarque : la boîte de dialogue Configuration de test n’est pas disponible si vous exécutez un test à partir du menu contextuel de l’Explorateur de packages. 3 (Facultatif) Sélectionnez Charger pour importer une configuration précédemment sauvegardée dans un fichier XML. 4 Cliquez sur Enregistrer.
Vous pouvez utiliser le fichier XML dans les scripts de génération pour exécuter le test. Vous pouvez générer un fichier SWF à partir du fichier MXML. Ce fichier SWF peut servir à effectuer des tests en dehors de l’environnement Flash Builder. Pour générer le fichier SWF, le fichier MXML est généralement copié dans le dossier src du projet.
Vous pouvez également relancer les tests, annuler un test en cours d’exécution et effacer les résultats de la vue. Si cette vue n’est pas ouverte, vous pouvez y accéder en sélectionnant Fenêtre > Affichage d’une vue > Autres > Flash Builder > Résultat des tests unitaires FlexUnit.
Ce panneau répertorie tous les tests de la série, en indiquant si le test a échoué ou réussi. Cliquez deux fois sur un test de la liste pour y accéder dans l’éditeur ActionScript.
Sélectionnez un test dans le panneau Résultats des tests pour afficher les détails de l’échec. Chaque détail indique le fichier source et la méthode, y compris le numéro de la ligne correspondant à l’échec. Si le fichier source appartient à l’espace de travail, cliquez deux fois dans la liste pour accéder à l’échec dans l’éditeur ActionScript.
Dans le menu de la vue Résultats des tests unitaires FlexUnit, vous pouvez procéder comme suit :
Masquage du panneau Détails des tests ayant échoué. Limitation de l’affichage aux tests ayant échoué
• Annulation d’un test en cours d’exécution • Enregistrement des résultats ou de la configuration d’un test • Chargement des résultats précédemment enregistrés dans un fichier • Suppression des résultats du panneau • Réexécution du test actuel. Vous pouvez choisir : • d’exécuter tous les tests ;. • d’exécuter uniquement les échecs ; • d’exécuter le test sélectionné. • Actualisation de la configuration FlexUnit Si vous avez modifié un test ou avez ajouté ou supprimé des tests, cliquez sur le bouton d’actualisation pour charger la nouvelle configuration FlexUnit.
Utilisez le bouton Exécuter des tests unitaires FlexUnit pour configurer et exécuter des tests FlexUnit.
Il vous est maintenant possible d’exécuter un test FlexUnit sur un périphérique mobile. Dans le cas où vous ne disposez pas de périphérique mobile, vous pouvez en simuler un sur votre ordinateur et ensuite exécuter le test FlexUnit. Exécution d’un test FlexUnit sur un périphérique mobile 1 Sélectionnez un projet mobile et exécutez le test en sélectionnant Exécuter > Tests FlexUnit ou sélectionnez Exécuter des tests unitaires FlexUnit dans le menu contextuel. 2 Spécifiez une méthode de lancement :
Flash Builder peut accéder au périphérique connecté au port USB de l’ordinateur ou au réseau via une connexion Wi-Fi. Une connexion socket et l’adresse IP de l’ordinateur permettent la communication entre Flash Builder et l’application FlexUnit exécutée sur le périphérique. Remarque : le test FlexUnit peut être exécuté sur un périphérique connecté au port USB de votre ordinateur, mais les résultats du test pourront uniquement être affichés si la connexion Wi-Fi est activée sur le périphérique. Le numéro de port utilisé par défaut pour établir une connexion socket est 8765. Vous pouvez modifier ce numéro en accédant à la boîte de dialogue Préférences et en sélectionnant Flash Builder > FlexUnit. Si l’application FlexUnit ne parvient pas à établir une connexion avec le périphérique, Flash Builder affiche parfois une boîte de dialogue vous demandant d’indiquer l’adresse IP de l’ordinateur. Assurez-vous que le périphérique est correctement connecté au réseau sans fil et que l’ordinateur qui exécute Flash Builder est accessible depuis ce réseau. 3 Dans la fenêtre de configuration de l’option Exécuter les tests unitaires FlexUnit, sélectionnez les scripts et les
4 Visionnez les résultats des tests.
Une application s’ouvre pour afficher des informations sur les tests et en indiquer la fin. Le panneau Résultat des tests unitaires FlexUnit s’ouvre et affiche les résultats des tests. Voir « Affichage des résultats de l’exécution d’un test FlexUnit » à la page 179.
Pour créer un projet, dans Flash Builder, sélectionnez Fichier > Nouveau, puis le type de projet que vous voulez ouvrir. L’assistant Nouveau projet diffère selon le type de projet. Dans certains cas, votre projet accède aux données d’un serveur, tel qu’un serveur PHP, ColdFusion ou d’application Java. Précisez les informations d’accès au serveur lors de la création du projet. Pour plus d’informations, voir « Création de projets dans Flash Builder » à la page 88. Vous pouvez importer des projets qui ont déjà été créés ou exportés depuis Flash Builder. Pour plus d’informations, voir « Exportation et importation de projets » à la page 95. Vous pouvez également importer des projets qui ont été créés dans Adobe Flash Catalyst. Pour plus d’informations, voir « Utilisation de Flash Builder avec Flash Catalyst » à la page 250. 2 Créez ou modifiez les fichiers source d’un projet.
Pour plus d’informations, voir « Outils de développement de code dans Flash Builder » à la page 48. 3 Créez le projet.
Pour plus d’informations, voir « Création de projets » à la page 101. 4 Exécutez les applications du projet.
En ce qui concerne les projets AIR mobiles, vous devez configurer une perspective de lancement avant de lancer l’application. Pour plus d’informations, voir « Exécution et débogage des applications » à la page 120. 5 Testez le projet.
Si votre application accède aux données distantes, utilisez le moniteur de réseau pour examiner les données transmises entre une application et un service de données. Pour plus d’informations, voir « Surveillance des applications qui accèdent aux services de données » à la page 224. Utilisez le profileur Adobe Flex pour identifier les problèmes de performance et les pertes de mémoire d’une application. Pour plus d’informations, voir « Profilage d’outils dans Flash Builder » à la page 145. 6 Déploiement d’une application.
Pour plus d’informations, voir « Exportation d’une application vers une version validée » à la page 126.
Bien que vous puissiez définir votre interface utilisateur complètement en mode Source, vous commencez généralement par ajouter les éléments d’interface utilisateur en mode Création. Pour plus d’informations, voir « Utilisation de composants visuels en mode Création MXML » à la page 22 et Création de l’interface utilisateur. Remarque : vous pouvez également ajouter à votre application des ressources créées avec Adobe Flash® Professional®. Voir « Création et modification de composants Flash » à la page 246.
Le formulaire Spark vous permet de créer des formulaires complexes. Le formulaire Spark est un conteneur hautement personnalisable qui prend en charge plusieurs créations de formulaires. Vous pouvez également créer et modifier des habillages pour le formulaire et les éléments de formulaire. Pour plus d’informations sur l’utilisation du formulaire Spark et des conteneurs Spark FormHeading et Spark FormItem, voir Utilisation de Flex 4.6.
1 Créez un composant MXML. Pour plus d’informations, voir « Création de composants MXML personnalisés » à la
Lorsque vous sélectionnez un habillage, un bloc <fx:Style> est créé. Par exemple, lorsque vous sélectionnez l’habillage Spark StackedFormItemSkin, le bloc de style suivant est créé.
• Le composant FormHeading utilise la classe FormHeadingSkin 4 Faites glisser et déposez le composant FormHeading dans le formulaire Spark, le cas échéant. Lorsque vous
</s:Form> <s:FormHeading label="Heading"/> par exemple. Chaque composant que vous déposez dans le formulaire génère un élément FormItem. Par défaut, une chaîne Label est ajoutée à chaque élément FormItem. Par exemple, si vous faites glisser et déposez un composant TextInput, un code ressemblant au suivant est généré : <s:Form> <s:FormItem label="Label"> <s:TextInput/> Utilisez le panneau Style de la vue des propriétés pour modifier les habillages. Pour plus d’informations sur l’application de styles aux composants, voir « Application des styles » à la page 191.
1 En mode Création de l’éditeur, sélectionnez Créer un habillage dans le menu contextuel de l’élément de formulaire. La boîte de dialogue de création d’un habillage MXML s’ouvre. Vous pouvez également ouvrir la boîte de dialogue de création d’un habillage MXML avec d’autres méthodes. En mode Création de l’éditeur, sélectionnez l’élément de formulaire, puis procédez de l’une des façons suivantes :
• Dans le menu Création, sélectionnez Créer un habillage. 2 Dans la boîte de dialogue de création d’un habillage MXML, spécifiez les éléments suivants :
• Nom de la classe d’habillage créée. • Composant hôte sélectionné, par défaut. • (Recommandé) Sélectionnez Créer en tant que copie de et ne supprimez pas le code de style ActionScript. Si vous êtes novice en matière d’habillage, utilisez une copie pour vous lancer dans la création d’une classe d’habillage. (Utilisateurs avancés) Si vous savez comment créer des classes d’habillage, procédez de l’une des manières suivantes : Supprimez le code de style ActionScript ou ne créez pas de copie d’une classe existante. Si vous ne créez pas de copie d’une classe existante, Flash Builder génère un fichier de classe Skin vide comportant des commentaires pour vous guider. Les étapes restantes de cette procédure supposent que vous avez suivi l’option recommandée pour la génération d’une classe d’habillage. Pour plus d’informations, voir « Génération et modification d’habillages pour les composants Spark » à la page 203. 3 Cliquez sur Terminer. Flash Builder génère un fichier de classe Skin et l’ouvre en mode Création dans l’éditeur
4 Vous êtes invité à appliquer le nouvel habillage à tous les éléments de formulaire. Lorsque vous procédez ainsi, un
Par exemple, si vous appliquez l’habillage SkinnableContainerSkin à tous les éléments de formulaire, un code ressemblant au suivant est généré :
éléments de formulaire. Toutefois, si vous choisissez de ne pas suivre cette recommandation,
Pour définir une classe d’habillage, procédez comme suit : 1 En mode Création de l’éditeur, sélectionnez l’élément de formulaire.
Les exemples ci-dessous vous expliquent comment créer des habillages MXML personnalisés pour les formulaires Spark. Ils se basent sur un projet Flex utilisant le thème Spark par défaut. Création d’un habillage MXML personnalisé pour un formulaire à partir d’un modèle (mode Création) Pour créer un habillage MXML personnalisé pour le formulaire, vous pouvez ouvrir la boîte de dialogue de création d’un habillage MXML de l’une des façons suivantes. En mode Création de l’éditeur, sélectionnez le formulaire, puis procédez de l’une des façons suivantes :
• Dans la section Style de la vue des propriétés, sélectionnez l’icône qui se trouve en regard du champ Habillage, puis choisissez Créer un habillage.
• Dans le menu Création, sélectionnez Créer un habillage. Les étapes restantes de cette procédure sont identiques à celles permettant de créer un habillage pour les éléments de formulaire. Pour plus d’informations, voir « Création d’un habillage MXML personnalisé pour les éléments de formulaire à partir d’un modèle (mode Création) » à la page 184. Définition d’un habillage unique pour tous les éléments de formulaire d’un formulaire (mode Création) Pour définir une seule classe d’habillage pour tous les éléments d’un formulaire, définissez l’habillage FormItem dans le formulaire. Pour ce faire : 1 En mode Création de l’éditeur, sélectionnez le formulaire. 2 Dans la section Commun de la vue des propriétés, sélectionnez un habillage FormItem.
<fx:Style> @namespace s "library://ns.adobe.com/flex/spark"; s|Form#form1 s|FormItem Pour plus d’informations sur la définition de données de graphique, la mise en forme d’éléments de graphique et la manipulation d’autres aspects des graphiques, voir Introduction aux graphiques. Ajout d’un composant de représentation graphique 1 En mode Création de l’éditeur MXML, faites glisser un composant de représentation graphique de la vue Composants vers la zone de création. 2 Saisissez un ID pour le graphique. 3 Pour afficher plusieurs séries de données dans le graphique, cliquez sur le bouton Ajouter et saisissez le nom de la
Par exemple, le contrôle ColumnChart contient deux séries de données. La barre sur la gauche représente le bénéfice brut sur six mois, et la suivante, le bénéfice net pour la même période.
4 (Facultatif) Sélectionnez l’option Inclure une légende.
5 Cliquez sur OK pour insérer le graphique.
Les thèmes permettent de personnaliser l’aspect de vos applications. Flash Builder offre un choix de plusieurs thèmes. Vous pouvez également importer d’autres thèmes ou créer les vôtres. Flash Builder comporte des thèmes Spark et Halo. Le thème par défaut pour les composants Flex 4.6 et 4 est Spark. et celui des composants Flex 3 est Halo. Pour plus d’informations sur la prise en charge des thèmes dans Flex, voir About themes.
1 Ouvrez la boîte de dialogue Sélectionner le thème du projet à partir de la vue Création ou de la vue Source de
Importation de thèmes Flash Builder vous permet d’importer des thèmes. Les fichiers correspondant à un thème doivent être inclus dans un dossier. Tous les fichiers requis pour un thème Flex doivent être présents. Le nom du thème est déterminé par l’élément de nom du fichier metadata.xml situé dans le dossier des thèmes. Si l’élément de nom n’est pas précisé ou si metadata.xml est absent, le thème prend le nom du dossier des thèmes. Pour plus d’informations sur le format requis pour les thèmes Flex, voir « Création de thèmes » à la page 189. Les thèmes de Flash Builder peuvent prendre les formats suivants :
Le fichier CSS ou SWC doit se trouver dans un dossier contenant tous les fichiers requis pour un thème Flex. Lorsque vous importez un thème à l’aide de Flash Builder, vous sélectionnez le fichier CSS ou SWC correspondant à ce thème.
Pour plus d’informations sur l’assemblage de thèmes dans un fichier MXP, voir « Création d’un fichier d’extension (fichier MXP) pour un thème Flex » à la page 190. Importation de thèmes Flex à l’aide de Flash Builder 1 Ouvrez la boîte de dialogue Sélectionner le thème du projet à partir de la vue Création ou de la vue Source de
1 Si vous ne l’avez pas encore fait, importez Adobe Flash® Builder™ 4.6 dans Adobe Extension Manager CS5 : Dans Adobe Extension Manager, sélectionnez Fichier > Importer produit. 2 Dans Adobe Extension Manager, sélectionnez Flash Builder 4.6. 3 Sélectionnez Fichier > Installer l’extension, accédez au fichier MXP correspondant au thème, puis cliquez sur
Vous pouvez télécharger des thèmes que vous pourrez ensuite importer dans Flash Builder. Téléchargement de thèmes Flex 1 Ouvrez la boîte de dialogue Sélectionner le thème du projet à partir de la vue Création ou de la vue Source de l’éditeur MXML :
• (Vue Source) Dans la barre de menus de Flash Builder, sélectionnez Projet > Propriétés > Thème Flex. 2 Sélectionnez Découvrir d’autres thèmes. Une fois le thème téléchargé, vous pouvez l’importer, comme décrit dans « Importation de thèmes » à la page 188.
Vous pouvez créer vos propres thèmes et les importer dans Flash Builder. Un thème Flex contient généralement les fichiers suivants :
Les fichiers composant le thème peuvent varier, mais ils doivent comprendre un fichier SWC ou CSS.
Il s’agit du fichier image d’aperçu pour le thème. Si le dossier de thème ne contient pas preview.jpg, Flash Builder fait appel à une image d’aperçu par défaut pour le thème.
Fichier metadata.xml Le tableau suivant répertorie les éléments pouvant être inclus dans le fichier metadata.xml. Nom d’élément
MXI), qu’Extension Manager utilise pour créer le fichier MXP. Pour plus d’informations sur le format d’un fichier MXI, reportez-vous au document Format du fichier d’extension. Lors de la création du fichier MXI, vous devez préciser un chemin de destination pour chacun des fichiers du thème. Les chemins sont au format suivant :
2 Dans Extension Manager, sélectionnez Fichier > Empaqueter l’extension. 3 Accédez au fichier d’installation d’extension souhaité et sélectionnez-le. 4 Recherchez un emplacement pour le fichier de package et nommez-le avec l’extension .mxp.
Vous pouvez définir plusieurs fichiers de thèmes pour une application. En l’absence de chevauchement de styles, les deux thèmes sont appliqués dans leur intégralité. D’autres aspects doivent également être pris en considération lors de l’ajout de thèmes. L’un d’eux est l’ordre des fichiers de thèmes. Pour ajouter des thèmes, utilisez le compilateur de ligne de commande mxmlc avec l’option de compilateur theme afin de spécifier le chemin d’accès aux fichiers de thèmes. Using themes fournit des informations sur la définition des arguments du compilateur et sur l’ordre des fichiers de thèmes.
Les styles modifient l’aspect de l’application par la définition de valeurs pour les paramètres visuels des composants. Vous pouvez définir des styles s’appliquant à tous les composants d’une application, à des composants individuels ou à des groupes de composants référencés par un sélecteur de style. Vous pouvez par exemple définir les styles suivants :
Famille, taille, couleur et épaisseur de la police ainsi que d’autres paramètres d’affichage (gras, italique et souligné, par exemple).
CSS. Le code CSS peut être placé à l’intérieur de balises <fx:Style> dans une application ou dans un fichier CSS distinct.
Vous pouvez également convertir en styles les habillages appliqués à un composant. Accédez au mode Création de l’éditeur MXML pour appliquer des styles à une application ou à des composants spécifiques d’une application. Le mode Création vous permet en outre de convertir les styles ou les habillages appliqués en feuilles de style CSS.
L’application d’un habillage consiste à changer l’aspect d’un composant par la modification ou le remplacement de ses éléments visuels. Ces éléments peuvent être composés d’images bitmap, de fichiers SWF ou de fichiers de classe qui contiennent des méthodes de dessin qui définissent des images vectorielles. Les habillages peuvent définir l’aspect d’un composant dans divers états. Vous pouvez par exemple définir l’aspect des états up, down, over et disabled d’un composant Button. Flash Builder vous permet de convertir l’habillage d’un composant en styles CSS.
Accédez à la vue Aspect pour définir les styles valables pour l’ensemble de l’application. Flash Builder enregistre le style défini dans cette vue en tant que sélecteur de style CSS global. 1 En mode Création de l’éditeur MXML, ouvrez un fichier d’application MXML contenant plusieurs composants. 2 Dans la vue Aspect, spécifiez des styles globaux pour l’application.
Builder > Aspect. Une fois les styles appliqués, Flash Builder crée un sélecteur de style CSS global pour le style spécifié. Si ce style est le premier référencé dans l’application, Flash Builder génère un nouveau fichier CSS et le référence dans le fichier de l’application MXML. Si l’application référence déjà un fichier CSS ou un bloc <fx:Style>, Flash Builder met à jour le fichier CSS avec le sélecteur de style global.
Vous pouvez définir des styles intralignes pour les composants dans la vue Propriétés. 1 En mode Création de l’éditeur MXML, ouvrez une application MXML contenant plusieurs composants. 2 Sélectionnez un composant et spécifiez les valeurs des propriétés de style dans la zone Style de la vue Propriétés.
Remarque : dans Flex, les noms de style composés peuvent être orthographiés à la manière des identifiants ActionScript (fontFamily, par exemple) ou des styles HTML (font-family, par exemple). 4 Une fois un style spécifié, basculez en mode Source pour afficher le code intraligne généré qui applique le style.
Vous pouvez intégrer des styles CSS dans un fichier d’application MXML ou référencer un fichier CSS externe. L’exemple suivant illustre du code CSS appliquant des styles à tous les composants Spark Button d’une application. Ce code génère également le sélecteurmyStyle qui peut être appliqué à n’importe quel composant :
Flex définit un cadre précis pour la création et l’application de styles. Pour plus d’informations, voir Using styles in Flex. Application de styles à une application 1 En mode Création de l’éditeur MXML, créez un fichier d’application MXML contenant plusieurs composants Spark Button et un composant CheckBox. 2 (Styles intégrés) En mode Source, ajoutez le code suivant à l’application : <fx:Style> @namespace s "library://ns.adobe.com/flex/spark"; @namespace mx "library://ns.adobe.com/flex/halo"; s|Button { fontSize: 16pt; color: Red } /* type selector */ 1 En mode Création de l’éditeur MXML, sélectionnez un composant dans la zone de création. Utilisez les styles
Pour plus d’informations sur la spécification d’une propriété skinClass pour un composant, voir « Génération et modification d’habillages pour les composants Spark » à la page 203. 2 Dans la vue Propriétés, cliquez sur Convertir en CSS. 3 Si l’espace de travail contient plusieurs projets ouverts, sélectionnez/désélectionnez les fichiers de ressources à
4 Dans la boîte de dialogue Nouvelle règle de style, sélectionnez le fichier .css ou cliquez sur Nouveau pour en générer un.
Le style est global et est appliqué à tous les composants de l’application.
Les composants spécifient ce sélecteur de style en utilisant l’attribut styleName. Si vous choisissez cette option, spécifiez un nom pour le sélecteur.
Le style ne s’applique qu’au composant sélectionné.
Il supprime les références au style intraligne ou à la propriété skinClass pour le composant.
Lorsque des styles CSS externes sont déjà appliqués à un composant, vous pouvez passer rapidement du composant à l’édition de ces styles. 1 Sélectionnez un composant. 2
Le fichier CSS s’ouvre en mode Création dans l’éditeur CSS. La vue Propriétés vous permet d’apporter des modifications supplémentaires. Vous pouvez également modifier le fichier CSS en mode Source.
Par défaut, Flash Builder ajoute les espaces de noms par défaut pour les styles Spark et MX. Pour créer un fichier CSS vide : 1 Dans le menu Flash Builder, sélectionnez Fichier > Nouveau > Fichier CSS. 2 Spécifiez un dossier source.
3 Spécifiez un package pour le fichier.
4 Spécifiez un nom pour le fichier. 5 Cliquez sur Terminer.
A la création d’une feuille de style, Flash Builder fournit les déclarations suivantes pour les espaces de noms Spark et MX : @namespace s "library://ns.adobe.com/flex/spark"; @namespace mx "library://ns.adobe.com/flex/mx";
Adobe® Flash® Builder™ permet de créer des applications dont l’apparence varie selon les tâches exécutées par l’utilisateur. Par exemple, l’état de base de l’application peut représenter la page d’accueil et inclure un logo, une barre latérale et un message de bienvenue. Lorsque l’utilisateur clique sur un bouton de la barre latérale, l’apparence (l’état) de l’application change de façon dynamique et la zone de contenu principale est remplacée par un formulaire de bon de commande sans modifier la position du logo et de la barre latérale. Flex vous permet d’appliquer cette interaction aux états d’affichage et aux transitions. Un état d’affichage représente l’un des différents affichages que vous définissez pour une application ou un composant personnalisé. Une transition consiste en un ou plusieurs effets regroupés pour être lancés lorsqu’un état d’affichage est modifié. Une transition vise à améliorer le changement visuel d’un état à un autre.
Un état d’affichage représente l’une des différentes mises en forme que vous définissez pour une application ou un composant MXML unique. Vous créez une application ou un composant qui passe d’un affichage à un autre en fonction des actions de l’utilisateur. Vous pouvez utiliser les états d’affichage pour créer une interface que l’utilisateur peut personnaliser ou qui présente progressivement davantage d’informations au fur et à mesure que l’utilisateur exécute des tâches spécifiques. Chaque application ou composant défini dans un fichier MXML affiche toujours au moins un état, l’état de base, représenté par la présentation par défaut du fichier. Vous pouvez utiliser un état de base en tant que référentiel de contenu, par exemple pour les barres de navigation ou les logos partagés par toutes les vues dans une application ou un composant afin d’assurer la cohérence de l’affichage. Vous créez un état d’affichage en modifiant la présentation d’un état existant ou en créant une nouvelle présentation. Les modifications pouvant être apportées à un état existant sont l’édition, le déplacement, l’ajout ou la suppression de composants. La nouvelle présentation correspond à ce que l’utilisateur voit lorsqu’il change d’état. Pour obtenir une présentation conceptuelle complète des états d’affichage, y compris des exemples, voir View states.
Une transition représente un ou plusieurs effets visuels appliqués de façon séquentielle ou simultanée lors du changement d’un état d’affichage. Par exemple, vous souhaitez redimensionner un composant pour inclure un nouveau composant lorsque l’application passe d’un état à un autre. Vous pouvez définir une transition qui réduit progressivement le premier composant tandis qu’un nouveau composant apparaît petit à petit à l’écran.
Flash Builder prend en charge les états d’affichage implémentés dans Flex 3. Pour les projets basés sur le SDK Flex 3, l’éditeur MXML rétablit l’implémentation Flex Builder 3 pour ses deux modes (Création et Source). Pour plus d’informations sur la modification des états pour le SDK Flex 3, voir la documentation de Flex Builder 3.
Par défaut, une application comporte un seul état d’affichage, que vous utilisez généralement comme état de base. Utilisez la vue Etats de Flash Builder pour ajouter des états supplémentaires et modifier la présentation et les composants de chaque état. 1 A l’aide des outils de présentation de Flash Builder, créez la présentation de l’état de base de l’application ou du
Pour plus d’informations, voir « Création d’interfaces utilisateur » à la page 182. 2 Dans la vue Etats (Fenêtre > Affichage d’une vue > Flash Builder > Etats), cliquez sur le bouton Nouvel état de la
3 Entrez le nom du nouvel état. 4 Indiquez si vous voulez créer une copie d’un état existant ou si vous préférez créer un nouvel état vide. Cliquez sur OK. 5 Utilisez les outils de présentation de Flash Builder pour modifier l’apparence de l’état.
6 Définissez un gestionnaire d’événement permettant à l’utilisateur d’afficher le nouvel état.
1 Dans la vue Etats (Fenêtre > Etats), cliquez deux fois sur l’état d’affichage que vous voulez utiliser au démarrage. 2 Dans la boîte de dialogue Modifier les propriétés de l’état qui apparaît, sélectionnez l’option Définir comme état de
Si l’application comporte plusieurs états, vous pouvez définir l’état d’affichage d’un seul composant. 1 Dans la vue Création de l’éditeur MXML, sélectionnez un composant de la présentation. 2 Dans la vue Propriétés, utilisez le champ Etats pour sélectionner les états dans lesquels le composant est visible.
Lors de l’exécution de l’application, les utilisateurs doivent passer d’un état d’affichage à un autre. Vous pouvez définir les gestionnaires d’événement pour les commandes utilisateur afin de permettre aux utilisateurs de changer d’état au moment de l’exécution. La méthode la plus simple consiste à affecter la propriété currentState à l’événement de clic d’un contrôle tel qu’un bouton ou un lien. La propriété currentState sélectionne le nom de l’état d’affichage que vous souhaitez consulter lorsque l’événement de clic se produit. Dans le code, spécifiez la propriété currentState de la façon suivante : click="currentState='viewstatename'"
1 Vérifiez que l’état initial comporte un contrôle cliquable, par exemple un contrôle de type Button.
2 Pour passer à l’état de base, saisissez : currentState='' '' est une chaîne vide représentée par deux guillemets simples.
Vous pouvez définir une transition afin que le changement d’état soit visuellement plus fluide. Pour plus d’informations, voir « Création d’une transition » à la page 201.
Le mode Création de l’éditeur MXML ne permet pas de modifier les groupes d’états. Basculez en mode Source pour créer et modifier des groupes d’états. Le mode Source facilite la création et l’édition de groupes d’états à travers les conseils de code et la liste déroulante Afficher état. Si vous créez un groupe d’états d’affichage, utilisez la vue Création avec prudence. La suppression d’un état dans la vue Création peut conduire par inadvertance au maintien d’une référence à un composant supprimé dans un groupe d’états.
Vous pouvez supprimer les états d’affichage d’une application dans la vue Création de l’éditeur MXML. Les groupes d’états créés devront toutefois être supprimés dans la vue Source. Vous évitez ainsi de laisser par inadvertance une référence à un composant dans un état supprimé. 1 Dans la vue Création de l’éditeur MXML, sélectionnez l’état d’affichage que vous voulez supprimer de la vue Etats
2 Cliquez sur le bouton Supprimer l’état dans la barre d’outils de la vue Etats.
Si l’application comporte plusieurs états, le mode Création de l’éditeur MXML vous permet de changer de vue pour chaque état, en affichant uniquement les composants définis pour un état spécifique. Vous pouvez spécifier l’état dans lequel chaque composant est visible. Modification du composant d’un état spécifique 1 Dans la vue Création de l’éditeur de source, utilisez la vue Etats pour ajouter un ou plusieurs états supplémentaires à une application. 2 Utilisez la liste déroulante Etat pour modifier la vue en choisissant l’état sélectionné. 3 Ajoutez, déplacez, supprimez ou modifiez les composants de l’état.
Spécification de l’affichage d’un composant dans plusieurs états 1 Dans la vue Création de l’éditeur de source, utilisez la vue Etats pour ajouter un ou plusieurs états supplémentaires à une application. 2 Sélectionnez chaque composant d’un état. 3 Dans la vue Propriétés, sélectionnez les états dans lesquels le composant apparaît.
Un composant, pour lequel un état particulier a été défini, ne s’affichera pas dans l’éditeur lorsqu’un état autre que celui qui lui a été attribué est sélectionné.
Le mode Source de l’éditeur MXML comporte plusieurs fonctions pour la modification du code source des états d’affichage. Pour toute application déclarant des états d’affichage, l’éditeur MXML comporte la liste déroulante Afficher état. Lorsque vous sélectionnez un état d’affichage dans la liste Afficher état, la mise en évidence dans l’éditeur des composants qui ne figurent pas dans cet état est atténuée. Les propriétés includeIn et excludeFrom des composants MXML spécifient l’état d’affichage ou le groupe d’états dans lequel un composant s’affiche. Les conseils de code de l’éditeur MXML facilitent la sélection d’un état d’affichage ou d’un groupe d’états pour ces propriétés. Vous pouvez également utiliser la notation à points pour les attributs de composants. Elle vous permet de spécifier l’état d’affichage dans lequel l’attribut est appliqué. Pour afficher par exemple un composant Button dans deux états d’affichage et obtenir la modification de l’étiquette en fonction de l’état, associez l’opérateur point à la propriété label. Les conseils de code de l’éditeur MXML facilitent la sélection de l’état d’affichage. Par exemple : <s:Button label.State1="Button in State 1" label.State2="Same Button in State 2">
1 Créez une application contenant plus d’un état d’affichage. En mode Source de l’éditeur MXML, ajoutez le code suivant après la balise <s:Application>. <s:states> <s:State name="State1" /> <s:State name="State2" /> L’éditeur affiche en gris clair le code des composants qui ne sont pas visibles dans l’état sélectionné.
5 Exécutez l’application. Cliquez sur le bouton supérieur pour faire défiler les états d’affichage.
Lorsque vous modifiez les états d’affichage d’une application, les composants semblent sauter d’un état d’affichage à un autre. Vous pouvez adoucir cet effet en ajoutant des transitions. Une transition consiste en un ou plusieurs effets regroupés pour être lancés lorsqu’un état d’affichage est modifié. Par exemple, vous pouvez définir une transition utilisant un effet Resize de redimensionnement afin de réduire progressivement un composant dans l’état d’affichage d’origine et un effet Fade de fondu pour afficher progressivement un composant dans le nouvel état d’affichage. 1 Assurez-vous de créer au moins un état d’affichage en plus de l’état de base. 2 Dans la vue Source de l’éditeur MXML, définissez un objet Transition en ajoutant une balise <s:transitions>,
<s:transitions> après le lancement de l’application.
Un effet est la modification visible ou audible du composant cible se produisant sur une période exprimée en millisecondes. Le fondu, le redimensionnement ou le déplacement d’un composant constituent des exemples d’effets. Les effets sont générés en réponse à un événement, alors que l’événement est souvent déclenché par une action de l’utilisateur, par exemple un clic sur un bouton. Les effets peuvent toutefois être programmés ou déclenchés en réponse à des événements qui ne sont pas déclenchés par l’utilisateur. Vous pouvez par exemple créer un effet faisant rebondir légèrement un composant TextInput auquel l’utilisateur accède par tabulation. Vous pouvez également appliquer un effet de fondu en sortie à un composant Label sur lequel l’utilisateur fait glisser le curseur de la souris. Dans Flash Builder, les effets peuvent être définis en tant que propriétés des composants MXML. Accédez à la vue Source de l’éditeur MXML pour implémenter l’effet. L’implémentation des effets varie suivant qu’il s’agit de composants Spark ou MX. Pour plus d’informations sur la création d’effets en code MXML et ActionScript, voir Introduction to effects.
Vous définissez les effets généralement en mode Source de l’éditeur MXML. Ils sont souvent invoqués à partir du gestionnaire d’événement d’un composant. Vous pouvez par exemple utiliser le gestionnaire d’événement click pour qu’un composant Button invoque un effet. Voir Applying effects. Dans Flash Builder cependant, vous pouvez définir un effet pour une propriété d’un composant MXML. 1 Accédez au mode Création de l’éditeur MXML, puis cliquez sur un composant dans la zone de création. 2 Définissez la propriété d’effet pour les composants Spark : a Dans la vue Propriétés, sélectionnez l’icône Vue par catégories. b Dans la catégorie Effets, sélectionnez une propriété et spécifiez un effet.
3 Enregistrez le fichier et exécutez-le pour visionner l’effet.
Les habillages Spark contrôlent tous les éléments visuels d’un composant, dont sa présentation. Ils peuvent contenir plusieurs éléments, tels que des éléments graphiques, du texte, des images et des transitions. Les habillages Spark prennent en charge les états. Vous pouvez utiliser un habillage pour définir l’aspect d’un composant pour chacun de ses états. Les habillages spécifient généralement une taille minimale pour le composant. Pour plus d’informations sur l’impémentation d’habillages Spark dans Flex, voir A propos des habillages Spark. Flash Builder vous permet de générer et de modifier des habillages pour les composants Spark. En générant un habillage, Flash Builder crée une classe d’habillage en MXML. Accédez à l’éditeur MXML pour modifier l’aspect défini par l’habillage. Certaines modifications peuvent être effectuées en mode Création ; d’autres nécessiteront le passage en mode Source. Voir « Génération et modification d’habillages pour les composants Spark » à la page 203.
Flash Builder vous permet d’importer des illustrations d’habillage pour des composants MX. Voir « Importation d’illustrations d’habillage pour les composants MX » à la page 207. Le package mx.skins.spark définit les habillages Spark pour les composants MX.
Flash Builder vous permet de générer et de modifier des habillages pour les composants Spark. Lorsque vous générez un habillage, Flash Builder utilise un habillage du thème pour un projet. Le thème par défaut d’un projet est Spark. Vous pouvez modifier le thème d’un projet dans la vue Aspect. Voir « Application des thèmes » à la page 187. Lors de la génération d’un habillage pour un composant, Flash Builder crée un fichier MXML qui implémente la classe Skin pour le composant. Vous pouvez spécifier si vous souhaitez générer la classe Skin en tant que copie d’un habillage existant ou générer un fichier de classe Skin vide. Accédez aux modes Création et Source de l’éditeur MXML pour modifier l’habillage. En mode Création, sélectionnez les éléments d’habillage à modifier dans la vue Structure. Parcourez les états d’un composant dans la vue Etats. Certaines parties d’un habillage ne sont pas modifiables en mode Création. Utilisez le mode Source pour modifier des parties d’habillage qui ne sont pas disponibles en mode Création. Certains composants contiennent des sous-composants. Par exemple, un composant HSlider contient des composants Button qui définissent le curseur et le rail de HSlider. Les sous-composants sont habillables uniquement en mode Source. Etats des composants, parties d’habillage et composants hôte Les habillages définissent l’aspect de chaque état d’un composant. Un bouton Spark possède par exemple quatre états : up, over, down et disabled. La génération d’un habillage pour un bouton Spark permet de spécifier l’aspect de chacun de ces états.
Button, vous pouvez choisir la couleur de remplissage, les attributs de texte de l’étiquette et les composants Rect formant la bordure du composant. Lors de la création d’habillages pour un composant, Flash Builder permet de spécifier un composant hôte sur lequel l’habillage généré est basé. Par défaut, le composant hôte est la classe de base du composant auquel l’habillage est appliqué. Cependant, vous pouvez sélectionner un composant hôte différent. Remarque : la spécification d’un composant hôte pour une classe d’habillage est requise lors de la génération de classes d’habillage à l’aide de Flash Builder. Cependant, la création de classes d’habillage directement dans le code source ne nécessite pas de composant hôte. Contrat d’habillage entre un habillage et son composant hôte Le contrat d’habillage entre une classe d’habillage et une classe de composants définit les règles à suivre par chaque membre afin de pouvoir communiquer entre eux. La classe d’habillage doit déclarer des états d’habillage et définir l’apparence des parties d’habillage. De plus, les classes d’habillage spécifient habituellement le composant hôte et, parfois, effectuent une liaison aux données définies sur le composant hôte. La classe de composants déclare la classe d’habillage qu’elle utilise. Elle doit également identifier des états d’habillage et des parties d’habillage à l’aide de métadonnées. Si la classe d’habillage établit une liaison aux données du composant hôte, ce dernier doit définir ces données. Le tableau suivant détaille les règles du contrat d’habillage. Classe d’habillage
1 En mode Création de l’éditeur MXML, sélectionnez un composant Spark dans la zone de création. 2 Dans le menu contextuel du composant, sélectionnez Ouvrir une déclaration d’habillage.
S’il s’agit d’une classe que vous avez créée, vous pouvez modifier le fichier.
Cet exemple illustre la génération d’une classe d’habillage pour un composant Spark Button, puis sa modification en faisant appel à différentes vues de Flash Builder. Il se base sur un projet Flex utilisant le thème Spark par défaut. 1 Créez un fichier d’application. En mode Création de l’éditeur, ajoutez un composant Spark Button. 2 Dans le menu contextuel du composant Button, sélectionnez Créer un habillage.
Vous pouvez également procéder comme suit pour accéder à cette boîte de dialogue :
3 Dans la boîte de dialogue de création d’un habillage MXML, spécifiez les éléments suivants :
• Nom Nom de la classe Skin créée.
Pour modifier le composant par défaut, cliquez sur Parcourir et sélectionnez un composant hôte.
Si vous êtes novice en matière d’habillage, utilisez une copie pour vous lancer dans la création d’une classe Skin. Modifiez le code de style ActionScript.
Supprimez le code de style ActionScript ou ne créez pas de copie d’une classe existante. Si vous ne créez pas de copie d’une classe existante, Flash Builder génère un fichier de classe d’habillage vide comportant des commentaires pour vous guider. Les étapes restantes de cette procédure supposent que vous avez suivi l’option recommandée pour la génération d’une classe Skin. 4 Cliquez sur Terminer.
Le composant Button est sélectionné. L’état Up du composant Button est sélectionné dans la vue Etats. 5 Pour chaque état du composant Button, modifiez les styles Texte, Arrière-plan du contenu et Couleur.
6 Ouvrez la vue Structure.
7 Dans la vue Structure, sélectionnez Rect shadow pour définir les styles de l’ombre du composant Button.
8 Passez en mode Source de l’éditeur.
9 Enregistrez le fichier de classe Skin et le fichier d’application.
Notez que le fichier d’application a ajouté une référence à la classe Skin que vous avez créée. 10 Exécutez l’application pour voir comment l’habillage change en fonction des états Up, Over et Down du composant
Création et modification d’habillages pour les composants Spark (mode Source) Vous pouvez ouvrir la boîte de dialogue de création d’un habillage MXML directement en mode Source de l’éditeur. Par exemple, pour créer une classe skinClass pour un composant Spark Button, procédez comme suit. 1 En mode Source de l’éditeur, placez votre curseur dans une balise <s:Button> et saisissez ce qui suit : <s:Button skinClass="
2 Avec Create Skin en surbrillance dans les conseils de code, la touche Entrée ouvre la boîte de dialogue de création
Cette boîte de dialogue est identique à celle qui s’ouvre en mode Création. Pour créer une classe skinClass, voir les instructions dans « Génération et modification d’un habillage pour un composant Spark Button (mode Création) » à la page 205. 3 Cliquez sur Terminer.
4 Modifiez la classe skinClass.
Remarque : vous pouvez convertir la classe d’habillage générée au format CSS pour afficher les styles appliqués. Voir « Conversion d’un habillage en style CSS » à la page 206. Conversion d’un habillage en style CSS Flash Builder vous permet de convertir l’habillage d’un composant en style CSS. L’avantage d’une telle conversion réside dans la possibilité d’utiliser le style en tant que sélecteur de type pour tous les composants de cette classe. Sinon, définissez la propriété skinClass pour chaque composant. La procédure suivante illustre la conversion de l’habillage d’un composant Spark Button en style CSS. 1 Générez et éditez l’habillage d’un composant Button. 2 En mode Création, sélectionnez le composant. Dans la zone Style de la vue Propriétés, cliquez sur Convertir en CSS.
En l’absence de fichier CSS dans le projet que vous souhaitez utiliser, cliquez sur Nouveau pour en créer un. 4 Spécifiez le Type de sélecteur en sélectionnant l’une des options suivantes :
Le style est appliqué à tous les composants de l’application.
Les composants spécifient ce sélecteur de style d’après son nom. Si vous choisissez cette option, spécifiez un nom pour le sélecteur de type.
Le style ne s’applique qu’au composant sélectionné.
Il supprime les références à la propriété skinClass pour le composant.
Remarque : Adobe propose un ensemble de modèles d’habillage destinés à faciliter la création d’habillages pour les composants Flex intégrés. Ces modèles, utilisés avec Flash, Fireworks, Illustrator ou Photoshop, permettent de créer l’illustration. Grâce à Flash, vous pouvez aussi créer des composants Flex personnalisés totalement fonctionnels. Pour plus d’informations, voir les articles sous Importation de ressources Flash Professional dans Flex. 1 Sélectionnez Fichier > Importer > Flash Builder > Illustrations d’habillage. 2 Dans la boîte de dialogue Importation d’illustrations d’habillage :
• Les fichiers de graphiques vectoriels créés dans Adobe Illustrator® et exportés en tant que fichiers SWF pour Flash Player 8
• Sélectionnez un dossier dans lequel importer les habillages. Il doit s’agir du dossier source d’un projet Flex (vous pouvez également indiquer un sous-dossier du dossier source). Le dossier du projet Flex ouvert est sélectionné par défaut.
• Cochez la case Supprimer toutes les règles existantes dans le fichier si vous voulez que le fichier CSS spécifié soit remplacé lors de l’importation (plutôt que d’importer les habillages et de conserver d’autres définitions existantes dans le fichier CSS). Par défaut, la case est désélectionnée. Si le fichier CSS n’existe pas, elle est désactivée.
Navigateur Flex ou dans la vue d’éditeur active, ou le fichier de l’application principale du projet.
3 Dans la boîte de dialogue Importation d’illustrations d’habillage suivante, sélectionnez les habillages à importer et
• Button_glow_downSkin (correspond à la propriété downSkin de la règle de style Button.glow) • TabBar-tab_upSkin (la propriété upSkin correspond à la propriété tabStyleName de la règle de style TabBar) • MyCustomComponent_borderSkin Pour les composants personnalisés, l’élément est coché si le composant a été défini dans le projet vers lequel vous effectuez l’importation.
• Cliquez sur Terminer. Un fichier CSS est créé et affiché dans la vue Source. Le fichier CSS est joint à l’application spécifiée dans l’assistant. Si vous importez un fichier SWC, il est ajouté automatiquement au chemin d’accès à la bibliothèque du projet.
Vous pouvez générer des rendus d’élément destinés à des contrôles basés sur une liste pour des applications d’ordinateur et mobiles. Pour les applications d’ordinateur, vous pouvez générer des rendus d’élément personnalisés destinés à des contrôles basés sur une liste Spark, tels que List et ComboBox. Vous pouvez également utiliser les rendus d’élément Spark avec certains contrôles MX, tels que MX DataGrid et MX Tree. Pour les applications mobiles, vous pouvez générer des rendus d’élément personnalisés destinés à des contrôles basés sur une liste mobile. Utilisez des rendus d’élément personnalisés pour contrôler l’affichage d’un élément de données dans un conteneur DataGroup, SkinnableDataContainer ou dans une sous-classe de ces conteneurs. L’aspect défini par un rendu d’élément peut inclure la police, la couleur d’arrière-plan, la bordure et tout autre aspect visuel de l’élément de données. Un rendu d’élément peut également définir l’aspect d’un élément de données au moment où l’utilisateur interagit avec celui-ci. Par exemple, le rendu d’élément peut afficher l’élément de données d’une certaine manière lorsque l’utilisateur déplace la souris sur ce dernier. Il l’affiche différemment lorsque l’utilisateur clique sur l’élément de données.
Utilisez ce modèle pour créer un rendu d’élément personnalisé destiné à des contrôles basés sur une liste en indiquant le libellé, le message et les propriétés de l’icône. Le fichier de rendu d’élément est créé au format MXML. Pour plus d’informations, voir « Génération et modification d’un rendu d’élément pour des composants mobiles (mode Création) » à la page 210.
Utilisez ce modèle pour créer un rendu d’élément standard destiné à des contrôles basés sur une liste. Vous pouvez ensuite personnaliser le rendu d’élément afin de définir l’aspect de la liste, le cas échéant. Le fichier de rendu d’élément est créé au format ActionScript. Vous pouvez ouvrir l’assistant de création d’un rendu d’élément en mode Création et en mode Source de l’éditeur MXML. Dans l’assistant de création d’un rendu d’élément, spécifiez un nom et un modèle pour le rendu d’élément. Flash Builder génère un fichier MXML ou ActionScript qui implémente le rendu d’élément. Les composants de l’application référencent le rendu d’élément généré à l’aide de la propriété itemRenderer. Pour plus d’informations sur la création et l’utilisation des rendus d’élément, voir Custom Spark Item Renderers. Apprenez-en davantage sur la création de rendus d’élément Spark en lisant l’article de Balaji Sridhar, ingénieur Adobe Flash Builder.
Création) Cet exemple génère un rendu d’élément pour un composant MX Tree et illustre comment combiner des vues Flash Builder pour le modifier. Il se base sur un projet Flex utilisant le thème Spark par défaut. 1 Créez un fichier d’application. En mode Création de l’éditeur, ajoutez un composant MX Tree à l’application.
2 Dans le menu contextuel du composant Tree, sélectionnez Créer un rendu d’élément.
Pour ouvrir cette boîte de dialogue, vous pouvez également procéder comme suit.
Dernière mise à jour le 9/12/2011
4 Cliquez sur Terminer.
Le composant ItemRenderer est sélectionné. L’état normal du composant Tree est sélectionné dans la vue Etats. 5 Modifiez l’aspect de chaque état du composant Tree dans la classe ItemRenderer générée. a Ouvrez la vue Structure.
Dans la section Style de la vue Propriétés, modifiez l’aspect des éléments d’arborescence. b Dans la vue Structure, sélectionnez d’autres composants de MXTreeItemRenderer pour en modifier l’aspect.
S’ils ne sont pas disponibles, utilisez le mode Source de l’éditeur pour définir l’aspect. Lorsque vous passez en mode Source, la source du composant sélectionné dans la vue Structure est mise en évidence. 6 Exécutez l’application pour découvrir comment la classe ItemRenderer modifie l’aspect du composant Tree.
Création) Cet exemple vise à générer un rendu d’élément basé sur une liste pour des composants mobiles. Il se base sur un projet Flex Mobile utilisant le thème Spark par défaut. 1 Créez un fichier d’application mobile. En mode Création de l’éditeur, ajoutez des composants à l’application. 2 Dans le menu contextuel du fichier d’application mobile, sélectionnez Nouveau > Rendu d’élément. Vous pouvez
La boîte de dialogue de création d’un rendu d’élément s’ouvre. 3 Dans la boîte de dialogue de création d’un rendu d’élément, spécifiez ce qui suit :
• Nom Nom de la classe de rendu d’élément créée.
Sélectionnez le modèle de liste des rendus d’éléments d’icône pour mobile.
Nom du champ dans les données que vous souhaitez définir comme libellé.
Nom du champ dans les données que vous souhaitez définir comme contenu du message.
Largeur de l’icône. La valeur par défaut est 64 pixels.
Hauteur de l’icône. La valeur par défaut est 64 pixels.
Sélectionnez une image au format GIF, JPEG ou PNG. L’image sélectionnée est intégrée à l’application. Par exemple, decoratorClass="@Embed('/foo/myfoo.png')" Vous pouvez également sélectionner un fichier FXP. Ajoutez le chemin d’accès au fichier FXP pour référencer le fichier FXG. Par exemple, decoratorClass="{assets.Chevron}" 4 Cliquez sur Terminer.
5 Exécutez l’application pour voir comment fonctionne le rendu ItemRenderer.
Vous pouvez ouvrir la boîte de dialogue de création d’un rendu d’élément directement en mode Source de l’éditeur. Par exemple, procédez comme suit pour créer un rendu d’élément pour un composant Spark List. 1 En mode Source de l’éditeur, placez votre curseur dans une balise <s:List> et saisissez ce qui suit : <s:List itemRender="
2 Double-cliquez sur Créer un rendu d’élément pour ouvrir la boîte de dialogue de création d’un rendu d’élément
Pour une application d’ordinateur, voir les instructions dans « Génération et modification d’un rendu d’élément pour un composant MX Tree (mode Création) » à la page 209 sur la création d’un rendu d’élément. Pour une application mobile, voir les instructions dans « Génération et modification d’un rendu d’élément pour des composants mobiles (mode Création) » à la page 210 sur la création d’un rendu d’élément. 3 Cliquez sur Terminer.
4 Modifiez la classe du rendu d’élément.
Dans Flash Builder, une déclaration ItemRenderer est le fichier qui implémente le rendu ItemRenderer personnalisé pour un composant. Vous pouvez afficher la déclaration du rendu ItemRenderer personnalisé pour les composants que vous avez sélectionnés : 1 En mode Création de l’éditeur MXML, sélectionnez un composant pour lequel vous avez implémenté un rendu
Liaison des contrôles à des données Pour accéder à un service de données, Flash Builder fournit des outils permettant de lier les données à des contrôles de données, par exemple DataGrid. Il crée les colonnes d’un contrôle DataGrid en fonction des données retournées par un service. Vous devrez généralement configurer les colonnes ainsi générées. Flash Builder comporte un éditeur pour la configuration des colonnes des composants DataGrid et AdvancedDataGrid. Pour plus d’informations sur la liaison des données aux contrôles de données, voir Liaison d’opérations de service à des contrôles.
Passez en mode Création de l’éditeur MXML pour configurer les colonnes DataGrid. La procédure suivante illustre la configuration des colonnes d’un composant DataGrid accédant à un service de données. La configuration des colonnes d’un composant AdvancedDataGrid est analogue. Configuration des colonnes d’un composant DataGrid 1 En mode Création de l’éditeur MXML, ajoutez un contrôle DataGrid (ou AdvancedDataGrid). Liez-le aux données renvoyées par un service de données. Pour plus d’informations, voir Liaison d’opérations de service à des contrôles. 2 Sélectionnez le contrôle DataGrid, puis cliquez sur le bouton Configurer les colonnes de la vue Propriétés.
3 Dans la boîte de dialogue Configurer les colonnes, utilisez les boutons Ajouter, Supprimer, Haut et Bas pour
4 La Vue standard de cette boîte de dialogue permet de modifier les principales propriétés d’une colonne
Sélectionnez le champ de données qui vous souhaitez afficher dans la colonne. La liste déroulante Liaison au champ répertorie tous les champs disponibles à partir des données renvoyées. Si le contrôle DataGrid est modifiable, vous pouvez déterminer si les données de cette colonne peuvent être modifiées. Si les données à afficher ne proviennent pas d’un service de données, Liaison au champ se présente sous la forme d’une zone de texte permettant de représenter les colonnes définies dans la source de données. Vous pouvez par exemple saisir le nom des colonnes définies dans une XMLList. Si le nom spécifié ne correspond à aucune source de données définie, la valeur est ignorée et la colonne demeure vide. Les colonnes ajoutées par programme à un contrôle DataGrid ne peuvent pas être configurées à l’aide des fonctions de liaison de données.
Définissez le style de mise en forme du texte de la colonne. 5 La Vue avancée permet d’afficher et de modifier les paramètres de toutes les propriétés d’une colonne sélectionnée.
Les applications conçues avec Flex sont gérées par les événements. Les composants de l’interface utilisateur réagissent à divers événements, par exemple lorsqu’un utilisateur clique sur un bouton ou lorsque l’initialisation d’un objet est terminée. Les gestionnaires d’événement, rédigés en code ActionScript, définissent la manière dont les composants réagissent à l’événement. Remarque : vous pouvez également générer des gestionnaires d’événement pour des éléments non visibles, tels que RemoteObject et HTTPService. Flash Builder assiste l’utilisateur par la génération des fonctions des gestionnaires d’événement pour un composant. Dans la fonction générée, rédigez le code qui définit le comportement du composant en réponse à l’événement. L’assistance pour la génération des gestionnaires d’événement est accessible :
• à partir du menu contextuel d’un élément en mode Création de l’éditeur MXML ; • à partir du menu contextuel d’un élément en mode Source de l’éditeur MXML.
Lorsque Flash Builder génère une fonction de gestionnaire d’événement, il place le gestionnaire d’événement dans le premier bloc Script du fichier. La fonction est placée à la fin du bloc Script. Le gestionnaire d’événement généré a un accès protégé et accepte la sous-classe appropriée de la classe Event comme seul paramètre. Flash Builder génère soit un nom unique pour le gestionnaire d’événement en fonction du nom de la classe du composant, soit un nom personnalisé pour le gestionnaire d’événement spécifié. Si vous ne précisez pas de nom personnalisé, le nom est généré selon le processus suivant :
• Si aucune propriété ID n’est définie pour le composant, Flash Builder génère un nom unique, basé sur le nom de la classe du composant. Vous devez fournir le corps du gestionnaire d’événement. Le bloc de code suivant contient un gestionnaire d’événement généré pour un contrôle Button.
Vous pouvez également générer des gestionnaires d’événement en faisant appel à l’assistant de contenu en mode Source. Génération de gestionnaires d’événement à partir de la vue Propriétés 1 En mode Création, sélectionnez un élément, puis sélectionnez la vue Standard dans l’inspecteur des propriétés. La zone Commun comporte un champ d’édition pour le gestionnaire d’événement par défaut. 2 Pour générer un gestionnaire pour l’événement par défaut : a (Facultatif) Dans le champ de texte Lors d’un Evénement, saisissez un nom pour l’événement.
Si vous ne spécifiez aucun nom, Flash Builder génère un nom unique pour l’événement. Lorsque vous précisez un nom pour le gestionnaire d’événement, vous avez la possibilité de spécifier un paramètre d’événement. Si vous ne le faites pas, Flash Builder génère le paramètre avec un type d’événement approprié. b Cliquez sur l’icône représentant un éclair, puis sélectionnez Générer un gestionnaire d’événement.
3 Pour générer un gestionnaire pour un événement d’un élément sélectionné : a Dans la Vue par catégories, développez le nœud Evénements afin d’afficher tous les événements correspondant
Génération de gestionnaires d’événement à l’aide du menu contextuel d’un élément 1 Dans la vue Création, ouvrez le menu contextuel d’un élément.
• Choisissez Afficher tous les événements pour ouvrir la liste d’événements dans la vue Propriétés. Précisez un gestionnaire d’événement dans la vue Propriétés. L’éditeur bascule en mode Source et met en évidence le corps du gestionnaire d’événement généré. Saisissez l’implémentation de l’événement. Génération de gestionnaires d’événement à l’aide de l’assistant de contenu 1 Dans un bloc MXML en mode Source, créez un composant, mais sans préciser d’événements. 2 Activez l’assistant de contenu pour les propriétés d’un composant en insérant un espace après le nom de la classe. 3 Dans la liste de propriétés sélectionnées, sélectionnez un événement (doubleClick, par exemple). 4 Appuyez sur Ctrl+Espace et sélectionnez Générer un gestionnaire d’événement.
Remarque : si vous avez spécifié un nom personnalisé pour le gestionnaire d’événement, Flash Builder ne peut pas générer le gestionnaire. Pour utiliser un nom personnalisé, générez d’abord un gestionnaire d’événement, puis modifiez-en le nom aussi bien dans la propriété event que dans le gestionnaire généré.
Vous pouvez créer des gestionnaires d’événement pour les composants Flex en cliquant sur le bouton Générer le gestionnaire d’événement pour les événements répertoriés dans la vue Propriétés. Vous pouvez attribuer un nom au gestionnaire d’événement avant de le créer. Si vous ne spécifiez pas de nom personnalisé, Flash Builder génère un nom en fonction de la propriété ID du composant. Si la propriété ID n’est pas définie, Flash Builder génère un nom unique dérivé du nom du composant. Génération d’un gestionnaire d’événement pour un composant 1 Dans la vue Création de l’éditeur de code, sélectionnez un composant. 2 Dans la vue Propriétés, sélectionnez la Vue par catégories, développez la liste des événements pour l’élément
3 (Facultatif) Saisissez un nom pour le gestionnaire d’événement dans le champ Valeur. 4 Cliquez sur le bouton Générer le gestionnaire d’événement.
Remarque : vous pouvez également utiliser le menu contextuel pour créer des gestionnaires pour les principaux événements d’un composant. Par exemple, le menu contextuel d’un composant Button comporte l’option Générer un gestionnaire Click. 5 Ajoutez le code pour l’implémentation du gestionnaire d’événement à la fonction de gestionnaire d’événement
Dans Flash Builder, vous interagissez avec des données et des contrôles gérés par des données directement dans les codes ActionScript et MXML. Vous pouvez travailler avec des données, générer automatiquement des applications de bases de données et utiliser un code proxy pour les services Web, ainsi que générer et utiliser le code fonctionnant avec Flex Ajax Bridge. Vous pouvez également gérer les problèmes de sécurité d’accès aux données d’Adobe Flash Player et utiliser Flash Builder avec un service proxy.
Dans Flash Builder, les données sont manipulées en modifiant directement les codes des applications ActionScript et MXML.
VerticalLayout, HorizontalLayout ou TileLayout.
Pour tous les contrôles gérés par des données, l’entrée de données est effectuée par un fournisseur de données. Pour plus d’informations sur l’utilisation de contrôles gérés par des données, voir Spark list-based controls.
Un objet collection contient un objet de données, par exemple Array ou XMList, et fournit un ensemble de méthodes permettant de consulter, trier, filtrer et modifier les éléments de données de cet objet. Plusieurs contrôles Adobe Flex, désignés par l’expression contrôles de fournisseurs de données, ont une propriété dataProvider renseignée par une collection. Les exemples suivants illustrent comment un fournisseur de données est défini (en tant qu’ArrayCollection ActionScript) et utilisé par un contrôle :
Selon le type d’interface dont vous disposez sur une application côté serveur particulière, vous pouvez vous connecter à une application via l’une des méthodes suivantes :
• Services Web conformes au protocole SOAP avec le composant WebService • Services distants AMF (Adobe Action Message Format) avec le composant RemoteObject Remarque : lorsque vous utilisez Flash Builder pour développer des applications accédant aux données côté serveur, utilisez un fichier cross-domain.xml ou un proxy si vous accédez aux données à partir d’un domaine différent du domaine à partir duquel l’application a été chargée. Voir « Gestion de la sécurité de Flash Player » à la page 248. Flash Builder permet également la création d’applications utilisant Adobe ADEP Data Services, un produit distinct offrant des fonctionnalités de service de données avancées. ADEP Data Services propose des applications de service d’appel de procédure distante (RPC), ainsi qu’une configuration de sécurité avancée. Il offre également les services de données suivants : Service de gestion de données : ce service permet de créer des applications qui fonctionnent avec les données distribuées. Le service de gestion de données vous permet en outre de gérer de vastes collections de données et des relations de données imbriquées, telles que des relations un-à-un et un-à-plusieurs. Service de message : ce service permet de créer des applications pouvant envoyer des messages à d’autres applications
Flash Builder fournit des assistants et des outils permettant de se connecter aux services de données et de lier des opérations de services de données à des composants d’application. Voir Création d’applications centrées sur les données avec Flash Builder.
Comme vous avez pu le constater dans l’exemple de code fourni dans « Fournisseurs de données et collections » à la page 216, la valeur de la propriété dataProvider du contrôle ComboBox est "{complexDP}". Il s’agit d’un exemple de liaison de données. La liaison de données copie la valeur d’un objet (la source) dans un autre objet (la destination). Une fois qu’un objet est lié à un autre objet, les modifications apportées à la source sont automatiquement répercutées dans la destination. L’exemple suivant lie la propriété de texte d’un contrôle TextInput (la source) à la propriété de texte d’un contrôle Label (la destination), de sorte à ce que le texte saisi dans le contrôle TextInput s’affiche dans le contrôle Label : <?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" minWidth="955" minHeight="600"> <fx:Declarations> Un modèle de données est un objet que vous pouvez utiliser afin de stocker de manière temporaire des données dans la mémoire pour faciliter leur manipulation. Vous pouvez définir un modèle de données dans ActionScript et dans MXML en utilisant une balise telle que <fx:Model> ou en utilisant tout objet contenant des propriétés. Par exemple, le modèle de données suivant affiche des informations telles que le nom d’une personne, son âge et son numéro de téléphone : <fx:Declarations> <fx:Model id="reg"> <registration> La validation de données vérifie que les données saisies par l’utilisateur dans l’application sont valides. Vous pouvez par exemple utiliser un validateur de données de code postal pour vérifier que le code postal indiqué par l’utilisateur est valide. Flex propose des validateurs prédéfinis pour les types de données suivants : carte de crédit, devise, date, adresse électronique, numéro, numéro de téléphone, expression régulière, sécurité sociale, chaîne et code postal. Les validateurs de données sont des composants Flex non visuels, ce qui signifie qu’ils ne sont pas accessibles à partir de la vue Composants. Vous devez donc les insérer dans le code, comme l’illustre l’exemple MXML suivant : <!-- Define the ZipCodeValidator. --> <mx:ZipCodeValidator id="zcV" source="{zipcodeInput}" property="text"/> <!-- Define the TextInput control for entering the zip code. --> Dernière mise à jour le 9/12/2011
Les validateurs de données sont souvent utilisés avec les modèles de données. Pour plus d’informations, voir Validating Data.
La mise en forme correcte de certains types de données dans l’application est garantie par l’utilisation de formateurs de données. Flex fournit des formateurs de données prédéfinis pour les types de données suivants : devise, date, numéro, téléphone et code postal. Les formateurs de données sont liés aux contrôles de saisie. Ils mettent correctement en forme les données saisies par l’utilisateur. Par exemple, un utilisateur peut saisir une date au format suivant : 120105 Un formateur, lié au contrôle de saisie de texte, stocke et affiche la date au format suivant : 12/01/05 A l’instar des validateurs de données, les formateurs de données sont des composants Flex non visuels que vous pouvez utiliser avec des balises MXML ou des classes ActionScript. Pour plus d’informations, voir Formatting Data.
L’assistant Nouveau projet pour les projets Flex et les projets Flex mobiles présente des options de configuration d’accès aux services de données. Les étapes de l’assistant sont identiques pour les projets Flex et les projets Flex mobiles. Vous pouvez configurer l’accès aux types de services suivants : Services PHP Services ColdFusion Services Java
1 Dans l’assistant Nouveau projet, indiquez l’emplacement du projet. Pour les projets mobiles, spécifiez les
Voir « Projets Flex » à la page 88 et « Projets Flex mobiles » à la page 34. 2 Sélectionnez PHP comme type de serveurs d’applications. 3 Spécifiez la racine Web et l’URL racine pour le service. Cliquez sur Valider la configuration.
Flash Builder est exécuté possède des droits d’accès en écriture. Vérifiez que vous avez mappé ou monté un lecteur pour le serveur réseau. Spécifiez ensuite le chemin vers le serveur. Le chemin d’accès est spécifique à la plateforme. Par exemple :
Voir « Chemins de génération, extension natives et autres options de configuration du projet » à la page 94.
Pour accéder aux données qui utilisent ColdFusion, vous devez disposer d’Adobe ColdFusion® 8 ou d’Adobe ColdFusion 9. Pour plus d’informations, consulter la page produit de ColdFusion. 1 Dans l’assistant Nouveau projet, indiquez l’emplacement du projet. Pour les projets mobiles, spécifiez les
Voir « Projets Flex » à la page 88 et « Projets Flex mobiles » à la page 34. 2 Pour le type de serveurs d’applications, sélectionnez ColdFusion, puis choisissez l’une des options suivantes. Utiliser le service d’accès aux objets distants : si vous désactivez l’option Utiliser le service d’accès aux objets
Si vous activez l’option Utiliser le service d’accès aux objets distants, vous pouvez effectuer les choix suivants.
Spécifiez ADEP Data Services en tant que type d’application ColdFusion uniquement si votre installation ColdFusion est configurée pour ADEP Data Services 2.6.1 (anciennement connu sous le nom de LiveCycle Data « Configuration de l’accès aux services Java » à la page 222.
Généralement, le type de serveurs d’applications pour BlazeDS n’est pas ColdFusion, mais Java. Voir « Configuration de l’accès aux services Java » à la page 222.
Activez cette option si vous prévoyez d’utiliser les outils de développement centrés sur les données disponibles avec Flash Builder. Cette option s’applique également si vous utilisez Flash Remoting pour invoquer des méthodes dans les composants ColdFusion (CFC). Voir Création d’applications centrées sur les données avec Flash Builder. 3 Spécifiez un emplacement de serveur, une racine Web, une URL racine et une racine du contexte.
Activez l’option Autonome si l’installation ColdFusion utilise la configuration du serveur. Spécifiez l’emplacement du serveur ColdFusion, de la racine Web et de l’URL racine.
La racine du contexte correspond en règle générale au dernier segment du chemin racine de l’URL lorsque vous déployez ColdFusion en tant qu’application Web dans la configuration Java ColdFusion. Pour spécifier l’emplacement du serveur ou de la racine Web, recherchez un répertoire local ou saisissez le chemin vers un répertoire situé sur un serveur réseau. Vérifiez que le répertoire est partagé et que le compte sous lequel Flash Builder est exécuté possède des droits d’accès en écriture. Vérifiez que vous avez mappé ou monté un lecteur réseau pour le serveur réseau. Le chemin au serveur réseau est fonction de la plateforme. Par exemple : (Windows) \\10.192.18.12\serveur\racine Web (Windows) Z:\racine Web (Mac) /Volumes/racine Web 4 Cliquez sur Valider la configuration pour vérifier l’exactitude des paramètres spécifiés. 5 Sélectionnez un dossier de sortie pour l’application compilée. 6 Cliquez sur Terminer ou sur Suivant pour accéder à d’autres options de configuration.
Cette configuration de projet vous permet de créer des projets Flex utilisant des classes de service Java avec l’option de service d’accès aux objets distants. Si aucune option n’est sélectionnée et qu’un serveur Java est utilisé, un dossier de sortie est créé sous la racine du serveur. Si le plug-in Eclipse Web Tools Project (WTP) est installé, vous pouvez créer des projets mixtes Java et Flex avec ou sans service d’accès aux objets distants. Remarque : ADEP Data Service (anciennement connu sous le nom de LiveCycle Data Services) et BlazeDS prennent en charge des versions spécifiques du SDK Flex. Consultez le Tableau de compatibilité ADEP Data Services pour découvrir les versions du SDK Flex prises en charge par votre version d’ADEP Data Service. Ce tableau de compatibilité répertorie également les versions du SDK Flex prises en charge par BlazeDS. 1 Dans l’assistant Nouveau projet, indiquez l’emplacement du projet. Pour les projets mobiles, spécifiez les
Voir « Projets Flex » à la page 88 et « Projets Flex mobiles » à la page 34. 2 Sélectionnez Java comme type de serveurs d’applications. 3 (Facultatif) Cochez l’option Utiliser le service d’accès aux objets distants.
Racine du contexte : la racine du contexte correspond généralement au dernier segment du chemin de l’URL
BlazeDS et /lcds pour Data Service.
Lorsque vous créez un projet Flex avec ADEP Data Services, Flash Builder crée un répertoire portant le même nom que le projet ou utilise un répertoire existant portant ce nom. Ce répertoire est un sous-répertoire du dossier racine que vous avez spécifié pour le projet.
Remarque : quelle que soit l’option choisie pour un projet ADEP Data Services dans Flash Builder, spécifiez un dossier racine et une URL racine. Ces valeurs mappent la racine d’une application Web ADEP Data Services. Si vous désélectionnez les options, saisissez uniquement la racine Web et l’URL racine. 5 Spécifiez l’emplacement auquel le projet sera compilé. 6 Cliquez sur Terminer ou sur Suivant pour accéder à d’autres options de configuration.
1 Dans l’assistant Nouveau projet, indiquez l’emplacement du projet. Pour les projets mobiles, spécifiez les
Voir « Projets Flex » à la page 88 et « Projets Flex mobiles » à la page 34. 2 Sélectionnez ASP.NET comme type de serveurs d’applications. • Spécifiez le dossier de sortie de l’application 4 Cliquez sur Terminer ou sur Suivant pour accéder à d’autres options de configuration.
Vous serez probablement amené dans certains cas à modifier la configuration d’origine du serveur d’un projet. Pour une application Web ou d’ordinateur, accédez à la fenêtre des propriétés du projet concerné. Sélectionnez l’option Serveur Flex pour ajouter ou modifier les options du serveur du projet.
La suppression de la configuration serveur d’un projet conduit également à la suppression de tout fichier SWC ajouté au chemin d’accès à la bibliothèque pour ce type de serveur.
Toutes les options de serveur pour la configuration serveur sélectionnée sont disponibles. Pour plus d’informations sur les paramètres de configuration du serveur, voir « Projets Flex » à la page 88. La modification du type de serveur d’un projet peut provoquer des erreurs dans le code existant reposant sur le type de serveur d’origine. Recherchez et corrigez toutes les erreurs résultantes dans votre code.
Le Moniteur de réseau est un outil ingénieux permettant de surveiller et de déboguer les applications accédant aux services de données. Le Moniteur de réseau permet d’analyser les données transmises entre une application et un service de données. Il examine également les données XML, AMF et JSON envoyées avec les protocoles SOAP, AMF, HTTP et HTTPS. Le Moniteur de réseau est disponible dans les vues Flash de développement et de débogage.
Le Moniteur de réseau peut être activé individuellement pour chaque projet Flex. L’état du moniteur (activé ou désactivé) s’applique à toutes les applications de ce projet. Il est impossible d’activer ou de désactiver le Moniteur de réseau pour des applications individuelles. Par défaut, le Moniteur de réseau n’est pas activé. Activez le Moniteur de réseau en sélectionnant l’icône Activer le moniteur dans la barre d’outils de la vue du Moniteur. Cette procédure suppose que vous êtes dans la perspective Développement Flex ou Débogage Flex. 1 Si la vue Moniteur de réseau n’est pas ouverte, sélectionnez Fenêtre dans le menu Flash Builder, puis Affichage
de la vue Moniteur de réseau. Cet bouton permet de l’activer et de le désactiver.
Pour surveiller l’application, activez le Moniteur de réseau et exécutez la version de développement ou de débogage de l’application. En général, le Moniteur de réseau capture et stocke toutes les données d’événements jusqu’à ce que vous quittiez l’application ou effaciez les données de manière explicite. Les événements s’affichent dans l’ordre chronologique.
1 Exécutez la version de développement ou de débogage de l’application qui accède aux services distants. 2 Pour chaque accès à un service distant, le Moniteur de réseau répertorie les éléments suivants :
• Service • Demande d’un service • Heure de la réponse • Temps écoulé 3 Sélectionnez un en-tête de colonne pour trier les données renvoyées en fonction des valeurs de ladite colonne.
4 Sélectionnez les onglets de requête et de paramètres situés au bas du moniteur pour afficher les détails de
Les données envoyées dans la requête, ainsi que les autres informations concernant la requête, peuvent être visualisées à partir de ces onglets. 5 Sélectionnez les onglets de réponse et de résultats situés au bas du moniteur pour afficher les détails de la réponse.
6 Double-cliquez sur une entrée pour accéder au code source de l’opération.
Remarque : dans la plupart des cas, le Moniteur de réseau peut faire correspondre un événement au code source Flex. Certains événements toutefois sont déclenchés en dehors de la portée du Moniteur de réseau. Dans ce cas, le Moniteur ne trouvera pas le code source Flex. 7 Cliquez sur le bouton Enregistrer de la barre d’outils du Moniteur de réseau pour inscrire toutes les informations
Remarque : utilisez le fichier XML généré pour étudier les données hors ligne. Il est impossible d’importer des données de ce fichier vers le Moniteur de réseau. 8 Cliquez sur l’icône Effacer dans la barre d’outils du Moniteur de réseau pour supprimer toutes les informations du
1 Cliquez sur le bouton Interrompre dans la barre d’outils du Moniteur de réseau pour interrompre la surveillance
2 Cliquez sur le bouton Reprendre pour continuer la surveillance de la session.
Pour arrêter la surveillance d’une session, désactivez le Moniteur de réseau. 1 (Facultatif) Fermez le Moniteur de réseau.
2 Cliquez sur le bouton Activer le moniteur.
Remarque : la désactivation du Moniteur de réseau s’applique à toutes les applications du projet Flex.
Pour surveiller les appels passés par protocole HTTPS, modifiez la préférence par défaut du Moniteur de réseau en activant l’option Ignorer les vérifications de sécurité SSL. Ouvrez la boîte de dialogue Préférences et accédez à Flash Builder > Moniteur de réseau.
Le volet de gauche du Moniteur de réseau fournit des informations sur la source des données. Il affiche les informations suivantes :
• Le type de service affiché : Par exemple RemoteService, HTTPService ou WebService.
• Le nom de l’opération appelée à partir du service de données Le Moniteur de réseau comporte deux onglets, l’un pour l’affichage des données de demande et l’autre pour l’affichage des données de réponse. Les données des demandes et réponses peuvent être visionnées en structure arborescente, dans une vue brute ou en affichage hexadécimal. Passez d’un affichage à l’autre en sélectionnant l’icône correspondante.
Affiche les données XML, JSON et AMF en structure arborescente. L’arborescence est la vue par défaut.
Vous pouvez enregistrer les données du Moniteur de réseau dans un fichier XML. Pour ce faire, cliquez sur le bouton Enregistrer de la vue Moniteur de réseau.
Vous pouvez surveiller plusieurs applications en même temps. Il existe deux scénarios possibles pour surveiller plusieurs applications :
Vous pouvez uniquement disposer d’un Moniteur de réseau par projet Flex. Lors de la surveillance de plusieurs applications d’un même projet, les événements de toutes les applications s’affichent dans le moniteur en fonction de l’heure à laquelle ils surviennent. Le moniteur ne permet pas de filtrer les événements selon une application spécifique.
Vous pouvez ouvrir un Moniteur de réseau pour chaque projet Flex actif. Chaque Moniteur de réseau est indépendant : il affiche uniquement les événements de son projet spécifique. L’interruption ou la désactivation d’un Moniteur de réseau dans un projet ne s’applique pas aux moniteurs d’autres projets.
Le Moniteur de réseau permet d’analyser les données transmises entre une application mobile et un service de données. Vous pouvez paramétrer le Moniteur de réseau de manière à ce qu’il surveille les applications mobiles, suivez pour cela la procédure suivante : 1 Exécutez la configuration de débogage de l’application avec le Moniteur de réseau activé. 2 Spécifiez une méthode de lancement.
Sélectionnez Dans le simulateur AIR afin de surveiller l’application sur un périphérique simulé qui est créé à l’aide d’ADL (AIR Debug Launcher). Le périphérique est simulé en prenant compte de la configuration de périphérique que vous sélectionnez.
Dans le cas où le Moniteur de réseau ne parvient pas à établir une connexion Wi-Fi, Flash Builder affiche une boîte de dialogue qui vous demande d’indiquer l’adresse IP de l’ordinateur hôte. Une fois la connexion établie, les appels réseau de l’application sont alors redirigés vers Flash Builder via le réseau Wi-Fi du périphérique. 3 Surveillez l’application mobile de la même façon que vous surveillez une application Web ou d’ordinateur qui
La surveillance des données du réseau présente les deux restrictions suivantes :
ActionScript ou de bibliothèque.
Les projets de bibliothèque vous permettent de créer des bibliothèques de code personnalisé que vous pouvez partager entre vos applications ou distribuer à d’autres développeurs. Un projet de bibliothèque génère un fichier SWC, c’està-dire un fichier archive pour les composants Flex ainsi que pour d’autres ressources. Par exemple, la structure Flex est contenue dans des fichiers SWC. Lorsque vous créez un projet Flex, les fichiers SWC de la structure Flex sont ajoutés au chemin de la bibliothèque du projet. Vous pouvez afficher et modifier le chemin de la bibliothèque dans la page de propriétés du chemin de génération du projet (pour les projets Flex, sélectionnez Projet > Propriétés > Chemin d’accès à la génération Flex). Un fichier SWF est archivé dans un fichier SWC contenant des composants, des ressources et un fichier catalog.xml, fichier manifeste des éléments contenus dans le fichier SWF. Le fichier SWF contient généralement un ou plusieurs composants et toute autre ressource requise. L’ajout de la bibliothèque à un projet vous permet d’utiliser ces composants et en active les conseils de code. Les bibliothèques SWC constituent une méthode pratique d’assemblage et de distribution des composants, mais servent également de thèmes, l’aspect visuel des applications créées dans Flex. Un fichier de thème SWC contient un fichier CSS ainsi que toutes les ressources graphiques associées. Pour plus d’informations sur la création et l’utilisation des thèmes, voir About themes. Les bibliothèques sont utiles si vous créez des composants intégralement dans ActionScript et que vous les utilisez en mode Création dans Flash Builder. Les composants ActionScript ne sont pas rendus visuellement en mode Création tant qu’ils ne sont pas compilés dans un fichier SWF. En ajoutant des composants ActionScript dans un projet de bibliothèque, vous créez un fichier SWF qui est contenu dans un fichier SWC. Vous pouvez ajouter la bibliothèque à un chemin d’accès à la bibliothèque d’un projet et les composants ActionScript sont rendus visuellement en mode Création lorsque vous les ajoutez à l’application.
Fusionnées dans l’application : lorsque vous ajoutez un fichier SWC au chemin d’accès à la bibliothèque du projet, les
SWF de l’application. En d’autres termes, tout le code de votre application est fusionné dans un seul fichier SWF. C’est la façon la plus courante et la plus simple d’utiliser les composants de bibliothèques. Externes à l’application : vous pouvez conserver les composants de bibliothèque séparément du fichier SWF compilé pour qu’ils ne soient pas fusionnés dans le fichier. Le compilateur résout tout le code contenu dans la bibliothèque utilisé par l’application, mais ne le fusionne pas dans le fichier SWF de l’application. L’avantage de cette méthode est de réduire la taille du fichier SWF de l’application. Les composants contenus dans le fichier SWC sont extraits et chargés dans la mémoire selon les besoins, au moment de l’exécution. Bibliothèque partagée à l’exécution : dans les projets Flex uniquement, vous pouvez également utiliser des fichiers
Le partage de composants entre applications à l’aide de ce type de bibliothèque présente plusieurs avantages. Dans un premier temps, la bibliothèque est chargée en mémoire une fois, placée dans le cache, puis mise à disposition de toutes les applications faisant appel à ces composants. Dans un second temps, les composants se trouvant dans la bibliothèque sont chargés uniquement selon les besoins, ce qui réduit le temps de démarrage de l’application, car la taille de l’application est moindre. Le problème potentiel de cette méthode est que la bibliothèque partagée à l’exécution est chargée en mémoire dans son intégralité, plutôt que les composants individuels que les applications utilisent. Pour plus d’informations sur l’utilisation des fichiers SWC en tant que RSL, voir Runtime Shared Libraries.
Lorsque vous créez un projet de bibliothèque, l’assistant Nouveau projet de bibliothèque Flex vous guide à travers les différentes étapes et vous demande d’indiquer le nom du projet, son emplacement, ainsi que le chemin de génération. La première étape de la création d’un fichier SWC dans Flash Builder est la création d’une projet de bibliothèque Flex. Une fois le projet de bibliothèque créé, vous ajoutez des composants, spécifiez les éléments du projet de bibliothèque à inclure dans le fichier SWC, puis générez le projet afin de créer le fichier SWC. 1 Sélectionnez Fichier > Nouveau > Projet de bibliothèque Flex. 2 Saisissez un nom de projet, puis précisez les éléments suivants. Emplacement du projet : l’emplacement par défaut est l’espace de travail actuel. Sous Windows, l’emplacement de
Macintosh, l’emplacement de l’espace de travail par défaut est /Users/nom d’utilisateurAdobe Flash Builder/. Pour choisir un emplacement de projet différent, désactivez l’option Utiliser l’emplacement par défaut. Configuration : vous pouvez préciser si le projet de bibliothèque Flex utilise des bibliothèques génériques ou
Vous pouvez également spécifier si le projet de bibliothèque Flex doit être compatible avec Flash Catalyst. Dans ce cas, les bibliothèques génériques sont utilisées. Les bibliothèques mobiles ne sont pas prises en charge pour les projets compatibles avec Flash Catalyst. Version SDK Flex : choisissez la version par défaut ou spécifiez-en une. Vous pouvez aussi cliquer sur le lien
Ne sélectionnez pas cette option si vous créez une bibliothèque générique destinée à une utilisation exclusive dans une application Web, ou dans une application Web ou AIR. 3 Cliquez sur Suivant. 4 (Facultatif) Définissez les informations concernant le chemin de génération. Vous pouvez, par exemple, ajouter des
également ajouter d’autres projets, dossiers ou fichiers SWC de bibliothèque à inclure dans votre projet de bibliothèque. Voir « Utilisation des fichiers SWC dans le cadre des projets » à la page 231. 5 Une fois les paramètres du projet saisis, cliquez sur Terminer.
1 Sélectionnez Fichier > Nouveau > Projet de bibliothèque Flex. 2 Entrez un nom de projet. 3 Activez l’option Inclure les bibliothèques Adobe AIR, puis cliquez sur Suivant. 4 Modifiez si nécessaire le chemin de génération, puis cliquez sur Terminer. Pour plus d’informations sur la création
Il existe plusieurs façons d’ajouter des composants à un projet de bibliothèque :
à des ressources situées en dehors de l’espace de travail du projet » à la page 44).
« Ajout d’un dossier de ressources externes au chemin d’accès source » à la page 46). Remarque : tous les composants que vous incluez dans le projet de bibliothèque doivent être associés au projet de bibliothèque (directement ou en tant que ressources liées).
1 Sélectionnez Projet > Propriétés > Chemin de génération de la bibliothèque Flex.
2 Sélectionnez les classes de composants à inclure dans le fichier SWC.
Une fois que vous avez sélectionné les éléments à inclure dans le fichier SWC et si vous avez sélectionné l’option de génération automatique, le fichier SWC est compilé immédiatement et généré dans le dossier de sortie du projet. Si vous générez vos projets manuellement, vous pouvez créer le projet de bibliothèque quand vous le souhaitez en sélectionnant Projet > Générer le projet ou Générer tout. La création du projet de bibliothèque génère un fichier SWC que vous pouvez partager avec d’autres applications ou utilisateurs. Un fichier SWC est un fichier archive. Vous pouvez l’ouvrir grâce à n’importe quel utilitaire d’archivage, tel que WinZip. Les fichiers library.swf et catalog.xml sont contenus dans le fichier SWC, ainsi que les fichiers de propriétés et autre ressources incorporées. Vous pouvez exporter la bibliothèque sous la forme d’un répertoire ouvert plutôt qu’en tant que fichier SWC. Vous exportez généralement une bibliothèque en tant que répertoire ouvert si vous prévoyez de faire appel au fichier library.swf dans le fichier SWC en tant que bibliothèque RSL. Pour ce faire, vous devez définir les options directory et output du compilateur. Définissez l’option output comme le nom du répertoire à créer et l’option directory sur true pour indiquer que vous voulez ouvrir le répertoire et non un fichier SWC lorsque vous générez la bibliothèque. Pour modifier les options du compilateur, sélectionnez Projet > Propriétés > Compilateur de bibliothèque Flex et ajoutez les options au champ « Arguments supplémentaires de compilateur », par exemple : -directory=true -output=myOpenDir
Pour pouvoir utiliser des fichiers SWC dans vos projets Flex, vous devez les ajouter au chemin d’accès à la bibliothèque du projet. Les fichiers SWC peuvent se trouver dans le projet, dans un projet de bibliothèque Flex, dans un dossier partagé dans l’espace de travail ou dans tout autre emplacement lié au projet (en utilisant un dossier partagé qui a été ajouté au chemin source du projet, par exemple). Lorsque vous utilisez des fichiers SWC dans des applications, certaines options de configuration déterminent s’ils sont liés de manière statique ou dynamique à l’application, s’ils sont fusionnés dans le fichier SWF de l’application ou s’ils sont externes et si leur accès se fait séparément au moment de l’exécution.
1 Sélectionnez un projet dans l’Explorateur de packages, puis cliquez sur Projet > Propriétés > Chemin d’accès à la
2 Cliquez sur l’onglet Chemin d’accès à la bibliothèque. 3 Sélectionnez l’une des options suivantes pour ajouter des fichiers SWC. Ajouter un projet : ajoute un projet de bibliothèque Flex. Ajouter un dossier SWC : permet d’ajouter un dossier contenant des fichiers SWC. Ajouter un fichier SWC : ajoute un fichier SWC compilé.
Fusion du fichier SWC dans le fichier SWF de l’application au moment de la compilation 1 Sélectionnez un projet dans l’Explorateur de packages, puis cliquez sur Projet > Propriétés > Chemin d’accès à la
2 Sous l’onglet Chemin d’accès à la bibliothèque, sélectionnez et développez l’entrée du fichier SWC pour en afficher
3 Cliquez deux fois sur l’option Type de lien. La boîte de dialogue Options de l’élément de chemin d’accès à la
4 Sélectionnez l’option Fusionné dans le code, puis cliquez sur OK.
1 Sélectionnez un projet dans l’Explorateur de packages, puis cliquez sur Projet > Propriétés > Chemin d’accès à la
2 Sous l’onglet Chemin d’accès à la bibliothèque, sélectionnez et développez l’entrée du fichier SWC pour en afficher
3 Cliquez deux fois sur l’option Type de lien. La boîte de dialogue Options de l’élément de chemin d’accès à la
4 Sélectionnez l’option Externe, puis cliquez sur OK.
4 Sélectionnez Bibliothèque RSL (Runtime Shared Library) comme type de lien. 5 Vous pouvez ajouter une URL pour spécifier où la bibliothèque SWC réside lorsque l’application est déployée. Vous
Pour plus d’informations sur l’utilisation des fichiers SWC en tant que bibliothèque RSL, voir Runtime Shared Libraries dans Utilisation d’Adobe Flex.
Vous pouvez créer des composants personnalisés pour ajouter certaines fonctions à un composant existant ou pour créer un composant réutilisable, tel qu’une zone de recherche ou l’affichage d’un élément dans une grille de données. Vous pouvez également rédiger un nouveau composant, qui n’existe pas dans la structure Flex. Les composants que vous créez sont affichés dans la vue Composants en mode Création. Vous pouvez distribuer les composants à l’aide des fichiers SWC. Pour plus d’informations, voir « Utilisation des fichiers SWC dans le cadre des projets » à la page 231. Si le composant est créé principalement à partir de composants existants, l’utilisation de MXML en facilitera la définition. Toutefois, s’il s’agit d’un nouveau type de composant, définissez-le en tant que composant ActionScript. Pour plus d’informations, voir « Création d’une classe ActionScript » à la page 42. 1 Sélectionnez Fichier > Nouveau > Composant MXML.
2 Spécifiez le dossier parent pour le fichier du composant personnalisé.
3 Spécifiez le nom de fichier du composant.
LoginBox. 4 Dans le champ Basé sur, sélectionnez le composant de base de votre composant personnalisé.
A partir de Flex 4, Flash Builder suggère spark.components.Group comme composant de base. Sélectionnez Parcourir pour ouvrir la boîte de dialogue Ouvrir un type, puis choisissez un composant. Modifiez ou effacez le composant suggéré afin d’élargir la sélection dans la boîte de dialogue Ouvrir un type. Par exemple, spécifiez spark.components. avant de cliquer sur Parcourir. Vous pouvez filtrer la sélection dans la boîte de dialogue Ouvrir un type en fonction de vos besoins. Pour plus d’informations sur l’utilisation de la boîte de dialogue Ouvrir un type, voir « Navigation et affichage des classes » à la page 83.
du composant. Vous pouvez saisir des valeurs fixes ou des pourcentages. Vous pouvez également vider les deux champs. Lorsque vous créez une instance du composant, vous pouvez remplacer la largeur et la hauteur du composant dans l’instance. Si vous saisissez des pourcentages ou ne spécifiez aucune valeur, vous avez la possibilité de visualiser un aperçu du composant à différentes tailles. Pour ce faire, utilisez la liste déroulante située dans la barre d’outils de la vue Création de l’éditeur MXML. Pour plus d’informations, voir « Création de composants visuels » à la page 234. 6 Cliquez sur Terminer.
Si vous avez enregistré le fichier dans le projet actif ou dans le chemin source correspondant, Flash Builder affiche également le composant dans la vue Composants pour permettre son insertion rapide dans les applications. Pour plus d’informations, voir « Ajout de composants en mode Création MXML » à la page 23. Remarque : la vue Composants ne répertorie que les composants personnalisés visibles (c’est-à-dire ceux ayant hérité de la classe UIComponent). Pour plus d’informations, voir le Guide de référence du langage ActionScript 3.0 pour la plateforme Adobe Flash. 7 Créez un composant personnalisé.
Vous pouvez présenter un composant personnalisé visuellement dans l’éditeur MXML à l’instar d’un fichier d’application MXML. Tous les outils du mode Création sont disponibles. Vous pouvez par exemple ajouter des contrôles enfant à partir de la vue Composants et définir les propriétés dans la vue Propriétés. Pour plus d’informations, voir « Utilisation de composants visuels en mode Création MXML » à la page 22. Les règles suivantes s’appliquent à la taille du composant personnalisé :
Sélectionnez différentes dimensions afin d’obtenir différents aperçus du composant. Les dimensions par défaut de la zone de création sont de 400x300 pixels pour les conteneurs. Pour les contrôles, la zone de création s’ajuste au contenu.
Vous pouvez documenter les composants personnalisés en ajoutant des commentaires ASDoc au code qui les implémente. Les commentaires ASDoc sont ensuite disponibles dans l’assistant de contenu des éditeurs MXML et ActionScript. Pour plus d’informations, voir « Assistant de contenu » à la page 48. Ajoutez des commentaires ASDoc aux fichiers source ActionScript pour fournir la documentation de référence de l’API. Vous pouvez également ajouter des commentaires ASDoc à des éléments MXML du document. Voir ASDoc pour plus d’informations sur la création de commentaires ASDoc pour vos fichiers source.
UIComponent) dans la vue Création de l’éditeur MXML. Vous pouvez double-cliquer sur un composant personnalisé pour en ouvrir le fichier et le modifier. 1 Ouvrez un fichier MXML utilisant un composant personnalisé. 2 En mode Création, double-cliquez sur un composant personnalisé.
Vous pouvez également sélectionner Ouvrir le composant personnalisé dans le menu contextuel. 3 Modifiez le composant personnalisé.
« Utilisation de projets de bibliothèque Flex » à la page 228.
Flash Builder permet de créer, d’ajouter, d’optimiser et de déboguer des modules. Pour plus d’informations sur la rédaction de code de module, voir Applications modulaires. Les étapes suivantes décrivent la procédure de création d’un module dans Flash Builder. Après avoir créé un module, vous pouvez le compiler. 1 Dans Flash Builder, sélectionnez Fichier > Nouveau > Module MXML. La boîte de dialogue Création d’un(e)
2 Sélectionnez un répertoire parent pour le module. Les modules sont habituellement stockés dans le même
Les modules étant exécutables, ils doivent se trouver dans le dossier source du projet. 3 Entrez un nom de fichier pour le module, par exemple MyModule. 4 Entrez les propriétés Largeur, Hauteur et Présentation. 5 Indiquez si vous souhaitez ou non optimiser le module.
Si vous activez cette option, spécifiez l’application pour laquelle le module doit être optimisé.
Si vous activez cette option, toutes les classes sont incluses dans le module, qu’elles soient définies ou non dans l’application principale, améliorant ainsi les performances de la compilation d’incrémentation. Vous pouvez en outre charger le module dans n’importe quelle application, toutes ses dépendances y étant compilées. 6 Cliquez sur Terminer.
Il est impossible d’exécuter le fichier SWF basé sur un module comme un fichier SWF autonome ou de le charger dans une fenêtre de navigateur. Il doit être chargé par une application en tant que module. Si vous exécutez le module dans Flash Builder pour le compiler, fermez Adobe Flash Player ou la fenêtre du navigateur et ignorez les erreurs éventuelles. Les modules ne doivent pas être sollicités directement par Flash Player ou par l’intermédiaire d’un navigateur. Les fichiers SWF du module et le fichier SWF de l’application principale se trouvent généralement dans le même répertoire. Flash Builder compile toutefois les modules en même temps que l’application, quel que soit leur emplacement. Les modules peuvent se situer dans le même répertoire que l’application ou dans des sous-répertoires. Vous pouvez également créer un projet Flex ou ActionScript distinct pour chaque module ou groupe de modules. Il en résulte une meilleure maîtrise de la compilation des modules, les options de compilateur de chaque projet pouvant différer de celles de l’application ou des autres modules. Cela permet également de compiler le ou les projets d’un module sans compiler l’application. Cette approche requiert toutefois la compilation manuelle de chaque module avant de compiler l’application. Une manière de procéder consiste à compiler simultanément tous les projets ouverts dans Flash Builder. Si vous compilez les modules indépendamment de l’application principale, veillez à inclure ou exclure les informations de débogage, selon que vous souhaitez déboguer l’application et les modules. Pour plus d’informations, voir « Débogage de modules dans Flash Builder » à la page 240. Le flux de travail dans Flash Builder est conçu pour l’association de modules avec une même application. Pour utiliser des modules dans plusieurs applications, encapsulez éventuellement le code dans une classe ou un composant de bibliothèque à inclure dans un module simple pour chaque application. Contrairement aux bibliothèques, les modules ne sont pas destinés à une utilisation dans le code commun à plusieurs applications.
Lors de la définition de l’architecture de votre projet, vous pouvez décider d’inclure des modules dans votre projet d’application, de créer un projet distinct pour chaque module ou de créer un projet distinct pour l’ensemble des modules.
L’utilisation d’un projet pour chaque module présente les avantages suivants :
• Les projets de module peuvent disposer de paramètres de compilateur distincts, tel qu’un chemin d’accès à la bibliothèque personnalisé. Ils peuvent utiliser l’option de compilateur load-externs pour supprimer les dépendances qui se recoupent. L’utilisation d’un projet pour chaque module présente les inconvénients suivants :
• L’existence de nombreux projets dans un même espace de travail peut augmenter son encombrement. • Par défaut, lorsque vous compilez l’application, tous les projets de module ne sont pas compilés, même s’ils ont subi des modifications.
Une approche semblable consiste à utiliser un même projet pour l’ensemble des modules, en conservant l’application dans son propre projet distinct. Certains inconvénients, liés à l’utilisation d’un même projet à la fois pour l’application et les modules, subsistent. Cette approche apporte toutefois de nombreux avantages découlant de l’utilisation d’un projet distinct pour chaque module. L’utilisation d’un projet pour l’ensemble des modules présente les avantages suivants :
• Vous pouvez compiler séparément les modules ou l’application, sans nécessité de compiler les deux simultanément. • Le projet de module peut utiliser l’option de compilateur load-externs pour supprimer les dépendances qui se recoupent. L’utilisation d’un projet de module pour l’ensemble des modules présente les inconvénients suivants :
Lors de la création d’un projet séparé pour les modules, vous modifiez le dossier de sortie du projet de module sur un répertoire utilisé par l’application. Vous supprimez également la création de fichiers d’enveloppe.
1 Créez un projet principal. 2 Créez un projet pour le ou les modules. 3 Dans le menu contextuel du projet du module, sélectionnez Propriétés. La boîte de dialogue Propriétés s’ouvre. 4 Sélectionnez l’option Chemin de génération Flex. 5 Modifiez le dossier de sortie de manière telle à ce qu’il pointe vers le répertoire des modules MainProject, comme
${DOCUMENTS}\MainProject\assets
6 Cliquez sur OK pour enregistrer vos modifications. 7 Ouvrez à nouveau les propriétés du projet et sélectionnez l’option Compilateur Flex. 8 Désélectionnez l’option Générer le fichier d’enveloppe HTML afin d’éviter que le projet du module ne génère les
Compilation de projets pour les modules La compilation de plusieurs projets dans Flash Builder est une opération courante. Il vous faut tout d’abord choisir l’ordre dans lequel vous souhaitez compiler les projets. Vous pouvez ensuite compiler tous les projets en même temps. Compilation simultanée de tous les projets dans Flash Builder ❖ Dans le menu principal, sélectionnez Projets > Générer tout. Flex génère alors l’ensemble des projets de l’espace de travail. Les fichiers d’application sont ajoutés au dossier de sortie de chaque projet. Si vous n’avez pas choisi l’enregistrement automatique des fichiers avant le début d’une génération, vous êtes invité à enregistrer les fichiers. Pour modifier l’ordre de génération, utilisez la boîte de dialogue Ordre de génération. La modification de l’ordre de génération n’est pas toujours nécessaire. Les projets utilisant des modules ne doivent être compilés qu’avant l’exécution de l’application de projet principale, et non lors de sa compilation. Dans la plupart des cas, l’ordre de génération par défaut ne doit pas être modifié. Si toutefois vous souhaitez éliminer les dépendances qui se recoupent, vous pouvez modifier l’ordre de génération afin de compiler d’abord l’application principale. L’option de compilateur link-report permet alors de générer le rapport de liaison. Lorsque vous compilez les modules, l’option de compilateur load-externs permet d’utiliser le rapport de liaison généré par l’application principale. Pour plus d’informations sur la réduction de la taille des modules, voir « Optimisation de modules dans Flash Builder » à la page 239. Modification de l’ordre de génération des projets 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Espace de travail > Ordre de génération. La boîte de dialogue Ordre de génération apparaît. 2 Désélectionnez la case à cocher Utiliser l’ordre de génération par défaut. 3 Utilisez les boutons Haut et Bas pour reclasser les projets de la liste Ordre de génération. Vous pouvez également
4 Cliquez sur OK. 5 Modifiez si nécessaire l’ordre de génération, puis cliquez sur OK.
Si vous utilisez un projet distinct pour chaque module, vous pouvez compiler un seul module à la fois. Cela permet de gagner du temps par rapport à la compilation simultanée de tous les projets, ou par rapport à la compilation d’un seul projet contenant tous les fichiers de modules et d’application. Compilation du projet d’un seul module 1 Cliquez avec le bouton droit de la souris sur le fichier MXML du module dans le projet du module. 2 Sélectionnez Exécuter l’application. La fenêtre du lecteur ou du navigateur tente d’exécuter le module après sa
Vous serez amené, dans certaines situations, à utiliser des modules ne figurant pas dans le projet de l’application principale. Le module peut provenir d’un projet distinct, vous pouvez alors utiliser des options de configuration personnalisées. Vous pouvez également vouloir partager le module entre plusieurs applications. Ajoutez le code source du module au chemin source de l’application, puis ajoutez le module à la liste de modules de l’application afin de pouvoir l’utiliser dans le projet. Ajout d’un module préalablement compilé au projet 1 Sélectionnez l’application principale dans l’Explorateur de packages Flex. 2 Sélectionnez Projet > Propriétés > Chemin d’accès à la génération Flex pour ajouter la source du module au chemin
3 Cliquez sur le bouton Ajouter un dossier et accédez au chemin source du module. Cliquez sur OK pour sélectionner
4 Cliquez à nouveau sur OK pour enregistrer vos modifications. 5 Sélectionnez Projet > Propriétés > Modules Flex pour ajouter le module à la liste de modules de l’application. La
6 Cliquez sur le bouton Ajouter. La boîte de dialogue Ajouter un module s’affiche. 7 Utilisez le bouton Parcourir ou entrez l’emplacement du fichier MXML du module dans le champ Source. Tous les
8 Sélectionnez l’une des options Taille du fichier SWF du module pour activer ou désactiver l’optimisation de
9 Cliquez sur OK pour enregistrer vos modifications. Flash Builder ajoute le module à la liste des modules disponibles
Dans Flash Builder, vous ne sélectionnez généralement qu’une seule application par rapport à laquelle le module doit être optimisé lors de sa création initiale ou de son ajout au projet. Si vous décidez par la suite de changer l’application visée par l’optimisation du module, ou de ne pas optimiser le module, vous pouvez modifier les propriétés du module au sein du projet. Pour plus d’informations, voir Reducing module size. Cette procédure part du principe que le module et l’application se trouvent dans le même projet Flash Builder. Si les modules se situent dans un projet distinct, ajoutez manuellement les options de compilateur load-externs et linkreport. 1 Cliquez avec le bouton droit de la souris sur le projet de l’application dans l’Explorateur de package Flex et
2 Dans le volet de gauche, sélectionnez Modules Flex. 3 Sélectionnez le module dans la liste et cliquez sur le bouton Modifier. La boîte de dialogue Modifier le module
4 Pour supprimer l’optimisation, sélectionnez l’option Ne pas optimiser sous Taille du fichier SWF du module.
Pour déboguer des modules et des applications, intégrez des informations de débogage dans les fichiers SWF lors de leur compilation. Dans Flash Builder, exécutez l’application, puisque les informations de débogage sont incluses par défaut. A la ligne de commande, définissez l’option de compilateur debug sur true. La valeur par défaut est true, mais si vous l’avez désactivée dans un fichier de configuration, veillez à le remplacer. Par défaut, Flash Builder génère un seul fichier SWF comprenant des symboles de débogage. Les instructions Déboguer et Exécuter fonctionnent donc toutes les deux lors de l’exécution d’une application utilisant des modules dans Flash Builder. Toutefois, l’inclusion de symboles de débogage dans le fichier SWF d’un module augmente sa taille. Pour exclure les symboles de débogage avant le déploiement, désactivez le débogage des modules de l’application. Pour ce faire, exportez la version validée des modules en sélectionnant Projet > Exporter une version validée. Pour exclure les informations de débogage des fichiers SWF dans Flash Builder, vous pouvez définir l’option debug sur false dans la zone de texte des arguments de compilateur supplémentaires, ou générer des fichiers SWF sans débogage en les exportant à l’aide de la fonctionnalité Exporter vers une version validée. Cela inclut les modules, s’ils figurent dans le projet actif. Si vous créez un projet distinct pour les modules, vous pouvez activer ou désactiver le débogage pour l’ensemble du projet sans modifier les paramètres de l’application principale. Pour déboguer un module, vous devez également déboguer son application de chargement. Le débogueur Flex ne se connecte pas aux applications dépourvues d’informations de débogage, même si les modules chargés par l’application les contiennent. En d’autres termes, vous ne pouvez pas exclure les informations de débogage de l’application si vous souhaitez déboguer le module qu’elle charge. Lors de l’utilisation de modules dans une application AIR, le fichier SWF du module doit figurer dans le même répertoire que le fichier SWF de l’application, ou dans l’un de ses sous répertoires.
La fonction Créer un composant Ajax Bridge génère un code proxy JavaScript spécifique aux API d’application que vous voulez appeler à partir de JavaScript. Vous pouvez générer du code pour toute classe ActionScript ou application MXML dans un projet Flash Builder.
Pour les classes ActionScript, vous pouvez générer un code pour tous les éléments suivants ou une partie d’entre eux :
• Propriétés publiques (pour chaque propriété, affichage d’une méthode get et set) • Constantes publiques 1 Cliquez avec le bouton droit sur un projet dans l’Explorateur de packages Flex et sélectionnez Créer un composant
2 Dans la boîte de dialogue Création d’un composant Ajax Bridge, sélectionnez les applications MXML et les classes
3 Spécifiez le répertoire dans lequel générer les classes de proxy. 4 Cliquez sur OK pour générer le code. L’exemple suivant illustre un fichier .js généré pour une application affichant
* * You should keep your JavaScript code inside this file as light as possible, de la description, remplacez le texte par le code HTML à utiliser pour accéder à l’application à partir de la page HTML. Par exemple, ce code ajoute des boutons pour contrôler l’exemple d’application d’image : <h2>Test controls</h2> <ul> <li><input type="button" onclick="DisplayShelfListObj.setCurrentPosition(0)" value="Go to first item"/> Remarque : pour accéder aux fonctions de Flash Professional dans Flash Builder, vous devez installer Flash Professional CS5.5.
Pour créer un projet Flash Professional dans Flash Builder, vous devez avoir déjà commencé le projet dans Flash Professional. C’est-à-dire que le fichier FLA ou XFL doit exister. 1 Sélectionnez Fichier > Nouveau > Projet Flash Professional. 2 Recherchez le fichier FLA ou XFL pour le projet.
3 Spécifiez l’emplacement du projet.
4 Cliquez sur Terminer.
S’il n’est pas déjà en cours d’exécution, Flash Professional démarre.
Vous pouvez appliquer les opérations suivantes aux fichiers source d’un projet Flash Professional :
• Déboguer le fichier dans le débogueur Flash Builder ou Flash Professional : Lors de la modification des fichiers dans Flash Builder, vous pouvez définir des points d’arrêt dans les fichiers ActionScript du projet. Pour déboguer le fichier dans Flash Builder, sélectionnez Exécuter > Déboguer fichier ou cliquez sur le bouton Déboguer dans la barre d’outils. Pour déboguer le fichier dans Flash Professional, sélectionnez Exécuter > Déboguer la séquence ou cliquez sur le bouton Déboguer la séquence dans Flash Builder. Le débogueur Flash Professional reconnaît les points d’arrêt définis dans Flash Builder.
Pour exécuter le fichier dans Flash Builder, sélectionnez Exécuter > Exécuter fichier ou cliquez sur le bouton Exécuter de la barre d’outils. Pour exécuter le fichier dans Flash Professional, sélectionnez Exécuter > Tester la séquence ou cliquez sur le bouton Tester la séquence de la barre d’outils.
1 Sélectionnez Projet > Propriétés > Flash Professional. 2 Sélectionnez Ajouter pour ajouter des fichiers supplémentaires au projet.
Définir par défaut pour spécifier le fichier cible par défaut du projet. 3 Cliquez sur OK.
Adobe Flash® Professional CS5.5 crée des applications compatibles avec Adobe Flash Player 10 ou version ultérieure. Les applications créées avec Flex prennent également en charge Flash Player 10 ou version ultérieure, ce qui signifie que vous pouvez importer dans vos applications des ressources issues de Flash Professional CS5.5. Vous pouvez créer des contrôles, des conteneurs, des habillages et d’autres ressources dans Flash Professional CS5.5, puis les importer dans vos applications sous la forme de fichiers SWC. Pour plus d’informations sur la création de composants à l’aide de Flash Professional CS5.5, voir Extensions pour la création d’habillages Flex et kit de composants Flex pour Flash Professional. La vue Création de l’éditeur Flash Builder vous permet d’insérer un nouveau composant Flash en ajoutant un espace réservé pour un composant ou un conteneur Flash. Vous pouvez appeler Flash Professional CS5.5 à partir de Flash Builder pour créer le composant ou conteneur. Vous pouvez également appeler Flash Professional CS5.5 pour modifier les composants Flash créés précédemment. Si l’application contient un composant SWFLoader destiné à lancer des fichiers SWF, vous pouvez démarrer Flash Professional CS5.5 pour créer ou modifier les fichiers FLA et SWF associés.
1 En mode Création de l’éditeur de Flash Builder, assurez-vous que la vue Composants est visible. 2 Dans le dossier Personnaliser de la vue Composants, faites glisser soit un Nouveau composant Flash soit un
Vous pouvez ensuite redimensionner ou positionner le composant ou conteneur. 3 Dans le menu contextuel ou dans la Vue standard des Propriétés du fichier, sélectionnez Créer dans Adobe Flash.
4 Dans la boîte de dialogue qui s’ouvre, précisez le nom de la classe et du fichier SWC, puis cliquez sur Créer pour
5 Dans Flash Professional CS5.5, modifiez le composant ou conteneur. Sélectionnez Terminer lorsque vous avez fini
Cette procédure suppose que vous avez déjà inséré un composant ou un conteneur Flash dans Flash Builder. 1 En mode Création de l’éditeur Flash Builder, sélectionnez le composant ou le conteneur Flash à modifier. 2 Dans le menu contextuel ou dans la Vue standard des Propriétés Flex, sélectionnez Editer dans Adobe Flash.
3 Dans Flash Professional CS5.5, modifiez le composant ou conteneur. Sélectionnez Terminer lorsque vous avez fini
Cette procédure suppose que l’application contient un composant SWFLoader. 1 En mode Création de l’éditeur Flash Builder, sélectionnez le composant SWFLoader. 2 A partir du menu contextuel du composant ou de la Vue standard de la fenêtre Propriétés, lancez Flash
• Sélectionnez Editer dans Adobe Flash pour modifier le fichier SWF associé au composant SWFLoader. 3 Une fois que vous avez fini de modifier le fichier, sélectionnez Terminer pour retourner à Flash Builder.
Vous pouvez ajouter à l’interface utilisateur des composants Flash créés avec Adobe Flash CS3 Professional. Remarque : pour pouvoir créer des composants Flex dans Flash CS3, installez le kit de composants Flex pour Flash. Pour plus d’informations, voir l’article Importation de ressources Flash CS Professional dans Adobe Flex. 1 Vérifiez que le composant Flash est enregistré dans le chemin d’accès à la bibliothèque du projet en cours.
Pour définir ou connaître le chemin d’accès à la bibliothèque, sélectionnez le projet dans l’Explorateur de packages, puis sélectionnez Projet > Propriétés. Dans la boîte de dialogue Propriétés, sélectionnez la catégorie Chemin de génération Flex, puis cliquez sur l’onglet Chemin d’accès à la bibliothèque. Pour plus d’informations, voir « Création manuelle de projets » à la page 109.
Flash Player n’autorise pas une application à recevoir des données d’un domaine autre que celui à partir duquel il a été chargé, à moins d’une autorisation explicite donnée. Si vous chargez le fichier SWF d’application depuis http://mydomain.com, il ne peut pas charger de données depuis http://yourdomain.com. Ce sandbox de sécurité empêche une utilisation malveillante des fonctions de Flash Player (JaveScript utilise un modèle de sécurité similaire pour empêcher toute utilisation malveillante de JavaScript). Pour accéder aux données provenant d’une application développée avec Flex, trois solutions s’offrent à vous :
• Placez le fichier SWF d’application sur le même serveur que celui hébergeant le service de données. • Sur le serveur contenant le fichier SWF d’application, créez un proxy qui appelle un service de données hébergé sur un autre serveur.
Un fichier de régulation interdomaines est un simple fichier XML qui accorde à Flash Player l’autorisation d’accéder aux données à partir d’un domaine autre que le domaine sur lequel réside l’application. Sans ce fichier de régulation, l’utilisateur est invité à fournir une autorisation d’accès via une boîte de dialogue. Cette situation est à éviter. Le fichier de régulation interdomaines (intitulé crossdomain.xml) est placé à la racine du serveur (ou des serveurs) contenant les données auxquelles vous souhaitez accéder. L’exemple suivant illustre un fichier de régulation interdomaines : <?xml version="1.0"?> <!DOCTYPE cross-domain-policy SYSTEM "http://www.adobe.com/xml/dtds/cross-domain-policy.dtd"> <cross-domain-policy> Pour gérer la sécurité de Flash Player, au lieu d’utiliser un fichier de régulation interdomaines, vous pouvez également utiliser un proxy. ADEP Data Services et BlazeDS fournissent un système de gestion proxy complet pour les applications développées avec Flex. Vous pouvez également créer un simple service proxy en utilisant un langage de script Web tel que ColdFusion, JSP, PHP ou ASP. Le service proxy traite les requêtes de l’application vers le service distant et répond du service distant vers l’application (Flash Player).
Une fois que vous avez configuré un proxy pour accéder aux données d’un service distant, vous placez les fichiers d’application dans le même domaine que le proxy. Dans Flash Builder, vous pouvez modifier les paramètres de version du projet et la configuration de lancement pour gérer l’utilisation d’un proxy. Si vous utilisez Flash Builder pour compiler vos applications et que le serveur proxy est également configuré sur votre ordinateur de développement local, vous pouvez modifier les paramètres de version de projet de sorte à copier automatiquement les fichiers d’application compilés à l’emplacement approprié sur votre serveur Web. Modification d’un chemin de génération de projet 1 Dans l’Explorateur de packages Flex, sélectionnez un projet. 2 Cliquez avec le bouton droit de la souris et sélectionnez Propriétés. La boîte de dialogue des propriétés du projet
3 Sélectionnez la page Chemin de génération Flex. 4 Modifiez le dossier de sortie existant en saisissant un nouveau chemin ou en naviguant jusqu’au dossier approprié
Remarque : si le serveur proxy n’est pas votre ordinateur local, copiez le contenu du répertoire bin sur le serveur avant l’exécution ou le débogage du programme. Modification de la configuration de lancement 1 Le fichier de l’application principale du projet étant ouvert dans Flash Builder, cliquez avec le bouton droit dans l’éditeur et sélectionnez Exécuter en tant que > Exécuter les configurations. La boîte de dialogue Création, gestion et exécution des configurations s’affiche. 2 Dans la liste des configurations, sélectionnez la configuration de lancement du projet. 3 (Facultatif) Dans l’onglet Principal, désélectionnez l’option Utiliser la valeur par défaut pour modifier l’URL ou le
4 Dans la zone de texte Déboguer, saisissez l’URL ou le chemin de la version de débogage de l’application. 5 Dans la zone de texte Profil, saisissez l’URL ou le chemin de la version du profileur de l’application. 6 Dans la zone de texte Exécuter, saisissez l’URL ou le chemin du fichier de l’application principale. 7 Cliquez sur Appliquer, puis sur Fermer.
Regardez cette vidéo de Steven Peeters, professionnel de la communauté Adobe, qui offre un aperçu des flux de travaux entre Flash Catalyst et Flash Builder.
Catalyst Ce flux de travail souligne un ensemble commun d’étapes que les concepteurs effectueront souvent dans Flash Catalyst et d’autres applications CS pour créer des structures filaires et élaborer rapidement des prototypes d’applications. L’implication d’un développeur permet d’étendre encore les projets Flash Catalyst à l’aide de Flash Builder, par exemple pour se connecter à une base de données ou à des services Web. Les flux de travaux 2 et 3 montrent comment des fichiers et des parties d’applications, telles que des habillages et des composants, peuvent être échangés entre concepteurs et développeurs.
états des composants Voir les flux de travail 2 ou 3
Créer une structure filaire ou importer une conception complète : utilisez les outils graphiques disponibles dans Flash
Créer ou acquérir des illustrations et du contenu audio et vidéo supplémentaires : créez des illustrations et du
Pour les composants centrés sur les données, tels que les listes de données, importez un échantillon de données représentatif (texte ou images). Pour plus d’informations, voir Importation d’illustrations. Une fois une illustration importée ou créée dans Flash Catalyst, vous pouvez la modifier dans Illustrator ou Photoshop, puis la renvoyer, ainsi modifiée, à Flash Catalyst. L’aller-retour de modifications constitue une extension des fonctionnalités de dessin et d’édition graphique de Flash Catalyst et améliore le processus de conception itératif. Pour plus d’informations, voir Aller-retour de modification d’illustrations. Créer et modifier les états d’affichage : créez des états en fonction de la spécification du projet. Pour plus
Créer des composants interactifs et définir des états de composant : convertissez les illustrations en composants prédéfinis (boutons, barres de défilement, listes de données et ainsi de suite). Utilisez le panneau Bibliothèque commune pour ajouter rapidement des composants courants d’aspect générique. Créez des composants personnalisés pour les comportements que vous ne pouvez pas capturer à l’aide des composants intégrés. Pour plus d’informations, voir Qu’est-ce qu’un composant ?
(enregistrements de base de données ou images bitmap, par exemple) ne nécessitant pas de connexion effective à un système back-end. Les développeurs Flex peuvent remplacer les données en phase de conception par des données réelles issues d’une base de données ou d’un service Web. Pour plus d’informations sur l’utilisation des données en phase de conception, voir Lites de données et panneaux de défilement. Créer ou modifier des états de composant : les composants peuvent avoir plusieurs états. Un bouton peut avoir par
Remarque : les étapes de création des états de page et des composants interactifs sont interchangeables. Certains concepteurs préfèrent commencer par créer tous les composants interactifs avant de les ajouter aux pages et aux états. Définir les interactions et les transitions : ajoutez des interactions définissant ce qui se produit lorsque les utilisateurs interagissent avec l’application. Vous pouvez par exemple créer des interactions définissant la transition d’un état de page ou de composant vers un autre lorsque l’utilisateur clique sur un bouton. Vous pouvez également ajouter des interactions déclenchant la lecture d’animations, contrôlant la lecture de vidéos ou ouvrant une URL. Utilisez le panneau Scénarios pour ajouter des transitions régulières animées entre les états de page et de composant ainsi que pour les modifier. Pour plus d’informations sur les interactions, voir Définition de la navigation et du comportement à l’aide des interactions. Pour plus d’informations sur les transitions, voir Animations. Tester le projet : testez fréquemment le projet au cours du développement pour vous assurer du bon fonctionnement
Builder. Le format FXP est un format d’archive contenant les dossiers, les fichiers et les métadonnées d’un projet.
• Créer un prototype
A l’aide de Flash Builder, le développeur peut ajouter les comportements de logique commerciale, de connectivité de données, de présentation avancée et des composants habillables personnalisés. Il peut renvoyer le fichier FXP au concepteur pour une modification ultérieure des habillages, l’ajout de l’interactivité et de l’animation au fur et à mesure de l’avancement du projet. Le développeur doit assurer en permanence le maintien de la compatibilité avec Flash Catalyst dans le projet. Pour plus d’informations sur la compatibilité avec Flash Catalyst dans Flash Builder, voir Directives pour la création d’un projet compatible avec Flash Catalyst. Si un travail de conception ultérieur s’avère nécessaire, le concepteur peut rouvrir le fichier FXP dans Flash Catalyst et modifier les habillages, la présentation et l’interactivité de base du projet. Il peut ensuite enregistrer le fichier FXP à nouveau et permettre au développeur d’incorporer ces modifications dans le projet à l’aide de Flash Builder. Remarque : certains composants et autres aspects du projet peuvent être impossibles à modifier dans Flash Catalyst après leur modification dans Flash Builder. Lorsqu’il est achevé, le projet peut être finalisé et publié dans Flash Builder.
• Configurer un ou des projets de bibliothèque
Catalyst, voir « Utilisation de projets de bibliothèque Flex » à la page 228. Un fichier FXPL est exporté depuis la bibliothèque du projet et contient des informations concernant le composant, nécessaires au développeur pour son utilisation dans Flash Builder. Dans Flash Builder, le développeur intègre le fichier FXPL en tant que partie d’un projet plus important. Le développeur peut exporter des fichiers FXPL pour les renvoyer au concepteur, sous forme de composants habillables personnalisés modifiables dans Flash Catalyst. Pour plus d’informations sur la création de composants habillables personnalisés dans Flash Builder, voir « Création d’un composant ActionScript habillable » à la page 42. Vous pouvez ensuite importer les ressources de conception dans Flash Builder sous forme de nouveau projet, puis comparer et fusionner les modifications à l’aide des outils de Flash Builder. Pour plus d’informations, voir « Transfert de fichiers entre Flash Builder et Flash Catalyst » à la page 256 Si un travail de conception supplémentaire s’avère nécessaire, vous pouvez transmettre les fichiers FXPL sous forme d’allers-retours entre Flash Builder et Flash Catalyst. Assurez vous en permanence de maintenir la compatibilité avec Flash Catalyst dans le projet. Pour plus d’informations sur le maintien de la compatibilité avec Flash Catalyst dans le projet, voir « Vérification de la compatibilité avec Flash Catalyst » à la page 255.
Intégration de Flash Catalyst et de Flash Builder Structure de projet permettant d’assurer la compatibilité avec Flash Catalyst Flash Catalyst CS5.5 prend en charge un jeu partiel de fonctionnalités et de composants disponibles dans Flex 4.5 ou version supérieure. Par conséquent, il est important de structurer le projet pour un fonctionnement transparent dans Flash Catalyst.
Lors de la planification de votre projet, identifiez les parties visuelles appartenant au concepteur et les parties logiques appartenant au développeur. En général, le concepteur est chargé des objets visuels, des animations et de la présentation de base du projet. Le développeur est habituellement chargé de l’architecture, de la fonctionnalité et de la présentation de niveau application du projet. sh Catalyst et Flash Builder proposent plusieurs outils permettant de définir un contrat précis entre conception et développement. La séparation du projet entre projet principal et projets de bibliothèque compatibles avec Flash Catalyst définit clairement les parties du projet modifiables par le concepteur. L’utilisation de composants habillables fournit une séparation précise entre la logique et les visuels au niveau du composant.
Les projets de bibliothèque permettent de séparer la conception et la logique au niveau du projet. Il sont utilisés par les développeurs afin de séparer des parties du projet devant être modifiées dans Flash Catalyst. Les projets de bibliothèque simplifient également le processus de fusion, car généralement le développeur ne modifie pas le projet de bibliothèque lorsqu’il est en cours d’utilisation par le concepteur. Création d’un projet principal et d’un projet de bibliothèque complémentaire compatible avec Flash Catalyst 1 Créez le projet Flex principal. Pour plus d’informations, voir « Projets Flex » à la page 88. 2 Créez un projet de bibliothèque Flex.
Flash Catalyst dans l’assistant Nouveau projet de bibliothèque Flex. Pour plus d’informations, voir « Création de projets de bibliothèque Flex » à la page 229. 3 Ajoutez le projet de bibliothèque au chemin de génération du projet Flex principal.
4 Placez les composants habillables et les habillages dans le projet de bibliothèque et les fichiers de code dans le projet
Un composant habillable contient la partie logique d’un composant, tandis que l’habillage contient les éléments visuels et les règles de présentation. En outre, un composant habillable peut indiquer que son habillage contient des parties et des états. Le composant hôte peut contrôler les parties et les états de l’habillage par programmation. En restreignant la communication entre le composant habillable et ses habillages aux parties et aux états, vous obtenez deux parties indépendantes et flexibles. Pour plus d’informations sur la création de composants habillables personnalisés dans Flash Builder, voir Exemple : création d’un composant Spark habillable. Après la création d’une définition de composant habillable dans Flash Builder, créez un exemple d’habillage initial. Dans ce cas, si vous importez le projet dans Flash Catalyst, l’habillage apparaît dans le panneau Composants de Flash Catalyst. Vous pouvez alors facilement modifier l’habillage dans Flash Catalyst. La création d’un exemple d’habillage aide le concepteur à comprendre la structure de base de l’habillage.
Composants habillables personnalisés Toutefois, Flash Builder fournit un vérificateur de compatibilité qui indique précisément les parties du code pouvant être modifiées dans Flash Catalyst. Lorsque vous créez un projet compatible avec Flash Catalyst dans Flash Builder, le vérificateur de compatibilité avec Flash Catalyst (Projet > Propriétés > Flash Catalyst) est automatiquement activé. Lorsque vous créez un projet dans Flash Catalyst et l’importez dans Flash Builder, il est automatiquement configuré pour être compatible avec Flash Catalyst. Si vous introduisez des incompatibilités lors de la modification du projet, Flash Builder affiche les erreurs de compatibilité dans la vue Erreurs en indiquant les parties du code pouvant être modifiées dans Flash Catalyst. Vous ne devez pas nécessairement résoudre toutes les erreurs de compatibilité avant d’ouvrir un projet dans Flash Catalyst. La colonne « Type » de la vue Erreurs affiche l’impact de chaque erreur de compatibilité. Les erreurs qui empêchent l’ouverture du projet dans Flash Catalyst s’affichent sous forme d’avertissements. Les erreurs moins graves s’affichent comme notifications d’« information ».
Incompatibilité de fichier
Toute incompatibilité dans l’application principale rend le projet incompatible.
être affectée dans Flash Catalyst.
Catalyst. Vous pouvez modifier l’aspect de la liste dans Flash Catalyst.
Vous pouvez ensuite transmettre des fichiers FXLP en allers-retours entre Flash Builder et Flash Catalyst afin d’échanger uniquement les habillages de composants et les ressources de conception. Pour s’assurer que tout est fait dans l’ordre, le concepteur peut importer les fichiers FXPL dans un projet Flash Catalyst, créer des habillages visuels et ajouter l’interactivité. Utilisez les flux de production d’exportation et d’importation suivants pour transmettre les fichiers FXP et FXPL sous forme d’allers-retours entre Flash Builder et Flash Catalyst. Transfert de fichiers de Flash Builder à Flash Catalyst • Pour exporter un fichier FXP ou FXPL de Flash Builder vers Flash Catalyst, sélectionnez Projet > Flash Catalyst > Exporter un projet Flash Catalyst.
Transfert de fichiers de Flash Catalyst à Flash Builder • Pour exporter un fichier FXP ou FXPL de Flash Catalyst vers Flash Builder, accédez à Fichier > Exporter et sélectionnez Fichier Adobe FXG (.fxg) ou Package de bibliothèque (.fxpl).
Importer un projet Flash Catalyst.
Si Flash Builder et Flash Catalyst sont installés sur le même ordinateur, vous pouvez utiliser la commande Editer dans Flash Builder pour modifier les fichiers FXP. Pour plus d’informations, voir « Commande Editer dans Flash Catalyst » à la page 257.
Lors de l’importation de fichiers FXP ou FXPL de Flash Catalyst dans Flash Builder, vous pouvez comparer et fusionner les différences entre les deux projets à l’aide de l’éditeur de comparaison. Vous pouvez également utiliser un outil de fusion tiers de votre choix. Lorsque vous créez des éléments de conception dans Flash Catalyst, vous pouvez les intégrer dans Flash Builder en important le fichier FXP ou FXPL avec les méthodes suivantes.
• Remplacez le fichier FXP existant avec la version mise à jour uniquement si aucune modification n’a été apportée au projet dans l’intervalle. Remarque : il est impossible de remplacer les projets de bibliothèque (.fxpl). Pour comparer les projets à l’aide de l’éditeur de comparaison, sélectionnez les projets en maintenant la touche Ctrl enfoncée tout en cliquant sur les projets à comparer. Ensuite, cliquez avec le bouton droit de la souris sur les projets sélectionnés et choisissez Comparer > Réciproquement. Les résultats s’affichent dans le panneau Comparaison de texte. Remarque : lors de la fusion, vous observez plusieurs modifications dans les fichiers de paramètres, tels que actionScriptProperties, ou dans les fichiers en sortie, tels que bin-debug, ou dans d’autres parties du projet. Vous pouvez généralement ignorer ces modifications et vous concentrer uniquement sur les modifications du dossier source. Pour plus d’informations sur l’utilisation de l’éditeur de comparaison, voir la documentation d’Eclipse.
Utilisez la commande Editer dans Flash Catalyst si vous disposez de Flash Builder et de Flash Catalyst sur le même ordinateur. Vous pouvez lancer Flash Catalyst depuis Flash Builder et apporter directement au projet toute modification de conception nécessaire, sans transmettre les fichiers entre Flash Builder et Flash Catalyst. 1 Pour lancer Flash Catalyst directement depuis Flash Builder, sélectionnez Projet > Flash Catalyst > Editer le projet
Vous pouvez également sélectionner Flash Catalyst > Editer le projet dans Flash Catalyst dans le menu contextuel du projet. 2 Modifiez la création de l’application, si nécessaire. Lorsque vous modifiez le projet dans Flash Catalyst, le projet est
3 Enregistrez les modifications et fermez le projet dans Flash Catalyst. Vous ne devez pas nécessairement quitter
4 Dans Flash Builder, sélectionnez Projet > Reprendre le travail sur le projet dans Flash Builder. Vous pouvez
Les modifications de création sont ajoutées au projet et le projet est ouvert pour être modifié dans Flash Builder.
Définition des préférences de Flash Builder 1 Ouvrez la boîte de dialogue Préférences :
• (Macintosh, autonome) Sélectionnez Fenêtre > Préférences. La configuration RDS par défaut est le point de départ pour l’établissement d’une connexion aux services de données. Modifiez la configuration par défaut afin de permettre l’accès à votre serveur ou base de données. Pour plus d’informations sur la configuration RDS, voir la documentation d’ADEP Data Services. Important : la configuration RDS présente des implications en termes de sécurité. Pour plus d’informations sur les implications au niveau de la sécurité du serveur d’applications, voir la documentation relative à ADEP Data Services.
Vous pouvez personnaliser le workbench en fonction de vos besoins. Il vous est par exemple possible de définir l’affichage des éléments dans la barre d’outils principale, de créer des raccourcis clavier ou encore de modifier les polices et les couleurs de l’interface utilisateur.
1 Vérifiez que la barre d’outils est déverrouillée. Dans le menu contextuel de la barre d’outils, désélectionnez l’option
2 Positionnez le pointeur sur la ligne verticale qui délimite sur la gauche la section à déplacer. 3 Cliquez sur cette ligne et déplacez la section vers la gauche, la droite, le haut ou le bas. Relâchez le bouton de la souris
Afin d’éviter tout déplacement non intentionnel des barres d’outils, verrouillez-les de nouveau en activant l’option correspondante de leur menu contextuel.
1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Touches. 2 Dans l’écran Vue de la boîte de dialogue Touches, sélectionnez la commande à modifier. 3 Dans le champ Liaison, saisissez le nouveau raccourci clavier à lier à la commande. 4 Dans la liste déroulante Quand, sélectionnez à quel moment le raccourci clavier doit être activé. 5 Cliquez sur Appliquer ou sur OK.
Par défaut, le workbench utilise les polices et les couleurs du système d’exploitation de l’ordinateur. Vous pouvez cependant personnaliser les polices et les couleurs de différentes manières. 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général > Apparence > Couleurs et polices. 2 Développez les catégories Comparaison de texte, Couleurs et polices de base, CVS, Déboguer ainsi que Dossiers des
Remarque : vous pouvez également cliquer sur Utiliser la police du système au lieu de Modifier pour laisser le système d’exploitation choisir une valeur de police appropriée. Sous Windows par exemple, si vous sélectionnez cette option, Flash Builder utilise la police sélectionnée dans les propriétés d’affichage du Panneau de configuration de Windows. 3 Définissez vos préférences en matière de police et de couleur.
Vous pouvez définir la réaction du workbench à un clic ou à un double-clic. 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Général. 2 Dans la section Mode d’ouverture, sélectionnez les options voulues et cliquez sur OK.
Vous pouvez définir les préférences de nombreux aspects du workbench. Vous pouvez par exemple configurer Flash Builder de manière à ce qu’il vous invite à sélectionner l’espace de travail au démarrage, définir l’éditeur à utiliser à l’ouverture de certains types de ressource ainsi que paramétrer différentes options pour l’exécution et le débogage de vos applications. Vos préférences Flash Builder s’appliquent uniquement à l’espace de travail actuel. Vous pouvez cependant exporter les préférences du workbench et les importer dans un autre espace de travail. L’exportation des préférences est utile si vous gérez plusieurs espaces de travail ou si vous souhaitez partager les préférences du workbench avec d’autres membres de votre équipe de développement. Vous pouvez également définir des préférences individuelles pour chaque projet d’un espace de travail, par exemple définir des options de compilation ou de débogage distinctes pour chacun de vos projets Flex. Définition des préférences du workbench Flash Builder 1 Ouvrez la fenêtre Préférences. 2 Développez Général, choisissez l’une des catégories de préférences du workbench et modifiez-la si nécessaire. 3 Cliquez sur OK.
Flash Builder Avertissement avant la mise à niveau d’anciens projets Flash Builder Flash Builder met à jour les projets qui ont été créés dans l’une de ses versions antérieures. La mise à jour englobe la mise en conformité des fichiers et de la structure du projet avec la structure actuelle des projets Flash Builder. Un projet converti ne pourra plus être ouvert avec une version antérieure de Flash Builder. Par défaut, Flash Builder vous avertit avant de procéder à la conversion. Désactivez cette option pour que les conversions s’effectuent sans avertissement.
Les préférences disponibles pour Données/Services sont décrites ci-dessous. Elles s’appliquent à tous les projets se trouvant dans votre environnement de développement Flash Builder. Vous pouvez les remplacer pour chaque projet individuellement. Sélectionnez Projet > Propriétés > Données/Services pour remplacer les préférences qui y sont spécifiées. Générateur de code Flash Builder fournit un utilitaire de génération de code par défaut pour générer l’accès aux services de données. Faites appel aux fonctions d’extensibilité de Flash Builder pour créer vos propres utilitaires de génération de code et les ajouter à Flash Builder en tant que plug-in. Pour plus d’informations, voir Guide de référence des API d’extensibilité de Flash Builder. Toute extension de génération de code ajoutée à Flash Builder en tant que plug-in est répertoriée dans la liste déroulante Générateur de code.
Par défaut, cette option n’est pas activée. Au cours de la génération de code, chaque application client d’un projet crée sa propre occurrence d’un service de données. Pour que les applications client du projet partagent une seule occurrence du service, activez cette option. Cette option est disponible uniquement si vous sélectionnez l’utilitaire de génération de code par défaut de Flash Builder.
Les options de débogage décrites ci-dessous sont activées par défaut. Pour les autres options affectant une session de débogage, voir : Ne désactivez pas cette option si vous souhaitez que Flash Builder vous avertisse de la tentative de démarrage d’une seconde session de débogage.
Dans certains cas, le navigateur Web émet une erreur de sécurité lorsqu’il ne peut pas lire le fichier de confiance de sécurité de Flash Player. Le redémarrage du navigateur Web suffit généralement à résoudre ce problème. Ne désactivez pas cette option si vous souhaitez que Flash Builder vous avertisse de ce type d’erreur de sécurité. Voir la note technique pour l’avertissement de sécurité de Flash Player.
Au cours des étapes d’une session de débogage, les variables représentant les fonctions d’accesseur (getter) sont automatiquement évaluées. Ce comportement est généralement utile au cours d’une session de débogage. Désactivez cette option si vous ne souhaitez pas évaluer automatiquement les variables représentant des fonctions d’accesseur lors des étapes d’une session de débogage.
Lorsque vous lancez ou déboguez une application à partir de Flash Builder, vous pouvez spécifier l’exécutable de Flash Player à utiliser. Pour ce faire, sélectionnez Flash Builder > Déboguer dans la boîte de dialogue Préférences. Définissez ensuite l’emplacement du fichier exécutable de Flash Player que Flash Builder utilise pour déboguer ou lancer votre application.
Launcher. Voir « Gestion des configurations de lancement » à la page 120. Flash Builder fournit des configurations par défaut pour les téléphones Nexus One, Droid, Apple iPad, Apple iPhone, HTC et Samsung Android. Vous ne pouvez pas modifier les configurations par défaut.
Général Flash Builder fournit des options utilisateur pour la réduction du code, en signalant les problèmes à mesure que vous saisissez le code et en utilisant le positionnement du caret au niveau du sous-mot. L’éditeur de source MXML ou ActionScript de Flash Builder fournit des conseils de code qui vous aident à compléter vos expressions de code. Il facilite par exemple la sélection des classes recommandées, des propriétés et des événements disponibles.
Désactivez l’option Activer l’activation automatique si vous ne souhaitez pas que les conseils de code soient automatiquement affichés en cours de frappe. Si cette option est désactivée, vous pouvez accéder aux conseils de code en appuyant sur les touches Ctrl+Espace.
MXML ou ActionScript. Si vous tapez sur une seule touche du raccourci, des conseils de code sont appelés. Par exemple, si vous spécifiez comme touches de raccourci ab. Une pression sur a ou sur b appelle l’assistant de code.
« Outils de développement de code dans Flash Builder » à la page 48
Flash Builder fournit des options utilisateur permettant la mise en retrait à l’aide de tabulations au lieu d’espaces et la mise en retrait automatique des nouvelles lignes de saisie.
Préférences générales de l’éditeur pour Eclipse Pour définir d’autres préférences générales de l’éditeur, sélectionnez Préférences > Général > Editeurs.
Chacune de ces fonctions par défaut peut être désactivée. Lorsque vous saisissez un code ActionScript dans les éditeurs de Flash Builder, l’assistant de contenu vous propose une liste d’options pour terminer votre expression de code. Vous pouvez compléter automatiquement votre code ActionScript partiellement saisi en utilisant des touches de raccourci de remplissage. Pour ce faire, Flash Builder fournit des touches de raccourci par défaut. Vous pouvez choisir de remplacer les touches de raccourci par défaut par vos propres raccourcis. Vous pouvez aussi choisir d’insérer le code en appuyant sur la barre d’espacement. Cycle d’assistance au contenu Lors de la saisie de code ActionScript, appuyez plusieurs fois sur les touches Ctrl+Espace pour faire défiler les filtres pour les conseils de code affichés. Vous pouvez spécifier les conseils de code à afficher, ainsi que l’ordre de défilement des conseils de code. Pour modifier le paramètre par défaut, procédez comme suit : 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Flash Builder > Editeurs > Code ActionScript > Cycle
2 Sélectionnez un type d’indicateur et modifiez-en la position dans le cycle de défilement en cliquant sur les boutons
Le premier type d’indicateur de la liste sera affiché en premier. Mise en retrait Par défaut, Flash Builder met en retrait le contenu du package, les déclarations de fonction et les instructions switch. Chacune de ces fonctions par défaut peut être désactivée.
« Outils de développement de code dans Flash Builder » à la page 48 « Assistant de contenu » à la page 48
Vous pouvez personnaliser le code de remplacement prédéfini généré par Flash Builder lorsque vous créez des méthodes ou des fonctions d’accesseur get et set, générez des gestionnaires d’événement ou remplacez des méthodes.
MXML, ActionScript et CSS. Vous pouvez créer et modifier des modèles de code. Vous pouvez également importer et exporter les fichiers de modèles de code. Pour plus d’informations à propos de l’utilisation, de la création et de la modification des modèles de code, voir « Création et modification de modèles de code » à la page 57.
Flash Builder comporte les préférences suivantes pour le mode Création de l’éditeur de source.
Lors du passage en mode Création de l’éditeur de source, Flash Builder ouvre automatiquement les vues associées, telles que Propriétés, Etats, Composants et Aspects. Désactivez cette préférence pour personnaliser le choix des vues qui s’ouvriront en mode Création.
En mode Création, Flash Builder comporte une grille invisible qui aligne automatiquement les composants ajoutés ou déplacés. Désactivez cette préférence pour avoir une meilleure maîtrise du positionnement des composants.
Le mode Création représente les composants dotés d’un habillage placés dans la zone de création. Pour désactiver le rendu des habillages des composants en mode Création, désélectionnez cette préférence.
En mode Création, les expressions de liaison des données ne reflètent généralement pas précisément la forme ou la taille des données auxquelles elles sont liées. Activez cette préférence pour autoriser le mode Création de l’éditeur à rendre les composants liés à des expressions de liaison de données avec une plus grande précision.
La modification d’un identifiant de composant dans la vue Propriétés peut avoir une incidence sur le code de l’espace de travail qui fait référence à cet identifiant. Activez cette préférence pour que Flash Builder mette automatiquement à jour toutes les références aux ID de composant lorsque vous modifiez un ID de composant dans la vue Propriétés.
Lorsque vous ouvrez un fichier MXML dans l’Explorateur de packages, il est toujours ouvert dans le mode Source de l’éditeur. Si cette préférence est désactivée, le fichier MXML est ouvert dans le dernier mode dans lequel l’éditeur l’a ouvert. Par exemple, supposons que le fichier MXML a été en dernier ouvert dans le mode Création, puis fermé. Lors de la prochaine ouverture de ce fichier MXML, l’éditeur ouvre à nouveau le fichier en mode Création.
Lorsqu’il est disponible, l’assistant de contenu affiche des indicateurs sur les éléments de langage pouvant être insérés dans le code. Pour parcourir les éléments affichés dans la fenêtre de l’assistant de contenu, appuyez plusieurs fois sur les touches Ctrl+Espace. Vous pouvez spécifier les conseils de code à afficher, ainsi que l’ordre de défilement des conseils de code. Pour modifier le paramètre par défaut, procédez comme suit : 1 Ouvrez la boîte de dialogue Préférences et sélectionnez Flash Builder > Editeurs > Code MXML > Cycle
2 Spécifiez les types d’indicateurs que vous souhaitez afficher. 3 Sélectionnez un type d’indicateur et modifiez-en la position dans le cycle de défilement en cliquant sur les boutons
Le premier type d’indicateur de la liste sera affiché en premier.
« Assistant de contenu » à la page 48 « Outils de développement de code dans Flash Builder » à la page 48 Formatage Par défaut, Flash Builder formate le code MXML généré automatiquement. Par exemple, Flash Builder formate le code MXML qui est généré automatiquement lorsque vous ajoutez un composant dans la vue Création ou lorsque vous utilisez les outils Flash Builder pour vous connecter à un service de données et accéder aux données. Vous pouvez modifier l’ordre et le regroupement des attributs dans la boîte de dialogue des préférences de formatage. Le formatage ne s’applique pas au code rédigé à la main. Pour formater un fragment de code rédigé à la main, sélectionnez Source > Appliquer le formatage (Ctrl+Maj+F). Le code est ensuite formaté, que vous ayez ou non sélectionné l’option Maintenir les attributs MXML organisés. Mise en retrait Par défaut, la mise en retrait du code s’effectue par tabulations. Ce paramètre peut être modifié en faveur de l’utilisation d’espaces. La taille de la tabulation et de la mise en retrait par défaut équivaut à quatre espaces. Sélectionnez ActionScript ou MXML sous Mise en retrait dans la boîte de dialogue Préférences afin d’afficher les paramètres correspondants. Vous pouvez également personnaliser les méthodes heuristiques de mise en retrait.
La coloration de la syntaxe et la mise en évidence de texte dans les fichiers ActionScript, CSS et MXML sont définies par défaut. Ces paramètres par défaut peuvent être remplacés. Développez le nœud du langage et sélectionnez une fonction de langage pour remplacer la fonction par défaut. Les préférences générales de l’éditeur pour Eclipse sont également disponibles. Voir :
• Préférences > Général > Couleurs et polices
1 Ouvrez la boîte de dialogue Préférences et sélectionnez Flash Builder > Associations de fichiers. 2 Sélectionnez les options Fichiers ActionScript (*.as) et Fichiers MXML (*.mxml) pour définir les associations de
Vous pouvez spécifier les types de fichier que vous souhaitez que Flash Builder ne copie pas dans le dossier de sortie au cours de la compilation du projet. 1 Ouvrez la boîte de dialogue Préférences, puis sélectionnez Flash Builder > Exclusions de fichiers. 2 Vous pouvez ajouter des extensions de nom de fichier et des noms de fichier, ou supprimer des éléments existants
3 Pour ajouter des extensions de nom de fichier ou des noms de fichier, cliquez sur Nouveau, puis indiquez une
4 Pour restaurer la liste par défaut des extensions à n’importe quel moment, cliquez sur Restaurer les valeurs par
Les modèles de fichiers interviennent lors de la création de nouveaux fichiers MXML, ActionScript et CSS et peuvent être personnalisés. Vous pouvez également importer et exporter des fichiers de modèles. Dans la zone Types de fichier, sélectionnez le modèle d’un type de fichier. Cliquez sur Editer pour le modifier. Désactivez l’option Mise en retrait automatique des nouveaux fichiers si vous ne souhaitez pas faire appel aux préférences de mise en retrait de Flash Builder lors de la création de fichiers. Vous pouvez modifier les préférences de mise en retrait de Flash Builder. Accédez à Préférences > Flash Builder > Mise en retrait.
« Personnalisation des modèles de fichier » à la page 62 « Mise en retrait » à la page 263
Mode de lancement par défaut Lorsque vous exécutez un test FlexUnit, Flash Builder est lancé par défaut en mode de débogage. Cette préférence vous permet de modifier le mode de lancement de Flash Builder pour les tests FlexUnit. Les modes de lancement par défaut de Flash Builder sont les suivants :
Par défaut, ce mode lance la perspective Flash.
• Préférences > Exécution/Débogage > Perspectives Nom de l’application personnalisée Spécifiez le nom complet du fichier de l’application FlexUnit personnalisée. Si le fichier de l’application FlexUnit personnalisée ne se trouve pas dans le projet Flex sélectionné, Flash Builder génère automatiquement un fichier d’application FlexUnit par défaut. Numéro de port Spécifie le numéro de port à utiliser pour connecter Flash Builder à l’application FlexUnit sur le périphérique mobile. Le numéro de port présente une valeur de 8765 codée en dur. Utilisation d’une structure alternative Par défaut, les fichiers SWC de la structure qui sont disponibles avec Flash Builder sont ajoutés au chemin de génération FlexUnit. Pour indiquer une structure FlexUnit différente, sélectionnez Use Alternative Framework. Accédez à l’emplacement du répertoire de la structure que vous souhaitez sélectionner. Lorsque vous créez une classe de cas de test ou une suite de cas de test FlexUnit pour le projet sélectionné, Flash Builder ajoute automatiquement les fichiers SWC figurant dans le répertoire de la structure alternative au chemin de génération de FlexUnit. Lorsque vous créez un répertoire de structure FlexUnit alternative, il est recommandé d’utiliser la structure de répertoire suivante pour les fichiers SWC :
Paul Robertson, professionnel de la communauté Adobe, a publié sur son blog un article concernant la création d’un framework FlexUnit personnalisé.
Vous pouvez ajouter et supprimer des SDK ainsi que modifier le SDK utilisé par défaut pour les projets n’en spécifiant aucun. Flash Builder vous demande de choisir le SDK que vous souhaitez utiliser à l’importation de projets créés avec l’une de ses versions antérieures. Vous pouvez désactiver l’affichage de cette invite à l’importation de projets. Les types de SDK disponibles sont les suivants : SDK Adobe Flex gratuit : versions publiées de produits Adobe officiels. Ces SDK contiennent différents composants
SDK Flex Open Source : ce type est destiné aux utilisateurs souhaitant un package ne contenant que du code « open
Modules complémentaires Adobe pour SDK Flex « open source » : ce package contient tous les éléments qui se trouvent dans le SDK Flex Adobe et non dans le SDK Flex « open source ». Le téléchargement de ce fichier vous permet d’aligner le SDK Flex « open source » sur le SDK Flex Adobe.
Les SDK sont généralement placés dans le répertoire d’installation de Flash Builder à l’emplacement suivant : <Flash Builder Install Directory>/sdks/
4 Cliquez sur Ajouter, puis recherchez le SDK Flex décompressé. Cliquez sur Appliquer. 5 Pour chaque projet utilisant le SDK Flex, accédez à cette boîte de dialogue et sélectionnez le SDK qui sera utilisé par
La page de préférences Moniteur de réseau répertorie les ports sur lesquels le Moniteur de réseau intercepte des événements et écoute les requêtes HTTP. Par défaut, le Moniteur de réseau supprime au démarrage toutes les entrées. Cette préférence peut être désactivée. Vous pouvez également activer les préférences suivantes :
• Ignorer les vérifications de sécurité SSL L’activation de cette préférence est utile pour surveiller le trafic réseau à partir d’un serveur autosigné.
Par défaut, le profilage de la mémoire et le profilage des performances sont tous les deux activés.
Le profilage de la mémoire permet de déterminer la quantité de mémoire utilisée par un objet ou un type d’objet dans l’application. Faites appel au profilage de la mémoire pour diminuer la taille des objets, réduire le nombre d’objets créés ou permettre le nettoyage des objets dans la mémoire en supprimant les références à ces objets. La quantité de mémoire utilisée par le profilage de la mémoire est bien supérieure à celle utilisée par le profilage des performances et peut donc ralentir votre application.
Le profilage des performances recherche les méthodes de l’application dont l’exécution est lente et qui sont susceptibles de pouvoir être améliorées ou optimisées. Vous pouvez définir les préférences suivantes pour le profileur :
Spécifiez le numéro de port que Flash Builder écoute lors du profilage d’une application. Le numéro de port par défaut est 9999. Ce port ne peut pas être défini sur 7935, ce dernier étant utilisé par le débogueur Flash.
RP indique une perte de mémoire. Par défaut, le profileur affiche dix chemins de références arrière. Vous pouvez augmenter cette valeur ou activer l’option d’affichage de tous les chemins de références arrière.
Vous pouvez spécifier quel lecteur Adobe Flash Player autonome et quel navigateur Web vous voulez utiliser pour le profilage des applications externes. Utilisez une version de débogage de Flash Player pour profiler une application.
Flash Builder ouvre l’application avec la version par défaut du débogueur du lecteur Flash Player autonome.
« Utilisation du profileur » à la page 162 « Vues du profileur » à la page 145
Pour le développement d’applications mobiles destinées à la plateforme Android, Flash Builder installe les parties nécessaires du SDK Android. Sélection d’une interface réseau principale Lorsque vous déboguez votre application via le réseau, votre machine hôte peut être connectée à plusieurs interfaces réseau simultanément. Toutefois, vous pouvez sélectionner une interface réseau principale à utiliser pour le débogage dans le package APK Android ou le package iOS de débogage.
Exécution et débogage des applications mobiles
L’API d’extensibilité de Flash Builder vous permet d’étendre Flash Builder de manière à prendre en charge les composants personnalisés. Elle permet notamment d’étendre les vues Création et Propriétés afin de garantir une prise en charge correcte des composants personnalisés. Voir Flash Builder Design View extension FAQ pour obtenir les réponses aux questions les plus fréquemment posées concernant les extensions de la vue Création. Vous pouvez également étendre la prise en charge par Flash Builder des services disponibles à partir de l’assistant des services. Pour plus d’informations, voir Guide de référence des API d’extensibilité de Flash Builder.
Notice Facile