Adobe FLASH BUILDER 4 Manuel du propriétaire

Ajouter à Mes manuels
259 Des pages
Utilisation de
ADOBE&reg; FLASH&reg; BUILDER 4
Derni&egrave;re mise &agrave; jour le 29/4/2010
&copy; 2010 Adobe Systems Incorporated. All rights reserved.
Copyright
Utilisation d’Adobe&reg; Flash&reg; Builder™ 4.
If this guide is distributed with software that includes an end-user agreement, this guide, as well as the software described in it, is furnished under license and
may be used or copied only in accordance with the terms of such license. Except as permitted by any such license, no part of this guide may be reproduced, stored
in a retrieval system, or transmitted, in any form or by any means, electronic, mechanical, recording, or otherwise, without the prior written permission of Adobe
Systems Incorporated. Please note that the content in this guide is protected under copyright law even if it is not distributed with software that includes an enduser license agreement.
The content of this guide is furnished for informational use only, is subject to change without notice, and should not be construed as a commitment by Adobe
Systems Incorporated. Adobe Systems Incorporated assumes no responsibility or liability for any errors or inaccuracies that may appear in the informational
content contained in this guide.
Please remember that existing artwork or images that you may want to include in your project may be protected under copyright law. The unauthorized
incorporation of such material into your new work could be a violation of the rights of the copyright owner. Please be sure to obtain any permission required
from the copyright owner.
Any references to company names in sample templates are for demonstration purposes only and are not intended to refer to any actual organization.
Adobe, the Adobe logo, ActionScript, ColdFusion, Flash, Flash Builder, Flex, and Flex Builder are either registered trademarks or trademarks of Adobe Systems
Incorporated in the United States and/or other countries.
Windows is either a registered trademark or trademark of Microsoft Corporation in the United States and/or other countries. Java is a trademark or registered
trademark of Sun Microsystems, Inc. in the United States and other countries. All other trademarks are the property of their respective owners.
This Work is licensed under the Creative Commons Attribution Non-Commercial 3.0 License. To view a copy of this license, visit
http://creativecommons.org/licenses/by-nc-sa/3.0/
This product includes software developed by the Apache Software Foundation (http://www.apache.org/).
This product includes software developed by the OpenSymphony Group (http://www.opensymphony.com/)
This product contains either BSAFE and/or TIPEM software by RSA Data Security, Inc.
The Flash Builder 3 software contains code provided by the Eclipse Foundation (“Eclipse Code”). The source code for the Eclipse Code as contained in Flash
Builder 3 software (“Eclipse Source Code”) is made available under the terms of the Eclipse Public License v1.0 which is provided herein, and is also available at
http://www.eclipse.org/legal/epl-v10.html.
Adobe Systems Incorporated, 345 Park Avenue, San Jose, CA 95110-2704, USA.
Notice to U.S. government end users. The software and documentation are “Commercial Items,” as that term is defined at 48 C.F.R. &sect;2.101, consisting of
“Commercial Computer Software” and “Commercial Computer Software Documentation,” as such terms are used in 48 C.F.R. &sect;12.212 or 48 C.F.R. &sect;227.7202,
as applicable. Consistent with 48 C.F.R. &sect;12.212 or 48 C.F.R. &sect;&sect;227.7202-1 through 227.7202-4, as applicable, the Commercial Computer Software and
Commercial Computer Software Documentation are being licensed to U.S. Government end users (a) only as Commercial items and (b) with only those rights
as are granted to all other end users pursuant to the terms and conditions herein. Unpublished-rights reserved under the copyright laws of the United States. For
U.S. Government End Users, Adobe agrees to comply with all applicable equal opportunity laws including, if appropriate, the provisions of Executive Order
11246, as amended, Section 402 of the Vietnam Era Veterans Readjustment Assistance Act of 1974 (38 USC 4212), and Section 503 of the Rehabilitation Act of
1973, as amended, and the regulations at 41 CFR Parts 60-1 through 60-60, 60-250 ,and 60-741. The affirmative action clause and regulations contained in the
preceding sentence shall be incorporated by reference.
Derni&egrave;re mise &agrave; jour le 29/4/2010
iii
Sommaire
Chapitre 1 : A propos de Flash Builder
Possibilit&eacute;s d’utilisation de Flash Builder
Versions de Flash Builder
............................................................................... 1
.............................................................................................. 2
Programmes d’installation Flash Builder
................................................................................ 2
Client de l’Aide de la communaut&eacute; Adobe
.............................................................................. 3
Chapitre 2 : Workbench Flash Builder
Notions de base du workbench Flash Builder
........................................................................... 4
Navigation et personnalisation du workbench Flash Builder
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
Chapitre 3 : Utilisation des projets
A propos des projets Flash Builder . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
Cr&eacute;ation de projets Flex
Gestion des projets
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
Exportation et importation de projets
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53
Exportation d’une application vers une version valid&eacute;e
Gestion des ressources du projet
Projets ActionScript
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 66
Projets de biblioth&egrave;que
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
G&eacute;n&eacute;ration de projets
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73
G&eacute;n&eacute;ration par ligne de commande de Flash Builder
Ex&eacute;cution des applications
Cr&eacute;ation de modules
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 86
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 90
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 96
Chapitre 4 : Modification du code dans Flash Builder
A propos de la modification du code dans Flash Builder
Aide au codage dans Flash Builder
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 103
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 105
Navigation et organisation du code
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 111
Formatage et modification du code
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 116
Recherche de r&eacute;f&eacute;rences et restructuration de code
Ic&ocirc;nes repr&eacute;sentant les &eacute;l&eacute;ments de langage
A propos des marqueurs
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 118
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 120
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 122
A propos de la v&eacute;rification de la syntaxe
Raccourcis clavier d’&eacute;dition de code
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 124
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 126
Personnalisation des mod&egrave;les de fichier
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127
Chapitre 5 : Cr&eacute;ation de composants MXML personnalis&eacute;s
A propos des composants personnalis&eacute;s . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134
Cr&eacute;ation de composants MXML avec Flash Builder
Cr&eacute;ation de composants visuels
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 135
D&eacute;finition de commentaires ASDoc pour les composants personnalis&eacute;s
Modification et distribution des composants MXML personnalis&eacute;s
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 136
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 136
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 iv
Sommaire
Chapitre 6 : D&eacute;veloppement d’applications AIR avec Flash Builder
Cr&eacute;ation de projets AIR avec Flash Builder . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 137
Conversion de projets Flex en projets Adobe AIR
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 137
D&eacute;bogage des applications AIR avec Flash Builder
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 137
Cr&eacute;ation de packages d’application AIR avec Flash Builder
Cr&eacute;ation d’un projet de biblioth&egrave;que AIR
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 138
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 140
Chapitre 7 : D&eacute;bogage, test et surveillance des applications
D&eacute;bogage des applications . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 141
Environnement de test FlexUnit
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 150
Surveillance des applications acc&eacute;dant aux services de donn&eacute;es
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 155
Chapitre 8 : Profilage des applications Flex
A propos du profilage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 159
Fonctionnement du profileur Flex
Utilisation du profileur
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 160
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 162
A propos des vues du profileur
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 168
A propos de la r&eacute;cup&eacute;ration de place
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 182
Identification des zones &agrave; probl&egrave;mes
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 182
A propos des filtres du profileur
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 186
Chapitre 9 : Cr&eacute;ation d’une interface utilisateur avec Flash Builder
A propos de la structure des interfaces utilisateur dans Flex . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 188
Ajout et modification des composants
Utilisation visuelle des composants
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 191
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 196
Utilisation de pr&eacute;sentations bas&eacute;es sur des contraintes
Cr&eacute;ation de gestionnaires d’&eacute;v&eacute;nement
Application de th&egrave;mes
Application de styles
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 205
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 210
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 213
Modification de l’interface utilisateur &agrave; l’aide des habillages
G&eacute;n&eacute;ration de rendus d’&eacute;l&eacute;ment personnalis&eacute;s
Actualisation du mode Cr&eacute;ation pour un rendu correct
Ajout d’&eacute;tats d’affichage et de transitions
Liaison des contr&ocirc;les &agrave; des donn&eacute;es
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 227
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 227
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 233
Ajout de composants de repr&eacute;sentation graphique
Ajout d’interactivit&eacute; &agrave; l’aide d’effets
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 218
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 224
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 234
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 235
Chapitre 10 : Utilisation de donn&eacute;es dans Flash Builder
A propos de l’utilisation des donn&eacute;es dans Flash Builder . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 237
G&eacute;n&eacute;ration automatique du code Flex Ajax Bridge
Gestion de la s&eacute;curit&eacute; de Flash Player
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 241
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 245
Chapitre 11 : Personnalisation de Flash Builder
Pr&eacute;f&eacute;rences Adobe . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 248
Pr&eacute;f&eacute;rences de Flash Builder
Extension de Flash Builder
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 249
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 255
Derni&egrave;re mise &agrave; jour le 29/4/2010
Chapitre 1 : A propos de Flash Builder
Adobe&reg; Flash&reg; Builder™ est un environnement de d&eacute;veloppement int&eacute;gr&eacute; permettant la g&eacute;n&eacute;ration d’applications
Internet riches (Rich Internet Applications, RIA) multiplateformes. Flash Builder vous permet de g&eacute;n&eacute;rer des
applications utilisant la structure Adobe Flex&reg;, MXML, Adobe Flash Player, Adobe AIR&reg;, ActionScript 3.0, Adobe&reg;
LiveCycle&reg; Data Services ES et les composants de repr&eacute;sentation graphique Adobe&reg; Flex&reg;. Il comporte &eacute;galement des
outils de test, de d&eacute;bogage et de profilage favorisant productivit&eacute; et efficacit&eacute;.
Flash Builder est bas&eacute; sur Eclipse, un environnement IDE de type &laquo; open source &raquo;, et fournit tous les outils requis pour
d&eacute;velopper des applications qui utilisent la structure Flex et ActionScript 3.0. Flash Builder s’ex&eacute;cute sous Microsoft
Windows et Apple Macintosh OS X et est disponible en plusieurs versions. Les options de configuration d’installation
vous permettent d’installer Flash Builder en ensemble de plug-ins dans une installation de workbench Eclipse existante
ou de cr&eacute;er une installation incluant le workbench Eclipse.
Possibilit&eacute;s d’utilisation de Flash Builder
Flash Builder vous permet de d&eacute;velopper des applications dans un environnement IDE complet et de r&eacute;aliser les t&acirc;ches
suivantes :
• Cr&eacute;ation de projets Flex compatibles avec toute technologie de serveur back-end, dont Adobe ColdFusion&reg; et
Adobe LiveCycle&reg; Data Services, avec ou sans serveur Flex. Voir &laquo; Cr&eacute;ation de projets Flex &raquo; &agrave; la page 41.
• Cr&eacute;ation d’applications acc&eacute;dant aux services de donn&eacute;es &agrave; distance. Flash Builder fournit des outils et des
assistants facilitant l’acc&egrave;s aux services de donn&eacute;es. Voir Pr&eacute;sentation de l’acc&egrave;s aux services de donn&eacute;es.
• Cr&eacute;ation de projet ActionScript. Voir &laquo; Projets ActionScript &raquo; &agrave; la page 66.
• R&eacute;daction et modification du code source des applications &agrave; l’aide d’&eacute;diteurs fournissant des fonctions telles que la
restructuration de code, les indicateurs de code, la navigation de code rationnalis&eacute;e et la v&eacute;rification automatique
des erreurs de syntaxe. Voir &laquo; A propos de la modification du code dans Flash Builder &raquo; &agrave; la page 103.
• Utilisation de l’&eacute;diteur MXML en mode Cr&eacute;ation entre autres pour g&eacute;n&eacute;rer des applications &agrave; l’aide des options de
pr&eacute;sentation, pour faire glisser des composants vers la zone de cr&eacute;ation avant de les repositionner et de les
redimensionner et pour simplifier l’utilisation par des &eacute;tats d’affichage. Voir &laquo; Cr&eacute;ation d’une interface utilisateur
avec Flash Builder &raquo; &agrave; la page 188.
• Cr&eacute;ation de fonctions ActionScript dans le code MXML ou dans des fichiers distincts de fonctions, classes et
interfaces ActionScript.
• Cr&eacute;ation de composants personnalis&eacute;s et acc&egrave;s rapide &agrave; partir de la vue Composants. Voir &laquo; Cr&eacute;ation de
composants MXML personnalis&eacute;s &raquo; &agrave; la page 134.
• Gestion des projets d’application gr&acirc;ce aux nombreuses fonctions fournies par l’environnement IDE Eclipse sousjacent. Par exemple, ajout et suppression de projets et de ressources, &eacute;tablissement de liens &agrave; des ressources en
dehors du projet, etc. Voir &laquo; Gestion des projets &raquo; &agrave; la page 49 et &laquo; Cr&eacute;ation de dossiers et de fichiers dans un
projet &raquo; &agrave; la page 63.
• Multiples m&eacute;thodes de g&eacute;n&eacute;ration des applications &agrave; l’aide des g&eacute;n&eacute;rateurs int&eacute;gr&eacute;s ou cr&eacute;ation de g&eacute;n&eacute;rateurs
personnalis&eacute;s &agrave; l’aide d’Apache Ant. Voir &laquo; G&eacute;n&eacute;ration de projets &raquo; &agrave; la page 73.
• Ex&eacute;cution des applications dans un navigateur Web ou dans la version autonome de Flash Player. Cr&eacute;ation de
configurations de lancement personnalis&eacute;es pour contr&ocirc;ler l’ex&eacute;cution des applications. Voir &laquo; Ex&eacute;cution des
applications &raquo; &agrave; la page 92 et &laquo; Gestion des configurations de lancement &raquo; &agrave; la page 94.
1
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 2
A propos de Flash Builder
• D&eacute;bogage des applications gr&acirc;ce aux outils de d&eacute;bogage int&eacute;gr&eacute;s de Flash Builder. Voir &laquo; D&eacute;bogage des
applications &raquo; &agrave; la page 141.
• Utilisation du Moniteur de r&eacute;seau pour g&eacute;n&eacute;rer une piste d’audit d&eacute;taill&eacute;e de toutes les donn&eacute;es transf&eacute;r&eacute;es entre
l’application Flex locale et le serveur back-end. Voir &laquo; Surveillance des applications acc&eacute;dant aux services de
donn&eacute;es &raquo; &agrave; la page 155.
• Publication du code source des applications afin que les utilisateurs et les autres d&eacute;veloppeurs puissent le visionner.
Voir &laquo; Publication du code source &raquo; &agrave; la page 85.
• Cr&eacute;ation de projets de biblioth&egrave;que g&eacute;n&eacute;rant des fichiers de biblioth&egrave;que de composants partag&eacute;s (SWC) pour la
r&eacute;utilisation et la distribution du code. Voir &laquo; Projets de biblioth&egrave;que &raquo; &agrave; la page 69.
• Personnalisation de l’IDE. Par exemple, r&eacute;organisation de l’interface afin d’inclure vos outils favoris dans la
pr&eacute;sentation sp&eacute;cifique. Voir &laquo; Navigation et personnalisation du workbench Flash Builder &raquo; &agrave; la page 23.
Versions de Flash Builder
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&eacute;er des
applications &agrave; l’aide de la structure Flex et de l’API Flash. Flash Builder version Standard inclut &eacute;galement des &eacute;diteurs
MXML, ActionScript et CSS, ainsi que des outils de d&eacute;bogage. Il fournit une biblioth&egrave;que de diagrammes et de
graphiques interactifs qui vous permettent de cr&eacute;er des tableaux de bord riches, des analyses de donn&eacute;es interactives
et des composants de visualisation des donn&eacute;es.
Flash Builder version Premium Outre les fonctionnalit&eacute;s de la version Standard, Flash Builder Premium comporte des
outils de profilage de la m&eacute;moire et des performances ainsi que des outils de tests automatis&eacute;s. Utilisez le Moniteur de
r&eacute;seau pour consulter les donn&eacute;es qui sont transmises entre une application client et un service de donn&eacute;es.
L’environnement de test FlexUnit permet de g&eacute;n&eacute;rer et de modifier des tests reproduisibles pouvant &ecirc;tre ex&eacute;cut&eacute;s &agrave;
partir de scripts ou directement &agrave; l’int&eacute;rieur ou &agrave; l’ext&eacute;rieur de l’environnement Flash Builder. Les fonctionnalit&eacute;s de
g&eacute;n&eacute;ration par ligne de commande vous permettent de synchroniser les param&egrave;tres de g&eacute;n&eacute;ration d’un d&eacute;veloppeur
avec une g&eacute;n&eacute;ration nocturne.
Programmes d’installation Flash Builder
Flash Builder comporte deux programmes d’installation.
Programme d’installation plug-in Ce programme d’installation est destin&eacute; aux utilisateurs ayant d&eacute;j&agrave; recours au
workbench Eclipse et souhaitant ajouter les plug-ins Flash Builder &agrave; leur ensemble de plug-ins Eclipse. Cela peut &ecirc;tre
le cas par exemple des d&eacute;veloppeurs d’applications Java. Etant donn&eacute; qu’Eclipse est une plateforme extensible et
ouverte, des centaines de plug-ins sont disponibles &agrave; diff&eacute;rentes fins de d&eacute;veloppement.
Programme d’installation autonome Ce programme d’installation est un package personnalis&eacute; de plug-ins Eclipse et
Flash Builder, cr&eacute;&eacute; sp&eacute;cialement pour d&eacute;velopper des applications qui utilisent la structure Flex et ActionScript 3.0.
L’interface utilisateur de l’installation autonome est plus &eacute;troitement int&eacute;gr&eacute;e que l’installation plug-in. L’installation
autonome permet d’&eacute;viter en grande partie les confusions auxquelles l’installation plug-in, multi-usage et ouverte,
risque de pr&ecirc;ter. Elle est id&eacute;ale pour les nouveaux utilisateurs ainsi que pour ceux qui souhaitent d&eacute;velopper
uniquement des applications reposant sur la structure Flex et ActionScript 3.0.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 3
A propos de Flash Builder
Si vous ne savez pas quel programme d’installation utiliser, suivez les recommandations suivantes :
• Si Eclipse version 3.4.2 (ou ult&eacute;rieure) est d&eacute;j&agrave; install&eacute;, utilisez le programme d’installation plug-in pour ajouter les
fonctionnalit&eacute;s Flash Builder &agrave; la copie existante d’Eclipse.
• Si aucune version d’Eclipse n’est install&eacute;e et que votre objectif principal est de d&eacute;velopper des applications Flex et
ActionScript, utilisez le programme d’installation autonome de Flash Builder. Ce programme d’installation vous
permet &eacute;galement d’installer d’autres plug-ins Eclipse afin d’&eacute;tendre la port&eacute;e de vos futurs travaux de
d&eacute;veloppement.
Les programmes d’installation plug-in et autonome de Flash Builder fournissent les m&ecirc;mes fonctionnalit&eacute;s.
Client de l’Aide de la communaut&eacute; Adobe
Cette version de Flash Builder comporte le client de l’Aide de la communaut&eacute; Adobe (Adobe Community Help Client,
CHC). Le client CHC est une application bas&eacute;e sur AIR qui remplace le moteur d’aide Eclipse pour Flash Builder et
constitue la plateforme pour la nouvelle g&eacute;n&eacute;ration d’aide Adobe. Le client CHC se caract&eacute;rise par les propri&eacute;t&eacute;s
suivantes :
• Toujours en ligne
Si vous disposez d’une connexion r&eacute;seau, le client CHC acc&egrave;de au contenu situ&eacute; sur le Web pour vous fournir en
permanence les informations les plus r&eacute;centes. En l’absence de connexion Internet, il est &eacute;galement op&eacute;rationnel
en mode local.
• Centr&eacute; sur la recherche
Vous pouvez utiliser les fonctions de recherche de l’Aide de la communaut&eacute; (adobe.com) ou proc&eacute;der &agrave; une
recherche locale. La recherche de l’Aide de la communaut&eacute; regroupe les ressources, dont celles des sites tiers. La
recherche adobe.com comporte des crit&egrave;res vous permettant d’en restreindre la port&eacute;e.
• Navigation en contexte
La navigation en contexte fournit un ensemble g&eacute;n&eacute;r&eacute; dynamiquement de liens associ&eacute;s dirigeant vers des pages
cl&eacute;s.
Derni&egrave;re mise &agrave; jour le 29/4/2010
Chapitre 2 : Workbench Flash Builder
Notions de base du workbench Flash Builder
Adobe&reg; Flash&reg; Builder™ repose sur Eclipse, un environnement de d&eacute;veloppement int&eacute;gr&eacute; de type &laquo; open source &raquo;. Il
vous permet de d&eacute;velopper des applications Flex&reg; et ActionScript&reg; 3.0 &agrave; l’aide de puissants outils de codage, de mise en
forme visuelle, de cr&eacute;ation et de d&eacute;bogage.
A propos du workbench
Le workbench Flash Builder est un environnement de d&eacute;veloppement enti&egrave;rement int&eacute;gr&eacute; con&ccedil;u pour vous aider &agrave;
d&eacute;velopper des applications pour la structure Adobe Flex. Vous pouvez d&eacute;velopper des applications &agrave; d&eacute;ployer sur
Adobe Flash Player et des applications de bureau &agrave; d&eacute;ployer sur Adobe AIR&reg;. Flash Builder repose sur Eclipse, un
environnement IDE de type &laquo; open source &raquo;. Flash Builder est un ensemble de plug-ins Eclipse vous permettant de
cr&eacute;er des applications Flex et ActionScript 3.0. La plupart des fonctionnalit&eacute;s de base de l’environnement IDE de Flash
Builder provient d’Eclipse. Cela inclut, par exemple, les fonctions de gestion, de recherche et de navigation dans les
ressources. Les plug-ins Flash Builder ajoutent les fonctions et fonctionnalit&eacute;s permettant de cr&eacute;er des applications
Flex et ActionScript 3.0. Ils modifient &eacute;galement l’interface utilisateur IDE et certaines fonctionnalit&eacute;s pour prendre
en charge ces t&acirc;ches.
Les informations n&eacute;cessaires &agrave; l’utilisation de Flash Builder sont pr&eacute;sent&eacute;es dans la documentation de Flash Builder.
A moins d’utiliser d’autres plug-ins Eclipse (CVS ou Java, par exemple) avec Flash Builder, ou si vous souhaitez &eacute;tendre
les plug-ins Flash Builder (voir &laquo; Extension du workbench Flash Builder &raquo; &agrave; la page 23), vous n’avez pas &agrave; vous soucier
de l’infrastructure Eclipse sous-jacente.
Workbench Le terme workbench d&eacute;signe l’environnement de d&eacute;veloppement Flash Builder. Le workbench contient
trois &eacute;l&eacute;ments principaux : les perspectives, les &eacute;diteurs et les vues. Vous utilisez ces trois composants dans diff&eacute;rentes
combinaisons &agrave; diff&eacute;rents stades du processus de d&eacute;veloppement de l’application. Le workbench constitue le
conteneur de tous les outils de d&eacute;veloppement des applications. Vous pouvez le comparer &agrave; Microsoft Visual Studio,
qui offre un cadre et les principales fonctionnalit&eacute;s d’une large gamme d’outils de d&eacute;veloppement.
Perspective Une perspective repr&eacute;sente un groupe de vues et d’&eacute;diteurs du workbench. Il s’agit essentiellement d’un
environnement de travail sp&eacute;cial qui vous aide &agrave; r&eacute;aliser un type de t&acirc;che sp&eacute;cifique. Par exemple, Flash Builder
contient deux perspectives. La perspective D&eacute;veloppement Flash sert au d&eacute;veloppement d’applications et la
perspective D&eacute;bogage Flash au d&eacute;bogage des applications. Flash Builder Premium contient &eacute;galement la perspective
Profil Flash.
Si vous utilisez la configuration plug-in de Flash Builder (voir &laquo; Programmes d’installation Flash Builder &raquo; &agrave; la page 2),
le workbench peut contenir d’autres perspectives telles qu’une perspective Java contenant des &eacute;diteurs et des vues
permettant de d&eacute;velopper des applications Java.
Pour plus d’informations sur les perspectives, voir &laquo; A propos des perspectives de Flash Builder &raquo; &agrave; la page 7.
Editeur Un &eacute;diteur vous permet d’&eacute;diter diff&eacute;rents types de fichier. Les &eacute;diteurs dont vous disposez varient selon le
nombre et le type de plug-ins Eclipse install&eacute;s. Flash Builder contient des &eacute;diteurs permettant de r&eacute;diger du code
MXML, ActionScript 3.0 et CSS (Cascading Style Sheets, feuilles de style en cascade). Pour plus d’informations sur la
modification du code dans Flash Builder, voir &laquo; A propos de la modification du code dans Flash Builder &raquo; &agrave; la page 103.
Vues Une vue comporte g&eacute;n&eacute;ralement un &eacute;diteur. Par exemple, lors de l’&eacute;dition MXML, les vues Composants et
Propri&eacute;t&eacute;s apparaissent &eacute;galement dans la perspective D&eacute;veloppement Flash. Ces vues prennent en charge le
d&eacute;veloppement d’applications et s’affichent par cons&eacute;quent lorsqu’un fichier MXML est ouvert en &eacute;dition.
4
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 5
Workbench Flash Builder
Certaines vues prennent en charge les principales fonctionnalit&eacute;s du workbench. Par exemple, la vue Explorateur de
packages vous permet de g&eacute;rer les fichiers et dossiers au sein du workbench et la vue T&acirc;ches affiche toutes les t&acirc;ches
automatiquement g&eacute;n&eacute;r&eacute;es par le workbench ou ajout&eacute;es manuellement.
Le terme vue est synonyme de panneau, ce dernier &eacute;tant utilis&eacute; dans les versions pr&eacute;c&eacute;dentes de Flex Builder, dans
Adobe Dreamweaver&reg; et dans d’autres outils de d&eacute;veloppement Adobe.
Espace de travail A ne pas confondre avec le workbench, un espace de travail repr&eacute;sente une zone d&eacute;finie d’un syst&egrave;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 &agrave; la fois, mais vous pouvez cependant s&eacute;lectionner un espace de travail
diff&eacute;rent &agrave; chaque lancement de Flash Builder. Pour plus d’informations, voir &laquo; Gestion des projets &raquo; &agrave; la page 49.
Ressource Le terme ressource est utilis&eacute; de fa&ccedil;on g&eacute;n&eacute;rique pour d&eacute;signer les fichiers et dossiers des projets d’un espace
de travail. Pour plus d’informations, voir &laquo; Cr&eacute;ation de dossiers et de fichiers dans un projet &raquo; &agrave; la page 63.
Projet Toutes les ressources constituant vos applications figurent dans des projets. Vous ne pouvez pas cr&eacute;er une
application dans Flash Builder sans cr&eacute;er au pr&eacute;alable un projet. Vous pouvez cr&eacute;er trois types de projet dans Flash
Builder : les projets Flex, les projets ActionScript et les projets de biblioth&egrave;que. Pour plus d’informations, voir
&laquo; Utilisation des projets &raquo; &agrave; la page 35.
Configuration de lancement Une configuration de lancement est cr&eacute;&eacute;e pour chacun de vos projets. Elle d&eacute;finit les
param&egrave;tres de projet utilis&eacute;s lors de l’ex&eacute;cution et du d&eacute;bogage de vos applications. Par exemple, les noms et
emplacements des fichiers SWF d’application compil&eacute;s sont contenus dans la configuration de lancement, et vous
pouvez modifier ces param&egrave;tres. Pour plus d’informations, voir &laquo; Ex&eacute;cution des applications &raquo; &agrave; la page 92.
A propos des &eacute;diteurs Flash Builder
Flash Builder contient des &eacute;diteurs vous permettant d’&eacute;diter du code MXML, ActionScript 3.0 et CSS. Les &eacute;diteurs
constituent la pierre angulaire du workbench et des vues. Les perspectives dans lesquelles ils figurent prennent en
charge leurs fonctionnalit&eacute;s.
Les &eacute;diteurs sont associ&eacute;s &agrave; des types de ressource. Ainsi, lorsque vous ouvrez des ressources dans le workbench,
l’&eacute;diteur correspondant s’affiche. Le workbench repr&eacute;sente un environnement orient&eacute; document (et orient&eacute; projet)
destin&eacute; au d&eacute;veloppement d’applications.
Le d&eacute;veloppement d’applications Flex dans Flash Builder repose sur l’utilisation des &eacute;diteurs MXML, ActionScript 3.0
et CSS. Chaque &eacute;diteur int&egrave;gre les fonctionnalit&eacute;s n&eacute;cessaires au type de ressource donn&eacute;. Flash Builder contient les
&eacute;diteurs suivants.
Editeur MXML Utilisez l’&eacute;diteur MXML pour &eacute;diter le code MXML et pour incorporer un code ActionScript et CSS
dans les balises &lt;fx:Script&gt; et &lt;fx:Style. L’&eacute;diteur MXML propose deux modes : Source et Cr&eacute;ation. Le mode
Source sert &agrave; l’&eacute;dition du code. Le mode Cr&eacute;ation permet la pr&eacute;sentation et la conception visuelles des applications.
Les deux modes sont synchronis&eacute;s et les modifications effectu&eacute;es dans un mode sont aussit&ocirc;t r&eacute;percut&eacute;es dans l’autre
mode. Pour plus d’informations, voir &laquo; A propos de la modification du code dans Flash Builder &raquo; &agrave; la page 103.
Editeur ActionScript Utilisez l’&eacute;diteur ActionScript pour &eacute;diter des fichiers de classe et d’interface ActionScript. Bien
que vous puissiez incorporer des fonctions ActionScript dans un fichier MXML &agrave; l’aide de la balise &lt;fx:Script&gt;, les
classes sont g&eacute;n&eacute;ralement d&eacute;finies dans des fichiers ActionScript, puis import&eacute;es dans des fichiers MXML. Cette
m&eacute;thode vous permet de d&eacute;finir la plupart de vos applications Flex dans ActionScript.
Editeur CSS Utilisez l’&eacute;diteur CSS pour afficher et &eacute;diter des feuilles de style en cascade. Vous pouvez ensuite appliquer
des styles aux &eacute;l&eacute;ments visuels de vos applications. Pour plus d’informations, voir &laquo; Utilisation visuelle des
composants &raquo; &agrave; la page 196 et Using Styles and Themes.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 6
Workbench Flash Builder
Indicateurs de code
Les &eacute;diteurs contiennent de nombreuses fonctionnalit&eacute;s qui simplifient et rationalisent le d&eacute;veloppement de code. Ils
proposent en particulier l’option Assistant de contenu, qui affiche des indicateurs de code et du contenu ASDoc
lorsque vous saisissez du code MXML, ActionScript et CSS. Le contenu ASDoc s’affiche &eacute;galement lorsque vous passez
le curseur de la souris sur une classe de l’&eacute;diteur.
Les indicateurs de code apparaissent automatiquement lorsque vous saisissez du code (vous pouvez &eacute;galement afficher
les indicateurs de code en appuyant sur Ctrl+Espace). L’exemple suivant illustre les indicateurs de code dans l’&eacute;diteur
MXML :
Les indicateurs de code apparaissent lorsque vous commencez &agrave; saisir une expression de code reconnue par Flex ou le
langage (MXML, ActionScript et CSS). Par exemple, si vous entrez le nom d’un composant, une liste de toutes les
propri&eacute;t&eacute;s de ce composant appara&icirc;t.
Les indicateurs de code ActionScript sont &eacute;galement pris en charge. Les indicateurs de code ActionScript s’affichent
dans les balises &lt;fx:Script&gt; incorpor&eacute;es dans un document MXML et dans des fichiers ActionScript autonomes.
L’Assistant de contenu affiche des indicateurs de code pour tous les &eacute;l&eacute;ments de langage ActionScript : interfaces,
classes, variables, fonctions, types de renvoi, etc. L’assistant de contenu affiche &eacute;galement le contenu ASDoc pour les
classes et interfaces ActionScript.
Il propose &eacute;galement des indicateurs de code pour les composants MXML personnalis&eacute;s ou les classes ActionScript
que vous cr&eacute;ez vous-m&ecirc;me. Si vous d&eacute;finissez par exemple un composant MXML personnalis&eacute; et l’ajoutez &agrave; votre
projet, les indicateurs de code apparaissent lorsque vous r&eacute;f&eacute;rencez le composant dans le fichier d’application MXML.
Pour plus d’informations, voir &laquo; A propos de l’assistant de contenu &raquo; &agrave; la page 106.
G&eacute;n&eacute;ration de gestionnaires d’&eacute;v&eacute;nement
Flash Builder permet la g&eacute;n&eacute;ration automatique de code de gestionnaires d’&eacute;v&eacute;nement afin de simplifier l’association
d’&eacute;v&eacute;nements aux composants de votre application. En mode Cr&eacute;ation, s&eacute;lectionnez un composant. Dans la cat&eacute;gorie
Ev&eacute;nements de la vue Propri&eacute;t&eacute;s, cliquez ensuite sur le bouton G&eacute;n&eacute;rer un gestionnaire d’&eacute;v&eacute;nement d’un &eacute;v&eacute;nement
r&eacute;pertori&eacute;. L’&eacute;diteur affiche le mode Source et g&eacute;n&egrave;re un gestionnaire d’&eacute;v&eacute;nement dans la section Script du code
source. L’&eacute;diteur place &eacute;galement une propri&eacute;t&eacute; d’&eacute;v&eacute;nement dans la balise de composant qui r&eacute;f&eacute;rence le gestionnaire
d’&eacute;v&eacute;nement g&eacute;n&eacute;r&eacute;.
Vous pouvez &eacute;galement g&eacute;n&eacute;rer des gestionnaires d’&eacute;v&eacute;nement en mode Source en faisant appel &agrave; l’assistant de
contenu.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 7
Workbench Flash Builder
Pour plus d’informations, voir &laquo; Cr&eacute;ation de gestionnaires d’&eacute;v&eacute;nement &raquo; &agrave; la page 208 et &laquo; Cr&eacute;ation de gestionnaires
d’&eacute;v&eacute;nement pour les composants &raquo; &agrave; la page 110.
Navigation par code
La navigation par code simplifie la saisie du code, en particulier avec les projets de grande taille comportant de
nombreuses ressources. La navigation par code offre la possibilit&eacute; de s&eacute;lectionner un &eacute;l&eacute;ment de code (une r&eacute;f&eacute;rence
&agrave; un composant personnalis&eacute; d’un fichier d’application MXML, par exemple) et d’aller &agrave; la source de la d&eacute;finition du
code, quel que soit son emplacement dans le projet, espace de travail ou chemin.
D’autres fonctionnalit&eacute;s de navigation par code incluent la r&eacute;duction de code qui vous permet de r&eacute;duire et de
d&eacute;velopper des instructions de code &agrave; plusieurs lignes. Une autre fonctionnalit&eacute; est la vue Structure, qui offre une
pr&eacute;sentation hi&eacute;rarchique et vous permet de parcourir tous les &eacute;l&eacute;ments de l’interface utilisateur et de code d’un
fichier. Pour plus d’informations, voir &laquo; Navigation et organisation du code &raquo; &agrave; la page 111.
Formatage de code
Lorsque vous saisissez du code, Flash Builder ins&egrave;re automatiquement des lignes de code pour am&eacute;liorer la lisibilit&eacute;,
ajoute une couleur distinctive aux &eacute;l&eacute;ments de code et propose de nombreuses commandes de formatage rapide du
code que vous saisissez (ajout d’un commentaire de bloc, par exemple).
Lorsque vous collez du code MXML ou ActionScript dans l’&eacute;diteur de code, Flash Builder met automatiquement en
retrait le code en fonction de vos pr&eacute;f&eacute;rences. Vous pouvez &eacute;galement sp&eacute;cifier une mise en retrait pour un bloc de
code s&eacute;lectionn&eacute;.
Pour plus d’informations, voir &laquo; Formatage et modification du code &raquo; &agrave; la page 116.
Recherche de r&eacute;f&eacute;rences et restructuration du code
Flash Builder peut rechercher toutes les r&eacute;f&eacute;rences et les d&eacute;clarations correspondant aux identifiants d’un fichier, d’un
projet ou d’un espace de travail donn&eacute;. La recherche porte &eacute;galement sur les &eacute;l&eacute;ments reli&eacute;s &agrave; partir de fichiers SWC
ainsi que les entr&eacute;es des chemins de biblioth&egrave;que (classes, interfaces, fonctions, variables et quelques m&eacute;tadonn&eacute;es, par
exemple). La restructuration vous permet de renommer les identificateurs de votre code tout en mettant &agrave; jour toutes
les r&eacute;f&eacute;rences correspondantes dans la totalit&eacute; de la base de code. Pour plus d’informations, voir &laquo; Recherche de
r&eacute;f&eacute;rences et restructuration de code &raquo; &agrave; la page 118.
A propos des perspectives de Flash Builder
Pour prendre en charge une t&acirc;che particuli&egrave;re ou un groupe de t&acirc;ches, les &eacute;diteurs et les vues correspondantes sont
combin&eacute;s dans une perspective. Flash Builder contient deux perspectives : D&eacute;bogage Flash et D&eacute;veloppement Flash.
Flash Builder Premium contient une perspective suppl&eacute;mentaire, Profil Flash.
Les perspectives changent automatiquement selon la t&acirc;che en cours. Par exemple, si vous cr&eacute;ez un projet Flex, le
workbench affiche la perspective D&eacute;veloppement ; si vous lancez une session de d&eacute;bogage, la perspective D&eacute;bogage
Flash s’affiche lorsque le premier point d’arr&ecirc;t est atteint. Vous pouvez changer manuellement de perspective en
s&eacute;lectionnant Fen&ecirc;tre &gt; Perspective dans le menu principal (Fen&ecirc;tre &gt; Ouvrir la perspective dans la version plug-in).
Vous pouvez &eacute;galement utiliser la barre des perspectives, situ&eacute;e dans la barre d’outils principale du workbench.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 8
Workbench Flash Builder
Si vous utilisez la configuration plug-in de Flash Builder et que vous avez install&eacute; d’autres plug-ins Eclipse, de
nombreuses autres perspectives peuvent s’afficher. Chaque plug-in Eclipse propose des perspectives pr&eacute;d&eacute;finies, mais
vous pouvez les personnaliser &agrave; votre guise ou cr&eacute;er vos propres perspectives. La personnalisation ou la cr&eacute;ation d’une
perspective requiert la s&eacute;lection, le placement et le redimensionnement des &eacute;diteurs et des vues n&eacute;cessaires &agrave; la
r&eacute;alisation de vos t&acirc;ches de d&eacute;veloppement. Pour plus d’informations sur l’utilisation et la personnalisation des
perspectives, voir &laquo; Utilisation des perspectives &raquo; &agrave; la page 23.
Perspective D&eacute;veloppement Flash
La perspective D&eacute;veloppement Flash comporte les &eacute;diteurs et les vues dont vous avez besoin pour cr&eacute;er des
applications pour la structure Flex. Lorsque vous cr&eacute;ez un projet, Flash Builder affiche la perspective D&eacute;veloppement
pour que vous puissiez commencer &agrave; d&eacute;velopper une application. L’exemple suivant illustre les vues Explorateur de
packages, Structure et Erreurs :
Le point central de la perspective (et du workbench en g&eacute;n&eacute;ral) est la zone de l’&eacute;diteur. Elle affiche tous les documents
actuellement ouverts dans une interface &agrave; plusieurs onglets et est entour&eacute;e des vues correspondantes. Les perspectives
pr&eacute;d&eacute;finissent la pr&eacute;sentation de tous les &eacute;l&eacute;ments qu’elles contiennent. Vous pouvez toutefois les r&eacute;organiser comme
vous le souhaitez. Pour plus d’informations, voir &laquo; Navigation et personnalisation du workbench Flash Builder &raquo; &agrave; la
page 23.
En mode Source (&eacute;dition de code), la perspective D&eacute;veloppement contient les &eacute;l&eacute;ments suivants.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 9
Workbench Flash Builder
Editeurs Flash Builder
La zone de l’&eacute;diteur affiche tous les documents ouverts. Lorsque vous cr&eacute;ez un projet Flex, le fichier d’application
MXML principal s’ouvre dans la zone de l’&eacute;diteur. Vous pouvez ensuite ouvrir et parcourir les documents MXML,
ActionScript et CSS que vous utilisez.
L’&eacute;diteur MXML comporte deux modes (Source et Cr&eacute;ation). Le passage de l’un &agrave; l’autre adapte la perspective
D&eacute;veloppement en fonction des t&acirc;ches qui y seront effectu&eacute;es.
L’&eacute;diteur ActionScript est un &eacute;diteur &agrave; fonction unique permettant la cr&eacute;ation de fichiers ActionScript.
L’&eacute;diteur CSS est un &eacute;diteur &agrave; fonction unique pour les projets bas&eacute;s sur le SDK Flex 4. Pour les projets bas&eacute;s sur le
SDK Flex 3, l’&eacute;diteur CSS comporte toutefois deux modes (Source et Cr&eacute;ation).
Pour plus d’informations sur l’utilisation de l’&eacute;diteur MXML, voir &laquo; A propos de la modification du code dans Flash
Builder &raquo; &agrave; la page 103 et &laquo; Utilisation visuelle des composants &raquo; &agrave; la page 196.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 10
Workbench Flash Builder
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&eacute;quent un &eacute;l&eacute;ment essentiel du workbench Flash Builder. Elle appara&icirc;t toujours dans les perspectives
D&eacute;veloppement et D&eacute;bogage.
Pour plus d’informations sur l’Explorateur de packages et l’utilisation de projets, voir &laquo; Utilisation des projets &raquo; &agrave; la
page 35.
Vue Structure
En mode Source, la vue Structure offre une pr&eacute;sentation hi&eacute;rarchique de la structure du code du document MXML ou
ActionScript s&eacute;lectionn&eacute;, ce qui vous permet d’inspecter et de parcourir les sections ou lignes de code du document.
La vue Structure affiche &eacute;galement les alertes d’erreur de syntaxe g&eacute;n&eacute;r&eacute;es par le compilateur. Cette vue appara&icirc;t
&eacute;galement lorsque vous utilisez l’&eacute;diteur ActionScript.
Pour plus d’informations sur l’utilisation de la vue Structure en mode Source, voir &laquo; Utilisation de la vue Structure
pour parcourir et examiner le code &raquo; &agrave; la page 111.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 11
Workbench Flash Builder
Vue Erreurs
Lorsque vous saisissez du code, le compilateur Flash Builder d&eacute;tecte les erreurs de syntaxe et d’autres erreurs de
compilation et les affiche dans la vue Erreurs. Lorsque vous d&eacute;boguez vos applications, les erreurs, avertissements et
autres informations apparaissent dans la vue Erreurs.
Remarque : vous pouvez &eacute;galement ajouter les vues T&acirc;ches et Signets. Ces vues offrent des raccourcis suppl&eacute;mentaires
vous permettant de g&eacute;rer et de parcourir le code. Pour plus d’informations sur ces vues, voir &laquo; A propos des marqueurs &raquo;
&agrave; la page 122. Pour une pr&eacute;sentation des vues optionnelles disponibles dans Flash Builder, voir &laquo; Autres vues utiles du
workbench &raquo; &agrave; la page 20.
Vue ASDoc
Flash Builder affiche le contenu ASDoc correspondant au code que vous saisissez ou aux &eacute;l&eacute;ments de code sur lesquels
le curseur de la souris est positionn&eacute;. Il affiche en outre dans la vue ASDoc le contenu ASDoc correspondant au code
s&eacute;lectionn&eacute;.
Pour plus d’informations, voir &laquo; Aide au codage dans Flash Builder &raquo; &agrave; la page 105.
Vue Donn&eacute;es/Services
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 12
Workbench Flash Builder
Flash Builder propose des assistants et des outils qui permettent de se connecter aux services de donn&eacute;es. Utilisez la
vue Donn&eacute;es/Services pour vous connecter aux services de donn&eacute;es. Une fois &eacute;tablie la connexion &agrave; un service de
donn&eacute;es, la vue Donn&eacute;es/Services affiche le service, les types des donn&eacute;es retourn&eacute;es et les op&eacute;rations disponibles pour
le service. Elle vous permet en outre de configurer l’acc&egrave;s au service et de lier les donn&eacute;es retourn&eacute;es aux composants
de l’interface utilisateur.
Pour plus d’informations, voir Construction d’applications centr&eacute;es sur les donn&eacute;es avec Flash Builder.
Vue Moniteur de r&eacute;seau
Le Moniteur de r&eacute;seau permet d’analyser les donn&eacute;es transmises entre une application et le ou les services de donn&eacute;es.
Il est disponible avec Flash Builder Premium.
Pour plus d’informations, voir &laquo; Surveillance des applications acc&eacute;dant aux services de donn&eacute;es &raquo; &agrave; la page 155.
Perspective D&eacute;veloppement Flash en mode Cr&eacute;ation
La pr&eacute;sentation et la cr&eacute;ation visuelles des applications ont lieu en mode Cr&eacute;ation de l’&eacute;diteur MXML. Ce mode
repr&eacute;sente visuellement le code &eacute;dit&eacute; en mode Source. Il contient cependant, par rapport &agrave; ce dernier, des vues
suppl&eacute;mentaires prenant en charge les t&acirc;ches de cr&eacute;ation. Il s’agit des vues Composants, Propri&eacute;t&eacute;s, Aspect et Etats. Le
mode Cr&eacute;ation comporte en outre la vue Structure qui affiche la structure MXML des applications. Pour plus
d’informations sur la cr&eacute;ation d’applications Flex dans Flash Builder, voir &laquo; Cr&eacute;ation d’une interface utilisateur avec
Flash Builder &raquo; &agrave; la page 188.
Remarque : le mode Cr&eacute;ation n’est pas disponible avec les projets ActionScript. Pour pr&eacute;visualiser l’interface utilisateur
des applications ActionScript, vous devez les cr&eacute;er et les ex&eacute;cuter. Pour plus d’informations sur l’utilisation
d’ActionScript, voir &laquo; Projets ActionScript &raquo; &agrave; la page 66 et &laquo; Ex&eacute;cution des applications &raquo; &agrave; la page 90.
En mode Cr&eacute;ation, la perspective D&eacute;veloppement contient l’&eacute;diteur MXML et les vues Composants, Etats, Propri&eacute;t&eacute;s,
Aspect et Structure.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 13
Workbench Flash Builder
Editeur MXML
Le mode Cr&eacute;ation MXML vous permet d’interagir visuellement avec les applications. Vous pouvez par exemple faire
glisser des composants vers la zone de cr&eacute;ation, s&eacute;lectionner et redimensionner des composants et ainsi de suite.
Toujours en mode Cr&eacute;ation, vous pouvez d&eacute;velopper l’&eacute;diteur MXML de mani&egrave;re telle &agrave; pouvoir visualiser et
s&eacute;lectionner chaque composant individuellement. Les modes Panoramique et Zoom permettent en outre d’obtenir
une vue plus d&eacute;taill&eacute;e des &eacute;l&eacute;ments, option utile notamment en pr&eacute;sence de composants conteneur incorpor&eacute;s. Pour
plus d’informations sur l’utilisation du mode Cr&eacute;ation, voir &laquo; Cr&eacute;ation d’une interface utilisateur avec Flash Builder &raquo;
&agrave; la page 188.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 14
Workbench Flash Builder
Vue Composants
La vue Composants contient tous les composants Flex standard. Vous pouvez les s&eacute;lectionner et les ajouter &agrave; la zone
de cr&eacute;ation. Cette vue contient &eacute;galement les composants personnalis&eacute;s que vous cr&eacute;ez.
Pour plus d’informations, voir &laquo; Ajout et modification des composants &raquo; &agrave; la page 191.
Vue Etats
Flex vous permet de cr&eacute;er des applications dont l’apparence varie selon les &eacute;v&eacute;nements d&eacute;clench&eacute;s directement par
l’utilisateur ou g&eacute;n&eacute;r&eacute;s de fa&ccedil;on programm&eacute;e. Ces changements d’interface utilisateur sont appel&eacute;s &eacute;tats d’affichage.
Vous cr&eacute;ez et g&eacute;rez les &eacute;tats d’affichage dans la vue Etats.
Pour plus d’informations sur les &eacute;tats d’affichage, voir &laquo; Ajout d’&eacute;tats d’affichage et de transitions &raquo; &agrave; la page 227.
Vue Aspect
La vue Aspect vous permet de d&eacute;finir le style global de l’application pour le texte et les couleurs. Vous pouvez
&eacute;galement y d&eacute;finir le th&egrave;me des applications du projet.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 15
Workbench Flash Builder
Panneau Aspect
Pour plus d’informations, voir &laquo; Application de styles &raquo; &agrave; la page 214.
Vue Style
La vue Style vous permet de d&eacute;finir le style des diff&eacute;rents composants. Les styles d&eacute;finissables varient en fonction du
composant.
Panneau Style
Pour plus d’informations, voir &laquo; Application de styles &raquo; &agrave; la page 214.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 16
Workbench Flash Builder
Vue Propri&eacute;t&eacute;s Flex
Lorsqu’un composant est s&eacute;lectionn&eacute;, ses propri&eacute;t&eacute;s s’affichent dans la vue Propri&eacute;t&eacute;s Flex. Vous pouvez d&eacute;finir et
&eacute;diter ces propri&eacute;t&eacute;s en fonction de vos besoins. Vous pouvez afficher les propri&eacute;t&eacute;s d’un composant de fa&ccedil;on
graphique (comme l’illustre l’exemple suivant), par cat&eacute;gories ou sous forme d’une liste alphab&eacute;tique.
Pour plus d’informations, voir &laquo; D&eacute;finition des propri&eacute;t&eacute;s des composants &raquo; &agrave; la page 201.
Vue Structure
En mode Cr&eacute;ation, la vue Structure pr&eacute;sente une vue hi&eacute;rarchique de la structure MXML de vos applications. Vous
pouvez facilement parcourir la structure d’une application en s&eacute;lectionnant des instructions de balises MXML et des
composants individuels. L’&eacute;l&eacute;ment s&eacute;lectionn&eacute; dans la vue Structure est mis en surbrillance dans la vue Cr&eacute;ation.
Pour plus d’informations sur l’utilisation de la vue Structure en mode Cr&eacute;ation, voir &laquo; Examen de la structure du code
MXML &raquo; &agrave; la page 204.
Perspective D&eacute;bogage Flash
La perspective D&eacute;bogage Flash contient les outils n&eacute;cessaires au d&eacute;bogage de vos applications. Tout comme la
perspective D&eacute;veloppement, l’&eacute;diteur en est le principal outil. Pour le d&eacute;bogage des applications, l’&eacute;diteur, associ&eacute; aux
outils correspondants, recherche et met en surbrillance les lignes de code qui doivent &ecirc;tre corrig&eacute;es avant que vous
puissiez poursuivre le test de l’application.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 17
Workbench Flash Builder
Vous pouvez par exemple d&eacute;finir des points d’arr&ecirc;t dans le code pour interrompre l’ex&eacute;cution et examiner les valeurs
des variables et d’autres informations qui pr&eacute;c&egrave;dent ce point. Vous pouvez &eacute;galement passer au point d’arr&ecirc;t suivant
ou &agrave; l’&eacute;tape suivante d’un appel de fonction pour visualiser les changements de valeur des variables.
La perspective D&eacute;bogage appara&icirc;t automatiquement lorsque le premier point d’arr&ecirc;t est atteint. Vous pouvez
&eacute;galement passer manuellement &agrave; la perspective D&eacute;bogage en la s&eacute;lectionnant dans la barre des perspectives situ&eacute;e &agrave;
l’extr&eacute;mit&eacute; droite de la barre d’outils principale du workbench.
La perspective D&eacute;bogage contient les vues D&eacute;bogage, Points d’arr&ecirc;t, Console, Variables et Expressions.
Vue D&eacute;bogage
La vue D&eacute;bogage (dans d’autres d&eacute;bogueurs, cette option porte le nom pile des appels) affiche le frame de pile du thread
suspendu de l’application que vous d&eacute;boguez. Utilisez la vue D&eacute;bogage pour g&eacute;rer le processus de d&eacute;bogage. Cette vue
vous permet par exemple de reprendre ou d’interrompre le thread ou une &eacute;tape dans les instructions de code.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 18
Workbench Flash Builder
Pour plus d’informations sur l’utilisation de la vue D&eacute;bogage, voir &laquo; Gestion de la session de d&eacute;bogage dans la vue
D&eacute;bogage &raquo; &agrave; la page 144.
Les applications cr&eacute;&eacute;es avec Flex ne comportent qu’un seul thread (ce qui n’est pas le cas de Java, par exemple). Vous
ne pouvez d&eacute;boguer qu’une seule application &agrave; la fois. Au cours du d&eacute;bogage d’une application, vous ne pouvez donc
afficher les processus et la vue D&eacute;bogage que d’un seul thread d’ex&eacute;cution.
La vue D&eacute;bogage affiche la liste des fonctions appel&eacute;es jusqu’&agrave; ce point, dans l’ordre de leur appel. Par exemple, la
premi&egrave;re fonction appel&eacute;e appara&icirc;t en bas de la liste. Vous pouvez double-cliquer sur une fonction pour la d&eacute;placer
dans le script ; Flash Builder met &agrave; jour les informations de la vue Variables conform&eacute;ment au nouvel emplacement de
la fonction dans le script.
Vue Points d’arr&ecirc;t
La vue Points d’arr&ecirc;t r&eacute;pertorie tous les points d’arr&ecirc;t d&eacute;finis dans le projet. Double-cliquez sur un point d’arr&ecirc;t pour
afficher son emplacement dans l’&eacute;diteur. Vous pouvez &eacute;galement d&eacute;sactiver, ignorer et supprimer des points d’arr&ecirc;t.
Pour plus d’informations, voir &laquo; Gestion des points d’arr&ecirc;t dans la vue Points d’arr&ecirc;t &raquo; &agrave; la page 143.
Vue Console
La vue Console affiche le r&eacute;sultat des instructions trace plac&eacute;es dans le code ActionScript ainsi que les informations
provenant du d&eacute;bogueur lui-m&ecirc;me (statut, avertissements et erreurs).
Pour plus d’informations, voir &laquo; Utilisation de la vue Console &raquo; &agrave; la page 145.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 19
Workbench Flash Builder
Vue Variables
La vue Variables affiche des informations sur les variables dans un cadre de pile s&eacute;lectionn&eacute;. Vous pouvez s&eacute;lectionner
les variables &agrave; surveiller (dans la vue Expressions) et modifier leurs valeurs dans la session de d&eacute;bogage. Lors de la
session de d&eacute;bogage, vous pouvez afficher les modifications effectu&eacute;es dans le fichier SWF en cours d’ex&eacute;cution et
tester des solutions pour r&eacute;soudre le probl&egrave;me.
Pour plus d’informations, voir &laquo; Gestion des variables dans la vue Variables &raquo; &agrave; la page 145.
Vue Expressions
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 &agrave; la vue Expressions afin de les surveiller. Vous pouvez &eacute;galement
ajouter et &eacute;valuer des expressions de contr&ocirc;le.
Lorsque vous d&eacute;boguez l’application, vous pouvez surveiller les variables et, si n&eacute;cessaire, modifier les valeurs. Vous
pouvez ajouter et supprimer des variables dans la vue Expressions. Les expressions de contr&ocirc;le sont des expressions de
code &eacute;valu&eacute;es &agrave; chaque interruption du d&eacute;bogage. Pour plus d’informations, voir &laquo; Utilisation de la vue Expressions &raquo;
&agrave; la page 146.
Pour plus d’informations sur le d&eacute;bogage des applications Flex et ActionScript, voir &laquo; D&eacute;bogage des applications &raquo; &agrave; la
page 141.
Perspective Profil Flash
Flash Builder Premium propose une perspective suppl&eacute;mentaire. Le profileur Adobe Flex permet d’identifier les
probl&egrave;mes de performance et les fuites de m&eacute;moire des applications. La perspective Profil affiche plusieurs panneaux
(ou vues) pr&eacute;sentant les donn&eacute;es de profilage sous diff&eacute;rentes formes. Lorsque vous interagissez avec l’application, le
profileur enregistre les donn&eacute;es concernant le statut de l’application, notamment le nombre d’objets, leur taille, le
nombre d’appels de la m&eacute;thode et le temps consacr&eacute; &agrave; ces appels. Pour plus d’informations sur le profileur, voir &laquo; A
propos du profilage &raquo; &agrave; la page 159.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 20
Workbench Flash Builder
Autres vues utiles du workbench
Outre les &eacute;diteurs et les vues associ&eacute;s aux perspectives par d&eacute;faut de Flash Builder (d&eacute;veloppement, d&eacute;bogage et
profilage), le workbench contient d’autres vues qui simplifient le processus de d&eacute;veloppement d’une application.
Vous pouvez acc&eacute;der aux vues qui n’apparaissent pas d&eacute;j&agrave; dans une perspective et les ajouter au workbench en
s&eacute;lectionnant Fen&ecirc;tre &gt; Autres vues &gt; G&eacute;n&eacute;ralit&eacute;s (Fen&ecirc;tre &gt; Afficher la vue &gt; Autre dans la version plug-in). Ces vues
optionnelles sont class&eacute;es par type et associ&eacute;es &agrave; des fonctionnalit&eacute;s distinctes du workbench ou &agrave; des plug-ins Eclipse
sp&eacute;cifiques. Pour plus d’informations sur l’utilisation des vues, voir &laquo; Utilisation des &eacute;diteurs et des vues &raquo; &agrave; la page 25.
Certaines vues du workbench en particulier vous seront tr&egrave;s pr&eacute;cieuses lors du d&eacute;veloppement d’applications dans
Flash Builder. Il s’agit des vues T&acirc;ches, Signets et Recherche.
Vue Signets
La vue Signets sert &agrave; g&eacute;rer les signets que vous ajoutez &agrave; des lignes de code sp&eacute;cifiques ou &agrave; des ressources. Tout comme
dans un navigateur Web, les signets permettent de garder la trace d’&eacute;l&eacute;ments importants. La s&eacute;lection d’un signet
recherche et affiche ce signet dans le workbench.
Pour plus d’informations sur la vue Signets, voir &laquo; A propos des marqueurs &raquo; &agrave; la page 122.
Vue Recherche
La vue Recherche s’affiche automatiquement lorsque vous recherchez des ressources dans l’espace de travail. Elle
permet de d&eacute;finir des recherches, acc&eacute;der &agrave; des recherches pr&eacute;c&eacute;dentes et filtrer la liste des r&eacute;sultats de la recherche.
Pour plus d’informations sur la vue Recherche, voir &laquo; Recherche dans le workbench &raquo; &agrave; la page 32.
Menus, barres d’outils et raccourcis du workbench
Toutes les commandes du workbench apparaissent dans le syst&egrave;me de menus, les menus contextuels, les barres d’outils
et les raccourcis clavier.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 21
Workbench Flash Builder
Barre d’outils du workbench
Les boutons de la barre d’outils du workbench correspondent aux principales commandes ainsi qu’aux commandes
les plus utilis&eacute;es. Ces commandes sont &eacute;galement disponibles dans les diff&eacute;rents menus de Flash Builder.
Les boutons suivants apparaissent dans la barre d’outils du workbench (de gauche &agrave; droite).
Nouveau Affiche un menu d&eacute;roulant contenant tous les types de projet et tous les documents que vous pouvez cr&eacute;er.
Enregistrer Enregistre le document ouvert dans l’&eacute;diteur et actuellement s&eacute;lectionn&eacute;.
Imprimer la source Imprime le document ouvert dans l’&eacute;diteur et actuellement s&eacute;lectionn&eacute;.
G&eacute;n&eacute;rer tout Appara&icirc;t lorsque l’option &laquo; G&eacute;n&eacute;rer automatiquement &raquo; est d&eacute;sactiv&eacute;e dans le menu Projet.
Ex&eacute;cuter Ouvre le fichier SWF de l’application principale dans le navigateur Web par d&eacute;faut ou directement dans
l’application Flash Player autonome. Vous pouvez &eacute;galement s&eacute;lectionner d’autres fichiers d’application dans le projet
&agrave; partir du menu contextuel associ&eacute;. Pour plus d’informations, voir &laquo; Ex&eacute;cution des applications &raquo; &agrave; la page 92.
D&eacute;boguer Utilise le fichier d’application principal du projet actuel pour ouvrir une session de d&eacute;bogage. Vous pouvez
&eacute;galement s&eacute;lectionner d’autres fichiers d’application dans le projet &agrave; partir du menu contextuel associ&eacute;. Pour plus
d’informations, voir &laquo; Lancement d’une session de d&eacute;bogage &raquo; &agrave; la page 141.
Profiler Cr&eacute;e, g&egrave;re et ex&eacute;cute des configurations. Pour plus d’informations, voir &laquo; A propos du profilage &raquo; &agrave; la
page 159.
Exporter vers une version valid&eacute;e Lance un assistant qui vous aide &agrave; s&eacute;lectionner l’application pour laquelle vous
souhaitez exporter une version optimis&eacute;e de qualit&eacute; finale.
Outils externes S&eacute;lectionne une configuration de lancement personnalis&eacute;e.
Marquer les occurrences Permet de s&eacute;lectionner et de marquer les occurrences de code en mode Source.
Annotation suivante Permet de s&eacute;lectionner et de passer aux annotations de code suivantes en mode Source.
Annotation pr&eacute;c&eacute;dente Permet de s&eacute;lectionner et de passer aux annotations de code pr&eacute;c&eacute;dentes en mode Source.
Emplacement de la derni&egrave;re &eacute;dition Renvoie &agrave; l’emplacement de la derni&egrave;re modification apport&eacute;e &agrave; une ressource (la
ligne de code exacte ou, en mode Cr&eacute;ation, l’&eacute;l&eacute;ment de l’interface utilisateur auquel vous avez ajout&eacute; un contr&ocirc;le ou
pour lequel vous avez d&eacute;fini une propri&eacute;t&eacute;, par exemple).
Pr&eacute;c&eacute;dent et Suivant Permettent d’acc&eacute;der aux documents pr&eacute;c&eacute;demment s&eacute;lectionn&eacute;s. Vous pouvez &eacute;galement
s&eacute;lectionner les documents actuellement ouverts dans la liste fournie par le menu contextuel associ&eacute; &agrave; ces boutons.
Barre d’outils de l’&eacute;diteur MXML
Les boutons de la barre d’outils de l’&eacute;diteur MXML permettent de contr&ocirc;ler l’&eacute;diteur en modes Source et Cr&eacute;ation.
Pour afficher la barre d’outils, ouvrez un fichier MXML en mode Cr&eacute;ation.
Les boutons suivants apparaissent dans la barre d’outils de l’&eacute;diteur MXML (de gauche &agrave; droite).
Source Affiche l’&eacute;diteur en mode Source, c’est-&agrave;-dire la zone d’&eacute;dition du code.
Cr&eacute;ation Affiche l’&eacute;diteur en mode Cr&eacute;ation, c’est-&agrave;-dire la zone de pr&eacute;sentation et de conception visuelles des
applications Flex.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 22
Workbench Flash Builder
Actualiser Recharge les &eacute;l&eacute;ments visuels (images, fichiers SWF ou fichiers de classes contenant les m&eacute;thodes API de
dessin) d&eacute;finissant l’apparence de l’application. Ces &eacute;l&eacute;ments sont d&eacute;sign&eacute;s collectivement par le terme habillage. Pour
plus d’informations, voir Creating Skins.
Etat Liste d&eacute;roulante r&eacute;pertoriant tous les &eacute;tats d’affichage d&eacute;finis. La s&eacute;lection d’un &eacute;tat d’affichage entra&icirc;ne la mise
&agrave; jour de l’affichage de la cr&eacute;ation visuelle. Pour plus d’informations, voir &laquo; Ajout d’&eacute;tats d’affichage et de transitions &raquo;
&agrave; la page 227.
Mode S&eacute;lection Activ&eacute; par d&eacute;faut &agrave; l’ouverture d’un fichier, ce mode vous permet de s&eacute;lectionner, d&eacute;placer et
redimensionner des &eacute;l&eacute;ments.
Mode Panoramique Permet d’effectuer un panoramique et de parcourir la zone de cr&eacute;ation. En revanche, ne permet
pas de s&eacute;lectionner ou de d&eacute;placer des &eacute;l&eacute;ments.
Mode Zoom Affiche par d&eacute;faut des valeurs d’agrandissement pr&eacute;d&eacute;finies. Pour effectuer un zoom arri&egrave;re, appuyez sur
Alt+clic (Opt+clic sous Mac). Pour revenir au mode d’affichage 100%, double-cliquez sur le bouton Mode Zoom.
Agrandissement Liste d&eacute;roulante affichant des pourcentages d’agrandissement. Cette liste est &eacute;galement disponible
dans le menu Cr&eacute;ation &gt; Agrandissement. La liste affiche par d&eacute;faut la valeur 100%.
Barre d’outils de l’&eacute;diteur CSS (uniquement Flex 3)
Si vous modifiez un fichier CSS pour un projet d’application bas&eacute; sur le SDK Flex 3, l’&eacute;diteur CSS affiche le mode
Cr&eacute;ation. L’&eacute;diteur CSS comporte plusieurs boutons vous permettant de contr&ocirc;ler l’&eacute;diteur en modes Source et
Cr&eacute;ation. Pour afficher la barre d’outils de l’&eacute;diteur CSS, cr&eacute;ez un projet bas&eacute; sur le SDK Flex 3 et ouvrez un fichier
CSS en mode Cr&eacute;ation.
Les boutons suivants apparaissent dans la barre d’outils CSS (de gauche &agrave; droite).
Source Affiche l’&eacute;diteur en mode Source, c’est-&agrave;-dire la zone d’&eacute;dition du code.
Cr&eacute;ation Affiche l’&eacute;diteur en mode Cr&eacute;ation, c’est-&agrave;-dire la zone de pr&eacute;sentation et de conception visuelles des
applications Flex.
Actualiser Recharge les &eacute;l&eacute;ments visuels (images, fichiers SWF ou fichiers de classes contenant les m&eacute;thodes API de
dessin) d&eacute;finissant l’apparence de l’application. Ces &eacute;l&eacute;ments sont d&eacute;sign&eacute;s collectivement par le terme habillage. Pour
plus d’informations, voir Creating Skins..
Style R&eacute;pertorie les styles contenus dans le fichier CSS.
Nouveau style Affiche la bo&icirc;te de dialogue Nouveau style permettant de choisir les types de s&eacute;lecteur et les composants
&agrave; appliquer au nouveau style.
Supprimer le style Supprime le style s&eacute;lectionn&eacute; du fichier CSS.
Mode S&eacute;lection Activ&eacute; par d&eacute;faut &agrave; l’ouverture d’un fichier. Permet de s&eacute;lectionner, de d&eacute;placer et de redimensionner
des &eacute;l&eacute;ments.
Mode Panoramique Permet d’effectuer un panoramique et de parcourir la zone de cr&eacute;ation. En mode Panoramique,
les &eacute;l&eacute;ments ne peuvent &ecirc;tre ni s&eacute;lectionn&eacute;s ni d&eacute;plac&eacute;s.
Mode Zoom Affiche par d&eacute;faut des valeurs d’agrandissement pr&eacute;d&eacute;finies. Pour effectuer un zoom arri&egrave;re, appuyez sur
Alt+clic (Opt+clic sous Mac). Pour revenir au mode d’affichage 100%, double-cliquez sur le bouton Mode Zoom.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 23
Workbench Flash Builder
Agrandissement Affiche les pourcentages d’agrandissement. Cette liste est &eacute;galement disponible dans le menu
Cr&eacute;ation &gt; Agrandissement. La liste affiche par d&eacute;faut la valeur 100%.
Arri&egrave;re-plan Lance un s&eacute;lecteur de couleurs permettant de s&eacute;lectionner une couleur d’arri&egrave;re-plan pour la zone
d’aper&ccedil;u. Ce changement de couleur ne modifie par le fichier CSS et n’a aucune incidence sur l’application Flex lorsque
vous l’ex&eacute;cutez.
Aper&ccedil;u en tant que Ne s’affiche que lorsque la r&egrave;gle de style n’est associ&eacute;e &agrave; aucun composant MXML en particulier.
Editer les grilles d’&eacute;chelle (pas affich&eacute;) Ne s’affiche que lorsque la r&egrave;gle de style utilise des habillages de fichier d’image.
Utilisation des raccourcis clavier
De nombreuses op&eacute;rations accessibles &agrave; partir du syst&egrave;me de menus de Flash Builder sont &eacute;galement disponibles sous
forme de raccourcis clavier.
Affichage de la liste de tous les raccourcis clavier de Flash Builder
❖ S&eacute;lectionnez Aide &gt; Assistant de touches.
Vous pouvez utiliser l’option Assistant de touches comme r&eacute;f&eacute;rence pour tous les raccourcis clavier Flash Builder,
ou ex&eacute;cuter ces commandes directement &agrave; partir du panneau Assistant de touches en double-cliquant sur les
commandes. Vous pouvez &eacute;galement modifier les raccourcis clavier ou cr&eacute;er vos propres raccourcis. Pour plus
d’informations, voir &laquo; Modification des raccourcis clavier &raquo; &agrave; la page 30.
Extension du workbench Flash Builder
Flash Builder se structure autour d’un ensemble de plug-ins Eclipse fournissant les outils n&eacute;cessaires &agrave; la cr&eacute;ation
d’applications Flex et ActionScript 3.0. Cette structure permet aux plug-ins de proposer des points d’extension
pouvant &ecirc;tre utilis&eacute;s pour &eacute;tendre les fonctionnalit&eacute;s et les capacit&eacute;s de l’outil. Pour plus d’informations, voir R&eacute;f&eacute;rence
d’extensibilit&eacute; d’Adobe Flash Builder.
Navigation et personnalisation du workbench Flash
Builder
Le terme workbench d&eacute;signe l’environnement de d&eacute;veloppement Flash Builder. Le workbench contient trois &eacute;l&eacute;ments
principaux : les perspectives, les &eacute;diteurs et les vues. L’utilisation associ&eacute;e de ces trois composants varie en fonction du
stade de d&eacute;veloppement de l’application. Le workbench constitue le conteneur de tous les outils de d&eacute;veloppement des
applications.
Remarque : pour plus d’informations sur certaines fonctionnalit&eacute;s du workbench Eclipse, voir le guide de l’utilisateur du
workbench Eclipse &agrave; l’adresse http://help.eclipse.org/help31/index.jsp.
Utilisation des perspectives
Les perspectives comportent des combinaisons de vues et d’&eacute;diteurs adapt&eacute;es &agrave; l’ex&eacute;cution de certains groupes de
t&acirc;ches. Vous utiliserez ainsi g&eacute;n&eacute;ralement la perspective D&eacute;bogage Flash pour d&eacute;boguer une application.
Pour une pr&eacute;sentation des perspectives, voir &laquo; A propos des perspectives de Flash Builder &raquo; &agrave; la page 7.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 24
Workbench Flash Builder
Ouverture et changement de perspectives
L’ouverture d’un fichier associ&eacute; &agrave; une perspective particuli&egrave;re conduit &agrave; l’affichage automatique de cette perspective.
La configuration autonome de Flash Builder propose trois perspectives :
• D&eacute;veloppement Flash
• D&eacute;bogage Flash
• Profil Flash
La perspective Profil Flash est disponible dans Flash Builder Premium.
❖ S&eacute;lectionnez Fen&ecirc;tre &gt; Perspective ou choisissez Autre pour afficher toutes les autres perspectives Eclipse (dans la
configuration plug-in de Flash Builder, s&eacute;lectionnez Fen&ecirc;tre &gt; Ouvrir la perspective).
Vous pouvez &eacute;galement cliquer sur le bouton Ouvrir la perspective dans l’angle sup&eacute;rieur droit de la fen&ecirc;tre du
workbench afin de s&eacute;lectionner une perspective dans le menu contextuel.
Pour afficher la liste compl&egrave;te des perspectives, s&eacute;lectionnez Autre dans le menu contextuel Ouvrir la perspective.
Le titre de la perspective que vous ouvrez remplace celui de la perspective pr&eacute;c&eacute;demment affich&eacute;e. Une ic&ocirc;ne
appara&icirc;t en regard du titre. Elle permet de parcourir rapidement les perspectives dans la m&ecirc;me fen&ecirc;tre. Par d&eacute;faut,
les perspectives s’affichent dans la m&ecirc;me fen&ecirc;tre.
D&eacute;finition de la perspective par d&eacute;faut
La perspective par d&eacute;faut est signal&eacute;e par le terme par d&eacute;faut affich&eacute; entre parenth&egrave;ses apr&egrave;s le nom de la perspective.
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Perspectives.
2 Sous Perspectives disponibles, s&eacute;lectionnez la perspective &agrave; d&eacute;finir par d&eacute;faut, puis cliquez sur Perspective par
d&eacute;faut.
3 Cliquez sur OK.
Ouverture des perspectives dans une nouvelle fen&ecirc;tre
Vous pouvez ouvrir les perspectives dans une nouvelle fen&ecirc;tre.
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Perspectives.
2 Sous Ouverture d’une nouvelle perspective, s&eacute;lectionnez Dans une nouvelle fen&ecirc;tre.
Pour r&eacute;tablir les valeurs par d&eacute;faut, s&eacute;lectionnez Dans la m&ecirc;me fen&ecirc;tre.
3 Cliquez sur OK.
Personnalisation d’une perspective
Pour modifier la pr&eacute;sentation d’une perspective, changez les &eacute;diteurs et les vues visibles dans une perspective donn&eacute;e.
Par exemple, vous pouvez afficher la vue Signets dans une perspective et la masquer dans une autre.
Vous pouvez &eacute;galement configurer d’autres aspects d’une perspective, notamment les sous-menus Fichier &gt; Nouveau,
Fen&ecirc;tre &gt; Perspective &gt; Autre, Fen&ecirc;tre &gt; Autres vues ainsi que les jeux d’actions (boutons et options de menu) qui
apparaissent dans la barre d’outils et dans les &eacute;l&eacute;ments du menu principal (les noms des menus varient l&eacute;g&egrave;rement
dans la configuration plug-in de Flash Builder).
Cr&eacute;ation d’une perspective
1 Ouvrez une perspective existante.
2 Affichez les vues et les &eacute;diteurs de votre choix.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 25
Workbench Flash Builder
Pour plus d’informations, voir &laquo; Ouverture des vues &raquo; &agrave; la page 26 et &laquo; Ouverture de fichiers &agrave; &eacute;diter &raquo; &agrave; la page 28.
3 S&eacute;lectionnez Fen&ecirc;tre &gt; Perspective &gt; Sauvegarder la perspective sous (Fen&ecirc;tre &gt; Sauvegarder la perspective sous
dans la configuration plug-in de Flash Builder).
4 Dans la bo&icirc;te de dialogue Sauvegarder la perspective sous, entrez le nouveau nom de la perspective, puis cliquez sur OK.
Configuration d’une perspective
1 Ouvrez la perspective &agrave; configurer.
2 S&eacute;lectionnez Fen&ecirc;tre &gt; Perspective &gt; Personnaliser la perspective (Fen&ecirc;tre &gt; Personnaliser la perspective dans la
configuration plug-in de Flash Builder).
3 S&eacute;lectionnez les onglets Raccourcis ou Commandes en fonction des &eacute;l&eacute;ments que vous souhaitez ajouter &agrave; la
perspective personnalis&eacute;e.
4 Cochez les cases correspondant aux &eacute;l&eacute;ments que vous souhaitez afficher dans les menus et dans les barres d’outils
de la perspective s&eacute;lectionn&eacute;e.
5 Cliquez sur OK.
6 S&eacute;lectionnez Fen&ecirc;tre &gt; Perspective &gt; Sauvegarder la perspective sous (Fen&ecirc;tre &gt; Sauvegarder la perspective sous
dans la configuration plug-in de Flash Builder).
7 Dans la bo&icirc;te de dialogue Sauvegarder la perspective sous, entrez le nouveau nom de la perspective, puis cliquez sur OK.
Flash Builder ajoute le nom de la perspective enregistr&eacute;e au menu Fen&ecirc;tre &gt; Perspective (Fen&ecirc;tre &gt; Ouvrir la
perspective dans la configuration plug-in de Flash Builder).
Suppression d’une perspective personnalis&eacute;e
Vous pouvez supprimer des perspectives d&eacute;finies pr&eacute;c&eacute;demment. Vous ne pouvez pas supprimer une perspective que
vous n’avez pas cr&eacute;&eacute;e.
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Perspectives.
2 Sous Perspectives disponibles, s&eacute;lectionnez la perspective que vous souhaitez supprimer.
3 Cliquez sur Supprimer, puis sur OK.
R&eacute;initialisation des perspectives
Vous pouvez r&eacute;tablir la pr&eacute;sentation d’origine d’une perspective que vous avez modifi&eacute;e.
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Perspectives.
2 Sous Perspectives disponibles, s&eacute;lectionnez la perspective &agrave; r&eacute;initialiser.
3 Cliquez sur R&eacute;initialiser, puis sur OK.
Utilisation des &eacute;diteurs et des vues
La plupart des perspectives du workbench se composent d’un &eacute;diteur ainsi que d’une ou de plusieurs vues. Un &eacute;diteur
est un composant visuel du workbench, g&eacute;n&eacute;ralement utilis&eacute; pour &eacute;diter ou explorer une ressource. Les vues sont
&eacute;galement des composants visuels de l’espace de travail. Elles prennent en charge les &eacute;diteurs, offrent des alternatives
de pr&eacute;sentation des &eacute;l&eacute;ments s&eacute;lectionn&eacute;s dans l’&eacute;diteur et permettent de parcourir les informations du workbench.
Pour une pr&eacute;sentation des &eacute;diteurs et des vues, voir &laquo; A propos du workbench &raquo; &agrave; la page 4.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 26
Workbench Flash Builder
Ouverture des vues
Les perspectives contiennent des combinaisons pr&eacute;d&eacute;finies de vues et d’&eacute;diteurs. Vous pouvez &eacute;galement ouvrir des
vues qui ne figurent pas dans la perspective active.
❖ S&eacute;lectionnez Fen&ecirc;tre et choisissez une vue Flash Builder ou choisissez Fen&ecirc;tre &gt; Autres vues pour choisir d’autres vues
du workbench Eclipse (dans la configuration plug-in de Flash Builder, s&eacute;lectionnez Fen&ecirc;tre &gt; Affichage d’une vue).
Apr&egrave;s avoir ajout&eacute; une vue &agrave; la perspective active, vous pouvez l’enregistrer en tant que partie de la perspective.
Pour plus d’informations, voir &laquo; Personnalisation d’une perspective &raquo; &agrave; la page 24.
Vous pouvez &eacute;galement cr&eacute;er des vues rapides qui facilitent l’acc&egrave;s aux vues fr&eacute;quemment utilis&eacute;es. Pour plus
d’informations, voir &laquo; Cr&eacute;ation et utilisation de vues rapides &raquo; &agrave; la page 27.
D&eacute;placement et ancrage des vues
Vous pouvez d&eacute;placer les vues &agrave; l’int&eacute;rieur du workbench, les ancrer &agrave; diff&eacute;rents emplacements ou en annuler
l’ancrage, en fonction de vos besoins.
1 D&eacute;placez la vue vers l’emplacement souhait&eacute; en faisant glisser sa barre de titre.
Lorsque vous d&eacute;placez la vue dans le workbench, le curseur prend la forme d’une fl&egrave;che noire pointant vers
l’emplacement o&ugrave; la vue sera ancr&eacute;e une fois le bouton de la souris rel&acirc;ch&eacute;.
Vous pouvez faire glisser un groupe de vues empil&eacute;es en cliquant sur l’espace vide situ&eacute; &agrave; droite des onglets des vues
et en d&eacute;pla&ccedil;ant la souris.
Vous pouvez &eacute;galement d&eacute;placer une vue &agrave; l’aide de son menu contextuel. Ouvrez le menu contextuel &agrave; partir de
l’onglet de la vue, s&eacute;lectionnez D&eacute;placer &gt; Vue, d&eacute;placez la vue vers l’emplacement souhait&eacute;, puis cliquez de
nouveau avec le bouton de la souris.
2 (Facultatif) Enregistrez vos modifications en s&eacute;lectionnant Fen&ecirc;tre &gt; Perspective &gt; Sauvegarder la perspective sous
(Fen&ecirc;tre &gt; Sauvegarder la perspective sous dans la configuration plug-in de Flash Builder).
R&eacute;organisation des onglets des vues
Outre l’ancrage des vues &agrave; diff&eacute;rents emplacements du workbench, vous pouvez r&eacute;organiser les onglets des vues &agrave;
l’int&eacute;rieur d’un groupe de vues.
❖ Cliquez sur l’onglet de la vue &agrave; d&eacute;placer, faites glisser la vue vers l’emplacement souhait&eacute;, puis rel&acirc;chez le bouton
de la souris. Un symbole repr&eacute;sentant une pile appara&icirc;t lorsque vous faites glisser l’onglet d’une vue sur d’autres
onglets.
Changement de vues
Le passage d’une vue &agrave; l’autre peut se faire de diff&eacute;rentes fa&ccedil;ons :
• Cliquez sur l’onglet de la vue &agrave; laquelle vous souhaitez acc&eacute;der.
• S&eacute;lectionnez une vue dans le menu Fen&ecirc;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&eacute;lectionner
une vue.
Pour obtenir une liste de tous les raccourcis clavier, cliquez sur Aide &gt; Assistant de touches.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 27
Workbench Flash Builder
Cr&eacute;ation et utilisation de vues rapides
Les vues rapides sont des vues masqu&eacute;es que vous pouvez ouvrir et fermer rapidement. Elles sont identiques aux autres
vues &agrave; ceci pr&egrave;s qu’elles n’encombrent pas le workbench.
Cliquez sur l’ic&ocirc;ne de vue rapide dans la barre de raccourcis pour afficher la vue. Cliquez &agrave; l’ext&eacute;rieur de la vue rapide
(ou sur le bouton R&eacute;duire de sa barre d’outils) pour la masquer &agrave; nouveau.
Remarque : si vous convertissez la vue Explorateur de packages en vue rapide, puis ouvrez un fichier &agrave; partir de la vue
rapide Explorateur de packages, la vue est automatiquement masqu&eacute;e pour vous permettre d’utiliser ce fichier.
Cr&eacute;ation d’une vue rapide
❖ Faites glisser la vue que vous souhaitez convertir en vue rapide vers la barre de raccourcis situ&eacute;e dans l’angle
inf&eacute;rieur gauche de la fen&ecirc;tre du workbench.
L’ic&ocirc;ne de la vue que vous avez d&eacute;plac&eacute;e appara&icirc;t dans la barre de raccourcis. Cliquez sur cette ic&ocirc;ne pour ouvrir la
vue. Cliquez &agrave; l’ext&eacute;rieur de la vue pour la masquer.
Restauration d’une vue rapide en vue normale
❖ Dans le menu contextuel de la vue, d&eacute;s&eacute;lectionnez Vue rapide.
Filtrage des vues T&acirc;ches et Erreurs
Vous pouvez filtrer les t&acirc;ches ou les probl&egrave;mes qui s’affichent dans les vues T&acirc;ches ou Erreurs. Vous pouvez par
exemple limiter l’affichage aux probl&egrave;mes consign&eacute;s par le workbench ou aux t&acirc;ches que vous avez consign&eacute;es comme
rappels. Vous pouvez filtrer les &eacute;l&eacute;ments en fonction de la ressource ou du groupe de ressources auquel ils sont
associ&eacute;s, de la cha&icirc;ne de texte affich&eacute;e dans le champ Description, de la gravit&eacute; du probl&egrave;me, de la priorit&eacute; de la t&acirc;che
ou du statut de la t&acirc;che.
1 Dans la barre des t&acirc;ches de la vue T&acirc;ches ou Erreurs, cliquez sur Filtrer.
2 Renseignez la bo&icirc;te de dialogue Filtres, puis cliquez sur OK.
Pour plus d’informations sur les vues, voir &laquo; Notions de base du workbench Flash Builder &raquo; &agrave; la page 4.
Cr&eacute;ation de jeux de documents
Si votre espace de travail contient de nombreux projets, vous pouvez cr&eacute;er un jeu de documents afin de regrouper un
certain nombre de projets. Vous pouvez alors afficher des jeux de documents diff&eacute;rents dans les vues Explorateur de
packages et T&acirc;ches ainsi que limiter la port&eacute;e de vos recherches &agrave; des jeux de documents (et &eacute;viter donc les recherches
portant sur l’ensemble de l’espace de travail).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 28
Workbench Flash Builder
Cr&eacute;ation d’un jeu de documents
1 Dans la vue Explorateur de packages, ouvrez le menu de la barre d’outils et choisissez S&eacute;lectionner un jeu de
documents.
2 S&eacute;lectionnez Nouveau.
Flash Builder propose deux types de jeu : les points d’arr&ecirc;t (utilis&eacute;s lors du d&eacute;bogage) et les ressources.
3 S&eacute;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
le jeu.
5 Cliquez sur Terminer.
Le jeu de documents est aussit&ocirc;t appliqu&eacute; &agrave; la vue Explorateur de packages et seuls les projets et les ressources qui
figurent dans le jeu s’affichent.
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&eacute;s&eacute;lectionner le jeu de
documents.
Ouverture de fichiers &agrave; &eacute;diter
L’ouverture d’un fichier lance un &eacute;diteur dans lequel il peut &ecirc;tre modifi&eacute;.
❖ Effectuez l’une des op&eacute;rations suivantes :
• Dans le menu contextuel du fichier (quelle que soit la vue de navigation dans laquelle il se trouve), s&eacute;lectionnez
Ouvrir.
• Double-cliquez sur le fichier dans l’une des vues de navigation.
• Double-cliquez sur le signet associ&eacute; au fichier dans la vue Signets.
• Double-cliquez sur un avertissement d’erreur ou un enregistrement de t&acirc;che associ&eacute; au fichier dans la vue
Erreurs.
Le fichier s’ouvre dans l’&eacute;diteur d&eacute;fini par d&eacute;faut pour ce type de fichier. Pour ouvrir le fichier dans un autre &eacute;diteur,
s&eacute;lectionnez Ouvrir avec dans le menu contextuel du fichier. S&eacute;lectionnez l’&eacute;diteur que vous souhaitez utiliser.
Association d’&eacute;diteurs &agrave; des types de fichier
Le workbench permet d’associer les &eacute;diteurs &agrave; diff&eacute;rents types de fichiers.
1 S&eacute;lectionnez Fen&ecirc;tre &gt; Pr&eacute;f&eacute;rences.
2 Cliquez sur le signe plus pour d&eacute;velopper la cat&eacute;gorie G&eacute;n&eacute;ral.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 29
Workbench Flash Builder
3 Cliquez sur le signe plus pour d&eacute;velopper la cat&eacute;gorie Editeurs, puis s&eacute;lectionnez Associations de fichiers.
4 S&eacute;lectionnez un type de fichier dans la liste Types de fichier.
Pour ajouter un type de fichier &agrave; la liste, cliquez sur Ajouter, entrez le nouveau type de fichier dans la bo&icirc;te de
dialogue Ajouter un type de fichier, puis cliquez sur OK.
5 Dans la liste Editeurs associ&eacute;s, s&eacute;lectionnez l’&eacute;diteur &agrave; associer &agrave; ce type de fichier.
Pour ajouter &agrave; la liste un &eacute;diteur interne ou externe, cliquez sur Ajouter et renseignez la bo&icirc;te de dialogue.
6 Cliquez sur OK.
Vous pouvez modifier les pr&eacute;f&eacute;rences par d&eacute;faut de l’&eacute;diteur &agrave; partir du menu contextuel de toute ressource se
trouvant dans l’une des vues de navigation. Dans le menu contextuel, s&eacute;lectionnez Ouvrir avec.
Edition de fichiers en dehors du workbench
Vous pouvez &eacute;diter un fichier MXML ou ActionScript dans un &eacute;diteur externe puis l’utiliser dans Flash Builder. Le
workbench effectue les op&eacute;rations de cr&eacute;ation ou d’actualisation n&eacute;cessaires afin d’appliquer les modifications que
vous avez apport&eacute;es au fichier en dehors du workbench.
Actualisation d’un fichier MXML ou ActionScript &eacute;dit&eacute; en dehors du workbench
1 Editez le fichier MXML ou ActionScript dans l’&eacute;diteur externe de votre choix.
2 Enregistrez et fermez le fichier.
3 D&eacute;marrez Flash Builder.
4 Dans l’une des vues de navigation du workbench, ouvrez le menu contextuel, puis s&eacute;lectionnez Actualiser.
Si vous utilisez r&eacute;guli&egrave;rement des &eacute;diteurs externes, vous pouvez activer l’actualisation automatique. Pour ce faire,
s&eacute;lectionnez Fen&ecirc;tre &gt; Pr&eacute;f&eacute;rences, d&eacute;veloppez la cat&eacute;gorie G&eacute;n&eacute;ral, s&eacute;lectionnez Espace de travail, puis cochez la
case Actualiser automatiquement. Lorsque vous activez cette option, le workbench consigne toutes les modifications
externes apport&eacute;es au fichier. La vitesse de l’op&eacute;ration d&eacute;pend de votre plateforme.
Mosa&iuml;que d’&eacute;diteurs
Le workbench vous permet d’ouvrir plusieurs fichiers dans diff&eacute;rents &eacute;diteurs. Mais contrairement aux vues, les
&eacute;diteurs ne peuvent pas &ecirc;tre d&eacute;plac&eacute;s &agrave; l’ext&eacute;rieur du workbench pour cr&eacute;er des fen&ecirc;tres. Vous pouvez cependant
disposer les &eacute;diteurs en mosa&iuml;que dans la zone d’&eacute;dition afin d’afficher les fichiers source c&ocirc;te &agrave; c&ocirc;te.
1 Ouvrez deux ou plusieurs fichiers dans la zone d’&eacute;dition.
2 Cliquez sur l’onglet de l’un des &eacute;diteurs.
3 Faites-le glisser vers le bord gauche, droit, sup&eacute;rieur ou inf&eacute;rieur de la zone d’&eacute;dition.
Le pointeur prend la forme d’une fl&egrave;che noire pointant vers l’emplacement o&ugrave; la vue sera ancr&eacute;e une fois le bouton
de la souris rel&acirc;ch&eacute;.
4 (Facultatif) Faites glisser les bords des &eacute;diteurs pour les redimensionner, si besoin est.
Agrandissement d’une vue ou d’un &eacute;diteur
Vous pouvez proc&eacute;der de diff&eacute;rentes fa&ccedil;ons pour agrandir une vue ou un &eacute;diteur de mani&egrave;re &agrave; occuper enti&egrave;rement la
fen&ecirc;tre du workbench.
Agrandissement (restauration) d’une vue ou d’un &eacute;diteur
• Acc&eacute;dez au menu contextuel de la barre de titre de la vue ou de l’&eacute;diteur et s&eacute;lectionnez Agrandir (Restaurer).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 30
Workbench Flash Builder
• Double-cliquez sur l’onglet de la vue.
• Dans le menu Fen&ecirc;tre de Flash Builder, s&eacute;lectionnez Agrandir/R&eacute;tablir l’&eacute;diteur.
• Cliquez sur les ic&ocirc;nes Agrandir/Restaurer situ&eacute;es dans l’angle sup&eacute;rieur droit de la vue ou de l’&eacute;diteur.
Changement d’espace de travail
Vous ne pouvez travailler que dans un seul espace de travail &agrave; la fois. Lorsque vous installez et ex&eacute;cutez Flash Builder
pour la premi&egrave;re fois, un message vous invite &agrave; cr&eacute;er un espace de travail qui devient l’espace de travail par d&eacute;faut. Vous
pouvez cr&eacute;er d’autres espaces de travail et passer de l’un &agrave; l’autre en s&eacute;lectionnant l’espace de travail voulu au
lancement de Flash Builder ou en choisissant Fichier &gt; Commuter l’espace de travail.
Personnalisation du workbench
Vous pouvez personnaliser le workbench en fonction de vos besoins. Vous pouvez par exemple d&eacute;finir l’affichage des
&eacute;l&eacute;ments dans la barre d’outils principale, cr&eacute;er des raccourcis clavier ou modifier les polices et les couleurs de
l’interface utilisateur.
R&eacute;organisation de la barre d’outils principale
Flash Builder vous permet de r&eacute;organiser les sections de la barre d’outils principale. Les sections de la barre d’outils
principale sont s&eacute;par&eacute;es par un espace.
1 V&eacute;rifiez que la barre d’outils est d&eacute;verrouill&eacute;e. Dans le menu contextuel de la barre d’outils, d&eacute;s&eacute;lectionnez l’option
Verrouiller les barres d’outils.
2 Positionnez le pointeur de la souris sur la ligne verticale qui d&eacute;limite sur la gauche la section &agrave; d&eacute;placer.
3 Cliquez sur cette ligne et d&eacute;placez la section vers la gauche, la droite, le haut ou le bas. Rel&acirc;chez le bouton de la souris
pour positionner la section &agrave; son nouvel emplacement.
Afin d’&eacute;viter tout d&eacute;placement non intentionnel des barres d’outils, verrouillez-les de nouveau en activant l’option
correspondante de leur menu contextuel.
Modification des raccourcis clavier
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Touches.
2 Dans l’&eacute;cran Vue de la bo&icirc;te de dialogue Touches, s&eacute;lectionnez la commande &agrave; modifier.
3 Dans le champ Liaison, entrez le nouveau raccourci clavier &agrave; lier &agrave; la commande.
4 Dans la liste d&eacute;roulante Quand, s&eacute;lectionnez &agrave; quel moment le raccourci clavier doit &ecirc;tre activ&eacute;.
5 Cliquez sur Appliquer ou sur OK.
Pour obtenir une liste de tous les raccourcis clavier, cliquez sur Aide &gt; Assistant de touches.
Modification des polices et des couleurs
Par d&eacute;faut, le workbench utilise les polices et les couleurs du syst&egrave;me d’exploitation de l’ordinateur. Vous pouvez
cependant personnaliser les polices et les couleurs de diff&eacute;rentes mani&egrave;res. Le workbench permet de configurer les
polices suivantes.
Police de banni&egrave;re Appara&icirc;t dans la barre de titre de nombreux assistants. Par exemple, l’assistant Nouveau projet Flex
utilise la police de la banni&egrave;re pour le titre sup&eacute;rieur.
Police de bo&icirc;te de dialogue Appara&icirc;t dans les widgets et les bo&icirc;tes de dialogue.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 31
Workbench Flash Builder
Police d’en-t&ecirc;te Appara&icirc;t dans l’en-t&ecirc;te de section.
Police de texte Appara&icirc;t dans les &eacute;diteurs de texte.
Police de console CVS Appara&icirc;t dans la console CVS.
Police des ressources ignor&eacute;es Affiche les ressources ignor&eacute;es par la console CVS.
Police des modifications sortantes Affiche les modifications sortantes dans CVS.
Police de la console (Police du texte, par d&eacute;faut) Appara&icirc;t dans la console D&eacute;boguer.
Police du texte des volets D&eacute;tails (Police du texte, par d&eacute;faut) Appara&icirc;t dans les volets D&eacute;tails des vues D&eacute;bogage.
Police de la table de la vue M&eacute;moire (Police du texte, par d&eacute;faut) Appara&icirc;t dans le tableau de la vue M&eacute;moire.
Police de texte de l’&eacute;diteur Java (Police du texte, par d&eacute;faut) Appara&icirc;t dans les &eacute;diteurs Java.
Police du texte de l’&eacute;diteur de fichier de propri&eacute;t&eacute;s (Police du texte, par d&eacute;faut) Appara&icirc;t dans les &eacute;diteurs de fichier
de propri&eacute;t&eacute;s.
Police du texte de comparaison (Police du texte, par d&eacute;faut) Appara&icirc;t dans les outils de comparaison textuelle ou de
fusion.
Police du texte de la comparaison Java (Police du texte, par d&eacute;faut) Appara&icirc;t dans les outils de comparaison ou de
fusion Java.
Police du texte de comparaison de fichiers de propri&eacute;t&eacute;s Java (Police du texte de l’&eacute;diteur de fichier de propri&eacute;t&eacute;s, par
d&eacute;faut) Appara&icirc;t dans les outils de comparaison ou de fusion de fichier de propri&eacute;t&eacute;s Java.
Police du titre de partie (Police du texte de l’&eacute;diteur de fichier de propri&eacute;t&eacute;s, par d&eacute;faut) Appara&icirc;t dans les titres des
vues et des &eacute;diteurs.
Police du message de la vue (Police du texte de l’&eacute;diteur du fichier des propri&eacute;t&eacute;s, par d&eacute;faut) Affiche les messages
dans la barre de titre de la vue (le cas &eacute;ch&eacute;ant).
Les plug-ins qui utilisent d’autres polices peuvent &eacute;galement comporter des pr&eacute;f&eacute;rences personnalisables. Le plug-in
Java Development Tools permet par exemple de d&eacute;finir la police utilis&eacute;e par l’&eacute;diteur Java (dans Pr&eacute;f&eacute;rences,
s&eacute;lectionnez &gt; G&eacute;n&eacute;ral &gt; Apparence &gt; Couleurs et polices &gt; Java &gt; Police de texte de l’&eacute;diteur Java).
Certaines zones (l’arborescence de l’Explorateur de packages, par exemple) sont toujours affich&eacute;es dans la police du
syst&egrave;me d’exploitation. Pour modifier la police de ces zones, utilisez les outils de configuration fournis par le syst&egrave;me
d’exploitation (les propri&eacute;t&eacute;s d’affichage du Panneau de configuration de Windows, par exemple).
Modification des polices et des couleurs
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Apparence &gt; Couleurs et polices.
2 D&eacute;veloppez les cat&eacute;gories Comparaison de texte, Couleurs et polices de base, CVS, D&eacute;boguer ainsi que Dossiers des
&eacute;diteurs et des vues pour rechercher et s&eacute;lectionner la police et les couleurs &agrave; modifier.
Remarque : vous pouvez &eacute;galement cliquer sur Utiliser la police du syst&egrave;me au lieu de Modifier pour laisser le syst&egrave;me
d’exploitation choisir une valeur de police appropri&eacute;e. Sous Windows par exemple, si vous s&eacute;lectionnez cette option,
Flash Builder utilise la police s&eacute;lectionn&eacute;e dans les propri&eacute;t&eacute;s d’affichage du Panneau de configuration de Windows.
3 D&eacute;finissez vos pr&eacute;f&eacute;rences en mati&egrave;re de police et de couleur.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 32
Workbench Flash Builder
Modification des couleurs
Le workbench fait appel &agrave; diff&eacute;rentes couleurs pour distinguer les &eacute;l&eacute;ments, par exemple les textes d’erreur et les liens
hypertexte. Il utilise les m&ecirc;mes couleurs que le syst&egrave;me d’exploitation. Pour les modifier, utilisez dans ce cas aussi les
outils de configuration fournis par le syst&egrave;me d’exploitation (les propri&eacute;t&eacute;s d’affichage du Panneau de configuration
de Windows, par exemple).
Modification des couleurs
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Apparence &gt; Couleurs et polices.
2 D&eacute;veloppez les cat&eacute;gories Comparaison de texte, Couleurs et polices de base, CVS, D&eacute;boguer ainsi que Dossiers des
&eacute;diteurs et des vues pour rechercher et s&eacute;lectionner la couleur &agrave; modifier.
3 Cliquez sur la barre de couleurs &agrave; droite pour ouvrir le s&eacute;lecteur de couleurs.
4 S&eacute;lectionnez une nouvelle couleur.
Contr&ocirc;le du clic et du double-clic
Vous pouvez d&eacute;finir la r&eacute;action du workbench &agrave; un clic ou &agrave; un double-clic.
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral.
2 Dans la section Mode d’ouverture, s&eacute;lectionnez les options voulues et cliquez sur OK.
Recherche dans le workbench
Flash Builder int&egrave;gre un outil de recherche qui vous permet de localiser rapidement des ressources. Pour plus
d’informations sur la recherche de texte dans un fichier particulier, voir &laquo; Recherche et remplacement de texte dans
l’&eacute;diteur &raquo; &agrave; la page 118.
Recherche de fichiers
Flash Builder vous permet d’effectuer des recherches complexes de fichiers.
❖ Dans la version plug-in de Flash Builder, s&eacute;lectionnez Rechercher &gt; Rechercher ou Rechercher &gt; Fichier.
Dans la version autonome de Flash Builder, s&eacute;lectionnez Editer &gt; Rechercher dans les fichiers.
Remarque : cliquez sur Personnaliser pour d&eacute;finir les types d’onglet de recherche disponibles dans la bo&icirc;te de dialogue
Rechercher.
Recherche de r&eacute;f&eacute;rences et de d&eacute;clarations
Flash Builder pr&eacute;sente des fonctions de recherche avanc&eacute;es plus puissantes que les fonctions de
recherche/remplacement. Afin de faciliter la compr&eacute;hension de la mani&egrave;re dont les fonctions, variables et autres
identifiants sont utilis&eacute;s, Flash Builder permet de rechercher et de rep&eacute;rer les r&eacute;f&eacute;rences ou les d&eacute;clarations vers les
identifiants dans les fichiers ActionScript ou MXML, les projets ou les espaces de travail. Pour plus d’informations,
voir &laquo; Recherche de r&eacute;f&eacute;rences et restructuration de code &raquo; &agrave; la page 118.
Utilisation de la vue Recherche
La vue Recherche affiche les r&eacute;sultats de votre recherche.
Ouverture d’un fichier de la liste
❖ Double-cliquez sur le fichier.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 33
Workbench Flash Builder
Suppression d’un fichier de la liste
❖ S&eacute;lectionnez le fichier &agrave; supprimer, puis cliquez sur Supprimer les occurrences s&eacute;lectionn&eacute;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&eacute;c&eacute;dente.
Affichage des recherches pr&eacute;c&eacute;dentes
❖ Cliquez sur la fl&egrave;che en regard de l’option Afficher les recherches pr&eacute;c&eacute;dentes et s&eacute;lectionnez une recherche dans
la liste d&eacute;roulante.
Retour &agrave; la vue Recherche apr&egrave;s sa fermeture
1 S&eacute;lectionnez Fen&ecirc;tre &gt; Autres vues &gt; G&eacute;n&eacute;ralit&eacute;s (Fen&ecirc;tre &gt; Afficher la vue &gt; Autre dans la configuration plug-in
de Flash Builder).
2 D&eacute;veloppez la cat&eacute;gorie G&eacute;n&eacute;ralit&eacute;s, s&eacute;lectionnez Recherche, puis cliquez sur OK.
Utilisation des modes Source et Cr&eacute;ation de l’&eacute;diteur
L’&eacute;diteur MXML de Flash Builder vous permet d’utiliser les modes Source ou Cr&eacute;ation. Flash Builder permet
&eacute;galement de cr&eacute;er une vue partag&eacute;e dans laquelle vous pourrez afficher les deux modes simultan&eacute;ment.
Affichage du fichier en mode Cr&eacute;ation
❖ Cliquez sur Cr&eacute;ation en haut de la zone de l’&eacute;diteur.
Affichage du fichier en mode Source
❖ Cliquez sur Source en haut de la zone de l’&eacute;diteur.
Utilisation simultan&eacute;e des modes Source et Cr&eacute;ation
1 Dans le menu contextuel de l’onglet de l’&eacute;diteur, s&eacute;lectionnez Nouvel &eacute;diteur.
Vous disposez &agrave; pr&eacute;sent de deux onglets d’&eacute;dition pour le m&ecirc;me fichier.
2 Faites glisser l’un des onglets vers la droite pour le juxtaposer &agrave; l’autre onglet.
3 Configurez l’un des &eacute;diteurs en mode Cr&eacute;ation et l’autre &eacute;diteur en mode Source.
Commutation des modes Source et Cr&eacute;ation
❖ Appuyez sur Ctrl+`(guillemet ouvrant).
Acc&egrave;s aux raccourcis clavier
Les raccourcis clavier disponibles dans Flash Builder d&eacute;pendent de nombreux facteurs, y compris de la vue ou de
l’&eacute;diteur s&eacute;lectionn&eacute;, de l’ouverture ou non d’une bo&icirc;te de dialogue, des plug-ins install&eacute;s et du syst&egrave;me d’exploitation.
Vous pouvez obtenir &agrave; tout moment la liste des raccourcis clavier disponibles &agrave; l’aide de la fonction Assistant de
touches.
❖ S&eacute;lectionnez Aide &gt; Assistant de touches.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 34
Workbench Flash Builder
D&eacute;finition des pr&eacute;f&eacute;rences du workbench
Vous pouvez d&eacute;finir les pr&eacute;f&eacute;rences de nombreux aspects du workbench. Vous pouvez par exemple configurer Flash
Builder de mani&egrave;re telle &agrave; ce qu’il vous invite &agrave; s&eacute;lectionner l’espace de travail au d&eacute;marrage, d&eacute;finir l’&eacute;diteur &agrave; utiliser
&agrave; l’ouverture de certains types de ressource et param&eacute;trer diff&eacute;rentes options pour l’ex&eacute;cution et le d&eacute;bogage de vos
applications.
Vos pr&eacute;f&eacute;rences Flash Builder s’appliquent uniquement &agrave; l’espace de travail actuel. Vous pouvez cependant exporter
les pr&eacute;f&eacute;rences du workbench et les importer dans un autre espace de travail. L’exportation des pr&eacute;f&eacute;rences est utile si
vous g&eacute;rez plusieurs espaces de travail ou si vous souhaitez partager les pr&eacute;f&eacute;rences du workbench avec d’autres
membres de votre &eacute;quipe de d&eacute;veloppement.
Vous pouvez &eacute;galement d&eacute;finir des pr&eacute;f&eacute;rences individuelles pour chaque projet d’un espace de travail, par exemple
d&eacute;finir des options de compilation ou de d&eacute;bogage distinctes pour chacun de vos projets Flex.
D&eacute;finition des pr&eacute;f&eacute;rences du workbench Flash Builder
1 Ouvrez la fen&ecirc;tre Pr&eacute;f&eacute;rences.
2 D&eacute;veloppez G&eacute;n&eacute;ral, choisissez l’une des cat&eacute;gories de pr&eacute;f&eacute;rences du workbench et modifiez-la si n&eacute;cessaire.
3 Cliquez sur OK.
Derni&egrave;re mise &agrave; jour le 29/4/2010
Chapitre 3 : Utilisation des projets
Adobe&reg; Flash&reg; Builder™ vous permet de cr&eacute;er, g&eacute;rer, assembler et distribuer des projets pour la cr&eacute;ation d’applications
pour le Web et de bureau. Lorsque vous g&eacute;n&eacute;rez des fichiers SWC (shared component library), vous pouvez partager
des composants et d’autres ressources entre diverses applications ou avec d’autres d&eacute;veloppeurs. Vous pouvez
&eacute;galement utiliser diff&eacute;rentes versions du SDK Flex d’Adobe directement dans Flash Builder.
A propos des projets Flash Builder
Flash Builder adopte une approche classique du d&eacute;veloppement de logiciels : le regroupement des ressources (dossiers
et fichiers) qui constituent une application au sein d’un conteneur appel&eacute; projet. Un projet contient un ensemble de
propri&eacute;t&eacute;s qui contr&ocirc;lent la fa&ccedil;on dont l’application est g&eacute;n&eacute;r&eacute;e, l’endroit o&ugrave; l’application construite est h&eacute;berg&eacute;e, la
fa&ccedil;on dont le d&eacute;bogage est g&eacute;r&eacute; et les relations avec d’autres projets dans l’espace de travail.
La vue Explorateur de packages vous permet de g&eacute;rer les projets, en ajoutant, modifiant et supprimant des ressources.
Vous pouvez &eacute;galement fermer les projets &agrave; l’int&eacute;rieur d’un espace de travail, importer des ressources et cr&eacute;er des liens
vers des ressources externes.
Outre les projets Flex, Flash Builder offre un type de projet de base appel&eacute; projet ActionScript. Gr&acirc;ce &agrave; un projet
ActionScript, vous pouvez coder et d&eacute;boguer des applications ActionScript qui acc&egrave;dent directement aux API d’Adobe
Flash Player et sont compil&eacute;es dans des fichiers SWF. Les projets ActionScript ne font pas appel &agrave; la structure Flex ni
au langage MXML.
Applications d&eacute;ploy&eacute;es dans Flash Player
Faites appel &agrave; l’assistant Nouveau projet Flex pour cr&eacute;er des applications pouvant &ecirc;tre d&eacute;ploy&eacute;es dans Flash Player. A
la cr&eacute;ation du projet, s&eacute;lectionnez l’option Application Web (ex&eacute;cut&eacute;e dans Adobe Flash Player). Ce type d’application
est compil&eacute; dans des fichiers SWF autonomes. Pour plus d’informations, voir &laquo; Utilisation des projets &raquo; &agrave; la page 35 et
&laquo; Projets ActionScript &raquo; &agrave; la page 66.
Applications d&eacute;ploy&eacute;es dans Adobe AIR
Faites appel &agrave; l’assistant de cr&eacute;ation d’un projet Flex pour cr&eacute;er des applications pouvant &ecirc;tre d&eacute;ploy&eacute;es dans Adobe&reg;
AIR&reg;. Sous Type d’applications, s&eacute;lectionnez l’option Application de bureau (ex&eacute;cution dans Adobe AIR). Utilisez la
fonction Exporter vers une version valid&eacute;e pour g&eacute;n&eacute;rer un package AIR de qualit&eacute; finale pr&ecirc;t &agrave; &ecirc;tre install&eacute;. Pour plus
d’informations, voir &laquo; D&eacute;veloppement d’applications AIR avec Flash Builder &raquo; &agrave; la page 137.
Flash Builder vous permet de d&eacute;boguer, assembler et g&eacute;rer des projets AIR. Il vous permet &eacute;galement d’ex&eacute;cuter des
applications dans AIR.
Adobe AIR Marketplace est un endroit o&ugrave; les d&eacute;veloppeurs d’AIR publient des applications AIR que les utilisateurs
peuvent t&eacute;l&eacute;charger. Pour trouver Marketplace, aller &agrave; www.adobe.com/go/marketplace. Si vous avez des questions sur
Adobe AIR Marketplace, aller &agrave; www.adobe.com/go/marketplace_faq.
Projets de biblioth&egrave;que Flex
Flash Builder vous permet &eacute;galement de cr&eacute;er des biblioth&egrave;ques de code personnalis&eacute; que vous partagez entre vos
applications ou que vous distribuez &agrave; d’autres d&eacute;veloppeurs. Un projet de biblioth&egrave;que g&eacute;n&egrave;re un fichier SWC, c’est&agrave;-dire un fichier archive pour les composants Flex ainsi que pour d’autres ressources. Pour plus d’informations, voir
&laquo; Projets de biblioth&egrave;que &raquo; &agrave; la page 69.
35
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 36
Utilisation des projets
Applications contenues dans les projets
Pour pouvoir commencer &agrave; cr&eacute;er une application dans Flash Builder, vous devez d’abord cr&eacute;er un projet. Sp&eacute;cifiez s’il
s’agit d’une application Web (ex&eacute;cut&eacute;e dans Adobe Flash Player) ou d’une application de bureau (ex&eacute;cut&eacute;e dans Adobe
AIR). Lorsque vous cr&eacute;ez un projet Flex, un fichier d’application principale est cr&eacute;&eacute;. Vous ajoutez ensuite toutes les
autres ressources, dont les fichiers d’application MXML, les fichiers de composants MXML personnalis&eacute;s et les fichiers
ActionScript, qui formeront votre application Lorsque vous cr&eacute;ez un projet ActionScript, un fichier ActionScript
principal est cr&eacute;&eacute;. Vous pouvez ensuite construire une application gr&acirc;ce &agrave; ActionScript et &agrave; l’API de Flash Player. Pour
plus d’informations, voir &laquo; Cr&eacute;ation de projets Flex &raquo; &agrave; la page 41 et &laquo; Gestion des projets &raquo; &agrave; la page 49.
Projets g&eacute;r&eacute;s dans les espaces de travail
Les projets sont g&eacute;r&eacute;s depuis un espace de travail, c’est-&agrave;-dire une zone d&eacute;finie du syst&egrave;me de fichiers contenant les
ressources (fichiers et dossiers) composant les applications. Vos projets r&eacute;sident par d&eacute;faut dans l’espace de travail.
Vous pouvez toutefois cr&eacute;er des projets en dehors de l’espace de travail. Flash Builder les relie automatiquement &agrave;
l’espace de travail. Le passage d’un espace de travail &agrave; l’autre entra&icirc;ne le red&eacute;marrage de Flash Builder.
Multiplicit&eacute; des projets dans chaque espace de travail
Vous pouvez ajouter autant de projets que vous le souhaitez &agrave; un espace de travail. Tous les projets s’affichent dans
l’Explorateur de packages, dans lequel vous pouvez les g&eacute;rer &agrave; votre guise. Vous pouvez ajouter des ressources, classer
les projets dans des dossiers et g&eacute;n&eacute;rer des projets dans l’espace de travail. Pour plus d’informations, voir &laquo; Gestion des
projets &raquo; &agrave; la page 49 et &laquo; Cr&eacute;ation de dossiers et de fichiers dans un projet &raquo; &agrave; la page 63.
Ressources externes li&eacute;es
Outre les ressources internes des projets, vous pouvez cr&eacute;er des liens avec des ressources situ&eacute;es en dehors d’un projet
et d’un espace de travail. Les ressources externes li&eacute;es apparaissent en tant que partie du projet, mais elles se trouvent
en dehors de l’emplacement du projet. Pour plus d’informations, voir &laquo; Liaison &agrave; des ressources situ&eacute;es en dehors de
l’espace de travail du projet &raquo; &agrave; la page 64.
Multiplicit&eacute; des applications dans un projet
Flash Builder vous permet de d&eacute;finir plusieurs fichiers dans votre projet pour former une application. Lorsque vous
cr&eacute;ez un projet, Flash Builder g&eacute;n&egrave;re un fichier d’application principale qui sert de point d’acc&egrave;s &agrave; l’application. Le
compilateur fait appel &agrave; ce fichier pour g&eacute;n&eacute;rer le fichier SWF de l’application. Vous pouvez cependant cr&eacute;er des
fichiers d’application suppl&eacute;mentaires en fonction de la complexit&eacute; du projet. Tous les fichiers d’application doivent
se trouver dans le dossier src sous le dossier racine du projet. Pour plus d’informations, voir &laquo; Gestion des fichiers
d’application du projet &raquo; &agrave; la page 52.
Prise en charge de plusieurs SDK Flex
Que vous ayez des projets en cours de d&eacute;veloppement ou que vous deviez g&eacute;rer une base de code d’un ancien projet,
Flash Builder vous permet d’utiliser diff&eacute;rentes versions du SDK Flex. Pour sp&eacute;cifier les SDK install&eacute;s, vous devez
configurer l’espace de travail de Flash Builder, qui propose un SDK par d&eacute;faut pour tous les projets. Une fois un projet
configur&eacute;, vous pouvez ajouter, supprimer ou modifier les configurations des SDK dans la bo&icirc;te de dialogue
Pr&eacute;f&eacute;rences en s&eacute;lectionnant Flex &gt; SDK install&eacute;s. Vous pouvez aussi modifier les configurations des SDK en
s&eacute;lectionnant Projet &gt; Propri&eacute;t&eacute;s &gt; Compilateur Flex. Pour plus d’informations, voir &laquo; Utilisation de plusieurs SDK
dans Flash Builder &raquo; &agrave; la page 83.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 37
Utilisation des projets
G&eacute;n&eacute;rations automatiques de projets
Par d&eacute;faut, votre projet est automatiquement g&eacute;n&eacute;r&eacute; &agrave; chaque fois que vous enregistrez des changements dans un
fichier. Vous ma&icirc;trisez compl&egrave;tement la fa&ccedil;on dont vos applications sont g&eacute;n&eacute;r&eacute;es ainsi que la fr&eacute;quence &agrave; laquelle elles
le sont. Si vous n’avez pas de besoins sp&eacute;cifiques en termes de personnalisation de la g&eacute;n&eacute;ration, celle-ci se fait en toute
transparence et les fichiers SWF de l’application sont g&eacute;n&eacute;r&eacute;s automatiquement. Pour plus d’informations, voir
&laquo; G&eacute;n&eacute;ration de projets &raquo; &agrave; la page 73.
Exportation vers une version valid&eacute;e
Une fois que l’application est pr&ecirc;te &agrave; &ecirc;tre d&eacute;ploy&eacute;e, l’assistant Exporter vers une version valid&eacute;e vous permet de cr&eacute;er
une version non d&eacute;bogu&eacute;e de qualit&eacute; finale de l’application. L’assistant copie les ressources requises dans un dossier
bin-release distinct du dossier de la version de d&eacute;bogage. Vous pouvez d&eacute;finir si le code source de l’application doit
&ecirc;tre ou non inclus. L’application export&eacute;e est une version de production optimis&eacute;e qui peut &ecirc;tre affich&eacute;e par les
utilisateurs finaux. Pour les projets Adobe AIR, les applications AIR sont export&eacute;es dans un fichier AIR. La
fonctionnalit&eacute; Exporter vers une version valid&eacute;e permet de cr&eacute;er un fichier AIR sign&eacute; num&eacute;riquement que les
utilisateurs doivent installer avant d’ex&eacute;cuter une application.
Scripts Ant personnalis&eacute;s
Apache Ant est un outil de g&eacute;n&eacute;ration Java qui permet de cr&eacute;er des scripts personnalis&eacute;s pour la cr&eacute;ation d’applications
dans Flash Builder. Ant vous permet de modifier et d’&eacute;tendre le processus de g&eacute;n&eacute;ration standard. Pour plus
d’informations, voir &laquo; Personnalisation des g&eacute;n&eacute;rations avec Apache Ant &raquo; &agrave; la page 83.
G&eacute;n&eacute;ration par ligne de commande
Flash Builder Premium vous permet d’impl&eacute;menter des g&eacute;n&eacute;rations par ligne de commande. Faites appel aux
g&eacute;n&eacute;rations par ligne de commande pour synchroniser les param&egrave;tres de g&eacute;n&eacute;ration d’un d&eacute;veloppeur avec la
g&eacute;n&eacute;ration nocturne. Pour plus d’informations, voir &laquo; G&eacute;n&eacute;ration par ligne de commande de Flash Builder &raquo; &agrave; la
page 86.
Types de projets
Flash Builder permet de cr&eacute;er des types de projets dans les configurations suivantes.
Projets Flex
Les options de configuration des projets d&eacute;pendent de la fa&ccedil;on dont l’application acc&egrave;de aux donn&eacute;es et de
l’installation d’Adobe&reg; LiveCycle&reg; Data Services ES ou d’Adobe BlazeDS. Vous pouvez cr&eacute;er des projets pour des
applications Web (ex&eacute;cut&eacute;es dans Flash Player) ou de bureau (ex&eacute;cut&eacute;es dans Adobe AIR). Les options sont les
suivantes.
Aucun En l’absence de serveur d’applications, cette configuration de base vous permet de sp&eacute;cifier le dossier de sortie
de l’application Flex compil&eacute;e. Vous pouvez &eacute;galement d&eacute;finir les chemins de g&eacute;n&eacute;ration du nouveau projet.
ASP.NET Si Microsoft Windows et Microsoft Visual Web Developer sont install&eacute;s, vous pouvez cr&eacute;er des projets qui
font appel &agrave; ASP.NET Development Server pour le d&eacute;ploiement. De plus, si vous avez acc&egrave;s &agrave; Internet Information
Service (IIS), vous pouvez cr&eacute;er des projets avec un dossier de sortie Flex sous IIS.
ColdFusion Cette configuration de projet vous permet de cr&eacute;er des projets utilisant ColdFusion avec LiveCycle Data
Services, BlazeDS ou ColdFusion Flash Remoting. Si aucune de ces options n’est s&eacute;lectionn&eacute;e, le dossier de sortie du
projet ColdFusion cr&eacute;&eacute; sera situ&eacute; sous la racine Web (ou dossier virtuel). Flash Builder propose des outils pour acc&eacute;der
aux donn&eacute;es distantes des sources ColdFusion. Pour plus d’informations, voir Construction d’applications centr&eacute;es
sur les donn&eacute;es avec Flash Builder.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 38
Utilisation des projets
J2EE Cette configuration de projet vous permet de cr&eacute;er des projets dont le d&eacute;ploiement est bas&eacute; sur J2EE. Vous
pouvez sp&eacute;cifier si vous souhaitez utiliser le service d’acc&egrave;s aux objets distants et choisir entre LiveCycle Data Services
et BlazeDS. En l’absence de s&eacute;lection d’un service d’acc&egrave;s aux objets distants, un dossier de sortie est cr&eacute;&eacute; sous la racine
du serveur d’applications Java. Apr&egrave;s avoir activ&eacute; l’option Utiliser le service d’acc&egrave;s aux objets distants, vous pouvez
choisir entre LiveCycle Data Services et BlazeDS. En fonction de votre choix, le projet est d&eacute;ploy&eacute; sur un serveur
LiveCycle Data Services ou BlazeDS. Si le plug-in Eclipse Web Tools Project (WTP) est install&eacute;, s&eacute;lectionnez l’option
Cr&eacute;er un projet mixte Java/Flex &agrave; l’aide de WTP pour cr&eacute;er des projets mixtes Java/Flex avec ou sans service d’acc&egrave;s
aux objets distants. Pour les projets compil&eacute;s localement avec WTP, les projets sont d&eacute;ploy&eacute;s sur votre serveur J2EE.
Vous pouvez utiliser LiveCycle Data Services avec ou sans WTP. Si vous l’utilisez avec WTP, le projet n’est pas d&eacute;ploy&eacute;
sur le serveur LiveCycle Data Services local, mais il est d&eacute;ploy&eacute; &agrave; l’aide des fonctions WTP.
PHP Cette configuration de projet vous permet de cr&eacute;er des projets Flex dot&eacute;s d’un dossier de sortie Flex sous la racine
Web Apache/IIS (ou dossier virtuel). Flash Builder propose des outils pour acc&eacute;der aux donn&eacute;es distantes des serveurs
PHP. Pour plus d’informations, voir Construction d’applications centr&eacute;es sur les donn&eacute;es avec Flash Builder.
Autre Si le serveur d’applications dont vous disposez n’est pas r&eacute;pertori&eacute;, cette option permet de sp&eacute;cifier le dossier
de sortie de l’application compil&eacute;e. Vous pouvez &eacute;galement d&eacute;finir les chemins de g&eacute;n&eacute;ration du nouveau projet.
Services Web et HTTP Pour chaque type d’application, vous pouvez cr&eacute;er des applications pouvant acc&eacute;der &agrave; des
services Web et HTTP. Flash Builder propose des outils pour l’acc&egrave;s aux services Web et HTTP. Pour plus
d’informations, voir Construction d’applications centr&eacute;es sur les donn&eacute;es avec Flash Builder.
Projets ActionScript
En s’appuyant sur l’API de Flash plut&ocirc;t que la structure Flex, les projets ActionScript permettent aux d&eacute;veloppeurs
d’ActionScript d’utiliser Flash Builder pour coder, g&eacute;n&eacute;rer et d&eacute;boguer les applications bas&eacute;es uniquement sur
ActionScript. Ces projets ne faisant pas appel &agrave; MXML pour d&eacute;finir une interface utilisateur, vous ne pouvez pas
afficher la pr&eacute;sentation et la conception de l’application en mode Cr&eacute;ation. Vous utilisez exclusivement l’&eacute;diteur de
source et les outils de d&eacute;bogage le cas &eacute;ch&eacute;ant, puis vous g&eacute;n&eacute;rez le projet dans des fichiers d’application SWF afin de
pr&eacute;visualiser l’application et de la tester dans un navigateur Web ou un Flash Player autonome. Pour plus
d’informations sur les projets ActionScript, voir &laquo; Projets ActionScript &raquo; &agrave; la page 66.
Projets de biblioth&egrave;que
Les projets de biblioth&egrave;que permettent d’assembler et de distribuer les composants et autres ressources. Ils g&eacute;n&egrave;rent
des fichiers SWC que vous ajoutez &agrave; d’autres projets ou que vous distribuez &agrave; d’autres d&eacute;veloppeurs. Pour plus
d’informations, voir &laquo; Projets de biblioth&egrave;que &raquo; &agrave; la page 69.
Projets Flash Professional
Utilisez les projets Flash Professional pour modifier, g&eacute;n&eacute;rer ou d&eacute;boguer les fichiers FLA ou XFL cr&eacute;&eacute;s avec Adobe
Flash Professional CS5. Les projets Flash Professional n&eacute;cessitent l’installation de Flash Professional CS5. Pour plus
d’informations, voir &laquo; Cr&eacute;ation de projets Flash Professional &raquo; &agrave; la page 48.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 39
Utilisation des projets
Projets dans l’Explorateur de packages
Tous les projets d’un espace de travail s’affichent dans l’Explorateur de packages, comme l’illustre l’exemple suivant.
L’Explorateur de packages pr&eacute;sente une arborescence des projets dans une vue &agrave; la fois physique et logique (plate).
Cette vue vous permet de g&eacute;rer les projets en ajoutant et en supprimant des ressources (dossier et fichiers), en
important des ressources externes et en cr&eacute;ant des liens vers ces ressources ainsi qu’en d&eacute;pla&ccedil;ant les ressources vers
d’autres projets dans l’espace de travail.
Principales caract&eacute;ristiques de l’Explorateur de packages :
• L’affichage des packages ActionScript peut se pr&eacute;senter de mani&egrave;re hi&eacute;rarchique ou plate.
Utilisez le menu de l’Explorateur de packages pour sp&eacute;cifier la pr&eacute;sentation des packages.
• Les biblioth&egrave;ques de projet sont repr&eacute;sent&eacute;es dans deux nœuds de niveau sup&eacute;rieur : un nœud pour le SDK Flex et
l’autre pour les biblioth&egrave;ques r&eacute;f&eacute;renc&eacute;es.
Vous pouvez d&eacute;velopper le contenu d’une biblioth&egrave;que et ouvrir les &eacute;diteurs pour afficher les pi&egrave;ces jointes.
• Les symboles d’erreur et d’avertissement apparaissant au niveau des nœuds de l’Explorateur de packages signalent
d’&eacute;ventuels probl&egrave;mes dans un package.
• Vous pouvez restreindre les projets et ressources visibles.
Vous pouvez cr&eacute;er un jeu de documents (collection de ressources), d&eacute;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 &laquo; Navigation et personnalisation du workbench Flash Builder &raquo; &agrave;
la page 23.
• Vous pouvez d&eacute;velopper les fichiers ActionScript, MXML et CSS ainsi qu’afficher leur contenu sous forme
d’arborescence.
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 &lt;fx:Script&gt; et le code CSS dans les blocs
&lt;fx:Style&gt;. Vous pouvez &eacute;galement passer en mode Cr&eacute;ation et agencer visuellement les composants et les contr&ocirc;les
pour d&eacute;finir la pr&eacute;sentation de l’application et son comportement. Pour plus d’informations sur l’utilisation des
&eacute;diteurs de Flash Builder, voir &laquo; A propos de la modification du code dans Flash Builder &raquo; &agrave; la page 103 et &laquo; Cr&eacute;ation
d’une interface utilisateur avec Flash Builder &raquo; &agrave; la page 188.
Vous pouvez ensuite ajouter des projets, fichiers et dossiers et les organiser et les g&eacute;rer selon vos besoins (voir
&laquo; Cr&eacute;ation de dossiers et de fichiers dans un projet &raquo; &agrave; la page 63).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 40
Utilisation des projets
La plupart des commandes de menu que vous utilisez dans la vue Explorateur de packages sont &eacute;galement disponibles
dans le menu contextuel de la vue.
Pour plus d’informations sur l’utilisation de projets dans l’Explorateur de packages, voir &laquo; Gestion des projets &raquo; &agrave; la
page 49 et &laquo; Cr&eacute;ation de dossiers et de fichiers dans un projet &raquo; &agrave; la page 63.
Cr&eacute;ation de projets et ouverture de ressources
Flash Builder comporte des assistants pour la cr&eacute;ation de projets Flex, ActionScript et de biblioth&egrave;que Flex. Le tableau
suivant d&eacute;crit chacun de ces projets. Pour cr&eacute;er un projet, s&eacute;lectionnez Fichier &gt; Nouveau.
Type de projet
Description
Projet ActionScript
Projet ActionScript bas&eacute; sur l’API Flash, non sur la structure Flex. Les projets ActionScript permettent
aux d&eacute;veloppeurs d’ActionScript d’utiliser Flash Builder pour coder, g&eacute;n&eacute;rer et d&eacute;boguer les
applications bas&eacute;es uniquement sur ActionScript. Pour plus d’informations, voir &laquo; Cr&eacute;ation de projets
ActionScript &raquo; &agrave; la page 67.
Projet Flex
Un projet Flex contient un ensemble de propri&eacute;t&eacute;s qui contr&ocirc;lent la fa&ccedil;on dont l’application est
g&eacute;n&eacute;r&eacute;e, l’endroit o&ugrave; l’application construite est h&eacute;berg&eacute;e, la mani&egrave;re dont le d&eacute;bogage est g&eacute;r&eacute; et les
relations avec les autres projets de l’espace de travail. Il vous permet de cr&eacute;er des applications qui seront
ex&eacute;cut&eacute;es dans Flash Player (applications Web) ou dans Adobe AIR (applications de bureau). Pour plus
d’informations, voir &laquo; D&eacute;finition des propri&eacute;t&eacute;s des projets Flex &raquo; &agrave; la page 49.
Projet de biblioth&egrave;que Flex
Les projets de biblioth&egrave;que Flex permettent d’assembler et de distribuer les composants ainsi que
d’autres ressources. Ils g&eacute;n&egrave;rent des fichiers SWC que vous ajoutez &agrave; d’autres projets ou que vous
distribuez &agrave; d’autres d&eacute;veloppeurs. Pour plus d’informations, voir &laquo; Projets de biblioth&egrave;que &raquo; &agrave; la
page 69.
Projet Flash Professional
Utilisez des projets Flash Professional pour acc&eacute;der aux fichiers FLA ou XFL cr&eacute;&eacute;s avec Flash
Professional CS5. Cette fonctionnalit&eacute; permet aux d&eacute;veloppeurs Flash Professional de profiter de
l’environnement de modification et de d&eacute;bogage que fournit Flash Builder. Pour acc&eacute;der aux fonctions
de Flash Professional dans Flash Builder, vous devez installer Flash Professional CS5.
Ressources des projets
Les applications Flex et ActionScript prennent en charge plusieurs types de ressources standard (MXML, ActionScript
et CSS). Le tableau suivant r&eacute;pertorie les types de ressources que vous pouvez ajouter &agrave; vos projets. Pour ajouter ces
ressources, s&eacute;lectionnez Fichier &gt; Nouveau.
Type de ressource
Description
Classe ActionScript
Fichier de classe ActionScript. Lorsque vous ajoutez ce type de ressource, l’assistant Nouvelle classe
ActionScript vous invite &agrave; pr&eacute;ciser des &eacute;l&eacute;ments de d&eacute;finition de la classe, tels que la super-classe, les
interfaces, etc. Pour plus d’informations sur l’utilisation d’ActionScript dans Flash Builder, voir &laquo; Cr&eacute;ation
d’une classe ActionScript &raquo; &agrave; la page 67.
Fichier ActionScript
Mod&egrave;le de fichier de texte pour la cr&eacute;ation de fonctions ActionScript.
Interface ActionScript
Fichier d’interface ActionScript. Lorsque vous ajoutez ce type de ressource, l’assistant Nouvelle
interface ActionScript vous invite &agrave; pr&eacute;ciser des &eacute;l&eacute;ments de d&eacute;finition de l’interface tels que les
interfaces &eacute;tendues et le package dans lequel elles r&eacute;sident. Pour plus d’informations sur l’utilisation
d’ActionScript dans Flash Builder, voir &laquo; Cr&eacute;ation d’une interface ActionScript &raquo; &agrave; la page 68.
Fichier CSS
Mod&egrave;le de fichier de texte pour la cr&eacute;ation d’un fichier Cascading Style Sheets.
Fichier
Fichier de texte non format&eacute;. Pour plus d’informations, voir &laquo; Cr&eacute;ation de dossiers et de fichiers dans un
projet &raquo; &agrave; la page 63.
Dossier
Dossier standard de syst&egrave;me de fichiers permettant de classer le contenu des projets. Pour plus
d’informations, voir &laquo; Cr&eacute;ation de dossiers et de fichiers dans un projet &raquo; &agrave; la page 63.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 41
Utilisation des projets
Type de ressource
Description
Application MXML
Fichier d’application standard dont l’&eacute;l&eacute;ment MXML racine est la balise &lt;s:Application&gt; (pour les
projets Flex 4). Vous pouvez d&eacute;finir la pr&eacute;sentation &agrave; utiliser pour l’application. Un projet Flex peut
contenir plusieurs fichiers d’application. Pour plus d’informations, voir &laquo; Gestion des fichiers
d’application du projet &raquo; &agrave; la page 52.
Composant MXML
Fichier de composant standard dont l’&eacute;l&eacute;ment MXML racine est la balise &lt;s:Group&gt;. L’assistant vous
permet de sp&eacute;cifier un &eacute;l&eacute;ment MXML racine alternatif. Pour plus d’informations, voir &laquo; Cr&eacute;ation de
composants MXML avec Flash Builder &raquo; &agrave; la page 134.
Rendu d’&eacute;l&eacute;ment MXML
Les rendus d’&eacute;l&eacute;ment contr&ocirc;lent l’aspect d’un &eacute;l&eacute;ment de donn&eacute;es dans un conteneur DataGroup,
SkinnableDataContainer ou dans une sous-classe de ces conteneurs. L’aspect peut inclure la police, la
couleur d’arri&egrave;re-plan, la bordure et tout autre aspect visuel de l’&eacute;l&eacute;ment de donn&eacute;es. Pour plus
d’informations, voir &laquo; G&eacute;n&eacute;ration de rendus d’&eacute;l&eacute;ment personnalis&eacute;s &raquo; &agrave; la page 224.
Habillage MXML
Les classes d’habillage modifient l’aspect des contr&ocirc;les dans une interface utilisateur. La cr&eacute;ation, la
modification et l’importation d’habillages varient en fonction des composants (Spark ou MX). Pour plus
d’informations, voir &laquo; Modification de l’interface utilisateur &agrave; l’aide des habillages &raquo; &agrave; la page 218.
Module MXML
Ressource pouvant &ecirc;tre ajout&eacute;e &agrave; un projet d’application existant ou cr&eacute;&eacute;e s&eacute;par&eacute;ment, mais toujours
associ&eacute;e &agrave; une application. Pour plus d’informations, voir &laquo; Cr&eacute;ation de modules dans Flash Builder &raquo; &agrave;
la page 96.
Classe de script de tests
Scripts et suites de tests FlexUnit. Vous pouvez g&eacute;n&eacute;rer et modifier des tests pouvant &ecirc;tre r&eacute;p&eacute;t&eacute;s et
ex&eacute;cutables &agrave; partir de scripts ou directement dans Flash Builder. Pour plus d’informations, voir
&laquo; Environnement de test FlexUnit &raquo; &agrave; la page 150.
Classe de suite de tests
Package
Cr&eacute;e un nouveau package pour les fichiers source d’un projet. L’emplacement par d&eacute;faut est le
r&eacute;pertoire src du dossier du projet.
Autre
Autres types de fichiers enregistr&eacute;s dans Flash Builder. S&eacute;lectionnez Fichier &gt; Nouveau &gt; Autre pour
ajouter d’autres types de fichiers. Si un plug-in Java est install&eacute; dans Flash Builder, vous pouvez par
exemple ajouter de nouvelles classes, de nouvelles interfaces et de nouveaux packages Java.
Lorsqu’un type de fichier est enregistr&eacute; dans Flash Builder, un &eacute;diteur correspondant est &eacute;galement
disponible dans le workbench. Pour plus d’informations, voir &laquo; Association d’&eacute;diteurs &agrave; des types de
fichier &raquo; &agrave; la page 28.
Vous pouvez en outre ajouter aux projets des types de fichiers non enregistr&eacute;s en les important. Pour
plus d’informations, voir &laquo; Importation de projets &raquo; &agrave; la page 55.
Pour plus d’informations sur l’ajout de ressources aux projets, voir &laquo; Cr&eacute;ation de dossiers et de fichiers dans un projet &raquo;
&agrave; la page 63.
Cr&eacute;ation de projets Flex
Lorsque vous cr&eacute;ez un projet, l’assistant Nouveau projet Flex vous guide &agrave; travers les diff&eacute;rentes &eacute;tapes et vous
demande de pr&eacute;ciser le type de projet &agrave; cr&eacute;er, le nom du projet, son emplacement ainsi que d’autres options.
Pour plus d’informations sur la cr&eacute;ation d’un projet ActionScript, voir &laquo; Cr&eacute;ation de projets ActionScript &raquo; &agrave; la
page 67. Pour plus d’informations sur la cr&eacute;ation de projets de biblioth&egrave;que, voir &laquo; Projets de biblioth&egrave;que &raquo; &agrave; la
page 69.
Cr&eacute;ation d’un projet Flex sans serveur
En l’absence de serveur, cette configuration de base vous permet de sp&eacute;cifier le dossier de sortie des applications
compil&eacute;es. Vous pouvez &eacute;galement, en option, d&eacute;finir les chemins de g&eacute;n&eacute;ration du nouveau projet.
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet Flex.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 42
Utilisation des projets
2 Entrez un nom de projet.
3 S&eacute;lectionnez un emplacement pour le projet. L’emplacement par d&eacute;faut est l’espace de travail actuel. Pour choisir
un emplacement de projet diff&eacute;rent, d&eacute;sactivez l’option Utiliser l’emplacement par d&eacute;faut.
4 Choisissez le type d’application (Web ou de bureau).
5 S&eacute;lectionnez Aucun comme type de serveurs d’applications.
6 Cliquez sur Terminer ou sur Suivant pour acc&eacute;der &agrave; d’autres options de configuration.
Voir &laquo; Options suppl&eacute;mentaires pour la configuration d’un projet &raquo; &agrave; la page 46.
Cr&eacute;ation d’un projet Flex avec ASP.NET
Si Microsoft Windows et Microsoft Visual Web Developer sont install&eacute;s, vous pouvez cr&eacute;er des projets Flex d&eacute;ploy&eacute;s
avec ASP.NET. De plus, si vous avez acc&egrave;s &agrave; un serveur de d&eacute;veloppement Internet Information Service (IIS), vous
pouvez cr&eacute;er des projets Flex avec un dossier de sortie Flex sous IIS.
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet Flex.
2 Entrez un nom de projet.
3 Sp&eacute;cifiez l’emplacement du projet. L’emplacement par d&eacute;faut est l’espace de travail actuel. Sous Windows, l’espace
de travail par d&eacute;faut est C:\Documents and Settings\D&eacute;veloppeur FlexAdobe Flash Builder\. Pour choisir un
emplacement de projet diff&eacute;rent, d&eacute;sactivez l’option Utiliser l’emplacement par d&eacute;faut.
4 Choisissez le type d’application (Web ou de bureau).
5 S&eacute;lectionnez ASP.NET comme type de serveurs d’applications.
6 Cliquez sur Suivant.
7 S&eacute;lectionnez le serveur ASP.NET :
• Si vous utilisez un serveur de d&eacute;veloppement ASP.NET, vous n’avez pas besoin de pr&eacute;ciser l’emplacement du
serveur.
• Si vous utilisez IIS, entrez la racine de l’application Web et l’URL de l’application Web.
• Sp&eacute;cifiez le dossier de sortie de l’application Flex.
8 Cliquez sur Terminer ou sur Suivant pour acc&eacute;der &agrave; d’autres options de configuration.
Voir &laquo; Options suppl&eacute;mentaires pour la configuration d’un projet &raquo; &agrave; la page 46.
Cr&eacute;ation d’un projet Flex avec J2EE
Cette configuration de projet vous permet de cr&eacute;er des projets Flex utilisant un servlet J2EE avec l’option de service
d’acc&egrave;s aux objets distants. Si aucune option n’est s&eacute;lectionn&eacute;e et qu’un serveur Java est utilis&eacute;, un dossier de sortie est
cr&eacute;&eacute; sous la racine du serveur. Si le plug-in Eclipse Web Tools Project (WTP) est install&eacute;, vous pouvez cr&eacute;er des projets
mixtes Java et Flex avec ou sans service d’acc&egrave;s aux objets distants.
Remarque : LiveCycle Data Services ES et BlazeDS prennent en charge des versions sp&eacute;cifiques du SDK Flex. Consultez
le Tableau de compatibilit&eacute; LiveCycle Data Services pour d&eacute;couvrir les versions du SDK Flex prises en charge par votre
version de LiveCycle DataService ES. Ce tableau de compatibilit&eacute; r&eacute;pertorie &eacute;galement les versions du SDK Flex prises en
charge par BlazeDS.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 43
Utilisation des projets
Vous disposez de deux options de compilation d’un projet Flex utilisant J2EE. L’option recommand&eacute;e compile
l’application localement, puis enregistre les fichiers (notamment le fichier SWF et l’enveloppe HTML) sur le serveur.
La seconde option compile le fichier source de l’application directement sur le serveur.
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet Flex.
2 Entrez un nom de projet.
3 Sp&eacute;cifiez l’emplacement du projet. L’emplacement par d&eacute;faut est l’espace de travail actuel. Pour choisir un
emplacement de projet diff&eacute;rent, d&eacute;sactivez l’option Utiliser l’emplacement par d&eacute;faut.
4 Choisissez le type d’application (Web ou de bureau).
5 S&eacute;lectionnez J2EE comme type de serveurs d’applications.
6 Cochez l’option Utiliser le service d’acc&egrave;s aux objets distants. LiveCycle Data Services ES est s&eacute;lectionn&eacute; par d&eacute;faut.
Vous pouvez s&eacute;lectionner BlazeDS. Si vous avez install&eacute; WTP, vous pouvez aussi choisir de cr&eacute;er un projet mixte
Java et Flex faisant appel &agrave; WTP (le dossier source Java est s&eacute;lectionn&eacute; pour vous).
7 Cliquez sur Suivant.
8 Configurez le serveur J2EE.
• Si vous s&eacute;lectionnez les options Utiliser le service d’acc&egrave;s aux objets distants et LiveCycle Data Services ou
BlazeDS, pr&eacute;cisez les param&egrave;tres racine :
Dossier racine Serveur Flex (application Web) qui sert votre application (C:\fds2\jrun4\servers\default\flex,
par exemple). Si vous n’utilisez pas l’option de serveur de d&eacute;veloppement par d&eacute;faut pour Flex, vous pouvez
sp&eacute;cifier un nouvel emplacement pour le dossier racine. Il doit toutefois s’agir d’un dossier valide mapp&eacute; &agrave; l’URL
racine sp&eacute;cifi&eacute;e. Si vous utilisez un serveur distant, pr&eacute;cisez son emplacement
(monServeur\MesApplications\jrun4\servers\default\flex, par exemple).
URL racine URL racine valide du serveur Flex (application Web) qui sert votre application. Pour LCDS, l’URL
racine par d&eacute;faut des occurrences du serveur local est http://localhost:8400/lcds/. Si vous utilisez un serveur
distant, l’URL peut avoir l’aspect suivant : http://monserveur.com:8400/lcds/.
Racine du contexte La racine du contexte correspond g&eacute;n&eacute;ralement au dernier segment du chemin racine de
l’URL.
• Si vous avez s&eacute;lectionn&eacute; l’option Cr&eacute;er un projet mixte Java/Flex &agrave; l’aide de WTP (avec ou sans LiveCycle Data
Services) :
• Indiquez le nom des dossiers source et des ex&eacute;cutions cible Java et Flex.
Lorsque vous cr&eacute;ez un projet Flex avec LiveCycle Data Services ES, Flash Builder cr&eacute;e un r&eacute;pertoire portant
le m&ecirc;me nom que le projet ou utilise un r&eacute;pertoire existant portant ce nom. Ce r&eacute;pertoire est un sousr&eacute;pertoire du dossier racine que vous avez sp&eacute;cifi&eacute; pour le projet.
• Avec LiveCycle Data Services ES, pr&eacute;cisez un fichier flex.war qui se trouve dans le dossier d’installation du
serveur.
Remarque : quelle que soit l’option choisie pour un projet LiveCycle Data Services ES dans Flash Builder, vous devez
sp&eacute;cifier un dossier racine LiveCycle Data Services ES et une URL racine. Ces valeurs mappent la racine d’une
application Web LiveCycle Data Services ES. Si vous d&eacute;s&eacute;lectionnez les options, vous devez saisir uniquement la racine
Web et l’URL racine.
9 Sp&eacute;cifiez l’emplacement auquel le projet sera compil&eacute;.
• Pour les applications compil&eacute;es localement, Flash Builder cr&eacute;e un dossier de d&eacute;bogage nom_du_projet dans
lequel les fichiers SWF et les enveloppes HTML sont enregistr&eacute;s.
• Pour les applications compil&eacute;es sur le serveur, l’emplacement du projet doit se trouver sur le serveur.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 44
Utilisation des projets
10 Cliquez sur Terminer ou sur Suivant pour acc&eacute;der &agrave; d’autres options de configuration.
Voir &laquo; Options suppl&eacute;mentaires pour la configuration d’un projet &raquo; &agrave; la page 46.
Cr&eacute;ation d’un projet Flex acc&eacute;dant aux services ColdFusion
Pour acc&eacute;der aux donn&eacute;es qui utilisent ColdFusion, vous devez disposer d’Adobe ColdFusion&reg; 8 ou d’Adobe
ColdFusion 9. Pour plus d’informations, consulter lapage produit de ColdFusion.
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet Flex.
2 Entrez un nom de projet.
3 Sp&eacute;cifiez l’emplacement du projet.
Vous pouvez &eacute;galement accepter l’emplacement par d&eacute;faut, qui est l’espace de travail actuel.
4 Sp&eacute;cifiez le type d’application (Web ou de bureau).
5 Pour le type de serveurs d’applications, s&eacute;lectionnez ColdFusion, puis choisissez l’une des options suivantes.
Utiliser le service d’acc&egrave;s aux objets distants Si vous d&eacute;sactivez l’option Utiliser le service d’acc&egrave;s aux objets
distants, sp&eacute;cifiez la racine Web et l’URL racine &agrave; l’&eacute;tape suivante.
Si vous activez l’option Utiliser le service d’acc&egrave;s aux objets distants, vous pouvez effectuer les choix suivants.
• ColdFusion Flash Remoting
Activez cette option si vous pr&eacute;voyez d’utiliser les outils de d&eacute;veloppement centr&eacute;s sur les donn&eacute;es disponibles
avec Flash Builder. Cette option s’applique &eacute;galement si vous utilisez Flash Remoting pour invoquer des
m&eacute;thodes dans les composants ColdFusion (CFC). Voir Cr&eacute;ation d’applications centr&eacute;es sur les donn&eacute;es avec
Flash Builder.
• LiveCycle Data Services
Sp&eacute;cifiez LiveCycle Data Services comme type d’application ColdFusion uniquement si votre installation
ColdFusion 8 est configur&eacute;e pour LiveCycle Data Services 2.6.1. Voir Integrating Adobe LiveCycle Data Services
ES 2.6 with Adobe ColdFusion 8.
G&eacute;n&eacute;ralement, le type de serveurs d’applications pour LiveCycle Data Services n’est pas ColdFusion, mais J2EE.
Voir &laquo; Cr&eacute;ation d’un projet Flex avec J2EE &raquo; &agrave; la page 42.
• BlazeDS
Sp&eacute;cifiez BlazeDS comme type d’application ColdFusion uniquement si votre installation ColdFusion 8 est
configur&eacute;e pour Adobe BlazeDS 3.1. Voir Integrating BlazeDS with a ColdFusion 8 Installation.
G&eacute;n&eacute;ralement, le type de serveurs d’applications pour BlazeDS n’est pas ColdFusion, mais J2EE. Voir &laquo; Cr&eacute;ation
d’un projet Flex avec J2EE &raquo; &agrave; la page 42.
6 Cliquez sur Suivant. Sp&eacute;cifiez un emplacement de serveur, une racine Web, une URL racine et une racine du
contexte.
Pour l’acc&egrave;s &agrave; un service d’objets distants, vous pouvez d&eacute;finir une configuration ColdFusion autonome ou une
configuration ColdFusion d&eacute;ploy&eacute;e sur un serveur J2EE.
• Autonome
Activez l’option Autonome si l’installation ColdFusion utilise la configuration du serveur.
Sp&eacute;cifiez l’emplacement du serveur ColdFusion, de la racine Web et de l’URL racine.
• D&eacute;ploy&eacute;e sur un serveur J2EE
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 45
Utilisation des projets
Activez cette option si l’installation ColdFusion utilise aussi bien la configuration multiserveurs que la
configuration J2EE.
Sp&eacute;cifiez la racine Web, l’URL racine et la racine du contexte. Si vous faites appel &agrave; la configuration
multiserveurs ColdFusion, vous ne devrez g&eacute;n&eacute;ralement pas sp&eacute;cifier la racine du contexte.
La racine du contexte correspond en r&egrave;gle g&eacute;n&eacute;rale au dernier segment du chemin racine de l’URL lorsque vous
d&eacute;ployez ColdFusion en tant qu’application Web dans la configuration J2EE ColdFusion.
Pour sp&eacute;cifier l’emplacement du serveur ou de la racine Web, recherchez un r&eacute;pertoire local ou saisissez le chemin
vers un r&eacute;pertoire situ&eacute; sur un serveur r&eacute;seau. V&eacute;rifiez que le r&eacute;pertoire est partag&eacute; et que le compte sous lequel
Flash Builder est ex&eacute;cut&eacute; poss&egrave;de des droits d’acc&egrave;s en &eacute;criture.
V&eacute;rifiez que vous avez mapp&eacute; ou mont&eacute; un lecteur r&eacute;seau pour le serveur r&eacute;seau. Le chemin au serveur r&eacute;seau est
fonction de la plateforme. Par exemple :
(Windows) \\10.192.18.12\serveur\racine Web
(Windows) Z:\racine Web
(Mac) /Volumes/racine Web
7 Cliquez sur Valider la configuration pour v&eacute;rifier l’exactitude des param&egrave;tres sp&eacute;cifi&eacute;s.
Si le r&eacute;pertoire de la racine Web n’est pas accessible en &eacute;criture, Flash Builder affiche un avertissement.
8 S&eacute;lectionnez un dossier de sortie pour l’application compil&eacute;e.
9 Cliquez sur Terminer ou sur Suivant pour acc&eacute;der &agrave; d’autres options de configuration.
Voir &laquo; Options suppl&eacute;mentaires pour la configuration d’un projet &raquo; &agrave; la page 46.
Cr&eacute;ation d’un projet Flex pour acc&eacute;der aux services PHP
L’acc&egrave;s aux donn&eacute;es de services PHP pr&eacute;suppose l’existence d’un serveur h&eacute;bergeant les services. Il peut s’agir d’un
serveur local ou d’un serveur appartenant &agrave; un r&eacute;seau local.
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet Flex.
2 Entrez un nom de projet.
3 S&eacute;lectionnez un emplacement pour le projet. L’emplacement par d&eacute;faut est l’espace de travail actuel. Pour choisir
un emplacement de projet diff&eacute;rent, d&eacute;sactivez l’option Utiliser l’emplacement par d&eacute;faut.
4 Choisissez le type d’application (Web ou de bureau).
5 S&eacute;lectionnez PHP comme type de serveurs d’applications. Cliquez sur Suivant.
6 Sp&eacute;cifiez la racine Web et l’URL racine pour le service. Cliquez sur Valider la configuration.
La racine Web et l’URL racine sp&eacute;cifi&eacute;es appartiennent g&eacute;n&eacute;ralement &agrave; votre environnement local. Vous pouvez
toutefois &eacute;galement acc&eacute;der &agrave; des serveurs r&eacute;seau. V&eacute;rifiez que le r&eacute;pertoire est partag&eacute; et que le compte sous lequel
Flash Builder est ex&eacute;cut&eacute; poss&egrave;de des droits d’acc&egrave;s en &eacute;criture.
V&eacute;rifiez que vous avez mapp&eacute; ou mont&eacute; un lecteur pour le serveur r&eacute;seau. Sp&eacute;cifiez ensuite le chemin vers le
serveur. Ce chemin est fonction de la plateforme. Par exemple :
(Windows) \\10.192.18.12\serveur\racine Web
(Windows) Z:\racine Web
(Mac) /Volumes/racine Web
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 46
Utilisation des projets
7 (Facultatif) Sp&eacute;cifiez le dossier de sortie de l’application.
8 Cliquez sur Terminer ou sur Suivant pour acc&eacute;der &agrave; d’autres options de configuration.
Voir &laquo; Options suppl&eacute;mentaires pour la configuration d’un projet &raquo; &agrave; la page 46.
Options suppl&eacute;mentaires pour la configuration d’un projet
Lorsque vous cr&eacute;ez un projet Flex, vous pouvez en personnaliser la configuration. Toutes les &eacute;tapes de configuration
suppl&eacute;mentaires sont facultatives.
Remarque : vous pouvez modifier la configuration d’un projet apr&egrave;s sa cr&eacute;ation. Pour ce faire, acc&eacute;dez au mode Source
de l’&eacute;diteur de Flash Builder, puis s&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s.
• Dossier source principal, Fichier de l’application principale et URL du dossier de sortie
Par d&eacute;faut, Flash Builder place les fichiers source dans le dossier src du projet. Le nom par d&eacute;faut du fichier de
l’application MXML principale est le nom du projet. Ces valeurs par d&eacute;faut peuvent &ecirc;tre modifi&eacute;es &agrave; la cr&eacute;ation du
projet.
Lorsque vous cr&eacute;ez un projet, Flash Builder ex&eacute;cute les fichiers d’application &agrave; partir d’une URL par d&eacute;faut, en
fonction des param&egrave;tres du projet. Sp&eacute;cifiez une URL de dossier de sortie pour remplacer les param&egrave;tres par d&eacute;faut.
Voir &laquo; D&eacute;finition d’un dossier de sortie de projet &raquo; &agrave; la page 79 et &laquo; Ex&eacute;cution des applications &raquo; &agrave; la page 90.
• Jeu de composants
En r&egrave;gle g&eacute;n&eacute;rale, tous les composants sont disponibles. Dans certains cas, vous pouvez ne sp&eacute;cifier que les
composants MX. Voir &laquo; Jeu de composants (MX + Spark ou MX uniquement) &raquo; &agrave; la page 78.
• Liaison de la structure
Par d&eacute;faut, les classes d’application de la structure Flex 4 utilisent la liaison dynamique. Les options suivantes sont
&eacute;galement activ&eacute;es par d&eacute;faut :
• V&eacute;rifier les condens&eacute;s RSL
• Utiliser les biblioth&egrave;ques RSL locales de d&eacute;bogage lors du d&eacute;bogage
• D&eacute;terminer automatiquement l’ordre de la biblioth&egrave;que, en fonction des d&eacute;pendances
Voir &laquo; Liaison de la structure des applications &raquo; &agrave; la page 78.
• Biblioth&egrave;ques du chemin de g&eacute;n&eacute;ration
Vous pouvez ajouter au chemin de g&eacute;n&eacute;ration des biblioth&egrave;ques de projet, des dossiers de biblioth&egrave;que SWC ou des
fichiers SWC ; vous pouvez &eacute;galement les en supprimer. Vous pouvez en outre modifier l’ordre du chemin de
g&eacute;n&eacute;ration.
Cliquez sur le bouton Editer pour modifier l’emplacement des biblioth&egrave;ques ou des dossiers ajout&eacute;s.
Utilisez le bouton Ajouter un SDK Flex pour r&eacute;tablir le SDK par d&eacute;faut d’un projet dont vous avez supprim&eacute; le SDK
Flex du chemin de g&eacute;n&eacute;ration.
• Dossiers source suppl&eacute;mentaires
Cliquez sur l’onglet Chemin source pour ajouter des dossiers source suppl&eacute;mentaires &agrave; un projet. Vous pouvez
r&eacute;organiser les dossiers source, en modifier l’emplacement ou les supprimer du chemin source.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 47
Utilisation des projets
Modification des options de serveur des projets existants
Vous serez probablement amen&eacute; dans certains cas &agrave; modifier la configuration d’origine du serveur d’un projet. Pour
une application Web ou de bureau, acc&eacute;dez &agrave; la fen&ecirc;tre des propri&eacute;t&eacute;s du projet concern&eacute;.
S&eacute;lectionnez l’option Serveur Flex pour ajouter ou modifier les options du serveur du projet.
• S&eacute;lectionnez Aucun pour supprimer la configuration serveur d’un projet.
La suppression de la configuration serveur d’un projet conduit &eacute;galement &agrave; la suppression de tout fichier SWC
ajout&eacute; au chemin d’acc&egrave;s &agrave; la biblioth&egrave;que pour ce type de serveur.
• S&eacute;lectionnez un type de serveur &agrave; modifier ou ajoutez la configuration serveur d’un projet.
Toutes les options de serveur pour la configuration serveur s&eacute;lectionn&eacute;e sont disponibles. Pour en savoir plus sur
les param&egrave;tres de configuration du serveur, voir &laquo; Cr&eacute;ation de projets Flex &raquo; &agrave; la page 41.
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. Vous devrez examiner et corriger chaque erreur de code.
Cr&eacute;ation d’un projet Flex 4 utilisant uniquement des composants MX
Vous pouvez cr&eacute;er un projet Flex compatible avec les composants MX mis &agrave; disposition par Flex 3. L’option MX
uniquement intervient lors de la cr&eacute;ation d’applications dont la conception est similaire aux applications cr&eacute;&eacute;es avec
une version ant&eacute;rieure de Flex, mais ayant malgr&eacute; tout acc&egrave;s aux fonctions de Flex 4 et de Flash Builder 4 (telles que la
nouvelle syntaxe d’&eacute;tats, les fonctionnalit&eacute;s CSS avanc&eacute;es, des fonctions de compilation am&eacute;lior&eacute;es ainsi que d’autres
fonctionnalit&eacute;s de langage).
L’option MX uniquement ne met pas &agrave; la disposition des applications du projet les composants Spark fournis avec
Flex 4.
Vous pouvez convertir un projet Flex 4 en projet MX uniquement. Gardez cependant &agrave; l’esprit que Flash Builder ne
r&eacute;&eacute;crit pas le code du projet. Vous devrez mettre &agrave; jour le code manuellement afin d’en supprimer toute r&eacute;f&eacute;rence aux
composants Spark.
Cr&eacute;ation d’un projet Flex MX uniquement
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet Flex.
2 Entrez un nom de projet.
3 S&eacute;lectionnez un emplacement pour le projet. L’emplacement par d&eacute;faut est l’espace de travail actuel. Pour choisir
un emplacement de projet diff&eacute;rent, d&eacute;sactivez l’option Utiliser l’emplacement par d&eacute;faut.
4 Choisissez le type d’application (Web ou de bureau).
5 Sp&eacute;cifiez un type de serveurs d’applications (ou n’en sp&eacute;cifiez aucun, s’il n’est pas requis). Cliquez sur Suivant.
6 (Facultatif) Sp&eacute;cifiez le dossier de sortie de l’application.
7 Cliquez sur Terminer ou sur Suivant pour acc&eacute;der &agrave; d’autres options de configuration.
Voir &laquo; Options suppl&eacute;mentaires pour la configuration d’un projet &raquo; &agrave; la page 46.
Conversion d’un projet Flex en projet Flex MX uniquement
1 Dans Flash Builder, activez le projet &agrave; convertir.
Pour ce faire, vous devez g&eacute;n&eacute;ralement ouvrir un fichier source du projet.
2 S&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Chemin de g&eacute;n&eacute;ration Flex.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 48
Utilisation des projets
3 Pour le param&egrave;tre Jeu de composants, s&eacute;lectionnez l’option MX uniquement. Cliquez sur OK.
4 Modifiez tout code d’application du projet acc&eacute;dant &agrave; des composants Spark.
Il ne peut y avoir de r&eacute;f&eacute;rences &agrave; des composants Spark dans un projet MX uniquement.
Cr&eacute;ation de projets Flash Professional
Utilisez des projets Flash Professional pour acc&eacute;der aux fichiers FLA ou XFL cr&eacute;&eacute;s avec Flash Professional CS5. Cette
fonctionnalit&eacute; permet aux d&eacute;veloppeurs Flash Professional de profiter de l’environnement de modification et de
d&eacute;bogage que fournit Flash Builder. Pour acc&eacute;der aux fonctions de Flash Professional dans Flash Builder, vous devez
installer Flash Professional CS5.
Vous commencez g&eacute;n&eacute;ralement par cr&eacute;er un projet et des fichiers dans Flash Professional. Vous cr&eacute;ez ensuite un projet
correspondant dans Flash Builder pour la modification et le d&eacute;bogage des fichiers. Lors de la modification des fichiers
dans Flash Builder, vous pouvez d&eacute;finir des points d’arr&ecirc;t dans les fichiers ActionScript du projet. Les points d’arr&ecirc;t
d&eacute;finis dans des fichiers appartenant au projet Flash Professional sont reconnus par le d&eacute;bogueur Flash Professional
lors de l’appel de D&eacute;boguer l’animation.
Vous pouvez lancer Flash Professional &agrave; partir de Flash Builder pour publier et ex&eacute;cuter les fichiers. Vous pouvez
&eacute;galement lancer le d&eacute;bogueur Flash Professional &agrave; partir de Flash Builder.
Cr&eacute;ation d’un projet Flash Professional
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet Flash Professional.
2 Recherchez le fichier FLA ou XFL pour le projet.
Le nom du fichier est utilis&eacute; comme nom du projet.
3 Sp&eacute;cifiez l’emplacement du projet.
Vous pouvez utiliser l’emplacement par d&eacute;faut dans l’espace de travail ou rechercher un nouvel emplacement.
4 Cliquez sur Terminer.
Flash Builder ouvre le nouveau projet dans l’Explorateur de packages. Le dossier contenant le fichier FLA cible est
accessible. Le fichier FLA s&eacute;lectionn&eacute; devient le fichier cible du projet. Les fichiers ActionScript qui d&eacute;pendent des
fichiers cible peuvent &ecirc;tre modifi&eacute;s.
S’il n’est pas d&eacute;j&agrave; en cours d’ex&eacute;cution, Flash Professional d&eacute;marre.
Utilisation de projets Flash Professional dans Flash Builder
Vous pouvez appliquer les op&eacute;rations suivantes aux fichiers source d’un projet Flash Professional :
• Modifier les fichiers ActionScript qui d&eacute;pendent du fichier FLA cible.
• D&eacute;boguer le fichier dans le d&eacute;bogueur Flash Builder ou Flash Professional.
Pour d&eacute;boguer le fichier dans Flash Builder, s&eacute;lectionnez Ex&eacute;cuter &gt; D&eacute;boguer fichier ou cliquez sur le bouton
D&eacute;boguer dans la barre d’outils.
Pour d&eacute;boguer le fichier dans Flash Professional, s&eacute;lectionnez Ex&eacute;cuter &gt; D&eacute;boguer l’animation ou cliquez sur le
bouton D&eacute;boguer l’animation dans Flash Builder. Les points d’arr&ecirc;t d&eacute;finis dans Flash Builder sont reconnus par
le d&eacute;bogueur Flash Professional.
• Publier le fichier dans Flash Professional CS5.
S&eacute;lectionnez Projet &gt; Publier la s&eacute;quence ou cliquez sur Publier dans le bouton Flash Professional de la barre
d’outils.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 49
Utilisation des projets
• Ex&eacute;cuter le fichier dans Flash Builder ou Flash Professional.
Pour ex&eacute;cuter le fichier dans Flash Builder, s&eacute;lectionnez Ex&eacute;cuter &gt; Ex&eacute;cuter fichier ou cliquez sur le bouton
Ex&eacute;cuter de la barre d’outils.
Pour ex&eacute;cuter le fichier dans Flash Professional, s&eacute;lectionnez Ex&eacute;cuter &gt; Tester l’animation ou cliquez sur le bouton
Tester l’animation de la barre d’outils.
D&eacute;finition des propri&eacute;t&eacute;s des projets Flash Professional
1 S&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s du projet &gt; Flash Professional.
2 S&eacute;lectionnez Ajouter pour ajouter des fichiers suppl&eacute;mentaires au projet.
Un projet ne peut comporter qu’un seul fichier FLA ou XFL cible comme fichier cible par d&eacute;faut. Utilisez le bouton
D&eacute;finir par d&eacute;faut pour sp&eacute;cifier le fichier cible par d&eacute;faut du projet.
3 Cliquez sur OK.
Gestion des projets
L’Explorateur de packages permet d’ajouter des ressources &agrave; un projet, d’importer des ressources, d’exporter des
projets ainsi que de d&eacute;placer et de supprimer des ressources.
D&eacute;finition des propri&eacute;t&eacute;s des projets Flex
Chaque projet Flex poss&egrave;de son propre jeu de propri&eacute;t&eacute;s. Pour d&eacute;finir ces propri&eacute;t&eacute;s, s&eacute;lectionnez le projet dans la vue
Explorateur de packages. Dans le menu principal, s&eacute;lectionnez ensuite Projet &gt; Propri&eacute;t&eacute;s. Vous pouvez &eacute;galement
acc&eacute;der aux propri&eacute;t&eacute;s &agrave; partir du menu contextuel du projet.
Vous pouvez d&eacute;finir les pr&eacute;f&eacute;rences de projet suivantes.
Ressource Pr&eacute;sente des informations g&eacute;n&eacute;rales concernant le projet, les param&egrave;tres pour le codage de texte et les
d&eacute;limiteurs de lignes du syst&egrave;me d’exploitation.
G&eacute;n&eacute;rateurs Pr&eacute;cise l’outil de g&eacute;n&eacute;ration &agrave; utiliser. Flash Builder contient un outil de g&eacute;n&eacute;ration standard. Vous
pouvez faire appel &agrave; Apache Ant (outil de g&eacute;n&eacute;ration &laquo; open source &raquo;) pour cr&eacute;er des scripts de g&eacute;n&eacute;ration ou importer
des scripts de g&eacute;n&eacute;ration Ant existants (voir &laquo; Personnalisation des g&eacute;n&eacute;rations avec Apache Ant &raquo; &agrave; la page 83).
Mod&egrave;le de donn&eacute;es La configuration du mod&egrave;le de donn&eacute;es est uniquement disponible avec LiveCycle Data Services
version 3 ou sup&eacute;rieure. Elle sp&eacute;cifie l’emplacement du fichier du mod&egrave;le de donn&eacute;es contenant les informations sur
le type de service et de donn&eacute;es pour LiveCycle Data Services.
Donn&eacute;es/Services Pour les projets acc&eacute;dant &agrave; des services de donn&eacute;es, cette page d&eacute;finit si le g&eacute;n&eacute;rateur de code par
d&eacute;faut doit &ecirc;tre utilis&eacute; pour acc&eacute;der aux services. Vous pouvez &eacute;galement indiquer si vous souhaitez utiliser une seule
occurrence de serveur pour acc&eacute;der aux services (pour plus d’informations sur l’extension de Flash Builder de mani&egrave;re
&agrave; prendre en charge la g&eacute;n&eacute;ration de code personnalis&eacute;, voir Extension de la prise en charge des services dans Flash
Builder). pour plus d’informations sur l’utilisation d’une seule occurrence de serveur lors de l’acc&egrave;s aux services, voir
Utilisation d’une occurrence de serveur unique).
Applications Flex Affiche le nom des fichiers de projet d&eacute;finis comme fichiers d’application pouvant &ecirc;tre compil&eacute;s,
d&eacute;bogu&eacute;s et ex&eacute;cut&eacute;s en tant qu’applications distinctes (voir &laquo; Gestion des fichiers d’application du projet &raquo; &agrave; la
page 52).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 50
Utilisation des projets
Chemin de g&eacute;n&eacute;ration Flex Sp&eacute;cifie le chemin d’acc&egrave;s &agrave; la g&eacute;n&eacute;ration, qui pr&eacute;cise l’emplacement des fichiers source
externes et des fichiers de biblioth&egrave;que. Vous pouvez modifier ce chemin et changer le nom du dossier de sortie (voir
&laquo; D&eacute;finition d’un dossier de sortie de projet &raquo; &agrave; la page 79 et &laquo; G&eacute;n&eacute;ration manuelle de projets &raquo; &agrave; la page 81).
Compilateur Flex Sp&eacute;cifie d’une part les pr&eacute;f&eacute;rences optionnelles pour le compilateur (g&eacute;n&eacute;ration d’un fichier SWF
accessible, activation des avertissements de compilation et de la v&eacute;rification des types, sp&eacute;cification d’arguments de
compilation suppl&eacute;mentaires et d&eacute;finition de la version du SDK Flex) et d&eacute;finit d’autre part les param&egrave;tres de
l’enveloppe HTML (voir &laquo; Options de g&eacute;n&eacute;ration avanc&eacute;es &raquo; &agrave; la page 81).
Modules Flex Pr&eacute;cise les modules &agrave; g&eacute;n&eacute;rer et &agrave; optimiser pour le projet. Pour plus d’informations sur l’utilisation des
modules dans Flash Builder, voir &laquo; Cr&eacute;ation de modules dans Flash Builder &raquo; &agrave; la page 96.
Serveur Flex Sp&eacute;cifie le type de serveurs d’applications pour le projet. A la cr&eacute;ation d’un projet, vous avez la possibilit&eacute;
de sp&eacute;cifier un type de serveurs d’applications. Vous pouvez modifier ce type ici. Si vous modifiez le type de serveurs
d’applications d’un projet, vous risquez de ne plus pouvoir acc&eacute;der aux services de donn&eacute;es pr&eacute;c&eacute;demment configur&eacute;s.
Voir &laquo; Cr&eacute;ation de projets Flex &raquo; &agrave; la page 41 et Cr&eacute;ation d’un projet Flex pour l’acc&egrave;s &agrave; des services de donn&eacute;es.
Th&egrave;me Flex Sp&eacute;cifie le th&egrave;me &agrave; utiliser pour toutes les applications du projet. Vous pouvez sp&eacute;cifier l’un des th&egrave;mes
disponibles dans Flash Builder ou en importer un. Pour plus d’informations, voir &laquo; Application de th&egrave;mes &raquo; &agrave; la
page 210.
R&eacute;f&eacute;rences de projet R&eacute;pertorie les projets auxquels le projet en cours fait r&eacute;f&eacute;rence.
Ex&eacute;cuter/d&eacute;boguer les param&egrave;tres G&egrave;re les param&egrave;tres de configuration de lancement. Voir &laquo; Gestion des
configurations de lancement &raquo; &agrave; la page 94.
Conversion de projets Flex en projets Adobe AIR
Vous pouvez convertir le type d’applications d’un projet Flex d’application Web (ex&eacute;cut&eacute;e dans Flash Player) en
application de bureau (ex&eacute;cut&eacute;e dans Adobe AIR). La conversion entra&icirc;ne les modifications suivantes :
• Un fichier descripteur AIR est cr&eacute;&eacute; pour chaque application du projet.
• Les configurations de lancement du projet sont mises &agrave; jour de mani&egrave;re telle &agrave; &ecirc;tre lanc&eacute;es correctement au cours
de l’ex&eacute;cution AIR.
• Les param&egrave;tres des enveloppes HTML sont supprim&eacute;s.
• Les param&egrave;tres personnalis&eacute;s de Flash Player sont supprim&eacute;s.
• Le chemin d’acc&egrave;s &agrave; la biblioth&egrave;que est modifi&eacute; pour inclure le fichier airglobal.swc au lieu du fichier
playerglobal.swc.
Au cours de la conversion, vous pouvez d&eacute;finir pour chaque application du projet si vous souhaitez modifier les balises
Application de base en balises WindowedApplication. Si vous d&eacute;cidez de convertir ces balises, cette modification sera
la seule &agrave; intervenir dans le code d’application au cours de la conversion. Examinez les attributs des balises de base
apr&egrave;s la conversion pour v&eacute;rifier que l’application est ex&eacute;cut&eacute;e correctement dans Adobe AIR.
Modification d’un projet d’application Web en projet d’application de bureau
Remarque : cette proc&eacute;dure ne peut pas &ecirc;tre annul&eacute;e.
1 S&eacute;lectionnez le projet que vous souhaitez convertir.
Il doit s’agir d’un projet Flex avec type d’application Web (ex&eacute;cut&eacute;e dans Flash Player).
2 Dans le menu contextuel du projet, s&eacute;lectionnez :
Ajouter/Modifier le type de projet &gt; Convertir en projet de bureau (ex&eacute;cution dans Adobe AIR).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 51
Utilisation des projets
3 Dans la bo&icirc;te de dialogue Convertir en projet Bureau/Adobe AIR, sp&eacute;cifiez si vous souhaitez apporter des
modifications au code :
• Convertir les balises Application en WindowedApplication
Les balises Application de toutes les applications existantes du projet sont converties en balises
WindowedApplication. Aucune autre modification ne sera apport&eacute;e au code. Examinez les attributs des balises
de base pour v&eacute;rifier que l’application est ex&eacute;cut&eacute;e correctement dans Adobe AIR.
Les nouvelles applications cr&eacute;&eacute;es dans le projet sont des applications de bureau pouvant &ecirc;tre ex&eacute;cut&eacute;es dans
Adobe AIR.
• Ne r&eacute;&eacute;crire aucun code
Aucune modification n’est apport&eacute;e au code. Vous devez &eacute;diter les applications dans le projet avant de pouvoir
les ex&eacute;cuter dans Adobe AIR.
Les nouvelles applications cr&eacute;&eacute;es dans le projet sont des applications de bureau pouvant &ecirc;tre ex&eacute;cut&eacute;es dans
Adobe AIR.
D&eacute;placement d’un projet d’un espace de travail vers un autre
Vous pouvez faire appel &agrave; une association d’op&eacute;rations de suppression et d’importation pour d&eacute;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&egrave;me de fichiers (voir &laquo; Suppression de projets &raquo; &agrave; la page 51). Apr&egrave;s avoir
supprim&eacute; un projet d’un espace de travail, vous pouvez l’importer dans un autre.
Sp&eacute;cification du SDK d’un projet
Lorsque vous cr&eacute;ez un projet Flex, vous pouvez sp&eacute;cifier quel SDK Flex vous souhaitez utiliser. Les param&egrave;tres du SDK
pourront &ecirc;tre modifi&eacute;s ult&eacute;rieurement en cliquant sur Projet &gt; Propri&eacute;t&eacute;s &gt; Compilateur Flex &gt; Utiliser un SDK
sp&eacute;cifique.
Vous pouvez compiler un projet en utilisant un SDK Flex qui n’est pas disponible dans votre installation Flash Builder
en le t&eacute;l&eacute;chargeant et en l’y ajoutant. Par exemple, pour que le SDK utilis&eacute; corresponde &agrave; celui du serveur, proc&eacute;dez &agrave;
l’extraction du SDK du serveur, puis ajoutez-le &agrave; Flash Builder en cliquant sur Projet &gt; Propri&eacute;t&eacute;s &gt; Compilateur
Flex &gt; Configurer les SDK Flex.
Importation de projets utilisant une compilation de serveur distant
L’importation de projets utilisant une compilation de serveur n’est pas prise en charge. Vous pouvez importer un
projet sp&eacute;cifiant une compilation de serveur. L’importation comportera toutefois des erreurs qui s’afficheront dans la
vue Erreurs. Les erreurs sont accompagn&eacute;es d’un lien fournissant des informations sur la conversion d’un projet de
compilation de serveur en projet de compilation d’outils.
Suppression de projets
Lorsque vous supprimez un projet, vous le retirez de l’espace de travail en cours. Vous pouvez &eacute;galement le supprimer
simultan&eacute;ment du syst&egrave;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&eacute;f&eacute;rence &agrave; ce projet dans l’espace de travail tout en lib&eacute;rant des ressources syst&egrave;me. Pour plus
d’informations, voir &laquo; Fermeture et ouverture de projets &raquo; &agrave; la page 52.
1 Dans l’Explorateur de packages, s&eacute;lectionnez le projet &agrave; supprimer.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 52
Utilisation des projets
2 Dans le menu principal, s&eacute;lectionnez Editer &gt; Supprimer.
3 S&eacute;lectionnez une option.
Supprimer &eacute;galement le contenu sous le r&eacute;pertoire Supprime d&eacute;finitivement le projet de l’espace de travail et du
syst&egrave;me de fichiers.
Ne pas supprimer le contenu Supprime le projet de l’espace de travail sans le supprimer du syst&egrave;me de fichiers.
Fermeture et ouverture de projets
Pour &eacute;conomiser de la m&eacute;moire et acc&eacute;l&eacute;rer la g&eacute;n&eacute;ration sans supprimer un projet, vous pouvez le fermer. Lorsque
vous fermez un projet, vous r&eacute;duisez le projet et ses ressources, mais son nom reste visible dans l’Explorateur de
packages. Un projet ferm&eacute; n&eacute;cessite moins de m&eacute;moire qu’un projet ouvert et est exclu des g&eacute;n&eacute;rations. Vous pouvez
facilement rouvrir un projet ferm&eacute;.
1 Dans l’Explorateur de packages, s&eacute;lectionnez le projet &agrave; fermer ou rouvrir.
2 Dans le menu contextuel de l’Explorateur de packages, s&eacute;lectionnez Fermer le projet ou Ouvrir le projet.
Changement du fichier d’application principale
Lorsque vous cr&eacute;ez un projet Flex, un fichier d’application principale est cr&eacute;&eacute;. Par d&eacute;faut, il est nomm&eacute; d’apr&egrave;s le
projet. Le fichier d’application principale est le point d’acc&egrave;s &agrave; vos applications et est la base du fichier SWF de
l’application. Cependant, &agrave; mesure que vous ajoutez des fichiers &agrave; l’application, vous pouvez d&eacute;signer un fichier
diff&eacute;rent comme fichier d’application principale.
Si vous pr&eacute;f&eacute;rez d&eacute;finir plusieurs fichiers d’application de mani&egrave;re &agrave; ce que chaque fichier d’application soit g&eacute;n&eacute;r&eacute;
dans un fichier SWF distinct, consultez &laquo; Gestion des fichiers d’application du projet &raquo; &agrave; la page 52.
1 Dans l’Explorateur de packages, s&eacute;lectionnez le fichier d’application MXML que vous voulez d&eacute;finir comme fichier
d’application principale.
2 Dans le menu contextuel de l’Explorateur de packages, s&eacute;lectionnez D&eacute;finir comme application par d&eacute;faut.
Vous pouvez g&eacute;rer les fichiers d’application du projet en s&eacute;lectionnant Projet &gt; Propri&eacute;t&eacute;s &gt; Applications Flex (ou
Applications ActionScript si vous utilisez un projet ActionScript).
Gestion des fichiers d’application du projet
Un projet poss&egrave;de g&eacute;n&eacute;ralement un seul fichier d’application principale, qui sert de point d’acc&egrave;s &agrave; l’application. Le
compilateur Flash Builder utilise ce fichier pour g&eacute;n&eacute;rer le fichier d’application SWF.
Une application Flex complexe peut par exemple &ecirc;tre dot&eacute;e de nombreux composants MXML personnalis&eacute;s qui
repr&eacute;sentent des &eacute;l&eacute;ments d’application distincts mais interd&eacute;pendants. Vous pouvez cr&eacute;er un fichier d’application
contenant un composant personnalis&eacute; et ensuite le g&eacute;n&eacute;rer, l’ex&eacute;cuter et le tester s&eacute;par&eacute;ment.
Par d&eacute;faut, vous pouvez ex&eacute;cuter l’application &agrave; chaque ajout d’un fichier d’application MXML au projet Flex. Ce
fichier est alors ajout&eacute; &agrave; la liste des fichiers d’application du projet. Tous les fichiers d&eacute;finis comme fichiers
d’application doivent se trouver dans le dossier source du projet.
Vous pouvez g&eacute;rer la liste des fichiers d’application en s&eacute;lectionnant un projet et en affichant ses propri&eacute;t&eacute;s.
1 Dans l’Explorateur de packages, s&eacute;lectionnez un projet.
2 S&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s dans le menu principal ou s&eacute;lectionnez Propri&eacute;t&eacute;s dans le menu contextuel.
3 Dans la bo&icirc;te de dialogue Propri&eacute;t&eacute;s du projet, s&eacute;lectionnez Applications Flex (ou Applications ActionScript si vous
utilisez un projet ActionScript).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 53
Utilisation des projets
4 Ajoutez et supprimez les fichiers d’applications selon vos besoins. Cliquez sur OK.
Exportation et importation de projets
Flash Builder exporte les projets Flex et les projets de biblioth&egrave;ques Flex au format FXP. Les projets ActionScript
peuvent &ecirc;tre export&eacute;s uniquement vers des fichiers archive, g&eacute;n&eacute;ralement au format ZIP.
Le format FXP est un format d’archive contenant les dossiers, les fichiers et les m&eacute;tadonn&eacute;es d’un projet. Un projet
export&eacute; contient tous les projets de biblioth&egrave;que Flex d&eacute;pendants.
Remarque : vous pouvez &eacute;galement faire appel &agrave; l’assistant d’exportation Eclipse pour exporter des projets Flex et des
projets de biblioth&egrave;que Flex au format ZIP ou vers un autre format d’archive.
Lors de l’exportation ou de l’importation d’un projet Flex, certains contenus du projet n&eacute;cessiteront un traitement
sp&eacute;cial.
• Versions diff&eacute;rentes du SDK Flex
Vous pouvez importer un projet Flex faisant r&eacute;f&eacute;rence &agrave; une version du SDK Flex qui n’a pas &eacute;t&eacute; install&eacute;e avec Flash
Builder. Pour plus d’informations sur le t&eacute;l&eacute;chargement et l’installation de versions suppl&eacute;mentaires du SDK Flex,
voir &laquo; SDK Flex install&eacute;s &raquo; &agrave; la page 253.
Si Flash Builder ne trouve pas une version sp&eacute;cifique du SDK Flex, une bo&icirc;te de dialogue s’ouvre vous permettant
de la rechercher.
Apr&egrave;s avoir install&eacute; la version correcte du SDK Flex, acc&eacute;dez &agrave; son emplacement.
• Fichiers de services
Les projets Flex qui se connectent &agrave; des services de donn&eacute;es comportent des dossiers services contenant des liens
vers des fichiers de services d&eacute;ploy&eacute;s. A l’exportation du projet, Flash Builder exporte les liens, mais pas les services
d&eacute;ploy&eacute;s. A l’importation, vous devrez d&eacute;ployer les fichiers de services manuellement et mettre &agrave; jour les liens, si
besoin est.
Pour les projets se connectant aux services via LiveCycle Data Service ou BlazeDS, v&eacute;rifiez que les destinations de
service sont disponibles sur le serveur cible.
Pour les projets qui r&eacute;f&eacute;rencent des fichiers locaux, d&eacute;ployez ces derniers en utilisant le m&ecirc;me chemin que celui du
projet d’origine &agrave; l’importation. Cette mani&egrave;re de proc&eacute;der s’applique aux projets acc&eacute;dant &agrave; des fichiers de service
XML statiques ou &agrave; des fichiers locaux pour des services HTTP ou Web.
• Structure Zend Framework
Les projets Flex qui se connectent &agrave; des services de donn&eacute;es en utilisant PHP et la structure Zend Framework
contiennent deux fichiers de configuration. A l’importation, examinez ces fichiers afin de v&eacute;rifier qu’ils ont &eacute;t&eacute;
correctement configur&eacute;s pour votre syst&egrave;me :
amf-config.ini
gateway.php
Pour plus d’informations sur l’installation, la configuration et le d&eacute;pannage de votre installation Zend Framework,
voir Installation de Zend Framework.
• Fichiers de mod&egrave;les de donn&eacute;es (LiveCycle Data Services)
Un projet Flex utilisant LiveCycle Data Services (LCDS) est reli&eacute; &agrave; un fichier de mod&egrave;le de donn&eacute;es.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 54
Utilisation des projets
Apr&egrave;s exportation puis importation, Flash Builder r&eacute;f&eacute;rence le fichier de mod&egrave;le de donn&eacute;es actuel et non le lien
qui y renvoie. Si vous souhaitez utiliser un fichier li&eacute; (et non celui inclus dans le projet export&eacute;), modifiez le fichier
de mod&egrave;le de donn&eacute;es en acc&eacute;dant aux propri&eacute;t&eacute;s du projet. S&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Mod&egrave;le de donn&eacute;es
pour apporter les modifications.
Exportation d’un projet Flex ou d’un projet de biblioth&egrave;que Flex au format
FXP
Les menus des configurations autonome et plug-in de Flash Builder correspondant &agrave; cette proc&eacute;dure diff&egrave;rent
l&eacute;g&egrave;rement.
Certains projets Flex devront faire l’objet d’un traitement sp&eacute;cial &agrave; l’importation. Voir &laquo; Exportation et importation de
projets &raquo; &agrave; la page 53.
1 Dans Flash Builder, s&eacute;lectionnez Fichier &gt; Exporter un projet Flex (FXP).
Dans la version plug-in de Flash Builder, s&eacute;lectionnez Fichier &gt; Exporter &gt; Flash Builder &gt; Projet Flash Builder.
Vous pouvez &eacute;galement faire appel au menu contextuel du projet dans l’Explorateur de packages. S&eacute;lectionnez
Exporter &gt; Flash Builder &gt; Projet Flash Builder.
2 Dans l’assistant Exportation d’un projet Flex, s&eacute;lectionnez le projet &agrave; exporter.
La liste d&eacute;roulante Projet r&eacute;pertorie tous les projets disponibles.
3 (Facultatif) Activez l’option Valider la compilation du projet.
S&eacute;lectionnez cette option pour obtenir confirmation que le projet sera compil&eacute; sans erreurs. La pr&eacute;sence d’erreurs
ne vous emp&ecirc;chera pas de poursuivre l’exportation.
4 Cliquez sur Terminer.
Pour les projets sur serveur, les chemins absolus vers les ressources du serveur sont enregistr&eacute;s sous forme de
variables de chemin. Lorsque vous importerez ult&eacute;rieurement le projet, vous devrez sp&eacute;cifier des valeurs pour les
variables de chemin.
Exportation d’un projet ActionScript au format ZIP (ou vers tout autre format
d’archive)
1 Dans Flash Builder, s&eacute;lectionnez Fichier &gt; Exporter &gt; Autre.
2 Dans l’assistant d’exportation, s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Fichier archive. Cliquez sur Suivant.
3 S&eacute;lectionnez le projet et les fichiers &agrave; exporter :
• Dans le volet de gauche, d&eacute;veloppez le projet pour en s&eacute;lectionner les dossiers &agrave; inclure dans l’exportation.
• Dans le volet de droite, indiquez pour chaque dossier s&eacute;lectionn&eacute; les fichiers &agrave; exporter.
4 Recherchez un emplacement dans lequel enregistrer le projet export&eacute; et attribuez un nom au fichier.
5 D&eacute;finissez les options pour le fichier archive, puis cliquez sur Terminer.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 55
Utilisation des projets
Importation de projets
Flash Builder peut importer des projets Flex, des projets de biblioth&egrave;que Flex et des projets ActionScript. Les projets
peuvent &ecirc;tre import&eacute;s &agrave; partir de dossiers de projet existants ou &agrave; partir de fichiers issus d’une pr&eacute;alable exportation &agrave;
partir de Flash Builder. Vous pouvez importer plusieurs versions d’un m&ecirc;me projet Flex ou d’un m&ecirc;me projet de
biblioth&egrave;que Flex. Une fois l’importation de plusieurs versions effectu&eacute;e, vous pouvez les comparer, puis copier ou
fusionner leurs diff&eacute;rences.
Projets n&eacute;cessitant un traitement sp&eacute;cial
Certains projets Flex devront faire l’objet d’un traitement sp&eacute;cial &agrave; l’importation. Cela est le cas par exemple lorsque :
• le projet fait r&eacute;f&eacute;rence &agrave; une version ant&eacute;rieure du SDK Flex ;
• le projet fait r&eacute;f&eacute;rence &agrave; des fichiers de service pour l’acc&egrave;s aux donn&eacute;es ;
• la configuration Zend Framework pour l’acc&egrave;s aux services PHP doit &ecirc;tre mise &agrave; jour ;
• le projet utilise des liens LiveCycle Data Services (LCDS) vers un fichier de mod&egrave;le de donn&eacute;es.
Pour plus d’informations sur les projets n&eacute;cessitant un traitement sp&eacute;cial, voir &laquo; Exportation et importation de
projets &raquo; &agrave; la page 53.
Prise en charge des projets Catalyst
Flash Builder prend en charge le d&eacute;veloppement des applications con&ccedil;ues dans Adobe&reg; Flash&reg; Catalyst™. Catalyst
exporte un projet au format FXP et des composants au format FXPL. Le fichier FXPL est un package de biblioth&egrave;que.
Les fichiers FXP et FXPL peuvent &ecirc;tre ensuite import&eacute;s dans Flash Builder &agrave; des fins de d&eacute;veloppement. Pour les
fichiers FXP, il en r&eacute;sulte un projet Web Flex ex&eacute;cut&eacute; dans Adobe Flash Player. Un fichier FXPL contient un fichier de
biblioth&egrave;que. Vous pouvez importer des fichiers FXPL sous la forme d’un projet de biblioth&egrave;que Flex ou importer le
contenu dans un projet Flex existant.
Vous pouvez cr&eacute;er un projet Adobe AIR &agrave; partir d’un projet Catalyst. Importez le fichier FXP du projet Catalyst dans
Flash Builder. Convertissez le type d’application du projet d’application Web (ex&eacute;cut&eacute;e dans Flash Player) en
application de bureau (ex&eacute;cut&eacute;e dans Adobe AIR). Voir &laquo; Conversion de projets Flex en projets Adobe AIR &raquo; &agrave; la
page 50.
Importation d’un projet Flex ou d’un projet de biblioth&egrave;que Flex
Vous pouvez importer un projet &agrave; partir d’un fichier FXP export&eacute; ou en acc&eacute;dant au dossier contenant le projet.
Remarque : pour plus d’informations sur l’importation de contenu d’un projet de biblioth&egrave;que dans un autre projet Flex,
voir &laquo; Importation d’un projet FXPL Catalyst &raquo; &agrave; la page 56. Un projet FXPL est un projet de biblioth&egrave;que cr&eacute;&eacute; par Adobe
Catalyst.
Les menus des configurations autonome et plug-in de Flash Builder correspondant &agrave; cette proc&eacute;dure diff&egrave;rent
l&eacute;g&egrave;rement.
1 Dans le menu de Flash Builder, s&eacute;lectionnez Fichier &gt; Importer un projet FXP.
Dans la version plug-in de Flash Builder, s&eacute;lectionnez Fichier &gt; Importer &gt; Flash Builder &gt; Projet Flash Builder.
Les fonctions d’importation d’un projet sont &eacute;galement disponibles dans le menu contextuel de l’Explorateur de
packages.
2 (Dossier du projet) Si l’importation est effectu&eacute;e &agrave; partir d’un dossier de projet existant, activez l’option Dossier du
projet et recherchez le dossier contenant le projet.
3 (Fichier FXP) Si vous effectuez une importation &agrave; partir d’un fichier FXP, s&eacute;lectionnez Fichier et naviguez jusqu’&agrave;
l’emplacement du fichier.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 56
Utilisation des projets
Si le fichier FXP contient plusieurs projets, vous pouvez s&eacute;lectionnez individuellement les projets &agrave; importer.
4 (Projet de biblioth&egrave;que ou projet FXPL) Si vous importez un projet de biblioth&egrave;que ou un projet FXPL Catalyst,
vous avez la possibilit&eacute; d’importer le contenu dans un projet existant. Voir &laquo; Importation d’un projet FXPL
Catalyst &raquo; &agrave; la page 56.
5 (Fichier FXP) Si un projet du m&ecirc;me nom existe dans l’espace de travail, sp&eacute;cifiez la m&eacute;thode d’importation.
• Importer en tant que nouveau projet : Flash Builder identifie le projet en ajoutant un chiffre &agrave; son nom. Les
versions ant&eacute;rieures du projet sont conserv&eacute;es.
Dans le champ Extraire le nouveau projet vers, sp&eacute;cifiez l’emplacement dans lequel vous souhaitez extraire le
fichier. Cet emplacement est g&eacute;n&eacute;ralement un r&eacute;pertoire de l’espace de travail de Flash Builder repr&eacute;sentant un
dossier du projet. Vous pouvez sp&eacute;cifier un nouveau dossier de projet ou remplacer un projet existant.
• Remplacer un projet existant : s&eacute;lectionnez le projet que vous souhaitez remplacer. La version ant&eacute;rieure du
projet est d&eacute;finitivement supprim&eacute;e.
6 (Variables de chemin) Si vous importez un projet d&eacute;finissant des variables de chemin, mettez &agrave; jour les variables de
chemin pour le projet.
Les projets compil&eacute;s pour ColdFusion, PHP, LiveCycle Data Services ou d’autres technologies de serveur font appel
aux variables de chemin pour acc&eacute;der au serveur Web et aux ressources du serveur. D’autres projets peuvent
pr&eacute;senter des variables de chemin personnalis&eacute;es.
S&eacute;lectionnez chaque variable de chemin et attribuez-lui une valeur valide.
7 (R&eacute;f&eacute;rences aux polices) Si vous importez un fichier FXP export&eacute; par Catalyst, le projet peut contenir des r&eacute;f&eacute;rences
aux polices. Vous avez la possibilit&eacute; de r&eacute;soudre ces r&eacute;f&eacute;rences.
Voir &laquo; R&eacute;solution des r&eacute;f&eacute;rences aux polices lors de l’importation de projets Catalyst &raquo; &agrave; la page 57.
8 Cliquez sur Terminer.
9 (Projets pour serveurs PHP) Si vous importez un projet pour serveur d’applications de type PHP, installez ou
mettez &agrave; jour l’installation Zend.
La bo&icirc;te de dialogue Zend vous guide au long du processus.
Remarque : si vous annulez le processus dans la bo&icirc;te de dialogue Zend, installez ou mettez &agrave; jour manuellement
Zend Framework. L’acc&egrave;s aux services PHP est impossible tant que Zend Framework n’est pas install&eacute; et configur&eacute;
correctement. Pour plus d’informations sur l’installation, la configuration et le d&eacute;pannage de l’installation Zend
Framework, voir Installation de Zend Framework.
10 (Projets pour serveurs) D&eacute;ployez des services.
a Placez manuellement des services dans la racine Web du serveur. Utilisez la structure de r&eacute;pertoire utilis&eacute;e dans
le projet d’origine.
b Dans la vue Donn&eacute;es/Services, s&eacute;lectionnez Actualiser dans le menu contextuel d’un service.
Importation d’un projet FXPL Catalyst
Un projet FXPL Catalyst est un projet de biblioth&egrave;que cr&eacute;&eacute; par Adobe Catalyst. Lors de l’importation d’un projet FXPL,
vous avez la possibilit&eacute; d’importer le contenu dans un autre projet Flex ou dans un projet de biblioth&egrave;que Flex.
Cette fonctionnalit&eacute; est con&ccedil;ue pour permettre aux d&eacute;veloppeurs de collaborer avec les concepteurs d’applications
Catalyst. Vous pouvez toutefois l’utiliser pour importer le contenu d’un projet de biblioth&egrave;que dans un autre projet
Flex ou dans un projet de biblioth&egrave;que Flex.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 57
Utilisation des projets
Les menus des configurations autonome et plug-in de Flash Builder correspondant &agrave; cette proc&eacute;dure diff&egrave;rent
l&eacute;g&egrave;rement. Cette proc&eacute;dure suppose que vous importez un projet de biblioth&egrave;que.
1 Dans le menu de Flash Builder, s&eacute;lectionnez Fichier &gt; Importer un projet FXP.
Dans la version plug-in de Flash Builder, s&eacute;lectionnez Fichier &gt; Importer &gt; Flash Builder &gt; Projet Flash Builder.
Les fonctions d’importation d’un projet sont &eacute;galement disponibles dans le menu contextuel de l’Explorateur de
packages.
2 Activez l’option Fichier et recherchez l’emplacement du fichier.
3
Sp&eacute;cifiez la m&eacute;thode d’importation.
• Importer nouvelle copie du projet : Flash Builder identifie le projet en ajoutant un chiffre &agrave; son nom. Les
versions ant&eacute;rieures du projet sont conserv&eacute;es.
Dans le champ Extraire le nouveau projet vers, sp&eacute;cifiez l’emplacement dans lequel vous souhaitez extraire le
fichier. Cet emplacement est g&eacute;n&eacute;ralement un r&eacute;pertoire de l’espace de travail de Flash Builder repr&eacute;sentant un
dossier du projet. Vous pouvez sp&eacute;cifier un nouveau dossier de projet ou remplacer un projet existant.
• Importez le contenu dans un projet existant.
Pour Dossier source, acc&eacute;dez au dossier src d’un projet existant. Pour Package, acc&eacute;dez &agrave; un package existant
ou sp&eacute;cifiez un nouveau nom de package pour le contenu.
• Remplacer un projet existant : si un projet du m&ecirc;me nom existe dans l’espace de travail, vous pouvez remplacer
le projet existant.
S&eacute;lectionnez le projet &agrave; remplacer. La version ant&eacute;rieure du projet est d&eacute;finitivement supprim&eacute;e.
4 Cliquez sur Terminer.
Lors de l’importation de fichiers FXPL, Flash Builder tente de r&eacute;soudre les r&eacute;f&eacute;rences aux polices du fichier FXPL.
Voir &laquo; R&eacute;solution des r&eacute;f&eacute;rences aux polices lors de l’importation de projets Catalyst &raquo; &agrave; la page 57.
R&eacute;solution des r&eacute;f&eacute;rences aux polices lors de l’importation de projets Catalyst
Lors de l’importation d’un projet FXP cr&eacute;&eacute; avec Adobe Catalyst, ce projet peut contenir des r&eacute;f&eacute;rences &agrave; des polices
qui ne sont pas disponibles sur votre syst&egrave;me.
L’assistant d’importation permet de corriger les r&eacute;f&eacute;rences aux polices &agrave; l’aide de CSS. Si vous s&eacute;lectionnez l’option
correspondante, Flash Builder importe la feuille de style Catalyst Main.css. Main.css contient les r&eacute;f&eacute;rences aux
polices utilis&eacute;es dans le projet.
Si vous obtenez des erreurs de compilation provenant des polices r&eacute;f&eacute;renc&eacute;es dans la feuille de style, corrigez les
r&eacute;f&eacute;rences de la feuille de style avec les polices disponibles sur votre syst&egrave;me.
Les projets FXPL Catalyst ne contiennent pas de feuilles de style. Flash Builder tente de corriger les r&eacute;f&eacute;rences aux
polices lors de l’importation d’un fichier FXPL. S’il ne trouve pas de police correspondante sur le syst&egrave;me cible, les
r&eacute;f&eacute;rences aux polices d’origine sont conserv&eacute;es. Pour les projets FXPL, les r&eacute;f&eacute;rences aux polices que Flash Builder ne
parvient pas &agrave; r&eacute;soudre sont d&eacute;tect&eacute;es &agrave; l’ex&eacute;cution. Les r&eacute;f&eacute;rences aux polices non r&eacute;solues entra&icirc;nent une substitution
de police ou une erreur d’ex&eacute;cution.
Remarque : pour les fichiers FXPL, Flash Builder modifie l’attribut fontFamily dans les fichiers MXML lorsqu’il tente
de r&eacute;soudre les r&eacute;f&eacute;rences aux polices.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 58
Utilisation des projets
Importation d’un projet Flex 3
Vous pouvez importer un projet Flex 3 dans Flash Builder en utilisant le mode de compatibilit&eacute; Flex 3. Dans ce cas, les
espaces de noms et les composants Flex 3 demeureront inchang&eacute;s. Vous pourrez cependant profiter du compilateur
disponible avec Flex 4.
Les documents cr&eacute;&eacute;s en mode de compatibilit&eacute; Flex 3 utilisent les composants MX et les espaces de noms suivants :
mx=&quot;http://www.adobe.com/2006/mxml&quot;
1 Dans Flash Builder, s&eacute;lectionnez Fichier &gt; Importer un projet Flex.
2 Recherchez le fichier ZIP du projet Flex 3 pr&eacute;c&eacute;demment export&eacute; ou le dossier du projet Flex 3.
3 Cliquez sur Terminer.
4 Dans la bo&icirc;te de dialogue Choisir la version du SDK Flex, v&eacute;rifiez que le SDK Flex 4 a &eacute;t&eacute; activ&eacute;. S&eacute;lectionnez
Utiliser le mode de compatibilit&eacute; Flex 3.
5 Cliquez sur OK.
Comparaison des modifications apport&eacute;es &agrave; un projet
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&eacute;rentes d’un m&ecirc;me projet.
1 Dans l’Explorateur de packages, s&eacute;lectionnez l’un des projets que vous souhaitez comparer.
2 Ouvrez le menu contextuel et s&eacute;lectionnez Comparer le projet avec la version.
L’affichage de comparaison s’ouvre, vous permettant de comparer le projet &agrave; d’autres versions de ce m&ecirc;me projet.
3 S&eacute;lectionnez la version avec laquelle vous souhaitez effectuer la comparaison. L’&eacute;diteur de comparaison Eclipse
s’ouvre.
4 Dans l’&eacute;diteur de comparaison, acc&eacute;dez au fichier que vous souhaitez comparer et s&eacute;lectionnez Afficher la
comparaison du contenu dans le menu contextuel.
L’&eacute;diteur de comparaison affiche les deux versions du fichier et en met en &eacute;vidence les diff&eacute;rences.
Vous pouvez utiliser les options de l’&eacute;diteur de comparaison pour copier ou fusionner les diff&eacute;rences dans le fichier.
Pour plus d’informations, voir la documentation Eclipse sur l’&eacute;diteur de comparaison.
Importation d’un projet ActionScript
Les projets ActionScript sont export&eacute;s au format d’archive ZIP. Utilisez l’assistant d’importation Eclipse pour importer
les projets ActionScript.
1 Dans Flash Builder, s&eacute;lectionnez Fichier &gt; Importer &gt; Autre &gt; G&eacute;n&eacute;ral &gt; Fichier archive.
Vous pouvez &eacute;galement faire appel au menu contextuel de l’Explorateur de packages.
2 Dans la bo&icirc;te de dialogue d’importation d’un projet Flex, s&eacute;lectionnez le fichier ZIP &agrave; importer.
3 Cliquez sur Terminer.
Importation de projets export&eacute;s avec l’assistant d’exportation Eclipse
Un projet export&eacute; &agrave; l’aide de l’assistant d’exportation Eclipse devra &ecirc;tre import&eacute; avec l’assistant d’importation Eclipse.
S&eacute;lectionnez Fichier &gt; Importer &gt; G&eacute;n&eacute;ral. Recherchez le format correspondant &agrave; 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.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 59
Utilisation des projets
Les services d’un projet cr&eacute;&eacute;s avec les outils Flash Builder d’acc&egrave;s aux services de donn&eacute;es devront &ecirc;tre ajout&eacute;s
manuellement. Copiez les fichiers de serveur dans le dossier services du serveur appropri&eacute;. Dans la vue
Donn&eacute;es/Services, utilisez les propri&eacute;t&eacute;s du service pour un serveur afin de d&eacute;terminer l’emplacement du service.
Si vous avez export&eacute; un projet PHP bas&eacute; sur la structure Zend Framework, cette derni&egrave;re doit &ecirc;tre install&eacute;e sur le
serveur cible. Modifiez le fichier amf-config.ini qui configure la structure Zend Framework. Pour zend_path,
sp&eacute;cifiez le chemin absolu du r&eacute;pertoire d’installation de Zend Framework. Pour plus d’informations sur l’installation,
la configuration et le d&eacute;pannage de l’installation Zend Framework, voir Installation de Zend Framework.
Importation d’un projet dans plusieurs espaces de travail
Flash Builder importe les projets dans ses espaces de travail. Un projet peut &ecirc;tre import&eacute; dans plusieurs espaces de
travail. Dans ce cas, les fichiers du projet se trouvent dans un seul emplacement sur le disque, mais sont r&eacute;f&eacute;renc&eacute;s par
chaque espace de travail. Les modifications apport&eacute;es au projet se r&eacute;percutent dans tous les espaces de travail.
Importation de fichiers source dans un nouveau projet
Vous pouvez cr&eacute;er un projet dans lequel importer les fichiers source et les ressources situ&eacute;s sur votre syst&egrave;me de
fichiers mais n’appartenant &agrave; aucun projet.
1 Dans le menu Flash Builder, s&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet.
Il peut s’agir d’un projet Flex, d’un projet de biblioth&egrave;que Flex ou d’un projet ActionScript.
2 Dans l’assistant Nouveau projet Flex, sp&eacute;cifiez la source et le dossier de sortie.
Remarque : vous pouvez &eacute;galement accepter les emplacements par d&eacute;faut propos&eacute;s par l’assistant et y d&eacute;placer les
fichiers source.
Exportation d’un programme d’installation d’application Adobe AIR
Pour les projets AIR, une g&eacute;n&eacute;ration de production cr&eacute;e un fichier AIR sign&eacute; num&eacute;riquement que l’utilisateur doit
installer pr&eacute;alablement &agrave; l’ex&eacute;cution de l’application. Ce processus s’apparente &agrave; la cr&eacute;ation d’un fichier .exe d’un
programme d’installation pour une application native standard. Vous pouvez cr&eacute;er un package interm&eacute;diaire non
sign&eacute; que vous pourrez signer ult&eacute;rieurement avant la publication.
Pour plus d’informations sur l’exportation d’une version de production et d’un programme d’installation AIR, voir
&laquo; Exportation vers une version valid&eacute;e (application de bureau, ex&eacute;cut&eacute;e dans Adobe AIR) &raquo; &agrave; la page 60.
Exportation d’une application vers une version valid&eacute;e
Vous pouvez exporter une version optimis&eacute;e de qualit&eacute; finale (fichier SWF ou AIR non d&eacute;bogu&eacute;) de l’application en
utilisant l’assistant Exporter vers une version valid&eacute;e. Les ressources requises sont copi&eacute;es dans un dossier distinct de
celui de la version de d&eacute;bogage. Une fois l’assistant ex&eacute;cut&eacute;, vous devrez proc&eacute;der &agrave; des op&eacute;rations suppl&eacute;mentaires
pour d&eacute;ployer l’application sur un serveur.
Exportation vers une version valid&eacute;e (application Web, ex&eacute;cut&eacute;e dans Adobe
Flash Player)
1 S&eacute;lectionnez Projet &gt; Exporter vers une version valid&eacute;e pour ouvrir l’assistant correspondant.
2 S&eacute;lectionnez le projet et l’application que vous souhaitez exporter.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 60
Utilisation des projets
3 (Facultatif) S&eacute;lectionnez Activer l’affichage de la source pour permettre l’acc&egrave;s aux fichiers source &agrave; partir de
l’application export&eacute;e.
Cliquez sur Choisir des fichiers source pour sp&eacute;cifier les fichiers source &agrave; inclure. Outre les fichiers source sp&eacute;cifi&eacute;s,
l’assistant g&eacute;n&egrave;re un fichier archive ZIP contenant les fichiers source.
Important : pour les projets pour serveurs, vous pouvez s&eacute;lectionner le dossier des services &agrave; l’exportation des fichiers
source. L’exportation de fichiers impl&eacute;mentant des services a des implications en termes de s&eacute;curit&eacute;. Ces fichiers
peuvent donner acc&egrave;s &agrave; votre base de donn&eacute;es, noms d’utilisateurs et mots de passe inclus. Voir Exportation des fichiers
source vers la version valid&eacute;e d’une application.
4 Cliquez sur Terminer.
5 Copiez le dossier contenant la version export&eacute;e vers la racine Web du serveur h&eacute;bergeant l’application.
6 (Projets pour serveurs) Si vous exportez la version d’un projet sp&eacute;cifiant un type de serveurs d’applications,
d&eacute;ployez les services &agrave; la racine Web du serveur cible.
Conservez la structure de r&eacute;pertoire utilis&eacute; lors du d&eacute;veloppement.
Cette &eacute;tape s’applique aux services ColdFusion, PHP, BlazeDS et LCDS. Le type de serveurs d’applications est d&eacute;fini
&agrave; la cr&eacute;ation du projet dans Flash Builder.
Pour des fichiers locaux d&eacute;ploy&eacute;s sur le serveur, un fichier de r&eacute;gulation interdomaines est n&eacute;cessaire pour acc&eacute;der
&agrave; ces services. Cette mani&egrave;re de proc&eacute;der s’applique aux projets acc&eacute;dant &agrave; des fichiers de service XML statiques ou
&agrave; des fichiers locaux pour des services HTTP ou Web. Voir Utilisation des fichiers de r&eacute;gulation interdomaines.
7 (Projets pour serveurs PHP uniquement) Pour les projets PHP, ex&eacute;cutez les &eacute;tapes suppl&eacute;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&eacute;e.
Pour zend_path, sp&eacute;cifiez le chemin absolu du r&eacute;pertoire d’installation de Zend Framework.
D&eacute;finissez amf.production sur true.
Saisissez pour webroot le chemin absolu vers la racine Web du serveur.
Exportation vers une version valid&eacute;e (application de bureau, ex&eacute;cut&eacute;e dans
Adobe AIR)
Pour les projets AIR, une version de production cr&eacute;e un fichier AIR sign&eacute; num&eacute;riquement que l’utilisateur devra
installer pr&eacute;alablement &agrave; l’ex&eacute;cution de l’application. Ce processus s’apparente &agrave; la cr&eacute;ation d’un fichier .exe de
programme d’installation pour une application native standard. Vous pouvez &eacute;galement cr&eacute;er un package
interm&eacute;diaire non sign&eacute; que vous pourrez signer ult&eacute;rieurement avant la publication. Avant d’entamer la proc&eacute;dure
d’exportation vers une version valid&eacute;e, vous devez d&eacute;cider de la mani&egrave;re dont vous souhaitez signer num&eacute;riquement
l’application AIR :
• Signer l’application en ayant recours &agrave; un certificat num&eacute;rique VeriSign ou Thawte
• Cr&eacute;er et utiliser un certificat num&eacute;rique autosign&eacute;
• Assembler l’application et la signer ult&eacute;rieurement
Les certificats num&eacute;riques d&eacute;livr&eacute;s par VeriSign et Thawte confirment votre identit&eacute; d’&eacute;diteur et indiquent qu’aucune
modification n’a &eacute;t&eacute; apport&eacute;e au fichier d’installation depuis sa signature. Les certificats num&eacute;riques autosign&eacute;s sont
utilis&eacute;s dans le m&ecirc;me but, mais se distinguent par le fait qu’ils ne sont pas valid&eacute;s par un tiers.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 61
Utilisation des projets
Vous pouvez &eacute;galement assembler l’application AIR sans signature num&eacute;rique en cr&eacute;ant un fichier AIR interm&eacute;diaire
(.airi). La validit&eacute; de ce type de fichier est limit&eacute;e. Il ne peut en effet pas &ecirc;tre install&eacute;. Il est utilis&eacute; dans les proc&eacute;dures
de test (effectu&eacute;es par les d&eacute;veloppeurs) et peut &ecirc;tre lanc&eacute; avec l’outil de ligne de commande AIR ADT. La mise &agrave;
disposition de cette fonctionnalit&eacute; est li&eacute;e au fait que dans certains environnements de d&eacute;veloppement, la signature est
prise en charge par un d&eacute;veloppeur ou une &eacute;quipe sp&eacute;cifique, garantissant ainsi un niveau de s&eacute;curit&eacute; sup&eacute;rieur.
Exportation d’une application et d’un programme d’installation AIR
1 (Facultatif) Modifiez les param&egrave;tres du serveur dans les propri&eacute;t&eacute;s du projet.
Une application de bureau export&eacute;e peut acc&eacute;der uniquement aux services utilis&eacute;s au cours du d&eacute;veloppement. Si
vous souhaitez modifier le serveur pour l’application de bureau export&eacute;e, modifiez les param&egrave;tres du projet.
2 S&eacute;lectionnez Projet &gt; Exporter vers une version valid&eacute;e pour ouvrir l’assistant correspondant.
3 S&eacute;lectionnez le projet et l’application que vous souhaitez exporter.
4 (Facultatif) S&eacute;lectionnez Activer l’affichage de la source pour permettre l’acc&egrave;s aux fichiers source &agrave; partir de
l’application export&eacute;e.
Cliquez sur Choisir des fichiers source pour sp&eacute;cifier les fichiers source &agrave; inclure. Outre les fichiers source sp&eacute;cifi&eacute;s,
l’assistant g&eacute;n&egrave;re un fichier archive ZIP contenant les fichiers source.
Important : pour les projets pour serveurs, vous pouvez s&eacute;lectionner le dossier des services &agrave; l’exportation des fichiers
source. L’exportation de fichiers impl&eacute;mentant des services a des implications en termes de s&eacute;curit&eacute;. Ces fichiers
peuvent donner acc&egrave;s &agrave; votre base de donn&eacute;es, noms d’utilisateurs et mots de passe inclus. Voir Exportation des fichiers
source vers la version valid&eacute;e d’une application.
5 S&eacute;lectionnez l’option Exporter vers un fichier AIR ou l’option Exporter vers le programme d’installation natif.
Cliquez sur Suivant.
L’option Exporter vers un fichier AIR cr&eacute;e un fichier de programme d’installation g&eacute;n&eacute;rique permettant
l’installation de l’application sur les plates-formes Windows ou Mac OS X.
L’option Exporter vers le programme d’installation natif cr&eacute;e un programme d’installation pour la plate-forme cible
(Windows ou Mac OS X).
6 A la page Signature num&eacute;rique, proc&eacute;dez comme suit :
Sp&eacute;cifiez le certificat num&eacute;rique repr&eacute;sentant l’identit&eacute; de l’&eacute;diteur de l’application. Pour g&eacute;n&eacute;rer un certificat
autosign&eacute;, cliquez sur Cr&eacute;er et renseignez les champs requis.
Pour exporter un fichier dont la signature peut &ecirc;tre effectu&eacute;e ult&eacute;rieurement, exportez un fichier interm&eacute;diaire AIRI.
7 Dans la page Contenu du fichier AIR, s&eacute;lectionnez les fichiers de sortie &agrave; inclure dans le fichier AIR ou AIRI.
8 Cliquez sur Terminer.
9 Copiez le projet .air vers le bureau cible.
10 (Projets pour serveurs) Si vous exportez la version d’un projet sp&eacute;cifiant un type de serveurs d’applications,
d&eacute;ployez les services sur le serveur cible.
Cette &eacute;tape s’applique aux services ColdFusion, PHP, BlazeDS et LCDS. Le type de serveurs d’applications est d&eacute;fini
&agrave; la cr&eacute;ation du projet dans Flash Builder.
11 (Projets pour serveurs PHP uniquement) Ex&eacute;cutez les &eacute;tapes suppl&eacute;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&eacute;e.
Pour zend_path, sp&eacute;cifiez le chemin absolu du r&eacute;pertoire d’installation de Zend Framework.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 62
Utilisation des projets
D&eacute;finissez amf.production sur true.
Saisissez pour webroot le chemin absolu vers la racine Web du serveur.
Version d&eacute;bogu&eacute;e
La version d&eacute;bogu&eacute;e de l’application contient des informations de d&eacute;bogage. Elle intervient au cours du d&eacute;bogage de
l’application. La version valid&eacute;e r&eacute;sultant de l’exportation ne contient aucune information de d&eacute;bogage. La taille de son
fichier est donc inf&eacute;rieure &agrave; celle du fichier de la version d&eacute;bogu&eacute;e. Un fichier d’enveloppe HTML contient un lien vers
le fichier SWF de l’application. Il intervient dans l’ex&eacute;cution ou le d&eacute;bogage de l’application dans un navigateur Web.
Remarque : les commandes Ex&eacute;cuter et D&eacute;boguer lancent la version de d&eacute;veloppement dans le dossier bin-debug (et non
dans le dossier de version valid&eacute;e, bin-release).
Dans une application standard, le dossier de sortie ressemble &agrave; l’exemple suivant.
Vous pouvez ex&eacute;cuter ou d&eacute;boguer vos applications Flex et ActionScript dans un navigateur Web ou dans l’application
Flash Player autonome. Pour d&eacute;finir la mani&egrave;re dont les applications sont ex&eacute;cut&eacute;es ou d&eacute;bogu&eacute;es, modifiez la
configuration de lancement du projet (voir &laquo; Ex&eacute;cution des applications &raquo; &agrave; la page 92). Pour plus d’informations sur
l’ex&eacute;cution ou le d&eacute;bogage des applications, voir &laquo; Ex&eacute;cution des applications &raquo; &agrave; la page 90 et &laquo; D&eacute;bogage des
applications &raquo; &agrave; la page 141.
L’utilisation de LiveCycle Data Services ES conduit &agrave; la cr&eacute;ation d’applications tirant parti des technologies de serveur
Flex. Lorsque vous g&eacute;n&eacute;rez des applications LiveCycle Data Services ES, vous pouvez opter entre la compilation locale
des fichiers de sortie avec Flash Builder ou la compilation sur le serveur intervenant au moment d’acc&eacute;der &agrave;
l’application pour la premi&egrave;re fois.
Gestion des ressources du projet
Les projets sont constitu&eacute;s de ressources (dossiers et fichiers) que vous pouvez g&eacute;rer depuis l’Explorateur de packages.
Les projets sont contenus dans un espace de travail. L’Explorateur de packages propose une repr&eacute;sentation logique de
l’espace de travail dans le syst&egrave;me de fichiers. Il est actualis&eacute; &agrave; chaque fois que vous ajoutez, supprimez ou modifiez
une ressource.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 63
Utilisation des projets
Vous pouvez &eacute;galement modifier les ressources du projet directement dans le syst&egrave;me de fichiers, sans passer par Flash
Builder ni par l’Explorateur de packages.
Cr&eacute;ation de dossiers et de fichiers dans un projet
Vous pouvez ajouter des dossiers et des fichiers &agrave; un projet selon vos besoins. Vous pouvez par exemple cr&eacute;er un
dossier destin&eacute; &agrave; stocker tous les mod&egrave;les de donn&eacute;es ou &agrave; organiser toutes les ressources qui composent l’aspect visuel
de l’application.
Cr&eacute;ation d’un dossier
1 Dans l’Explorateur de packages, s&eacute;lectionnez Fichier &gt; Nouveau &gt; Dossier.
2 Si l’espace de travail contient plusieurs projets, s&eacute;lectionnez le projet &agrave; ajouter au dossier autonome.
Si vous cr&eacute;ez le dossier dans le dossier du chemin d’acc&egrave;s source, il est trait&eacute; comme un nom de package. Vous
pouvez y placer des fichiers source qui seront reconnus par le compilateur.
Si vous le cr&eacute;ez en dehors du dossier du chemin d’acc&egrave;s source, vous pourrez l’ajouter ult&eacute;rieurement &agrave; ce chemin
afin de le transformer en racine d’une structure de packages. Une fois que vous avez termin&eacute; cette proc&eacute;dure,
s&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s, puis Chemin de g&eacute;n&eacute;ration Flex. Cliquez sur Ajouter un dossier et acc&eacute;dez au
dossier que vous venez de cr&eacute;er.
3 Entrez le nom du dossier, puis cliquez sur Terminer.
Cr&eacute;ation d’un fichier
1 Dans l’Explorateur de packages, s&eacute;lectionnez Fichier &gt; Nouveau &gt; Fichier.
2 Si l’espace de travail contient plusieurs projets, s&eacute;lectionnez le projet auquel vous voulez ajouter le fichier.
3 Entrez le nom du fichier, puis cliquez sur Terminer.
Vous pouvez &eacute;galement ajouter des dossiers et des fichiers se trouvant en dehors du projet en cours. Pour plus
d’informations, voir &laquo; Liaison &agrave; des ressources situ&eacute;es en dehors de l’espace de travail du projet &raquo; &agrave; la page 64.
Suppression de dossiers et de fichiers
La suppression de dossiers et de fichiers du projet les &eacute;limine de l’espace de travail et, par cons&eacute;quent, du syst&egrave;me de
fichiers.
Remarque : la suppression d’une ressource li&eacute;e ne supprime du projet que le lien, pas la ressource en soi (voir &laquo; Liaison &agrave;
des ressources situ&eacute;es en dehors de l’espace de travail du projet &raquo; &agrave; la page 64). Cependant, si vous avez cr&eacute;&eacute; un lien &agrave; un
dossier et que vous supprimez un ou plusieurs de ses fichiers, ceux-ci sont supprim&eacute;s du syst&egrave;me de fichiers.
1 Dans l’Explorateur de packages, s&eacute;lectionnez la ressource &agrave; supprimer.
2 S&eacute;lectionnez Edition &gt; Supprimer ou appuyez sur la touche Suppr, puis cliquez sur Oui.
La ressource est supprim&eacute;e du syst&egrave;me de fichiers.
D&eacute;placement de ressources entre les projets d’un espace de travail
Lorsque vous travaillez avec plusieurs projets dans un espace de travail, vous pouvez d&eacute;placer des ressources d’un
projet vers un autre.
1 Dans l’Explorateur de packages, s&eacute;lectionnez la ressource &agrave; d&eacute;placer.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 64
Utilisation des projets
2 Effectuez l’une des op&eacute;rations suivantes :
• Faites glisser la ressource vers un nouveau projet.
• Coupez et collez la ressource dans un autre projet.
Remarque : vous pouvez d&eacute;placer des ressources normales et des ressources li&eacute;es. Pour plus d’informations sur la
liaison de ressources, voir &laquo; Liaison &agrave; des ressources situ&eacute;es en dehors de l’espace de travail du projet &raquo; &agrave; la page 64.
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&eacute;rentes vues qui affichent ces ressources. La suppression d’un fichier du projet par exemple
est imm&eacute;diatement r&eacute;percut&eacute;e dans l’Explorateur de packages.
Vous pouvez &eacute;galement modifier des ressources situ&eacute;es en dehors de Flash Builder, directement dans le syst&egrave;me de
fichiers. Ces modifications ne sont visibles dans Flash Builder qu’apr&egrave;s actualisation de l’espace de travail.
Par d&eacute;faut, l’espace de travail de la configuration autonome de Flash Builder est actualis&eacute; automatiquement. Cette
option peut &ecirc;tre modifi&eacute;e dans les pr&eacute;f&eacute;rences de Flash Builder. Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez
G&eacute;n&eacute;ral &gt; Espace de travail. Vous pouvez &eacute;galement modifier le comportement par d&eacute;faut de Flash Builder et
d&eacute;sactiver l’actualisation automatique de l’espace de travail.
Actualisation manuelle de l’espace de travail
❖ Dans le menu contextuel de l’Explorateur de packages, s&eacute;lectionnez Actualiser. Toutes les ressources de projet dans
l’espace de travail sont actualis&eacute;es.
D&eacute;sactivation de l’actualisation automatique
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Espace de travail.
2 D&eacute;s&eacute;lectionnez l’option Actualiser automatiquement.
Liaison &agrave; des ressources situ&eacute;es en dehors de l’espace de travail du projet
Vous pouvez cr&eacute;er des liens avec des ressources situ&eacute;es en dehors du projet et de l’emplacement de l’espace de travail
ainsi qu’avec des dossiers et des fichiers situ&eacute;s n’importe o&ugrave; dans le syst&egrave;me de fichiers. Cette option est utile en cas de
partage des ressources entre diff&eacute;rents projets. Vous pouvez par exemple partager une biblioth&egrave;que de composants
Flex ou ActionScript personnalis&eacute;s entre plusieurs projets Flex.
Les dossiers contenant des ressources li&eacute;es sont signal&eacute;s dans l’Explorateur de packages (comme l’illustre l’exemple
suivant). Vous pouvez ainsi distinguer les ressources normales des ressources li&eacute;es.
Parmi d’autres exemples de liaison de ressources, citons les dossiers de fichiers d’images ou encore le cas des dossiers
de sortie ne se trouvant pas dans le dossier racine du projet.
Lorsque les ressources sont partag&eacute;es, les modifications que vous apportez aux dossiers et fichiers source affectent tous
les projets qui leur sont li&eacute;s. Soyez prudent lorsque vous supprimez de vos projets des ressources li&eacute;es : dans certains
cas, vous supprimez simplement la r&eacute;f&eacute;rence au lien ; dans d’autres, vous supprimez la source m&ecirc;me. Pour plus
d’informations, voir &laquo; Suppression de dossiers et de fichiers &raquo; &agrave; la page 63.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 65
Utilisation des projets
Remarque : il est recommand&eacute; de lier d’autres projets aux projets de biblioth&egrave;que. La liaison des ressources ne doit &ecirc;tre
utilis&eacute;e que pour des biblioth&egrave;ques tierces dot&eacute;es d’un fichier SWC.
Liaison &agrave; des ressources situ&eacute;es en dehors de l’espace de travail du projet
1 Dans l’Explorateur de packages, s&eacute;lectionnez le projet auquel vous souhaitez ajouter des ressources li&eacute;es.
2 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Dossier (ou Fichier).
3 S&eacute;lectionnez le projet ou le dossier du projet auquel vous souhaitez ajouter les ressources li&eacute;es.
4 Saisissez le nom du dossier ou du fichier. Il peut &ecirc;tre diff&eacute;rent du nom du dossier ou du fichier avec lequel vous
cr&eacute;ez un lien.
5 Cliquez sur le bouton Options avanc&eacute;es.
6 S&eacute;lectionnez Lier au dossier dans le syst&egrave;me de fichiers. Saisissez ou recherchez l’emplacement de la ressource.
7 Cliquez sur Terminer pour lier la ressource au projet.
Utilisation d’une variable de chemin &agrave; relier aux ressources
Vous pouvez &eacute;tablir des liens vers des ressources en d&eacute;finissant des variables de chemin. Vous &eacute;vitez ainsi de devoir
saisir le chemin complet d’un dossier local ou d’un dossier r&eacute;seau dans lequel vous enregistrez les fichiers. Pour plus
d’informations, voir &laquo; Cr&eacute;ation d’une variable de chemin &raquo; &agrave; la page 80.
1 Dans l’Explorateur de packages, s&eacute;lectionnez le projet auquel vous souhaitez ajouter des ressources li&eacute;es.
Les variables de chemin peuvent &eacute;galement intervenir dans certains param&egrave;tres de projet, tels que le chemin
d’acc&egrave;s &agrave; la biblioth&egrave;que et le chemin d’acc&egrave;s &agrave; la source.
2 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Dossier (ou Fichier, si vous voulez ajouter des fichiers).
3 S&eacute;lectionnez le projet ou le dossier du projet auquel vous souhaitez ajouter les ressources li&eacute;es.
4 Cliquez sur le bouton Options avanc&eacute;es.
5 S&eacute;lectionnez Lier au dossier dans le syst&egrave;me de fichiers. Cliquez sur le bouton Variables.
6 S&eacute;lectionnez une variable de chemin d&eacute;finie ou cliquez sur Nouveau pour cr&eacute;er une variable de chemin.
Si vous avez s&eacute;lectionn&eacute; une variable de chemin d&eacute;finie, passez &agrave; l’&eacute;tape 9. Si vous avez cliqu&eacute; sur Nouveau, la bo&icirc;te
de dialogue Nouvelle variable s’affiche.
7 Saisissez le nom de la variable de chemin et saisissez ou recherchez l’emplacement du fichier ou du dossier.
Cliquez sur OK pour cr&eacute;er la variable de chemin.
8 S&eacute;lectionnez la nouvelle variable de chemin dans la bo&icirc;te de dialogue S&eacute;lection d’une variable de chemin, puis
cliquez sur OK.
9 Cliquez sur Terminer pour terminer la cr&eacute;ation du lien vers la ressource.
Vous pouvez &eacute;galement d&eacute;finir et g&eacute;rer des variables de chemin dans les pr&eacute;f&eacute;rences du workbench de Flash Builder
(dans la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences, s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Espace de travail &gt; Ressources li&eacute;es).
Ajout de dossiers de ressources au chemin source du projet
Pour partager des ressources entre plusieurs projets, placez-les dans des dossiers qui pourront ensuite &ecirc;tre reli&eacute;s aux
diff&eacute;rents projets &agrave; l’aide du chemin d’acc&egrave;s source de ces derniers. Il s’agit de la meilleure m&eacute;thode de partage de
ressources, telles que les classes, les composants MXML et les images. Les mises &agrave; jour de ces ressources sont
imm&eacute;diatement disponibles pour tous les projets qui les utilisent. Lorsque les projets sont compil&eacute;s, les ressources
partag&eacute;es sont ajout&eacute;es au fichier SWC.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 66
Utilisation des projets
Ajout d’un dossier de ressources externes au chemin d’acc&egrave;s source
1 S&eacute;lectionnez un projet dans l’Explorateur de packages.
2 S&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Chemin de g&eacute;n&eacute;ration Flex (ou Chemin de g&eacute;n&eacute;ration ActionScript si vous
utilisez un projet ActionScript).
3 Sur la page des propri&eacute;t&eacute;s du chemin de g&eacute;n&eacute;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.
Le dossier est ajout&eacute; au chemin source.
L’onglet de propri&eacute;t&eacute;s Chemin source vous permet &eacute;galement de modifier, supprimer ou changer l’ordre des &eacute;l&eacute;ments
du chemin source.
Les dossiers qui sont ajout&eacute;s au chemin source sont signal&eacute;s dans l’Explorateur de packages.
Alternatives &agrave; l’utilisation de r&eacute;f&eacute;rences de projets
Les r&eacute;f&eacute;rences de projet pouvant avoir une incidence sur l’ordre de g&eacute;n&eacute;ration, Flash Builder propose une alternative
&agrave; leur utilisation.
Projets de biblioth&egrave;que Flex M&eacute;thode privili&eacute;gi&eacute;e de cr&eacute;ation d’une biblioth&egrave;que r&eacute;utilisable. Flash Builder cr&eacute;e une
r&eacute;f&eacute;rence de projet pour garantir que le projet SWC est g&eacute;n&eacute;r&eacute; avant le projet principal qui le contient sur le chemin
d’acc&egrave;s &agrave; la biblioth&egrave;que. En outre, puisque Flash Builder l’ajoute au chemin de la biblioth&egrave;que, des indicateurs de code
apparaissent dans le projet principal pour les classes du projet SWC.
Chemin source M&eacute;thode recommand&eacute;e pour inclure du code dans le projet ne se trouvant pas sous la m&ecirc;me structure
de dossier. Elle active les indicateurs de code dans les fichiers du projet et dans les classes situ&eacute;es dans des fichiers li&eacute;s.
Le compilateur sait o&ugrave; trouver le code source. Vous pouvez ajouter au projet un nombre quelconque de chemins
source. Ils s’affichent en tant que dossiers li&eacute;s dans l’Explorateur de packages.
Affichage des propri&eacute;t&eacute;s des ressources
Dans l’Explorateur de packages, vous pouvez s&eacute;lectionner une ressource et en afficher les propri&eacute;t&eacute;s.
1 Dans l’Explorateur de packages, s&eacute;lectionnez une ressource.
2 S&eacute;lectionnez Fichier &gt; Propri&eacute;t&eacute;s.
Projets ActionScript
Flash Builder vous permet de cr&eacute;er des projets ActionScript qui font appel &agrave; l’API Flash (et non &agrave; la structure Flex).
Les outils du workbench de Flash Builder et l’&eacute;diteur ActionScript s’associent ainsi pour former un environnement de
d&eacute;veloppement d’applications ActionScript, int&eacute;gr&eacute; et riche en fonctionnalit&eacute;s.
Les projets ActionScript ne poss&egrave;dent pas de repr&eacute;sentation visuelle dans Flash Builder. En d’autres termes, il n’existe
pas de mode Cr&eacute;ation pour les applications ActionScript. Vous affichez les applications ActionScript en les compilant
dans Flash Builder, puis en les ex&eacute;cutant dans Flash Player. Vous pouvez utiliser tous les outils de d&eacute;bogage.
Lorsque vous cr&eacute;ez un projet ActionScript ou un fichier ActionScript autonome destin&eacute; &agrave; contenir des fonctions, une
classe ou une interface, la perspective de d&eacute;veloppement Flex change pour prendre en charge l’&eacute;diteur ActionScript.
Les principales vues associ&eacute;es &agrave; l’&eacute;diteur ActionScript sont les vues Structure et Erreurs.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 67
Utilisation des projets
Cr&eacute;ation de projets ActionScript
Lorsque vous cr&eacute;ez un projet, l’assistant Nouveau projet ActionScript vous guide tout au long des diff&eacute;rentes &eacute;tapes et
vous demande de pr&eacute;ciser le type de projet &agrave; cr&eacute;er, le nom du projet, son emplacement, ainsi que d’autres options
avanc&eacute;es.
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet ActionScript.
2 Saisissez le nom du projet, puis sp&eacute;cifiez les &eacute;l&eacute;ments suivants.
Emplacement du projet L’emplacement par d&eacute;faut est l’espace de travail actuel. Sous Windows, l’emplacement de
l’espace de travail par d&eacute;faut est C:\Documents and Settings\D&eacute;veloppeur FlexAdobe Flash Builder\. Sous
Macintosh, l’emplacement de l’espace de travail par d&eacute;faut est /Users/D&eacute;veloppeur FlexAdobe Flash Builder/. Pour
choisir un emplacement de projet diff&eacute;rent, d&eacute;sactivez l’option Utiliser l’emplacement par d&eacute;faut.
Version SDK Flex Choisissez la version par d&eacute;faut ou sp&eacute;cifiez-en une. Vous pouvez aussi cliquer sur le lien
Configurer les SDK Flex pour ajouter, modifier ou supprimer des SDK en acc&eacute;dant &agrave; la page principale des
Pr&eacute;f&eacute;rences.
3 Cliquez sur Suivant pour d&eacute;finir les options avanc&eacute;es (sinon, cliquez sur Terminer).
Chemin source Pr&eacute;cise le chemin de liaison des ressources externes &agrave; l’application. En pr&eacute;sence d’un dossier de
classes partag&eacute;es ActionScript par exemple, vous pouvez cr&eacute;er un lien vers ce dossier en l’ajoutant au chemin
source.
Chemin d’acc&egrave;s &agrave; la biblioth&egrave;que Pr&eacute;cise le chemin d’acc&egrave;s de liaison des biblioth&egrave;ques de ressources externes
(fichiers SWC). Par d&eacute;faut, le chemin d’acc&egrave;s &agrave; la biblioth&egrave;que des nouveaux projets ActionScript contient les
fichiers playerglobal.swc et utilities.swc.
Dossier source principal Pr&eacute;cise, par d&eacute;faut, la racine du projet. Vous pouvez toutefois s&eacute;lectionner un dossier
diff&eacute;rent au sein du projet. Vous pouvez parcourir la structure des dossiers du projet et, le cas &eacute;ch&eacute;ant, cr&eacute;er un
dossier pour la source.
Fichier de l’application principale Pr&eacute;cise le nom du fichier ActionScript qui est le fichier de l’application
principale. Par d&eacute;faut, Flash Builder utilise le nom du projet comme nom de fichier de l’application principale.
Vous pouvez le modifier.
Dossier de sortie Pr&eacute;cise l’emplacement des fichiers de l’application compil&eacute;e. Par d&eacute;faut, il s’agit du dossier bin.
Vous pouvez en s&eacute;lectionner un autre.
URL du dossier de sortie Pr&eacute;cise l’emplacement du serveur des fichiers de l’application compil&eacute;e. Cette
information est facultative.
4 Une fois les param&egrave;tres du projet ActionScript saisis, cliquez sur Terminer.
Cr&eacute;ation d’une classe ActionScript
Vous pouvez faire appel &agrave; un assistant Flash Builder pour cr&eacute;er rapidement des classes ActionScript pour les projets
Flex et ActionScript. Cet assistant vous permet &eacute;galement de g&eacute;n&eacute;rer facilement des stubs pour des fonctions devant
&ecirc;tre impl&eacute;ment&eacute;es.
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Classe ActionScript.
2 Dans la bo&icirc;te de dialogue, sp&eacute;cifiez les propri&eacute;t&eacute;s de base de la nouvelle classe, puis cliquez sur Terminer.
Une fois que vous avez cliqu&eacute; sur Terminer, Flash Builder enregistre le fichier dans le package sp&eacute;cifi&eacute; et le rouvre
dans l’&eacute;diteur de code.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 68
Utilisation des projets
Si vous avez enregistr&eacute; le fichier dans le projet actif ou dans le chemin source correspondant, Flash Builder affiche
&eacute;galement le composant dans la vue Composants pour permettre son insertion rapide dans les applications. Pour
plus d’informations, voir &laquo; Ajout de composants en mode Cr&eacute;ation MXML &raquo; &agrave; la page 192.
3 R&eacute;digez la d&eacute;finition de la classe ActionScript.
Pour plus d’informations, voir Simple Visual Components in ActionScript.
Cr&eacute;ation d’une interface ActionScript
Vous pouvez faire appel &agrave; un assistant Flash Builder pour cr&eacute;er rapidement des interfaces ActionScript pour les projets
Flex et ActionScript. Une interface est un ensemble de constantes et de m&eacute;thodes que diff&eacute;rentes classes peuvent
partager.
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Interface ActionScript.
2 Sp&eacute;cifiez les propri&eacute;t&eacute;s de base de la nouvelle interface dans la bo&icirc;te de dialogue, puis cliquez sur Terminer.
3 Ajoutez &agrave; l’interface ActionScript les &eacute;ventuelles constantes ou m&eacute;thodes que les diff&eacute;rentes classes partagent.
G&eacute;n&eacute;ration des fonctions d’accesseur
Les fonctions des accesseurs Get et Set permettent de faire en sorte que les propri&eacute;t&eacute;s d’une classe restent priv&eacute;es pour
cette classe. Les utilisateurs peuvent acc&eacute;der &agrave; ces propri&eacute;t&eacute;s de la m&ecirc;me mani&egrave;re qu’ils acc&egrave;dent &agrave; une variable de
classe (au lieu d’appeler une m&eacute;thode de classe).
Flash Builder peut g&eacute;n&eacute;rer des fonctions d’accesseur Get et Set ActionScript pour les variables de classe. Lorsque vous
g&eacute;n&eacute;rez des accesseurs Get et Set, Flash Builder propose les options suivantes :
• Rendre la variable de classe priv&eacute;e.
En r&egrave;gle g&eacute;n&eacute;rale, les variables de classe ont un acc&egrave;s priv&eacute;.
• Renommer la variable de classe, en sugg&eacute;rant un trait de soulignement au d&eacute;but du nom.
Par convention, les variables de classe priv&eacute;e ont un trait de soulignement au d&eacute;but du nom.
• Renommer les fonctions d’accesseur.
• Pr&eacute;ciser si vous voulez g&eacute;n&eacute;rer des fonctions d’accesseur Get et Set.
• Sp&eacute;cifier le placement de la fonction d’accesseur dans l’un des emplacements suivants :
• Avant la premi&egrave;re m&eacute;thode
• Apr&egrave;s la derni&egrave;re m&eacute;thode
• Avant les d&eacute;clarations de variable
• Afficher un aper&ccedil;u du code qui sera g&eacute;n&eacute;r&eacute;.
G&eacute;n&eacute;ration de fonctions d’accesseur Get ou Set
1 Ouvrez un fichier ActionScript dans l’&eacute;diteur de source, puis placez le curseur sur une variable de classe.
2 S&eacute;lectionnez Source &gt; G&eacute;n&eacute;rer les m&eacute;thodes Get/Set dans le menu Flash Builder ou le menu contextuel.
3 Dans la bo&icirc;te de dialogue G&eacute;n&eacute;rer les m&eacute;thodes Get/Set, sp&eacute;cifiez les informations concernant les fonctions
d’accesseur puis cliquez sur OK.
Remarque : pour afficher le code qui sera g&eacute;n&eacute;r&eacute;, s&eacute;lectionnez Aper&ccedil;u avant de cliquer sur OK.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 69
Utilisation des projets
Projets de biblioth&egrave;que
Les projets de biblioth&egrave;que vous permettent de cr&eacute;er des biblioth&egrave;ques de code personnalis&eacute; que vous pouvez partager
entre vos applications ou distribuer &agrave; d’autres d&eacute;veloppeurs. Un projet de biblioth&egrave;que g&eacute;n&egrave;re un fichier SWC, c’est&agrave;-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&eacute;ez un projet Flex, les fichiers SWC de la structure Flex sont
ajout&eacute;s au chemin de la biblioth&egrave;que du projet. Vous pouvez afficher et modifier le chemin de la biblioth&egrave;que dans la
page de propri&eacute;t&eacute;s du chemin de g&eacute;n&eacute;ration du projet (pour les projets Flex, s&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Chemin
de g&eacute;n&eacute;ration Flex).
Un fichier SWF est archiv&eacute; dans un fichier SWC contenant des composants, des ressources et un fichier catalog.xml,
fichier manifeste des &eacute;l&eacute;ments contenus dans le fichier SWF. Le fichier SWF contient g&eacute;n&eacute;ralement un ou plusieurs
composants et toute autre ressource requise. L’ajout de la biblioth&egrave;que &agrave; un projet vous permet d’utiliser ces
composants et en active les indicateurs de code.
Les biblioth&egrave;ques SWC constituent une m&eacute;thode pratique d’assemblage et de distribution des composants, mais
servent &eacute;galement de th&egrave;mes, l’aspect visuel des applications Flex. Un fichier de th&egrave;me SWC contient un fichier CSS
ainsi que toutes les ressources graphiques associ&eacute;es. Pour plus d’informations sur la cr&eacute;ation et l’utilisation des th&egrave;mes,
voir About themes.
Les biblioth&egrave;ques sont utiles si vous cr&eacute;ez des composants int&eacute;gralement dans ActionScript et que vous les utilisez en
mode Cr&eacute;ation dans Flash Builder. Les composants ActionScript ne sont pas rendus visuellement en mode Cr&eacute;ation
tant qu’ils ne sont pas compil&eacute;s dans un fichier SWF. En ajoutant des composants ActionScript dans un projet de
biblioth&egrave;que, vous cr&eacute;ez un fichier SWF qui est contenu dans un fichier SWC. Vous pouvez ajouter la biblioth&egrave;que &agrave;
un chemin d’acc&egrave;s &agrave; la biblioth&egrave;que d’un projet et les composants ActionScript sont rendus visuellement en mode
Cr&eacute;ation lorsque vous les ajoutez &agrave; l’application.
Configuration de biblioth&egrave;ques pour vos applications
Vous pouvez utiliser les biblioth&egrave;ques SWC dans vos projets des fa&ccedil;ons suivantes.
Fusionn&eacute;es dans l’application Lorsque vous ajoutez un fichier SWC au chemin d’acc&egrave;s &agrave; la biblioth&egrave;que du projet, les
composants contenus dans la biblioth&egrave;que sont disponibles pour &ecirc;tre utilis&eacute;s dans l’application. Lorsque vous g&eacute;n&eacute;rez
l’application, seuls les composants de biblioth&egrave;que que vous avez utilis&eacute;s dans les faits sont compil&eacute;s dans le fichier
SWF de l’application. En d’autres termes, tout le code de votre application est fusionn&eacute; dans un seul fichier SWF. C’est
la fa&ccedil;on la plus courante et la plus simple d’utiliser les composants de biblioth&egrave;ques.
Externes &agrave; l’application Vous pouvez conserver les composants de biblioth&egrave;que s&eacute;par&eacute;ment du fichier SWF compil&eacute;
pour qu’ils ne soient pas fusionn&eacute;s dans le fichier. Le compilateur r&eacute;sout tout le code contenu dans la biblioth&egrave;que
utilis&eacute; par l’application, mais ne le fusionne pas dans le fichier SWF de l’application. L’avantage de cette m&eacute;thode est
de r&eacute;duire la taille du fichier SWF de l’application. Les composants contenus dans le fichier SWC sont extraits et
charg&eacute;s dans la m&eacute;moire selon les besoins, au moment de l’ex&eacute;cution.
Biblioth&egrave;que partag&eacute;e &agrave; l’ex&eacute;cution Dans les projets Flex uniquement, vous pouvez &eacute;galement utiliser des fichiers
SWC en tant que biblioth&egrave;que partag&eacute;e &agrave; l’ex&eacute;cution (Runtime Shared Library, RSL), qui s’apparente &agrave; une
biblioth&egrave;que &agrave; liaison dynamique sur d’autres plateformes. Vous pouvez utiliser des fichiers SWC en tant que
biblioth&egrave;que RSL si vous disposez d’un ensemble de composants qui sont utilis&eacute;s par plusieurs applications.
Le partage de composants entre applications &agrave; l’aide de ce type de biblioth&egrave;que pr&eacute;sente plusieurs avantages. Dans un
premier temps, la biblioth&egrave;que est charg&eacute;e en m&eacute;moire une fois, plac&eacute;e dans le cache, puis mise &agrave; disposition de toutes
les applications faisant appel &agrave; ces composants. Dans un second temps, les composants se trouvant dans la biblioth&egrave;que
sont charg&eacute;s uniquement selon les besoins, ce qui r&eacute;duit le temps de d&eacute;marrage de l’application, car la taille de
l’application est moindre. Le probl&egrave;me potentiel de cette m&eacute;thode est que la biblioth&egrave;que partag&eacute;e &agrave; l’ex&eacute;cution est
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 70
Utilisation des projets
charg&eacute;e en m&eacute;moire dans son int&eacute;gralit&eacute;, plut&ocirc;t que les composants individuels que les applications utilisent. Pour
plus d’informations sur l’utilisation des fichiers SWC en tant que RSL, voir Using Runtime Shared Libraries.
Cr&eacute;ation de projets de biblioth&egrave;que Flex
Lorsque vous cr&eacute;ez un projet de biblioth&egrave;que, l’assistant Nouveau projet de biblioth&egrave;que Flex vous guide &agrave; travers les
diff&eacute;rentes &eacute;tapes et vous demande d’indiquer le nom du projet, son emplacement, ainsi que le chemin de g&eacute;n&eacute;ration.
Une fois le projet de biblioth&egrave;que cr&eacute;&eacute;, vous ajoutez des composants, sp&eacute;cifiez les &eacute;l&eacute;ments du projet de biblioth&egrave;que
&agrave; inclure dans le fichier SWC, puis g&eacute;n&eacute;rez le projet afin de cr&eacute;er le fichier SWC. La premi&egrave;re &eacute;tape de la cr&eacute;ation d’un
fichier SWC dans Flash Builder est la cr&eacute;ation d’une projet de biblioth&egrave;que Flex.
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet de biblioth&egrave;que Flex.
2 Saisissez un nom de projet, puis pr&eacute;cisez les &eacute;l&eacute;ments suivants.
Emplacement du projet L’emplacement par d&eacute;faut est l’espace de travail actuel. Sous Windows, l’emplacement de
l’espace de travail par d&eacute;faut est C:\Documents and Settings\D&eacute;veloppeur FlexAdobe Flash Builder\. Sous
Macintosh, l’emplacement de l’espace de travail par d&eacute;faut est /Users/D&eacute;veloppeur FlexAdobe Flash Builder/. Pour
choisir un emplacement de projet diff&eacute;rent, d&eacute;sactivez l’option Utiliser l’emplacement par d&eacute;faut.
Version SDK Flex Choisissez la version par d&eacute;faut ou sp&eacute;cifiez-en une. Vous pouvez aussi cliquer sur le lien
Configurer les SDK Flex pour ajouter, modifier ou supprimer des SDK sur la page principale Pr&eacute;f&eacute;rences.
Inclure les biblioth&egrave;ques Adobe AIR S&eacute;lectionnez cette option si votre biblioth&egrave;que doit utiliser des fonctions AIR,
telles que l’acc&egrave;s aux API AIR. Flash Builder change alors le chemin d’acc&egrave;s &agrave; la biblioth&egrave;que de ce nouveau projet
de biblioth&egrave;que Flex de mani&egrave;re qu’il contienne les fichiers airglobal.swc et airframework.swc. Les projets Web Flex
ne peuvent pas utiliser cette biblioth&egrave;que.
Ne s&eacute;lectionnez pas cette option si vous cr&eacute;ez une biblioth&egrave;que g&eacute;n&eacute;rique destin&eacute;e &agrave; une utilisation exclusive dans
une application Web Flex, ou dans une application Web ou AIR.
3 Cliquez sur Suivant.
4 (Facultatif) D&eacute;finissez les informations concernant le chemin de g&eacute;n&eacute;ration. Vous pouvez, par exemple, ajouter des
dossiers au chemin source du projet qui contient les composants &agrave; inclure dans le fichier SWC. Vous pouvez
&eacute;galement ajouter d’autres projets, dossiers ou fichiers SWC de biblioth&egrave;que &agrave; inclure dans votre projet de
biblioth&egrave;que. Voir &laquo; Utilisation des fichiers SWC dans le cadre des projets &raquo; &agrave; la page 71.
5 Une fois les param&egrave;tres du projet saisis, cliquez sur Terminer.
Ajout de composants &agrave; un projet de biblioth&egrave;que
Il existe plusieurs fa&ccedil;ons d’ajouter des composants &agrave; un projet de biblioth&egrave;que :
• Vous pouvez ajouter des composants, nouveaux ou existants personnalis&eacute;s, des classes ActionScript et d’autres
ressources au projet.
• Vous pouvez cr&eacute;er des liens avec des composants existant dans d’autres projets de l’espace de travail (voir &laquo; Liaison
&agrave; des ressources situ&eacute;es en dehors de l’espace de travail du projet &raquo; &agrave; la page 64).
• Vous pouvez ajouter un dossier li&eacute; qui contient des composants au chemin source du projet de biblioth&egrave;que (voir
&laquo; Ajout de dossiers de ressources au chemin source du projet &raquo; &agrave; la page 65).
Remarque : tous les composants que vous incluez dans le projet de biblioth&egrave;que doivent &ecirc;tre associ&eacute;s au projet de
biblioth&egrave;que (directement ou en tant que ressources li&eacute;es).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 71
Utilisation des projets
S&eacute;lection d’&eacute;l&eacute;ments du projet de biblioth&egrave;que &agrave; inclure dans le fichier SWC
L’&eacute;tape suivante de la cr&eacute;ation d’un fichier SWC de biblioth&egrave;que est la s&eacute;lection des &eacute;l&eacute;ments (composants et
ressources) &agrave; inclure dans le fichier SWC lors de sa cr&eacute;ation par le compilateur.
1 S&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Chemin de g&eacute;n&eacute;ration de biblioth&egrave;que Flex.
Les composants que vous avez ajout&eacute;s au projet (soit directement soit en les reliant) s’affichent dans l’onglet Classes.
2 S&eacute;lectionnez les classes de composants &agrave; inclure dans le fichier SWC.
3 (Facultatif) Sous l’onglet Ressources, s&eacute;lectionnez les ressources &agrave; inclure dans le fichier SWC.
4 Une fois que vous avez effectu&eacute; vos s&eacute;lections, cliquez sur OK.
Cr&eacute;ation de projets de biblioth&egrave;que
Une fois que vous avez s&eacute;lectionn&eacute; les &eacute;l&eacute;ments &agrave; inclure dans le fichier SWC et si vous avez s&eacute;lectionn&eacute; l’option de
g&eacute;n&eacute;ration automatique, le fichier SWC est compil&eacute; imm&eacute;diatement et g&eacute;n&eacute;r&eacute; dans le dossier de sortie du projet. Si
vous g&eacute;n&eacute;rez vos projets manuellement, vous pouvez cr&eacute;er le projet de biblioth&egrave;que quand vous le souhaitez en
s&eacute;lectionnant Projet &gt; G&eacute;n&eacute;rer le projet ou G&eacute;n&eacute;rer tout.
La cr&eacute;ation du projet de biblioth&egrave;que g&eacute;n&egrave;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&acirc;ce &agrave; 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&eacute;t&eacute;s
et autre ressources incorpor&eacute;es.
Vous pouvez exporter la biblioth&egrave;que sous la forme d’un r&eacute;pertoire ouvert plut&ocirc;t qu’en tant que fichier SWC. Vous
exportez g&eacute;n&eacute;ralement une biblioth&egrave;que en tant que r&eacute;pertoire ouvert si vous pr&eacute;voyez de faire appel au fichier
library.swf dans le fichier SWC en tant que biblioth&egrave;que RSL.
Pour ce faire, vous devez d&eacute;finir les options directory et output du compilateur. D&eacute;finissez l’option output comme
le nom du r&eacute;pertoire &agrave; cr&eacute;er et l’option directory sur true pour indiquer que vous voulez ouvrir le r&eacute;pertoire et non
un fichier SWC lorsque vous g&eacute;n&eacute;rez la biblioth&egrave;que. Pour modifier les options du compilateur, s&eacute;lectionnez Projet &gt;
Propri&eacute;t&eacute;s &gt; Compilateur de biblioth&egrave;que Flex et ajoutez les options au champ Arguments de compilateur
suppl&eacute;mentaires, par exemple :
-directory=true -output=myOpenDir
Flash Builder cr&eacute;e un r&eacute;pertoire dans le projet nomm&eacute; myOpenDir et y enregistre le contenu du fichier SWC.
Utilisation des fichiers SWC dans le cadre des projets
Pour pouvoir utiliser des fichiers SWC dans vos projets Flex, vous devez les ajouter au chemin d’acc&egrave;s &agrave; la biblioth&egrave;que
du projet. Les fichiers SWC peuvent se trouver dans le projet, dans un projet de biblioth&egrave;que Flex, dans un dossier
partag&eacute; dans l’espace de travail ou dans tout autre emplacement li&eacute; au projet (en utilisant un dossier partag&eacute; qui a &eacute;t&eacute;
ajout&eacute; au chemin source du projet, par exemple).
Lorsque vous utilisez des fichiers SWC dans des applications, certaines options de configuration d&eacute;terminent s’ils sont
li&eacute;s de mani&egrave;re statique ou dynamique &agrave; l’application, s’ils sont fusionn&eacute;s dans le fichier SWF de l’application ou s’ils
sont externes et si leur acc&egrave;s se fait s&eacute;par&eacute;ment au moment de l’ex&eacute;cution.
Ajout d’un fichier SWC au chemin d’acc&egrave;s &agrave; la biblioth&egrave;que
1 S&eacute;lectionnez un projet dans l’Explorateur de packages, puis cliquez sur Projet &gt; Propri&eacute;t&eacute;s &gt; Chemin de g&eacute;n&eacute;ration
Flex.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 72
Utilisation des projets
2 Cliquez sur l’onglet Chemin d’acc&egrave;s &agrave; la biblioth&egrave;que.
3 S&eacute;lectionnez l’une des options suivantes pour ajouter des fichiers SWC.
Ajouter un projet Ajoute un projet de biblioth&egrave;que Flex.
Ajouter un dossier SWC Permet d’ajouter un dossier contenant des fichiers SWC.
Ajouter un fichier SWC Ajoute un fichier SWC compil&eacute;.
Ajouter un SDK Flex Permet d’ajouter d’autres SDK Flex. Ce bouton est d&eacute;sactiv&eacute; si le chemin d’acc&egrave;s &agrave; la
biblioth&egrave;que du projet contient d&eacute;j&agrave; un SDK Flex. Si vous supprimez le SDK Flex existant du chemin d’acc&egrave;s &agrave; la
biblioth&egrave;que, le bouton est activ&eacute;. Lorsque vous cliquez sur ce bouton, un nœud SDK Flex est ajout&eacute;, mais aucune
invite ne pr&eacute;cise lequel. Pour pr&eacute;ciser quel SDK Flex utiliser, s&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Compilateur Flex.
4 Saisissez ou recherchez l’emplacement du ficher SWC, du projet ou du dossier, puis s&eacute;lectionnez-le. Cliquez sur OK.
Le fichier SWC, projet de biblioth&egrave;que ou dossier est ajout&eacute; au chemin d’acc&egrave;s &agrave; la biblioth&egrave;que.
Fusion du fichier SWC dans le fichier SWF de l’application au moment de la compilation
1 S&eacute;lectionnez un projet dans l’Explorateur de packages, puis cliquez sur Projet &gt; Propri&eacute;t&eacute;s &gt; Chemin de g&eacute;n&eacute;ration
Flex.
2 Sous l’onglet Chemin d’acc&egrave;s &agrave; la biblioth&egrave;que, s&eacute;lectionnez et d&eacute;veloppez l’entr&eacute;e du fichier SWC pour en afficher
les options.
3 Double-cliquez sur l’option Type de lien. La bo&icirc;te de dialogue Options de l’&eacute;l&eacute;ment de chemin d’acc&egrave;s &agrave; la
biblioth&egrave;que appara&icirc;t.
4 S&eacute;lectionnez l’option Fusionn&eacute; dans le code, puis cliquez sur OK.
Cette proc&eacute;dure &eacute;quivaut &agrave; utiliser l’option library-path du compilateur.
D&eacute;finition du fichier SWC en tant que fichier de biblioth&egrave;que externe
1 S&eacute;lectionnez un projet dans l’Explorateur de packages, puis cliquez sur Projet &gt; Propri&eacute;t&eacute;s &gt; Chemin de g&eacute;n&eacute;ration
Flex.
2 Sous l’onglet Chemin d’acc&egrave;s &agrave; la biblioth&egrave;que, s&eacute;lectionnez et d&eacute;veloppez l’entr&eacute;e du fichier SWC pour en afficher
les options.
3 Double-cliquez sur l’option Type de lien. La bo&icirc;te de dialogue Options de l’&eacute;l&eacute;ment de chemin d’acc&egrave;s &agrave; la
biblioth&egrave;que appara&icirc;t.
4 S&eacute;lectionnez l’option Externe, puis cliquez sur OK.
Cette proc&eacute;dure &eacute;quivaut &agrave; utiliser l’option external-library-path du compilateur.
Utilisation du fichier SWC en tant que biblioth&egrave;que RSL
1 S&eacute;lectionnez un projet dans l’Explorateur de packages, puis cliquez sur Projet &gt; Propri&eacute;t&eacute;s &gt; Chemin de g&eacute;n&eacute;ration
Flex.
2 Sous l’onglet Chemin d’acc&egrave;s &agrave; la biblioth&egrave;que, s&eacute;lectionnez et d&eacute;veloppez l’entr&eacute;e du fichier SWC pour en afficher
les options.
3 Double-cliquez sur l’option Type de lien. La bo&icirc;te de dialogue Options de l’&eacute;l&eacute;ment de chemin d’acc&egrave;s &agrave; la
biblioth&egrave;que appara&icirc;t.
4 S&eacute;lectionnez l’option Biblioth&egrave;que RSL (Runtime Shared Library).
5 Entrez l’URL o&ugrave; la biblioth&egrave;que SWC doit r&eacute;sider lors du d&eacute;ploiement de l’application.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 73
Utilisation des projets
6 (Facultatif) Pour extraire le fichier SWF dans le fichier SWC lorsqu’il se trouve dans l’emplacement de d&eacute;ploiement,
s&eacute;lectionnez l’option Extraire automatiquement le fichier SWF dans le chemin de d&eacute;ploiement.
7 Cliquez sur OK.
L’utilisation des fichiers SWC en tant que biblioth&egrave;que RSL simplifie le processus d’utilisation manuelle de
biblioth&egrave;ques RSL. Pour ce faire, extrayez le fichier SWF du fichier SWC et d&eacute;finissez les valeurs de l’option runtimeshared-library-path du compilateur.
Pour plus d’informations sur l’utilisation des fichiers SWC en tant que biblioth&egrave;que RSL, voir Using Runtime Shared
Libraries dans Utilisation d’Adobe Flex 4.
G&eacute;n&eacute;ration de projets
Adobe&reg; Flash&reg; Builder™ g&eacute;n&egrave;re et exporte automatiquement les projets vers des applications. Cette op&eacute;ration comporte
la cr&eacute;ation de fichiers d’application et de biblioth&egrave;que, le placement des fichiers de sortie dans les emplacements
appropri&eacute;s et la signalisation de toute erreur survenue en cours de compilation.
Diff&eacute;rentes options permettent d’ajuster les param&egrave;tres de g&eacute;n&eacute;ration. Vous pouvez ainsi d&eacute;terminer la mani&egrave;re dont
les projets sont int&eacute;gr&eacute;s aux applications. Vous pouvez par exemple d&eacute;finir des pr&eacute;f&eacute;rences pour la g&eacute;n&eacute;ration de
projets individuels ou pour l’ensemble des projets de l’espace de travail, modifier le chemin de sortie ou l’ordre de
g&eacute;n&eacute;ration et ainsi de suite. Vous pouvez en outre cr&eacute;er des instructions de g&eacute;n&eacute;ration personnalis&eacute;es &agrave; l’aide d’outils
tiers tels qu’Apache Ant.
Lorsque les applications sont pr&ecirc;tes &agrave; &ecirc;tre publi&eacute;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 &ecirc;tre visualis&eacute; dans un navigateur Web.
Pr&eacute;sentation de la g&eacute;n&eacute;ration et de l’exportation des projets
Un d&eacute;roulement de travail se compose de la g&eacute;n&eacute;ration de projets Flex et ActionScript, l’option G&eacute;n&eacute;rer
automatiquement &eacute;tant activ&eacute;e. Au cours du d&eacute;veloppement, Flash Builder affiche les erreurs et les avertissements
dans la vue Erreurs. A l’ex&eacute;cution de l’application, une version de d&eacute;bogage du fichier SWF est plac&eacute;e dans le dossier
de sortie (bin) du projet avec les ressources requises et une enveloppe HTML. Cette g&eacute;n&eacute;ration contient des
informations de d&eacute;bogage et n’est destin&eacute;e qu’&agrave; l’usage des d&eacute;veloppeurs. Pour plus d’informations sur l’exportation
de projets, voir &laquo; Exportation et importation de projets &raquo; &agrave; la page 53.
Une fois l’application pr&ecirc;te &agrave; &ecirc;tre d&eacute;ploy&eacute;e, l’assistant Exporter vers une version valid&eacute;e vous permet de cr&eacute;er une
version optimis&eacute;e de qualit&eacute; finale de l’application. Cette op&eacute;ration enregistre le fichier SWF dans le dossier binrelease. Les informations de d&eacute;bogage &eacute;tant supprim&eacute;es, la taille du fichier diminue. S’agissant d’une version de
production, elle peut &ecirc;tre visionn&eacute;e par les utilisateurs finaux. Pour les projets Adobe AIR, les applications AIR sont
export&eacute;es dans un fichier AIR. La fonction Exporter vers une version valid&eacute;e permet de cr&eacute;er un fichier AIR sign&eacute;
num&eacute;riquement que les utilisateurs doivent installer avant d’ex&eacute;cuter une application (&agrave; l’instar d’un fichier
install.exe).
Les projets Adobe LiveCycle Data Services ES peuvent en revanche &ecirc;tre compil&eacute;s sur le serveur en y acc&eacute;dant. Pour
plus d’informations, voir &laquo; Gestion des projets &raquo; &agrave; la page 49.
Aucune exportation n’est requise pour les projets de biblioth&egrave;que. Le fichier SWC cr&eacute;&eacute; par un projet de biblioth&egrave;que
Flex se pr&ecirc;te &agrave; la fois au d&eacute;veloppement et &agrave; la production. Pour plus d’informations, voir &laquo; Projets de biblioth&egrave;que &raquo;
&agrave; la page 69.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 74
Utilisation des projets
Notions de base sur la g&eacute;n&eacute;ration
MXML et ActionScript 3.0 sont des langages compil&eacute;s. Contrairement aux langages interpr&eacute;t&eacute;s (JavaScript, par
exemple) imm&eacute;diatement ex&eacute;cutables par leurs environnements d’ex&eacute;cution, MXML et ActionScript 3.0 doivent &ecirc;tre
convertis dans un format compil&eacute; avant de pouvoir &ecirc;tre ex&eacute;cut&eacute;s dans Flash Player. Ce processus, ainsi que la cr&eacute;ation
des fichiers de sortie correspondants, est d&eacute;sign&eacute; par le terme de g&eacute;n&eacute;ration.
Flash Builder g&eacute;n&egrave;re automatiquement un projet &agrave; chaque modification ou enregistrement de l’un de ses fichiers. La
possibilit&eacute; de g&eacute;n&eacute;rer des applications manuellement ne signifie pas qu’il est n&eacute;cessaire d’y recourir. Toutefois, la
compr&eacute;hension du processus de g&eacute;n&eacute;ration et des fichiers de sortie cr&eacute;&eacute;s facilitera le diagnostic et la r&eacute;solution des
&eacute;ventuels probl&egrave;mes de configuration du projet.
Projets Flex Les fichiers source et les ressources int&eacute;gr&eacute;es (les images, par exemple) sont compil&eacute;s dans un seul et
unique format de sortie d&eacute;sign&eacute; par SWF. Les fichiers ayant ce format peuvent &ecirc;tre ex&eacute;cut&eacute;s directement dans
l’application Flash Player autonome ou dans un navigateur Web par le biais d’un fichier d’enveloppe HTML, &eacute;galement
cr&eacute;&eacute; par la g&eacute;n&eacute;ration. Ces fichiers sont cr&eacute;&eacute;s dans le dossier de sortie du projet (ce dossier, nomm&eacute; par d&eacute;faut &laquo; bin &raquo;,
peut &ecirc;tre renomm&eacute;).
Projets LiveCycle Data Services ES LiveCycle Data Services ES offre la possibilit&eacute; de cr&eacute;er des projets qui seront
compil&eacute;s sur le serveur. Le fichier d’application MXML, auquel il est acc&eacute;d&eacute; pour la premi&egrave;re fois (par l’interm&eacute;diaire
d’un navigateur Web), est compil&eacute; dans un fichier SWF.
Remarque : les projets LiveCycle Data Services ES peuvent &ecirc;tre d&eacute;finis de mani&egrave;re telle &agrave; &ecirc;tre compil&eacute;s sur le serveur.
Flash Builder les compile n&eacute;anmoins au fur et &agrave; mesure du d&eacute;veloppement de vos applications, afin de permettre au
compilateur de valider la syntaxe du code et d’afficher les messages d’erreur. Ces projets ne disposent pas d’option de
dossier de sortie et Flash Builder ne g&eacute;n&egrave;re aucun fichier de sortie.
Projets ActionScript 3.0 A l’instar des projets Flex, les projets ActionScript 3.0 compilent les fichiers source et les
ressources int&eacute;gr&eacute;es dans un fichier SWF.
Projets de biblioth&egrave;que Flex Pour les projets de biblioth&egrave;que, les fichiers source sont des composants et des ressources
apparent&eacute;es. Lors de la g&eacute;n&eacute;ration de projets de biblioth&egrave;que, un fichier SWC est cr&eacute;&eacute; dans le dossier de sortie. Un
fichier SWF est archiv&eacute; dans un fichier SWC contenant des composants, des ressources et le fichier catalog.xml, fichier
manifeste des &eacute;l&eacute;ments contenus dans le fichier SWF.
G&eacute;n&eacute;rations automatiques
En configuration autonome, Flash Builder g&eacute;n&egrave;re vos applications automatiquement. En configuration plug-in, vous
devez s&eacute;lectionner l’option G&eacute;n&eacute;rer automatiquement. Malgr&eacute; la possibilit&eacute;, d&eacute;crite ci-dessus, de g&eacute;n&eacute;rer des
applications manuellement, il ne devrait pas &ecirc;tre n&eacute;cessaire d’y recourir. La d&eacute;sactivation de la g&eacute;n&eacute;ration automatique
emp&ecirc;che en outre le compilateur de d&eacute;tecter les erreurs de syntaxe et d’afficher les avertissements et les messages
d’erreur au fur et &agrave; mesure de la saisie du code. La vue Erreurs ne vous fournira donc aucune information jusqu’&agrave;
l’ach&egrave;vement de la compilation du projet. Il est donc conseill&eacute; d’activer le mode de g&eacute;n&eacute;ration automatique de Flash
Builder.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 75
Utilisation des projets
Options avanc&eacute;es pour la g&eacute;n&eacute;ration de projets
Les options avanc&eacute;es permettent de d&eacute;finir la dur&eacute;e et l’&eacute;tendue des g&eacute;n&eacute;rations. Vous pouvez par exemple g&eacute;n&eacute;rer un
seul projet ou un ensemble de projets dans l’espace de travail ou encore d&eacute;finir un jeu de documents (une collection)
de projets &agrave; g&eacute;n&eacute;rer. Toutes les commandes de g&eacute;n&eacute;ration se situent dans le menu Projet, ainsi que l’illustre l’exemple
suivant. Pour plus d’informations, voir &laquo; Options de g&eacute;n&eacute;ration avanc&eacute;es &raquo; &agrave; la page 81.
Le compilateur Flash Builder est incr&eacute;mentiel. Il ne g&eacute;n&egrave;re que les ressources qui ont &eacute;t&eacute; ajout&eacute;es ou concern&eacute;es par
une mise &agrave; jour et ignore toutes les autres, ce qui se traduit par un gain de temps et une utilisation parcimonieuse des
ressources du syst&egrave;me. Vous disposez toutefois de la possibilit&eacute; de reg&eacute;n&eacute;rer l’ensemble des ressources du projet en
proc&eacute;dant &agrave; une g&eacute;n&eacute;ration nettoy&eacute;e. Ce type de g&eacute;n&eacute;ration est indiqu&eacute; lorsque l’application pr&eacute;sente un
comportement impr&eacute;visible au cours des tests effectu&eacute;s. Vous pouvez dans ce cas &eacute;liminer toute source potentielle de
probl&egrave;mes en ignorant et reg&eacute;n&eacute;rant tous les fichiers du projet. Pour plus d’informations, voir &laquo; Options de g&eacute;n&eacute;ration
avanc&eacute;es &raquo; &agrave; la page 81.
En pr&eacute;sence de d&eacute;pendances entre des projets distincts de l’espace de travail, le compilateur d&eacute;termine
automatiquement l’ordre dans lequel les projets ont &eacute;t&eacute; g&eacute;n&eacute;r&eacute;s afin de r&eacute;soudre correctement les d&eacute;pendances. Vous
pouvez toutefois remplacer l’ordre de g&eacute;n&eacute;ration par d&eacute;faut en d&eacute;finissant manuellement l’ordre dans lequel les projets
de l’espace de travail sont g&eacute;n&eacute;r&eacute;s. Pour plus d’informations, voir &laquo; G&eacute;n&eacute;ration manuelle de projets &raquo; &agrave; la page 81.
Vous pouvez en outre modifier le chemin d’acc&egrave;s &agrave; la g&eacute;n&eacute;ration, la liste des applications et les param&egrave;tres du
compilateur pour chaque projet de l’espace de travail. Pour plus d’informations, voir &laquo; G&eacute;n&eacute;ration manuelle de
projets &raquo; &agrave; la page 81, &laquo; Gestion des fichiers d’application du projet &raquo; &agrave; la page 52 et &laquo; Options de g&eacute;n&eacute;ration avanc&eacute;es &raquo;
&agrave; la page 81.
Affichage des erreurs de g&eacute;n&eacute;ration dans la vue Erreurs
Les erreurs d&eacute;tect&eacute;es par le compilateur au cours de la g&eacute;n&eacute;ration s’affichent dans la vue Erreurs des perspectives
D&eacute;veloppement et D&eacute;bogage, ainsi que dans l’&eacute;diteur de code, dans lequel les lignes contenant des erreurs sont
signal&eacute;es par un x, comme l’illustre l’exemple suivant.
Pour plus d’informations sur l’utilisation de la vue Erreurs, voir &laquo; Utilisation de la vue Erreurs &raquo; &agrave; la page 125.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 76
Utilisation des projets
Erreurs d’environnement Eclipse dans le fichier journal
Des erreurs g&eacute;n&eacute;r&eacute;es par l’environnement Eclipse sont susceptibles de se produire. Elles surviennent g&eacute;n&eacute;ralement
lorsque des ressources (des fichiers SWC, par exemple) ne sont pas trouv&eacute;es &agrave; l’ex&eacute;cution. Dans ce cas, les messages
d’erreur apparaissent dans le fichier journal des erreurs Eclipse. L’emplacement par d&eacute;faut de ce fichier journal sous
Windows est le suivant : \Documents and Settings\nom_utilisateur\workspace\.metadata\.log. Sous Mac,
l’emplacement par d&eacute;faut se trouve &eacute;galement dans le r&eacute;pertoire de l’espace de travail. Les fichiers et dossiers
commen&ccedil;ant par un point y sont toutefois masqu&eacute;s par d&eacute;faut.
Personnalisation des scripts de g&eacute;n&eacute;ration avec Apache Ant
Vous pouvez modifier et &eacute;tendre le processus de g&eacute;n&eacute;ration standard en faisant appel &agrave; Apache Ant, outil de
g&eacute;n&eacute;ration Java &agrave; code source libre. Pour plus d’informations sur la cr&eacute;ation de g&eacute;n&eacute;rateurs personnalis&eacute;s, voir
&laquo; Personnalisation des g&eacute;n&eacute;rations avec Apache Ant &raquo; &agrave; la page 83.
Options du compilateur Flex
Vous pouvez modifier les param&egrave;tres par d&eacute;faut du compilateur Flex utilis&eacute; par Flash Builder. Pour afficher les
param&egrave;tres par d&eacute;faut et en modifier les valeurs, ouvrez la page des propri&eacute;t&eacute;s du compilateur Flex. Dans le menu Flash
Builder, s&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Compilateur Flex.
Version SDK Flex
Le SDK par d&eacute;faut pour Flash Builder 4 est Flex 4.0. Cependant, si votre projet utilise une version sp&eacute;cifique, telle que
Flex 3.4, Flash Builder compile les applications du projet &agrave; l’aide du SDK Flex sp&eacute;cifi&eacute;.
Vous pouvez d&eacute;finir comme param&egrave;tre par d&eacute;faut un SDK Flex sp&eacute;cifique ou vous pouvez d&eacute;finir que la compilation
soit effectu&eacute;e en utilisant la compatibilit&eacute; avec Flex 3. La sp&eacute;cification de la compatibilit&eacute; ascendante affecte certains
comportements, tels que les r&egrave;gles de pr&eacute;sentation, les marges int&eacute;rieures et les espaces, les habillages ainsi que d’autres
param&egrave;tres de style. Elle a &eacute;galement une incidence sur les r&egrave;gles d’analyse des fichiers de propri&eacute;t&eacute;s. La d&eacute;finition de
la version de compatibilit&eacute; n’applique pas toutes les diff&eacute;rences existant entre les versions.
Pour plus d’informations, voir Backward compatibility.
Options d’Adobe Flash Player
La version par d&eacute;faut de Flash Player utilis&eacute;e par le compilateur est la version minimale requise par le SDK Flex utilis&eacute;
pour la compilation.
Vous pouvez d&eacute;finir une version sp&eacute;cifique de Flash Player pour l’application. Les fonctionnalit&eacute;s n&eacute;cessitant une
version ult&eacute;rieure de Flash Player ne seront pas compil&eacute;es dans l’application.
Options du compilateur
Flash Builder fournit des cases &agrave; cocher pour les options suivantes du compilateur :
• Utiliser le moteur de texte Flash dans les composants MX
Le moteur de texte Flash (Flash Text Engine, FTE) est une biblioth&egrave;que qui fournit des contr&ocirc;les de texte dot&eacute;s d’un
ensemble complet d’options de formatage. Tous les composants Spark du package spark.components prennent en
charge FTE. Voir Using embedded fonts.
Certains contr&ocirc;les MX fournissent une prise en charge de FTE. Les contr&ocirc;les MX prenant en charge FTE utilisent
les m&ecirc;mes polices int&eacute;gr&eacute;es que les composants Spark utilisant FTE. Voir Using FTE in MX controls.
• Copier les fichiers non imbriqu&eacute;s dans le dossier de sortie
• G&eacute;n&eacute;rer un fichier SWF accessible
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 77
Utilisation des projets
Cette option active les fonctionnalit&eacute;s d’accessibilit&eacute; lors de la compilation de l’application ou du fichier SWC. Pour
plus d’informations sur l’utilisation des fonctionnalit&eacute;s d’accessibilit&eacute; avec Flex, voir Accessible applications.
• Activer la v&eacute;rification stricte
Lorsque la v&eacute;rification stricte est activ&eacute;e, le compilateur imprime des appels de propri&eacute;t&eacute; et de fonction non d&eacute;finis.
Il effectue &eacute;galement une v&eacute;rification de type au moment de la compilation pour les affectations et les options
fournies aux appels de m&eacute;thode.
• Activer les avertissements
Cette option active des avertissements sp&eacute;cifiques. Pour plus d’informations, voir Viewing warnings and errors.
Vous pouvez &eacute;galement sp&eacute;cifier des arguments de compilateur disponibles avec la ligne de commande mxmlc
compiler. Vous pouvez d&eacute;finir les valeurs de la plupart des options du champ Arguments de compilateur
suppl&eacute;mentaires en utilisant la syntaxe de la ligne de commande. Pour plus d’informations sur la syntaxe pour la
d&eacute;finition des options dans la bo&icirc;te de dialogue Compilateur Flex, voir About the command-line compilers.
Dans le champ Arguments de compilateur suppl&eacute;mentaires, vous pouvez remplacer un chemin vers le r&eacute;pertoire du
SDK par le jeton ${flexlib}, comme l’illustre l’exemple suivant :
-include-libraries &quot;${flexlib}/libs/automation.swc&quot; &quot;${flexlib}/libs/automation_agent.swc&quot;
Enveloppe HTML
Outre les fichiers SWF, le compilateur Flash Builder g&eacute;n&egrave;re &eacute;galement une enveloppe HTML que vous pouvez utiliser
lors du d&eacute;ploiement de l’application. Les options suivantes sont disponibles :
• G&eacute;n&eacute;rer le fichier d’enveloppe HTML
• V&eacute;rifier la version du lecteur cible
Lorsque cette option est activ&eacute;e, l’application compil&eacute;e v&eacute;rifie que la version de Flash Player est correcte.
Si l’option d’utilisation de l’installation rapide est activ&eacute;e, l’application ex&eacute;cute un fichier SWF dans le lecteur Flash
Player existant pour mettre &agrave; niveau les utilisateurs vers la derni&egrave;re version du lecteur.
• Activer l’int&eacute;gration avec le navigateur
Cette option active la liaison profonde. La liaison profonde permet aux utilisateurs de parcourir leurs interactions
avec l’application en utilisant les boutons Pr&eacute;c&eacute;dent et Suivant de leur navigateur.
Acc&egrave;s par ligne de commande aux compilateurs de structure Flex
Vous pouvez acc&eacute;der directement par ligne de commande aux compilateurs de structure Flex (mxmlc et compc).
Lorsque vous installez Flash Builder, l’invite de structure Flex se trouve dans le menu de d&eacute;marrage Windows
(Programmes &gt; Adobe). Pour plus d’informations, voir About the command-line compilers dans Utilisation d’Adobe
Flex 4.
Personnalisation des g&eacute;n&eacute;rations de projet
Flash Builder vous permet de g&eacute;n&eacute;rer des applications automatiquement en utilisant les param&egrave;tres de projet par
d&eacute;faut. Cette m&eacute;thode est recommand&eacute;e pour la g&eacute;n&eacute;ration d’applications. Vous pouvez toutefois personnaliser la
g&eacute;n&eacute;ration de projets en fonction de vos besoins. Vous avez ainsi la possibilit&eacute; par exemple de s&eacute;lectionner un autre
dossier de sortie par d&eacute;faut ou de modifier les options du compilateur.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 78
Utilisation des projets
Jeu de composants (MX + Spark ou MX uniquement)
Par d&eacute;faut, les projets Flex mettent &agrave; la disposition des applications l’ensemble des composants, c’est-&agrave;-dire les
composants Spark fournis avec Flex 4 et les composants MX livr&eacute;s avec Flex 3.
Il est possible toutefois que dans certains cas, vous ne souhaitiez faire appel qu’aux composants MX fournis avec Flex 3.
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&eacute;n&eacute;ficier des avantages des fonctionnalit&eacute;s introduites
avec Flex 4 et Flash Builder 4 (nouvelle syntaxe d’&eacute;tats, fonctions de compilation am&eacute;lior&eacute;es et autres fonctionnalit&eacute;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&eacute;n&eacute;ration toutes les biblioth&egrave;ques associ&eacute;es &agrave; 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 &agrave; jour le code manuellement afin d’en supprimer toute r&eacute;f&eacute;rence aux composants et aux
biblioth&egrave;ques Spark.
Liaison de la structure des applications
Par d&eacute;faut, les classes d’application de la structure Flex 4 utilisent la liaison dynamique. Au lieu de compiler toutes les
classes dans le fichier SWF de l’application (liaison statique), certaines classes sont charg&eacute;es &agrave; partir de la biblioth&egrave;que
partag&eacute;e &agrave; l’ex&eacute;cution (Runtime Shared Library, RSL). Les applications cr&eacute;&eacute;es avec une liaison dynamique sont dot&eacute;es
de fichiers SWF plus petits, ce qui permet de les t&eacute;l&eacute;charger plus rapidement. En revanche, ces applications utilisent
plus de m&eacute;moire, toutes les classes de la structure &eacute;tant charg&eacute;es, y compris celles dont vous n’avez pas besoin. Pour
plus d’informations, voir Biblioth&egrave;que partag&eacute;e &agrave; l’ex&eacute;cution.
Vous pouvez modifier les propri&eacute;t&eacute;s d’un projet afin de personnaliser ce comportement pour toutes les applications
d’un projet. Apr&egrave;s avoir s&eacute;lectionn&eacute; un projet, dans le menu de Flash Builder, choisissez Projet &gt; Propri&eacute;t&eacute;s &gt; Chemin
de g&eacute;n&eacute;ration Flex &gt; Chemin d’acc&egrave;s &agrave; la biblioth&egrave;que.
Par d&eacute;faut, Flash Builder utilise le comportement par d&eacute;faut du SDK pour la liaison des structures. Pour Flex 4, il s’agit
de la liaison dynamique des biblioth&egrave;ques partag&eacute;es &agrave; l’ex&eacute;cution (RSL) ; pour Flex 3, de la liaison statique. Utilisez le
menu d&eacute;roulant Liaison de structure pour remplacer le comportement par d&eacute;faut.
Pour le SDK Flex 4, les options suivantes sont activ&eacute;es par d&eacute;faut :
• V&eacute;rifier les condens&eacute;s RSL
V&eacute;rifie que le condens&eacute; de la biblioth&egrave;que RSL correspond &agrave; celui stock&eacute; dans l’application au moment de la
compilation lorsque l’application a &eacute;t&eacute; li&eacute;e &agrave; la biblioth&egrave;que RSL interdomaines. Pour plus d’informations, voir
About RSL digests.
• Utiliser les biblioth&egrave;ques RSL locales de d&eacute;bogage lors du d&eacute;bogage
Utilise les biblioth&egrave;ques RSL locales lors du d&eacute;bogage de l’application. L’utilisation des biblioth&egrave;ques RSL locales
vous permet d’intervenir dans les fichiers RSL de d&eacute;bogage. Cette option est ignor&eacute;e lors de l’exportation d’une
version valid&eacute;e.
• D&eacute;terminer automatiquement l’ordre de la biblioth&egrave;que, en fonction des d&eacute;pendances
Si cette option est activ&eacute;e, Flash Builder d&eacute;termine l’ordre des biblioth&egrave;ques en fonction des d&eacute;pendances au sein
des biblioth&egrave;ques. Pour personnaliser l’ordre des biblioth&egrave;ques, d&eacute;sactivez cette option et indiquez l’ordre voulu &agrave;
l’aide des boutons Haut et Bas.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 79
Utilisation des projets
Activation et d&eacute;sactivation des g&eacute;n&eacute;rations automatiques
En configuration autonome, Flash Builder g&eacute;n&egrave;re vos projets automatiquement. En configuration plug-in, vous devrez
activer cette option. Flash Builder est con&ccedil;u pour g&eacute;n&eacute;rer les projets automatiquement. La d&eacute;sactivation de cette
option emp&ecirc;che le compilateur de d&eacute;tecter les erreurs de syntaxe et d’afficher les avertissements et les messages
d’erreur au fur et &agrave; mesure de la saisie du code. Pour plus d’informations sur la g&eacute;n&eacute;ration manuelle de projets, voir
&laquo; G&eacute;n&eacute;ration manuelle de projets &raquo; &agrave; la page 81.
Effectuez l’une des op&eacute;rations suivantes :
• S&eacute;lectionnez Projet &gt; G&eacute;n&eacute;rer automatiquement.
• Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Espace de travail. S&eacute;lectionnez ou d&eacute;s&eacute;lectionnez
l’option G&eacute;n&eacute;rer automatiquement.
Cette option a une incidence sur tous les projets de l’espace de travail.
D&eacute;finition d’un dossier de sortie de projet
Lorsque vous cr&eacute;ez un projet dans Flash Builder, le r&eacute;sultat de la cr&eacute;ation est g&eacute;n&eacute;r&eacute; par d&eacute;faut dans le dossier de sortie.
Les projets LiveCycle Data Services ES faisant appel &agrave; l’option de compilation sur le serveur d&eacute;rogent &agrave; cette r&egrave;gle. A
son ex&eacute;cution, l’application est en effet compil&eacute;e sur le serveur.
Vous pouvez modifier le nom de ce dossier &agrave; la cr&eacute;ation du projet ou une fois le projet cr&eacute;&eacute;. Vous avez en outre la
possibilit&eacute; de cr&eacute;er un dossier ou de s&eacute;lectionner un dossier existant de l’espace de travail.
1 Dans l’Explorateur de packages, s&eacute;lectionnez un projet.
2 Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl enfonc&eacute;e (Macintosh), puis
s&eacute;lectionnez Propri&eacute;t&eacute;s dans le menu contextuel.
La bo&icirc;te de dialogue des propri&eacute;t&eacute;s du projet appara&icirc;t.
3 S&eacute;lectionnez la page Chemin de g&eacute;n&eacute;ration Flex.
4 Modifiez le dossier de sortie sp&eacute;cifi&eacute; en saisissant un nouveau nom ou en recherchant et s&eacute;lectionnant le dossier
existant du projet.
Remarque : le dossier de sortie d’une application LiveCycle Data Services ES ne peut pas &ecirc;tre modifi&eacute; de cette mani&egrave;re.
Son emplacement est en effet contr&ocirc;l&eacute; par le serveur Flex et est accessible uniquement par le biais du fichier Flexconfig.xml du projet.
5 Cliquez sur OK.
Le dossier de sortie existant est remplac&eacute; par le nouveau dossier choisi.
Important : la modification du nom du dossier de sortie entra&icirc;ne la suppression du dossier de sortie d’origine ainsi que
de l’ensemble de son contenu. Vous devrez reg&eacute;n&eacute;rer le projet afin de recr&eacute;er les fichiers d’application SWF et d’enveloppe
HTML.
Modification d’un chemin de g&eacute;n&eacute;ration de projet
Chaque projet poss&egrave;de son propre chemin de g&eacute;n&eacute;ration compos&eacute; du chemin source et du chemin de biblioth&egrave;que (les
chemins de g&eacute;n&eacute;ration de projet de biblioth&egrave;que sont l&eacute;g&egrave;rement plus complexes. Pour plus d’informations, voir
&laquo; Projets de biblioth&egrave;que &raquo; &agrave; la page 69). Le chemin source correspond &agrave; l’emplacement des fichiers source MXML et
ActionScript du projet. Le chemin de biblioth&egrave;que correspond &agrave; l’emplacement des classes de la structure Flex de base
ainsi que des composants Flex personnalis&eacute;s que vous avez cr&eacute;&eacute;s (sous la forme de fichiers SWC).
Modification du chemin source
1 S&eacute;lectionnez un projet dans l’Explorateur de packages.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 80
Utilisation des projets
2 Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl enfonc&eacute;e (Macintosh), puis
s&eacute;lectionnez Propri&eacute;t&eacute;s dans le menu contextuel. La bo&icirc;te de dialogue des propri&eacute;t&eacute;s du projet appara&icirc;t.
3 S&eacute;lectionnez la page Chemin de g&eacute;n&eacute;ration Flex (dans le cadre d’un projet ActionScript, s&eacute;lectionnez la page
Chemin de g&eacute;n&eacute;ration ActionScript).
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
personnalis&eacute;es.
Vous pouvez &eacute;galement utiliser des variables de chemin afin d’&eacute;viter de saisir le chemin complet du syst&egrave;me de
fichiers. Vous pouvez saisir le nom d’une variable existante ou en cr&eacute;er une. Pour plus d’informations, voir
&laquo; Cr&eacute;ation d’une variable de chemin &raquo; &agrave; la page 80.
6 Apportez les modifications n&eacute;cessaires au chemin source, puis cliquez sur OK.
Modification du chemin de la biblioth&egrave;que
1 R&eacute;p&eacute;tez les &eacute;tapes 1 &agrave; 3 de la proc&eacute;dure pr&eacute;c&eacute;dente afin d’acc&eacute;der &agrave; la page des propri&eacute;t&eacute;s Chemin de g&eacute;n&eacute;ration
Flex.
2 Cliquez sur l’onglet Chemin d’acc&egrave;s &agrave; la biblioth&egrave;que.
Le chemin de la biblioth&egrave;que contient des r&eacute;f&eacute;rences aux classes de la structure Flex contenues dans des fichiers
SWC. Un fichier SWC est un fichier d’archivage pour les composants Flex et d’autres ressources (pour plus
d’informations, voir &laquo; Utilisation des fichiers SWC dans le cadre des projets &raquo; &agrave; la page 71).
Vous pouvez modifier le chemin vers la structure ou, si vous avez cr&eacute;&eacute; des composants Flex personnalis&eacute;s, ajouter
de nouveaux dossiers ou fichiers SWC au chemin de la biblioth&egrave;que. Vous avez &eacute;galement la possibilit&eacute; de
supprimer des &eacute;l&eacute;ments du chemin.
3 Apportez les modifications n&eacute;cessaires au chemin de la biblioth&egrave;que, puis cliquez sur OK.
Cr&eacute;ation d’une variable de chemin
Vous pouvez &eacute;tablir des liens vers des ressources en d&eacute;finissant des variables de chemin. Vous &eacute;vitez ainsi de devoir
saisir le chemin complet d’un dossier local ou d’un dossier r&eacute;seau dans lequel vous enregistrez les fichiers. D&eacute;finissez
par exemple une variable de chemin nomm&eacute;e Classes, puis sp&eacute;cifiez le chemin vers un dossier du syst&egrave;me de fichiers.
La variable Classes peut ensuite &ecirc;tre s&eacute;lectionn&eacute;e comme &eacute;tant l’emplacement du nouveau dossier auquel la relation a
&eacute;t&eacute; &eacute;tablie. Si le dossier est d&eacute;plac&eacute;, il vous suffit de mettre &agrave; jour l’emplacement dans la variable de chemin d&eacute;finie pour
que tous les projets reli&eacute;s &agrave; la variable Classes puissent continuer &agrave; acc&eacute;der aux ressources.
D&eacute;finition ou cr&eacute;ation d’une variable de chemin
1 S&eacute;lectionnez un projet dans l’Explorateur de packages Flex.
2 Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl enfonc&eacute;e (Macintosh), puis
s&eacute;lectionnez Propri&eacute;t&eacute;s dans le menu contextuel. La bo&icirc;te de dialogue des propri&eacute;t&eacute;s du projet appara&icirc;t.
3 S&eacute;lectionnez la page Chemin de g&eacute;n&eacute;ration Flex (dans le cadre d’un projet ActionScript, s&eacute;lectionnez la page
Chemin de g&eacute;n&eacute;ration ActionScript).
4 Vous pouvez cr&eacute;er une variable pour chaque &eacute;l&eacute;ment du chemin (dont les dossiers du chemin source et les dossiers
SWC, les projets et les fichiers SWC du chemin de la biblioth&egrave;que). A titre d’exemple, cliquez sur le bouton Ajouter
un dossier dans l’onglet Chemin source. La bo&icirc;te de dialogue d’ajout d’un dossier appara&icirc;t.
5 Saisissez une variable de chemin conform&eacute;ment au format suivant : ${nom_de_la_variable_de_chemin}.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 81
Utilisation des projets
Remarque : la variable doit exister, sinon la saisie du chemin &eacute;choue. Pour obtenir la liste des variables de ressource
existantes, s&eacute;lectionnez Fen&ecirc;tre &gt; Pr&eacute;f&eacute;rences dans le menu principal, puis G&eacute;n&eacute;ral &gt; Espace de travail &gt; Ressources
li&eacute;es. Les variables de ressources li&eacute;es peuvent &eacute;galement &ecirc;tre g&eacute;r&eacute;es &agrave; partir de cette page de propri&eacute;t&eacute;s.
6 Cliquez sur OK pour ajouter la variable au chemin.
Options de g&eacute;n&eacute;ration avanc&eacute;es
Flash Builder offre des options avanc&eacute;es pour la personnalisation des g&eacute;n&eacute;rations de projet. Vous pouvez par exemple
g&eacute;n&eacute;rer des projets manuellement, modifier l’ordre par d&eacute;faut de g&eacute;n&eacute;ration des projets dans l’espace de travail et cr&eacute;er
des g&eacute;n&eacute;rateurs personnalis&eacute;s avec l’utilitaire Apache Ant.
G&eacute;n&eacute;ration manuelle de projets
La g&eacute;n&eacute;ration manuelle de projets vous permet de contr&ocirc;ler la dur&eacute;e et l’&eacute;tendue de la g&eacute;n&eacute;ration. Vous pouvez par
exemple g&eacute;n&eacute;rer un seul projet ou un ensemble de projets dans l’espace de travail. Vous pouvez &eacute;galement d&eacute;finir un
jeu de documents de projets ou de ressources de projet et ne g&eacute;n&eacute;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 &ecirc;tre s&eacute;lectionn&eacute;es
et group&eacute;es en fonction de l’utilisation qui en est faite. Pour plus d’informations sur les jeux de documents, voir
&laquo; Cr&eacute;ation de jeux de documents &raquo; &agrave; la page 27.
Les options de g&eacute;n&eacute;ration se situent dans le menu Projet, ainsi que l’illustre l’exemple suivant.
G&eacute;n&eacute;ration d’un projet unique
1 Dans l’Explorateur de packages, s&eacute;lectionnez le projet que vous souhaitez g&eacute;n&eacute;rer.
2 S&eacute;lectionnez Projet &gt; G&eacute;n&eacute;rer le projet dans le menu principal.
Le projet s&eacute;lectionn&eacute; est g&eacute;n&eacute;r&eacute;. Des fichiers d’application valid&eacute;s ou d&eacute;bogu&eacute;s (nouveaux ou mis &agrave; jour) sont
ajout&eacute;s au dossier de sortie du projet.
Remarque : le programme vous invite &agrave; enregistrer les fichiers de projet qui ne l’ont pas encore &eacute;t&eacute; avant le d&eacute;but de
la g&eacute;n&eacute;ration. Pour &eacute;viter l’affichage de cette invite, activez l’enregistrement automatique des fichiers avant le d&eacute;but
de la g&eacute;n&eacute;ration dans les pr&eacute;f&eacute;rences de l’espace de travail.
G&eacute;n&eacute;ration de tous les projets dans l’espace de travail
❖ S&eacute;lectionnez Projet &gt; G&eacute;n&eacute;rer tout dans le menu principal.
Tous les projets de l’espace de travail sont g&eacute;n&eacute;r&eacute;s. Les fichiers d’application sont ajout&eacute;s aux dossiers de sortie des
projets respectifs. Dans la mesure o&ugrave; vous n’avez pas d&eacute;fini l’enregistrement automatique des fichiers avant le d&eacute;but
de la g&eacute;n&eacute;ration, le programme vous invite &agrave; les enregistrer.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 82
Utilisation des projets
G&eacute;n&eacute;ration d’un jeu de documents
Utilisez l’une des m&eacute;thodes suivantes :
• S&eacute;lectionnez Projet &gt; G&eacute;n&eacute;rer un jeu de documents &gt; S&eacute;lectionner un jeu de documents dans le menu principal.
Cliquez sur Nouveau pour cr&eacute;er un jeu de documents. Pour plus d’informations sur la cr&eacute;ation d’un jeu de
documents, voir &laquo; Cr&eacute;ation de jeux de documents &raquo; &agrave; la page 27.
• Choisissez un jeu de documents existant en s&eacute;lectionnant Projet &gt; G&eacute;n&eacute;rer un jeu de documents &gt; S&eacute;lectionner un
jeu de documents dans le menu principal.
Tous les projets du jeu de documents sont g&eacute;n&eacute;r&eacute;s. Les fichiers d’application sont ajout&eacute;s au dossier de sortie du projet.
Enregistrement automatique des ressources du projet
Lorsque vous g&eacute;n&eacute;rez des projets manuellement, le programme vous invite &agrave; enregistrer toutes les ressources avant de
d&eacute;buter la g&eacute;n&eacute;ration. Pour &eacute;viter l’affichage de cette invite, activez l’enregistrement automatique des ressources du
projet dans les pr&eacute;f&eacute;rences de l’espace de travail.
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Espace de travail.
2 S&eacute;lectionnez l’option Sauvegarder automatiquement avant la g&eacute;n&eacute;ration.
3 (Facultatif) Vous pouvez modifier la fr&eacute;quence d’enregistrement des ressources en saisissant une valeur (en
minutes) dans la zone de texte Intervalle de sauvegarde du plan de travail.
Ex&eacute;cution d’une g&eacute;n&eacute;ration nettoy&eacute;e
Une fois un projet cr&eacute;&eacute;, les g&eacute;n&eacute;rations ult&eacute;rieures n’impliqueront que les ressources ajout&eacute;es ou modifi&eacute;es. Une
g&eacute;n&eacute;ration nettoy&eacute;e permet de forcer le compilateur Flash Builder &agrave; reg&eacute;n&eacute;rer toutes les ressources d’un projet. Vous
pouvez y recourir par exemple pour &eacute;liminer toutes les sources potentielles d’un probl&egrave;me survenu au cours du test de
l’application.
1 S&eacute;lectionnez Projet &gt; Nettoyer dans le menu principal.
2 Choisissez le ou les projets dont vous souhaitez &eacute;liminer les fichiers de g&eacute;n&eacute;ration pour les reg&eacute;n&eacute;rer.
3 Cliquez sur OK.
Modification de l’ordre de g&eacute;n&eacute;ration d’un projet
Flash Builder permet de cr&eacute;er des relations entre les projets ouverts dans l’espace de travail. Vous pouvez par exemple
importer les classes ActionScript d’un projet &agrave; l’autre. La cr&eacute;ation de relations entre les projets a une incidence sur
l’ordre dans lequel les projets sont g&eacute;n&eacute;r&eacute;s.
Par d&eacute;faut, le compilateur g&eacute;n&egrave;re des projets reli&eacute;s dans l’ordre garantissant la g&eacute;n&eacute;ration correcte de tous les projets.
Prenons l’exemple de deux projets, dont le premier fait r&eacute;f&eacute;rence &agrave; des classes contenues dans le second : le second
projet est g&eacute;n&eacute;r&eacute; en premier. Dans la plupart des cas, le compilateur g&eacute;n&egrave;re les projets dans l’ordre requis et les
applications sont cr&eacute;&eacute;es correctement sans qu’aucune intervention ne soit n&eacute;cessaire.
Vous avez cependant la possibilit&eacute; de modifier l’ordre de g&eacute;n&eacute;ration. Cette modification peut s’av&eacute;rer n&eacute;cessaire par
exemple si vous avez cr&eacute;&eacute; un g&eacute;n&eacute;rateur personnalis&eacute; Ant et que vous l’avez associ&eacute; &agrave; un projet de l’espace de travail
que vous devez g&eacute;n&eacute;rer avant les autres projets. Pour plus d’informations sur la cr&eacute;ation de g&eacute;n&eacute;rateurs personnalis&eacute;s,
voir &laquo; Personnalisation des g&eacute;n&eacute;rations avec Apache Ant &raquo; &agrave; la page 83.
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Espace de travail &gt; Ordre de g&eacute;n&eacute;ration.
La bo&icirc;te de dialogue Ordre de g&eacute;n&eacute;ration pr&eacute;sente les options suivantes.
Utiliser l’ordre de g&eacute;n&eacute;ration par d&eacute;faut L’ordre de g&eacute;n&eacute;ration par d&eacute;faut d&eacute;pend des d&eacute;pendances entre les
projets. Il est g&eacute;r&eacute; par le compilateur.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 83
Utilisation des projets
Ordre de g&eacute;n&eacute;ration du projet Vous pouvez d&eacute;finir manuellement l’ordre dans lequel tous les projets de l’espace
de travail doivent &ecirc;tre g&eacute;n&eacute;r&eacute;s. Il est &eacute;galement possible de supprimer un projet de la liste d&eacute;finissant l’ordre de
g&eacute;n&eacute;ration. Dans ce cas, le projet sera g&eacute;n&eacute;r&eacute; apr&egrave;s tous les autres projets de la liste.
It&eacute;rations maximales lors de la g&eacute;n&eacute;ration avec des cycles En pr&eacute;sence de r&eacute;f&eacute;rences cycliques dans un projet (ce
que nous vous conseillons d’&eacute;viter), vous pouvez d&eacute;finir le nombre de tentatives de g&eacute;n&eacute;ration, afin de permettre
au compilateur de g&eacute;n&eacute;rer tous les projets correctement. Par d&eacute;faut, le nombre maximal d’it&eacute;rations est 10.
2 Modifiez si n&eacute;cessaire l’ordre de g&eacute;n&eacute;ration, puis cliquez sur OK.
Personnalisation des g&eacute;n&eacute;rations avec Apache Ant
La cr&eacute;ation d’un g&eacute;n&eacute;rateur personnalis&eacute; vous permet de modifier et d’&eacute;tendre le processus de g&eacute;n&eacute;ration standard.
Flash Builder comporte un script de g&eacute;n&eacute;ration standard intervenant dans la compilation des applications. Vous
pouvez, le cas &eacute;ch&eacute;ant, cr&eacute;er des scripts de g&eacute;n&eacute;ration personnalis&eacute;s gr&acirc;ce &agrave; Apache Ant, outil de g&eacute;n&eacute;ration Java &agrave; code
source libre.
Le d&eacute;veloppement de scripts de g&eacute;n&eacute;ration Ant d&eacute;passe le cadre de ce guide. Cette rubrique illustre toutefois comment
cr&eacute;er un g&eacute;n&eacute;rateur personnalis&eacute; et l’appliquer &agrave; vos projets.
Vous pouvez appliquer les g&eacute;n&eacute;rateurs personnalis&eacute;s &agrave; tous les types de projet Flash Builder.
Cr&eacute;ation d’un g&eacute;n&eacute;rateur
1 Dans l’Explorateur de packages, s&eacute;lectionnez un projet. Cliquez avec le bouton droit de la souris (Windows) ou en
maintenant la touche Ctrl enfonc&eacute;e (Macintosh) pour afficher le menu contextuel et s&eacute;lectionnez Propri&eacute;t&eacute;s.
2 S&eacute;lectionnez la page de propri&eacute;t&eacute;s G&eacute;n&eacute;rateurs. La liste sera plus ou moins longue en fonction du nombre de plug-
ins que vous utilisez. Flash Builder fournit un g&eacute;n&eacute;rateur nomm&eacute; Flex qui ne peut pas &ecirc;tre modifi&eacute;.
3 S&eacute;lectionnez Nouveau.
4 Dans la bo&icirc;te de dialogue S&eacute;lection d’un type de configuration, choisissez le type de configuration appropri&eacute;. Flash
Builder prend en charge le type Programme. S&eacute;lectionnez-le, puis cliquez sur OK pour poursuivre. D&eacute;finissez les
propri&eacute;t&eacute;s du nouveau g&eacute;n&eacute;rateur dans la page des propri&eacute;t&eacute;s et r&eacute;f&eacute;rencez le script Ant (fichier XML).
5 Cliquez sur OK pour appliquer les valeurs d&eacute;finies au projet.
Pour plus d’informations sur l’utilisation des scripts de g&eacute;n&eacute;ration Ant, voir la documentation Eclipse disponible &agrave;
l’adresse help.eclipse.org/help31/index.jsp.
Utilisation de plusieurs SDK dans Flash Builder
Flash Builder permet de modifier la version du SDK utilis&eacute; pour la compilation des projets. Vous pouvez s&eacute;lectionner
le SDK &agrave; la cr&eacute;ation ou en cours de d&eacute;veloppement du projet.
Le SDK se compose d’une structure et du compilateur. Le SDK Flex 2.0.1 signifie que vous utilisez la version 2.0.1 des
fichiers SWC de la structure Flex et la version 2.0.1 du compilateur Flex. Vous ne pouvez pas utiliser le compilateur
Flex 3 avec les fichiers SWC de la structure Flex 2.0.1, par exemple.
La possibilit&eacute; de modifier le SDK est utile en pr&eacute;sence d’un projet d&eacute;velopp&eacute; avec Flex Builder 2.0.1 (qui utilise le SDK
Flex 2.0.1) alors que vous ex&eacute;cutez la version 4 de Flash Builder (qui utilise par d&eacute;faut le SDK Flex 4). En s&eacute;lectionnant
un SDK ant&eacute;rieur pour la g&eacute;n&eacute;ration, vous pouvez pr&eacute;server la compatibilit&eacute; avec la derni&egrave;re version du SDK des
projets qui n’ont pas &eacute;t&eacute; mis &agrave; jour. En outre, si vous travaillez sur un projet utilisant le SDK Flex 2.0.1 mais vous
souhaitez faire appel &agrave; des fonctions de Flash Builder 4 (restructuration du code, par exemple), vous pouvez mettre &agrave;
niveau Flash Builder, puis s&eacute;lectionner un SDK ant&eacute;rieur comme SDK par d&eacute;faut.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 84
Utilisation des projets
La modification du SDK apr&egrave;s le d&eacute;veloppement d’un projet entra&icirc;ne une reg&eacute;n&eacute;ration compl&egrave;te, et non une
g&eacute;n&eacute;ration incr&eacute;mentielle. Flash Builder signale alors toute diff&eacute;rence qui aurait g&eacute;n&eacute;r&eacute; des erreurs de compilateur,
tout comme si le projet avait &eacute;t&eacute; d&eacute;velopp&eacute; avec le SDK d’origine. Si vous utilisez par exemple un composant
AdvancedDataGrid (introduit dans le SDK Flex 3), puis modifiez le SDK du projet en s&eacute;lectionnant la version 2.0.1,
Flash Builder signale que la classe AdvancedDataGrid est inconnue.
Flash Builder reg&eacute;n&egrave;re &eacute;galement tous les fichiers de prise en charge des projets, dont les fichiers de gestion de
l’historique et de liaisons profondes utilis&eacute;s par l’enveloppe HTML. Pour les projets SDK Flex 2.0.1, Flash Builder cr&eacute;e
les fichiers compatibles de gestion des historiques history.swf, history.html et history.js dans le r&eacute;pertoire des mod&egrave;les
HTML. Pour les projets SDK Flex 3, Flash Builder cr&eacute;e les fichiers compatibles de liaisons profondes history.htm et
history.js et historyFrame.html dans le r&eacute;pertoire html-templates/history.
Les options pr&eacute;sentes dans Flash Builder varient en outre en fonction du SDK s&eacute;lectionn&eacute;. Si vous ajoutez par exemple
un module &agrave; un projet utilisant le SDK Flex 2.0.1, Flash Builder ne vous propose pas d’optimiser le module. Cette
op&eacute;ration devra &ecirc;tre effectu&eacute;e manuellement.
Pour plus d’informations sur les diff&eacute;rences entre les SDK Flex 3 et Flex 2.0.1, voir Backward compatibility dans
Utilisation d’Adobe Flex 4.
Flash Builder utilise le SDK par d&eacute;faut pour les nouveaux projets cr&eacute;&eacute;s. Le SDK par d&eacute;faut est la derni&egrave;re version
fournie avec Flash Builder. Vous pouvez toutefois s&eacute;lectionner tout SDK r&eacute;pertori&eacute; dans la liste des SDK disponibles
dans Flash Builder.
Lorsque vous cr&eacute;ez un projet de biblioth&egrave;que Flex ou un projet ActionScript, vous pouvez s&eacute;lectionner le SDK &agrave; utiliser
dans les bo&icirc;tes de dialogue Nouveau projet de biblioth&egrave;que Flex et Nouveau projet ActionScript.
Ajout d’un nouveau SDK Flex &agrave; la liste des SDK disponibles
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez Flash Builder &gt; SDK Flex install&eacute;s.
Elle r&eacute;pertorie les SDK install&eacute;s. Le nom du SDK par d&eacute;faut est coch&eacute;.
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 &agrave; la liste des SDK disponibles. Cette liste est g&eacute;r&eacute;e dans
l’espace de travail Flash Builder pour tous les projets Flex. Au prochain projet cr&eacute;&eacute;, la liste des SDK disponibles
comportera &eacute;galement ce nouveau SDK.
Modification de la version de SDK du projet en cours
1 S&eacute;lectionnez Projets &gt; Propri&eacute;t&eacute;s.
2 Choisissez Compilateur Flex.
3 Cliquez sur Utiliser un SDK sp&eacute;cifique.
4 S&eacute;lectionnez un SDK dans la liste d&eacute;roulante. Si elle ne contient pas le SDK recherch&eacute;, cliquez sur le lien Configurer
les SDK Flex.
5 Cliquez sur OK.
Flash Builder applique le nouveau SDK au projet en cours. Des erreurs et des avertissements peuvent survenir si le
projet utilise un code qui n’est pas compatible avec le nouveau SDK.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 85
Utilisation des projets
S&eacute;lection d’un nouveau SDK par d&eacute;faut
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez Flash Builder &gt; SDK Flex install&eacute;s.
Le nom du SDK par d&eacute;faut est coch&eacute;.
2 Cochez la case correspondant &agrave; un autre SDK pour le d&eacute;finir comme SDK par d&eacute;faut. Ce SDK sera appliqu&eacute; &agrave; tout
projet, y compris celui en cours, pour lequel l’option Utiliser le SDK par d&eacute;faut a &eacute;t&eacute; s&eacute;lectionn&eacute;e dans la bo&icirc;te de
dialogue Compilateur Flex. Un projet param&eacute;tr&eacute; pour utiliser un SDK sp&eacute;cifique ne sera pas concern&eacute; par cette
modification, et ce m&ecirc;me si vous modifiez le SDK par d&eacute;faut de l’espace de travail.
3 Cliquez sur OK pour enregistrer vos modifications.
4 Cliquez &agrave; nouveau sur le bouton OK.
Publication du code source
Une fois qu’une application est pr&ecirc;te &agrave; &ecirc;tre publi&eacute;e, Flash Builder vous permet de d&eacute;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&eacute;der &agrave; la source et la visionner dans un navigateur Web en s&eacute;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 &eacute;galement un moyen
pratique de partager le code avec d’autres d&eacute;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’&eacute;diteur, puis s&eacute;lectionnez Projet &gt; Exporter vers une version
valid&eacute;e.
2 S&eacute;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&icirc;te de dialogue Publier la source de l’application, s&eacute;lectionnez le ou les fichiers de l’application &agrave; inclure
dans le menu Afficher la source. Par d&eacute;faut, le fichier principal de l’application est s&eacute;lectionn&eacute;.
Important : pour les projets pour serveurs, vous pouvez s&eacute;lectionner le dossier des services &agrave; l’exportation des fichiers
source. L’exportation de fichiers impl&eacute;mentant des services a des implications en termes de s&eacute;curit&eacute;. Ces fichiers
peuvent donner acc&egrave;s &agrave; votre base de donn&eacute;es, noms d’utilisateurs et mots de passe inclus. Voir Exportation des fichiers
source vers la version valid&eacute;e d’une application.
5 (Facultatif) Modifiez le dossier de sortie de la source. Par d&eacute;faut, un dossier d’affichage de la source est ajout&eacute; au
dossier de sortie du projet.
6 Cliquez sur OK.
Les utilisateurs ex&eacute;cutant l’application peuvent acc&eacute;der au code source en s&eacute;lectionnant Afficher la source dans le
menu contextuel. Le code source est affich&eacute; dans le navigateur Web par d&eacute;faut sous forme d’arborescence refl&eacute;tant la
structure des ressources (package, dossiers et fichiers) contenues dans l’application (que vous avez d&eacute;cid&eacute; de publier).
S&eacute;lectionnez un &eacute;l&eacute;ment source pour en afficher le code dans le navigateur. Les utilisateurs peuvent &eacute;galement
t&eacute;l&eacute;charger tous les fichiers source en cliquant sur le lien vers le fichier Download.zip.
Remarque : les restrictions de s&eacute;curit&eacute; d’Internet Explorer risquent d’entraver l’affichage du code source sur votre
ordinateur local. Vous devrez dans ce cas d&eacute;ployer l’application sur un serveur Web.
Ajout du menu d’affichage de la source aux projets ActionScript
Dans les projets Flex, l’ajout de l’&eacute;l&eacute;ment de menu Afficher la source &agrave; l’application s’effectue par l’interm&eacute;diaire de
l’assistant Exporter vers une version valid&eacute;e. Dans les applications ActionScript, cette option doit &ecirc;tre ajout&eacute;e
manuellement.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 86
Utilisation des projets
La fonction suivante, contenue dans la structure Flex, peut &ecirc;tre utilis&eacute;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)
L’exemple suivant illustre l’utilisation de cette fonction dans les applications ActionScript :
package {
import flash.display.MovieClip;
import com.adobe.viewsource.ViewSource;
public class MyASApp extends MovieClip
{
public function MyASApp()
{
ViewSource.addMenuItem(this, &quot;srcview/index.html&quot;);
// ... additional application code here
}
}
}
Cet exemple se base sur l’emplacement par d&eacute;faut du dossier source (srcview). En cas de modification de cet
emplacement, veillez &agrave; ce que le code utilise l’emplacement correct.
G&eacute;n&eacute;ration par ligne de commande de Flash Builder
Flash Builder fournit la t&acirc;che Ant &lt;fb.exportReleaseBuild&gt;. Utilisez-la pour impl&eacute;menter des g&eacute;n&eacute;rations par ligne de
commande qui synchronisent les param&egrave;tres de g&eacute;n&eacute;ration d’un d&eacute;veloppeur avec une g&eacute;n&eacute;ration nocturne. Vous
pouvez &eacute;galement utiliser la t&acirc;che &lt;mxmlc&gt; dans les scripts personnalis&eacute;s pour la g&eacute;n&eacute;ration nocturne.
T&acirc;che &lt;fb.exportReleaseBuild&gt;
La t&acirc;che &lt;fb.exportReleaseBuild&gt; garantit que les param&egrave;tres de g&eacute;n&eacute;ration nocturne correspondent exactement &agrave;
ceux utilis&eacute;s par les d&eacute;veloppeurs pendant leur travail de la journ&eacute;e.
Par exemple, si un d&eacute;veloppeur modifie le chemin de la biblioth&egrave;que d’un projet Flex, le nouveau chemin est &eacute;crit dans
le projet Flash Builder. A son ex&eacute;cution par l’ordinateur de g&eacute;n&eacute;ration nocturne, la t&acirc;che &lt;fb.exportReleaseBuild&gt;
charge le projet Flash Builder et tous ses param&egrave;tres.
La t&acirc;che &lt;fb.exportReleaseBuild&gt; pr&eacute;sente un autre avantage : elle prend automatiquement en charge les t&acirc;ches de
maintenance suppl&eacute;mentaires qui font normalement partie d’une g&eacute;n&eacute;ration Flash Builder. Par exemple :
• La compilation automatique des projets de biblioth&egrave;que associ&eacute;s
• La copie de ressources, telles que les fichiers JPEG, dans le r&eacute;pertoire de sortie
• La copie du mod&egrave;le HTML, y compris le remplacement des macros en fonction des r&eacute;sultats de compilation
(comme la largeur et la hauteur)
Remarque : la t&acirc;che &lt;fb.exportReleaseBuild&gt; n&eacute;cessite l’installation de Flash Builder sur l’ordinateur de g&eacute;n&eacute;ration
nocturne.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 87
Utilisation des projets
T&acirc;che &lt;mxmlc&gt;
Si vous &eacute;crivez un script personnalis&eacute; qui fait appel &agrave; la t&acirc;che &lt;mxmlc&gt; (un script Ant, par exemple), vous n’avez pas
besoin d’installer Flash Builder sur l’ordinateur de g&eacute;n&eacute;ration. Le SDK Flex doit toutefois s’y trouver. L’ordinateur de
g&eacute;n&eacute;ration peut par cons&eacute;quent se trouver sur une plateforme Linux.
En revanche, l’inconv&eacute;nient de cette approche est que vous disposez de deux jeux de param&egrave;tres de g&eacute;n&eacute;ration &agrave;
synchroniser : le premier, utilis&eacute; par les d&eacute;veloppeurs au cours de la journ&eacute;e, se trouve dans Flash Builder et le second,
sur l’ordinateur de g&eacute;n&eacute;ration nocturne.
Utilisation de la t&acirc;che &lt;fb.exportReleaseBuild&gt;
1 Installez Flash Builder sur un ordinateur de g&eacute;n&eacute;ration.
2 Ecrivez build.xml avec fb.exportReleaseBuild comme cible. Par exemple :
&lt;?xml version=&quot;1.0&quot;?&gt;
&lt;project default=&quot;main&quot;&gt;
&lt;target name=&quot;main&quot;&gt;
&lt;fb.exportReleaseBuild project=&quot;MyProject&quot; /&gt;
&lt;/target&gt;
&lt;/project&gt;
build.xml indique qu’une g&eacute;n&eacute;ration par ligne de commande du projet Flex doit &ecirc;tre ex&eacute;cut&eacute;e avec les param&egrave;tres
enregistr&eacute;s dans les fichiers du projet. Pour plus d’informations sur les param&egrave;tres disponibles, voir &laquo; Param&egrave;tres
de la t&acirc;che fb.exportReleaseBuild &raquo; &agrave; la page 88.
3 Cr&eacute;ez un script de g&eacute;n&eacute;ration nocturne qui demande &agrave; Eclipse de rechercher un fichier de g&eacute;n&eacute;ration et d’ex&eacute;cuter
sa cible.
Les exemples suivants indiquent build.xml comme fichier de g&eacute;n&eacute;ration, qui ex&eacute;cute MyTarget.
Si le script de la g&eacute;n&eacute;ration nocturne se trouve sur une plateforme Macintosh, vous pouvez ex&eacute;cuter le script
suivant :
WORKSPACE=&quot;$HOME/Documents/Adobe Flash Builder&quot;
# works with either FlashBuilder.app or Eclipse.app
&quot;/Applications/Adobe Flash Builder/FlashBuilder.app/Contents/MacOS/FlashBuilder&quot; \
--launcher.suppressErrors \
-noSplash \
-application org.eclipse.ant.core.antRunner \
-data &quot;$WORKSPACE&quot; \
-file &quot;$(pwd)/build.xml&quot; MyTarget
Si la g&eacute;n&eacute;ration nocturne est effectu&eacute;e sur une plateforme Windows, vous pouvez ex&eacute;cuter le fichier de commandes
suivant :
set WORKSPACE=%HOMEPATH%\Adobe Flash Builder
REM works with either FlashBuilderC.exe or eclipsec.exe
&quot;C:\Program Files\Adobe\Adobe Flash Builder\FlashBuilderC.exe&quot; ^
--launcher.suppressErrors ^
-noSplash ^
-application org.eclipse.ant.core.antRunner ^
-data &quot;%WORKSPACE%&quot; ^
-file &quot;%cd%\build.xml&quot; MyTarget
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 88
Utilisation des projets
Propri&eacute;t&eacute; Ant fb.running
La propri&eacute;t&eacute; Ant fb.running a la valeur true lorsque Flash Builder est en cours d’ex&eacute;cution. Vous pouvez utiliser cette
propri&eacute;t&eacute; lorsque vous ex&eacute;cutez des scripts dans Flash Builder. Par exemple :
&lt;target name=&quot;myFlashBuilderTasks&quot; if=&quot;fb.running&quot;&gt;
&lt;fb.exportReleaseBuild ... /&gt;
&lt;/target&gt;
T&acirc;ches Ant d’Eclipse
Eclipse propose plusieurs t&acirc;ches Ant que vous pouvez incorporer comme cibles dans le script de g&eacute;n&eacute;ration. Par
exemple :
• eclipse.incrementalBuild
• elicpse.refreshLocal
• eclipse.convertpath
Consultez la documentation d’Eclipse pour en savoir plus sur ces scripts.
Param&egrave;tres de la t&acirc;che fb.exportReleaseBuild
Attribut
Description
Obligatoire ?
Valeur par d&eacute;faut
project
Projet &agrave; g&eacute;n&eacute;rer. Indiquez le nom d’un projet dans
l’espace de travail Flash Builder, sans chemin d’acc&egrave;s.
Par exemple : &laquo; MonProjetFlex &raquo;.
Oui
Sans objet
application
Nom de l’application &agrave; compiler. Vous pouvez
Non
sp&eacute;cifier simplement le nom de l’application, sans
chemin d’acc&egrave;s ou extension (app1, par exemple).
Pour &eacute;viter toute ambigu&iuml;t&eacute; de nom, vous pouvez
sp&eacute;cifier un chemin d’acc&egrave;s complet par rapport &agrave; la
racine du projet (src/app1.mxml, par exemple). Pour
compiler toutes les applications, sp&eacute;cifiez &laquo; * &raquo; ou
omettez cet attribut. Lorsque vous ex&eacute;cutez un projet
AIR, vous ne pouvez sp&eacute;cifier qu’une seule
application. La valeur &laquo; * &raquo; n’est pas autoris&eacute;e.
Application par
d&eacute;faut du projet.
publishsource
Indique si la source de l’application doit &ecirc;tre publi&eacute;e, Non
ce qui permet &agrave; l’utilisateur d’afficher les fichiers
source &agrave; l’aide du menu contextuel Afficher la source.
false
locale
Indique la langue, par exemple fr-FR. Cette valeur est Non
transmise au compilateur &agrave; l’aide de l’identifiant locale du compilateur. Si sp&eacute;cifi&eacute;e, cette valeur
remplace la langue indiqu&eacute;e dans le champ
Arguments de compilateur suppl&eacute;mentaires de Flash
Builder.
Sans objet
destdir
Dossier de sortie. Le dossier peut &ecirc;tre un chemin
relatif ou absolu. Si vous sp&eacute;cifiez un chemin relatif, il
est relatif par rapport &agrave; la racine du projet. Si vous
compilez un projet AIR, le dossier est un r&eacute;pertoire
temporaire qui est supprim&eacute; apr&egrave;s la cr&eacute;ation du
fichier .air.
Non
bin-release
failonerror
Indique si des erreurs de compilation provoquent
l’&eacute;chec de la g&eacute;n&eacute;ration.
Non
true
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 89
Utilisation des projets
Attribut
Description
Obligatoire ?
Valeur par d&eacute;faut
verbose
La t&acirc;che &lt;fb.exportReleaseBuild&gt; g&eacute;n&egrave;re des
informations suppl&eacute;mentaires. Par exemple, elle
r&eacute;pertorie les fichiers qui ont &eacute;t&eacute; assembl&eacute;s dans le
fichier AIR et la dur&eacute;e de chaque &eacute;tape du processus.
Non
false
package
Pour les projets AIR uniquement : indique si le r&eacute;sultat Non
doit &ecirc;tre assembl&eacute; dans un fichier .air ou .airi. Si la
valeur est true, un fichier .air ou .airi est cr&eacute;&eacute; et le
r&eacute;pertoire de sortie temporaire (par d&eacute;faut, le
r&eacute;pertoire bin-release d&eacute;fini par l’attribut destdir) est
supprim&eacute;.
true
Si la valeur est false, aucun fichier .air ou .airi n’est cr&eacute;&eacute;
et le r&eacute;pertoire interm&eacute;diaire reste intact apr&egrave;s la
compilation.
destfile
Pour les projets AIR uniquement : le nom d’un fichier
.air ou .airi &agrave; cr&eacute;er.
Non
appname.air ou
appname.airi
(dans la racine du
projet)
Non
Si cet argument
est omis, un fichier
.airi non sign&eacute; est
g&eacute;n&eacute;r&eacute;. Il pourra
&ecirc;tre sign&eacute;
ult&eacute;rieurement.
Vous pouvez sp&eacute;cifier un chemin relatif ou absolu. Si
vous sp&eacute;cifiez un chemin relatif, il est relatif par
rapport &agrave; la racine du projet.
certificate
Pour les projets AIR uniquement : le chemin d’acc&egrave;s
au certificat utilis&eacute; pour signer le fichier AIR.
password
Pour les projets AIR uniquement : le mot de passe du Non
certificat qui est utilis&eacute; pour signer le fichier AIR. Si cet
argument est omis, un message d’erreur s’affiche.
Sans objet
Avertissement : l’utilisation d’une valeur litt&eacute;rale
pour un mot de passe risque de compromettre la
s&eacute;curit&eacute;.
timestamp
Pour les projets AIR uniquement : indique si le fichier
AIR g&eacute;n&eacute;r&eacute; inclut un horodatage.
Non
false
Assistant Exporter vers une version valid&eacute;e
Lorsque vous ex&eacute;cutez l’assistant Exporter vers une version valid&eacute;e (Projet &gt; Exporter vers une version valid&eacute;e), les
param&egrave;tres que vous d&eacute;finissez dans l’assistant sont enregistr&eacute;s dans le fichier .actionScriptProperties. Une g&eacute;n&eacute;ration
par ligne de commande qui utilise la t&acirc;che fb.exportReleaseBuild r&eacute;cup&egrave;re les param&egrave;tres de l’assistant. L’assistant
Exporter vers une version valid&eacute;e enregistre les param&egrave;tres suivants :
• Afficher la source
Les fichiers source que vous sp&eacute;cifiez pour l’option Afficher la source sont enregistr&eacute;s. Si vous d&eacute;finissez le
param&egrave;tre publishsource sur fb.exportReleaseBuild, l’assistant inclut ces fichiers comme fichiers source pouvant
&ecirc;tre affich&eacute;s.
Important : pour les projets pour serveurs, vous pouvez s&eacute;lectionner le dossier des services &agrave; l’exportation des fichiers
source. L’exportation de fichiers impl&eacute;mentant des services a des implications en termes de s&eacute;curit&eacute;. Ces fichiers
peuvent donner acc&egrave;s &agrave; votre base de donn&eacute;es, noms d’utilisateurs et mots de passe inclus. Voir Exportation des fichiers
source vers la version valid&eacute;e d’une application.
• Pour les projets AIR, tous les fichiers de sortie suppl&eacute;mentaires dont vous d&eacute;terminez la prise en compte avec le
fichier AIR ou AIRI dans l’assistant.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 90
Utilisation des projets
Ex&eacute;cution des g&eacute;n&eacute;rations par ligne de commande sur Linux et d’autres
plateformes
La t&acirc;che &lt;fb.exportReleaseBuild&gt; est uniquement prise en charge sur des plateformes Windows et Mac.
Si vous r&eacute;digez toutefois un script de g&eacute;n&eacute;ration pour une autre plateforme, utilisez l’option -dump-config dans le
compilateur mxmlc ou compc pour &eacute;crire les param&egrave;tres de configuration du compilateur dans un fichier. L’option load-config vous permettra ensuite de lire les options de configuration.
Modifiez les param&egrave;tres de configuration du fichier en fonction de vos besoins. Par exemple, changez
&lt;debug&gt;true&lt;/debug&gt; en &lt;debug&gt;false&lt;/debug&gt; pour que la g&eacute;n&eacute;ration nocturne g&eacute;n&egrave;re une version valid&eacute;e.
Ex&eacute;cution d’une g&eacute;n&eacute;ration par ligne de commande &agrave; l’aide des param&egrave;tres du compilateur Flash Builder
1 Dans Flash Builder, s&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Compilateur Flex.
2 Dans le champ Arguments de compilateur suppl&eacute;mentaires, indiquez l’argument suivant :
-dump-config nom_du_chemin, o&ugrave; nom_du_chemin sp&eacute;cifie le chemin d’acc&egrave;s absolu &agrave; un fichier du syst&egrave;me.
3 Appliquez les modifications dans la fen&ecirc;tre du projet.
Les param&egrave;tres du compilateur sont &eacute;crits dans le fichier sp&eacute;cifi&eacute;. Supprimez l’argument -dump-config apr&egrave;s avoir
v&eacute;rifi&eacute; que le fichier a &eacute;t&eacute; &eacute;crit.
4 Modifiez les param&egrave;tres de configuration comme il convient.
5 Dans le script de g&eacute;n&eacute;ration, ex&eacute;cutez le compilateur afin qu’il int&egrave;gre les param&egrave;tres enregistr&eacute;s du compilateur :
mxmlc -load-config nom_du_chemin
Restrictions pour l’ex&eacute;cution des g&eacute;n&eacute;rations par ligne de commande
Certaines restrictions s’appliquent &agrave; l’ex&eacute;cution des g&eacute;n&eacute;rations par ligne de commande &agrave; l’aide de la t&acirc;che
&lt;fb.exportReleaseBuild&gt;.
Ex&eacute;cution des g&eacute;n&eacute;rations par ligne de commande sur des plateformes Mac avec Eclipse 3.4
Dans Eclipse 3.4 sur des plateformes Mac, la g&eacute;n&eacute;ration sans affichage &eacute;choue si le chemin d’installation d’Eclipse
comporte des espaces.
Ex&eacute;cution des g&eacute;n&eacute;rations par ligne de commande sur des plateformes 64 bits
Flash Builder s’ex&eacute;cute sur des plateformes qui impl&eacute;mentent Java 32 bits. Pour ex&eacute;cuter une g&eacute;n&eacute;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 &agrave; Java. Par exemple :
java -d32 ...
Ex&eacute;cution des applications
Le test d’une application dans Adobe&reg; Flash&reg; Builder™ consiste &agrave; ex&eacute;cuter les fichiers SWF de l’application dans un
navigateur Web ou dans la version autonome de Flash Player. En pr&eacute;sence d’erreurs dans l’application, les outils de
d&eacute;bogage vous permettent : de placer des points d’arr&ecirc;t dans le code et de les g&eacute;rer ; de contr&ocirc;ler l’ex&eacute;cution de
l’application en l’interrompant, la reprenant et la terminant ; d’avancer d’un pas avec entr&eacute;e ou d’avancer d’un pas sans
entr&eacute;e dans les instructions de code ; de s&eacute;lectionner les variables critiques &agrave; contr&ocirc;ler ; et enfin d’&eacute;valuer les
expressions de contr&ocirc;le en cours d’ex&eacute;cution de l’application.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 91
Utilisation des projets
A propos de l’ex&eacute;cution et du d&eacute;bogage des applications
Une fois les projets g&eacute;n&eacute;r&eacute;s en applications (voir &laquo; G&eacute;n&eacute;ration de projets &raquo; &agrave; la page 73), vous pouvez les ex&eacute;cuter et
les d&eacute;boguer dans Flash Builder.
Utilisation de la version de d&eacute;bogage de Flash Player
Pour utiliser la fonction de d&eacute;bogage de Flash Builder, vous devez ex&eacute;cuter la version de d&eacute;bogage de Flash Player.
Cette version est disponible sous forme de plug-in ou de contr&ocirc;le ActiveX pour navigateur ou en tant que version
autonome. Elle est install&eacute;e avec Flash Builder mais peut &eacute;galement &ecirc;tre t&eacute;l&eacute;charg&eacute;e &agrave; partir du site Web d’Adobe.
Les programmes d’installation de la version de d&eacute;bogage de Flash Player se trouvent dans le r&eacute;pertoire
flex_builder_install/Player.
Vous pouvez d&eacute;terminer par programmation la version de Flash Player ex&eacute;cut&eacute;e en utilisant la m&eacute;thode
Capabilities.isDebugger(). Pour plus d’informations, voir Determining Flash Player version in Flex.
Utilisation des configurations de lancement pour ex&eacute;cuter et d&eacute;boguer des applications
Une configuration de lancement d&eacute;finit le nom du projet, le fichier principal de l’application et le chemin des versions
d’ex&eacute;cution et de d&eacute;bogage de l’application. Flash Builder contient une configuration de lancement d’application Flex
par d&eacute;faut. Cette configuration est utilis&eacute;e pour cr&eacute;er automatiquement des configurations de lancement pour chacun
de vos projets. Pour plus d’informations, voir &laquo; Gestion des configurations de lancement &raquo; &agrave; la page 94.
Remarque : dans la configuration plug-in de Flash Builder, la cr&eacute;ation des configurations de lancement n’est pas
automatique. Vous devez en cr&eacute;er une &agrave; la premi&egrave;re ex&eacute;cution de l’application. Voir &laquo; Ex&eacute;cution des applications &raquo; &agrave; la
page 92.
Personnalisation des configurations de lancement
Vous pouvez personnaliser les configurations de lancement que Flash Builder cr&eacute;&eacute; automatiquement pour vous. Vous
pouvez par exemple commuter le fichier d’application principal ou modifier le chemin afin qu’il dirige vers un fichier
SWF plut&ocirc;t que vers le fichier d’enveloppe HTML. Cela permet d’ex&eacute;cuter et de d&eacute;boguer les applications directement
dans la version autonome de Flash Player plut&ocirc;t que dans un navigateur Web. Vous pouvez en outre cr&eacute;er des
configurations de lancement distinctes pour chaque fichier d’application du projet. Pour plus d’informations, voir
&laquo; Cr&eacute;ation ou modification d’une configuration de lancement &raquo; &agrave; la page 94.
Ex&eacute;cution et d&eacute;bogage des applications dans un navigateur ou dans la version autonome de Flash Player
Par d&eacute;faut, les chemins d’ex&eacute;cution et de d&eacute;bogage de la configuration de lancement dirigent vers les fichiers
d’enveloppe HTML situ&eacute;s dans le dossier de sortie du projet. Les applications sont donc ex&eacute;cut&eacute;es et d&eacute;bogu&eacute;es dans
la version Flash Player int&eacute;gr&eacute;e dans le navigateur Web utilis&eacute;. Vous avez toutefois la possibilit&eacute; d’ex&eacute;cuter et de
d&eacute;boguer les applications dans la version autonome de Flash Player (voir &laquo; Ex&eacute;cution du fichier d’application SWF
dans la version autonome de Flash Player &raquo; &agrave; la page 95). Vous pouvez en outre remplacer le navigateur Web standard
par tout autre navigateur install&eacute; sur votre ordinateur (voir &laquo; Modification du navigateur Web par d&eacute;faut &raquo; &agrave; la
page 96).
Remarque : les param&egrave;tres de s&eacute;curit&eacute; par d&eacute;faut d’Internet Explorer 6 (ou des versions ult&eacute;rieures) bloquent les
applications lanc&eacute;es &agrave; partir de Flash Builder. Pour les modifier, cliquez sur Outils &gt; Options Internet &gt; Avanc&eacute; &gt;
S&eacute;curit&eacute; &gt; Autoriser le contenu actif &agrave; s’ex&eacute;cuter dans les fichiers de la zone Ordinateur local. Une autre possibilit&eacute;
consiste &agrave; autoriser l’ex&eacute;cution de chaque page Internet Explorer apr&egrave;s son blocage.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 92
Utilisation des projets
Ex&eacute;cution des outils de d&eacute;bogage &agrave; partir de l’&eacute;diteur de code
La perspective D&eacute;bogage Flash contient toutes les fonctions attendues d’un outil de d&eacute;veloppement puissant et
complet. Les outils de d&eacute;bogage vous permettent :
• de d&eacute;finir et de g&eacute;rer des points d’arr&ecirc;t ;
• de d&eacute;terminer comment interrompre, reprendre ou quitter l’application ;
• d’avancer d’un pas avec et sans entr&eacute;e dans le code ;
• de contr&ocirc;ler des variables ;
• d’&eacute;valuer des expressions.
Pour plus d’informations sur les outils de d&eacute;bogage Flash Builder, voir &laquo; D&eacute;bogage des applications &raquo; &agrave; la page 141.
Pour plus d’informations sur la modification du code, voir &laquo; A propos de la modification du code dans Flash Builder &raquo;
&agrave; la page 103.
Activation de la perspective de d&eacute;bogage au niveau d’un point d’arr&ecirc;t
Des points d’arr&ecirc;t peuvent &ecirc;tre ajout&eacute;s &agrave; des lignes de code ex&eacute;cutables dans l’&eacute;diteur de code. Au lancement d’une
session de d&eacute;bogage, l’application est ex&eacute;cut&eacute;e jusqu’au premier point d’arr&ecirc;t rencontr&eacute;. A ce stade, la perspective
D&eacute;bogage Flash est activ&eacute;e. Elle vous permet d’analyser l’&eacute;tat de l’application et de la g&eacute;rer en faisant appel aux outils
de d&eacute;bogage. Pour plus d’informations, voir &laquo; Lancement d’une session de d&eacute;bogage &raquo; &agrave; la page 141.
Comparaison des versions d&eacute;bogu&eacute;es et non d&eacute;bogu&eacute;es d’une application Flex
Par d&eacute;faut, Flash Builder g&eacute;n&egrave;re des versions d&eacute;bogu&eacute;es du fichier SWF de l’application et les enregistre dans le
r&eacute;pertoire bin-debug du projet. Le volume de cette application est sup&eacute;rieur &agrave; celui d’une version non d&eacute;bogu&eacute;e car il
contient du code et des m&eacute;tadonn&eacute;es suppl&eacute;mentaires utilis&eacute;es par le d&eacute;bogueur.
Pour g&eacute;n&eacute;rer une version non d&eacute;bogu&eacute;e de l’application Flex, effectuez l’une des op&eacute;rations suivantes :
• S&eacute;lectionnez Projet &gt; Exporter vers une version valid&eacute;e. Cette op&eacute;ration cr&eacute;e un fichier SWF ou un fichier AIR non
d&eacute;bogu&eacute; dans le r&eacute;pertoire bin-release.
• Ajoutez -debug=false dans le champ Arguments de compilateur suppl&eacute;mentaires. Ceci faisant, un fichier SWF
non d&eacute;bogu&eacute; sera g&eacute;n&eacute;r&eacute; o&ugrave; que vous exportiez le projet.
Ex&eacute;cution des applications
Les applications sont ex&eacute;cut&eacute;es (et d&eacute;bogu&eacute;es) en fonction d’une configuration de lancement. La configuration de
lancement d’une nouvelle application Flex ou ActionScript sp&eacute;cifie l’emplacement des fichiers d’application g&eacute;n&eacute;r&eacute;s
et du fichier principal de l’application. Les configurations de lancement peuvent &ecirc;tre modifi&eacute;es ou personnalis&eacute;es.
Pour plus d’informations, voir &laquo; Gestion des configurations de lancement &raquo; &agrave; la page 94.
L’ex&eacute;cution des projets conduit &agrave; l’ouverture du fichier principal SWF de l’application dans le navigateur Web par
d&eacute;faut ou directement dans la version autonome de Flash Player. Pour plus d’informations sur la modification du
navigateur par d&eacute;faut ou sur l’ex&eacute;cution et le d&eacute;bogage dans la version autonome de Flash Player, voir &laquo; Modification
du navigateur Web par d&eacute;faut &raquo; &agrave; la page 96 et &laquo; Ex&eacute;cution du fichier d’application SWF dans la version autonome de
Flash Player &raquo; &agrave; la page 95.
L’ex&eacute;cution des projets dans Flash Builder peut &ecirc;tre effectu&eacute;e de diff&eacute;rentes mani&egrave;res. Vous pouvez par exemple
utiliser la commande d’ex&eacute;cution &agrave; partir de la barre d’outils et du menu principaux du workbench, de la vue
Explorateur de packages et des menus contextuels de l’&eacute;diteur de code.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 93
Utilisation des projets
Remarque : le bouton Ex&eacute;cuter comporte deux &eacute;l&eacute;ments : le bouton d’action principal et la liste d&eacute;roulante affichant les
fichiers d’application du projet pouvant &ecirc;tre ex&eacute;cut&eacute;s ou d&eacute;bogu&eacute;s. Cliquez sur le bouton d’action principal pour ex&eacute;cuter
le fichier d’application par d&eacute;faut. Vous pouvez &eacute;galement activer la liste d&eacute;roulante et s&eacute;lectionner l’un des fichiers
d’application du projet ainsi que cr&eacute;er ou modifier une configuration de lancement dans la bo&icirc;te de dialogue Cr&eacute;ation,
gestion et ex&eacute;cution d’une configuration.
Ex&eacute;cution du projet avec la configuration de lancement par d&eacute;faut de l’application Flex
1 Dans l’Explorateur de packages, s&eacute;lectionnez le projet que vous souhaitez ex&eacute;cuter.
2 Dans la barre d’outils principale du workbench, cliquez sur le bouton Ex&eacute;cuter.
Si le projet n’a pas encore &eacute;t&eacute; g&eacute;n&eacute;r&eacute;, Flash Builder le g&eacute;n&egrave;re et l’ex&eacute;cute.
L’application s’affiche dans le navigateur Web par d&eacute;faut ou dans la version autonome de Flash Player.
Vous pouvez ex&eacute;cuter et d&eacute;boguer tout fichier de projet d&eacute;fini comme fichier d’application. Pour plus d’informations,
voir &laquo; Gestion des fichiers d’application du projet &raquo; &agrave; la page 52.
Cr&eacute;ation d’une configuration de lancement personnalis&eacute;e
1 Dans l’Explorateur de packages, s&eacute;lectionnez le projet que vous souhaitez ex&eacute;cuter et ouvrez le fichier principal de
l’application dans l’&eacute;diteur.
2 Dans le menu principal, cliquez sur Ex&eacute;cuter &gt; Ex&eacute;cuter &gt; Autre.
3 Dans la bo&icirc;te de dialogue Cr&eacute;ation, gestion et ex&eacute;cution des configurations, s&eacute;lectionnez l’option Application Web
ou Application de bureau.
4 Dans la barre d’outils de la bo&icirc;te de dialogue, cliquez sur le bouton Cr&eacute;e une nouvelle configuration de lancement.
5 Saisissez le nom de la configuration.
6 (Facultatif) Modifiez si n&eacute;cessaire les propri&eacute;t&eacute;s de la configuration.
7 (Facultatif) Cliquez sur Ex&eacute;cuter pour lancer l’ex&eacute;cution de l’application.
Ex&eacute;cution d’autres fichiers d’application du projet
1 Dans l’Explorateur de packages, s&eacute;lectionnez le projet que vous souhaitez ex&eacute;cuter.
2 Dans le menu principal, cliquez sur Ex&eacute;cuter &gt; Ex&eacute;cuter &gt; Autre.
3 S&eacute;lectionnez l’application que vous souhaitez ex&eacute;cuter.
Ex&eacute;cution d’une configuration de lancement personnalis&eacute;e
❖ Dans le menu principal, cliquez sur Ex&eacute;cuter &gt; Ex&eacute;cuter &gt; Autre.
Dans la bo&icirc;te de dialogue Cr&eacute;ation, gestion et ex&eacute;cution des configurations, s&eacute;lectionnez une configuration
personnalis&eacute;e existante ou cr&eacute;ez-en une. Voir &laquo; Gestion des configurations de lancement &raquo; &agrave; la page 94.
L’action de la commande Ex&eacute;cuter de la version plug-in de Flash Builder est l&eacute;g&egrave;rement diff&eacute;rente. Elle n’ex&eacute;cute
pas le projet s&eacute;lectionn&eacute;, mais la derni&egrave;re configuration &agrave; avoir &eacute;t&eacute; lanc&eacute;e. Vous pouvez &eacute;galement s&eacute;lectionner une
configuration parmi la liste de celles &agrave; avoir &eacute;t&eacute; lanc&eacute;es en dernier.
Ex&eacute;cution de la derni&egrave;re configuration lanc&eacute;e
❖ Cliquez sur le bouton Ex&eacute;cuter situ&eacute; dans la barre d’outils principale.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 94
Utilisation des projets
Gestion des configurations de lancement
Les configurations de lancement permettent d’ex&eacute;cuter et de d&eacute;boguer des applications. Flash Builder comporte une
configuration de lancement par d&eacute;faut pour les applications Flex et ActionScript. Lorsque vous ex&eacute;cutez ou d&eacute;boguez
un projet pour la premi&egrave;re fois, le programme cr&eacute;e une configuration de lancement sp&eacute;cifique &agrave; ce projet. Vous pouvez
ensuite modifier le fichier d’application par d&eacute;faut sp&eacute;cifi&eacute; dans la configuration de lancement de m&ecirc;me que le chemin
de lancement par d&eacute;faut, afin que l’application soit ex&eacute;cut&eacute;e ou d&eacute;bogu&eacute;e dans la version autonome de Flash Player
plut&ocirc;t que dans un navigateur Web.
Cr&eacute;ation ou modification d’une configuration de lancement
Un projet cr&eacute;&eacute; et g&eacute;n&eacute;r&eacute; est pr&ecirc;t &agrave; &ecirc;tre ex&eacute;cut&eacute; ou d&eacute;bogu&eacute;. L’ex&eacute;cution et le d&eacute;bogage des applications du projet sont
contr&ocirc;l&eacute;s par une configuration de lancement. Par d&eacute;faut, Flash Builder cr&eacute;e une configuration de lancement pour
chaque fichier d’application du projet ex&eacute;cut&eacute; ou d&eacute;bogu&eacute; pour la premi&egrave;re fois. Les configurations se basent sur la
configuration d’application Flex par d&eacute;faut et peuvent &ecirc;tre modifi&eacute;es.
Les configurations de lancement sont g&eacute;r&eacute;es dans la bo&icirc;te de dialogue Cr&eacute;ation, gestion et ex&eacute;cution des
configurations.
Ouverture et modification d’une configuration de lancement
1 Dans l’Explorateur de packages Flex, s&eacute;lectionnez un projet.
2 Ouvrez un fichier du projet dans l’&eacute;diteur de code, puis la bo&icirc;te de dialogue Cr&eacute;ation, gestion et ex&eacute;cution des
configurations. Cette op&eacute;ration d&eacute;pend de la version d’installation de Flash Builder.
• Pour la version autonome de Flash Builder : s&eacute;lectionnez le projet, puis Ex&eacute;cuter &gt; Ex&eacute;cuter &gt; Autre ou Ex&eacute;cuter
&gt; D&eacute;boguer &gt; Autre.
• Pour la version plug-in de Flash Builder avec Eclipse 3.2 : cliquez avec le bouton droit de la souris (ou en
enfon&ccedil;ant la touche Ctrl sur Mac OS) pour afficher le menu contextuel et s&eacute;lectionnez Ex&eacute;cuter en tant que &gt;
Ex&eacute;cuter ou D&eacute;boguer en tant que &gt; D&eacute;boguer.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 95
Utilisation des projets
• Pour la version plug-in de Flash Builder avec Eclipse 3.3 : cliquez avec le bouton droit de la souris (ou en
enfon&ccedil;ant la touche Ctrl sur Mac OS) pour afficher le menu contextuel et s&eacute;lectionnez Ex&eacute;cuter en tant que &gt;
Ouvrir la bo&icirc;te de dialogue d’ex&eacute;cution ou D&eacute;boguer en tant que &gt; Ouvrir la bo&icirc;te de dialogue de d&eacute;bogage.
3 S&eacute;lectionnez la configuration de lancement que vous souhaitez modifier.
Il est possible que plusieurs configurations soient r&eacute;pertori&eacute;es. C’est le cas notamment si l’espace de travail contient
d’autres projets, si vous avez d&eacute;fini d’autres fichiers de projet comme fichiers d’application ou si d’autres plug-ins
Eclipse sont install&eacute;s.
A la premi&egrave;re ex&eacute;cution d’un projet, Flash Builder cr&eacute;e par d&eacute;faut une configuration de lancement sp&eacute;cifique au
projet, reposant sur la configuration d’application Flex par d&eacute;faut.
Les configurations sp&eacute;cifiques aux applications peuvent &ecirc;tre modifi&eacute;es. Vous pouvez &eacute;galement cr&eacute;er une nouvelle
configuration de lancement ou d&eacute;velopper une nouvelle configuration &agrave; partir d’une configuration existante.
4 Adaptez les param&egrave;tres de la configuration, puis cliquez sur Ex&eacute;cuter ou D&eacute;boguer.
Cr&eacute;ation de configurations de lancement pour applications de bureau
Pour les applications de bureau, vous pouvez cr&eacute;er des configurations de lancement qui remplaceront les
configurations par d&eacute;faut fournies par Flash Builder.
Lors de la cr&eacute;ation ou de la modification d’une configuration de lancement pour une application de bureau, vous devez
sp&eacute;cifier des arguments de ligne de commande, un ID d’&eacute;diteur, un profil et des param&egrave;tres de format d’&eacute;cran.
Pour les applications de bureau, la valeur de Profil peut &ecirc;tre soit desktop, soit extendedDesktop.
Pour cr&eacute;er une configuration de lancement :
1 S&eacute;lectionnez Ex&eacute;cuter &gt; Ex&eacute;cuter &gt; Autre.
Pour les configurations de lancement de d&eacute;bogage, cliquez sur Ex&eacute;cuter &gt; D&eacute;boguer &gt; Autre.
Pour les configurations de lancement de profilage, cliquez sur Ex&eacute;cuter &gt; Profil &gt; Autre.
2 S&eacute;lectionnez le projet de bureau. Cliquez sur le bouton de cr&eacute;ation d’une configuration de lancement.
Acc&eacute;dez aux onglets Principal, Source et Commun pour sp&eacute;cifier les param&egrave;tres de la configuration.
3 S&eacute;lectionnez Ex&eacute;cuter, D&eacute;boguer ou Profiler pour ex&eacute;cuter l’application avec les param&egrave;tres d&eacute;finis.
Cliquez sur Fermer pour enregistrer les param&egrave;tres.
Voir aussi
&laquo; Gestion des configurations de lancement &raquo; &agrave; la page 94
Ex&eacute;cution du fichier d’application SWF dans la version autonome de Flash Player
Les applications sont ex&eacute;cut&eacute;es ou d&eacute;bogu&eacute;es dans le navigateur Web par d&eacute;faut. Vous pouvez toutefois en
s&eacute;lectionner un autre (voir &laquo; Modification du navigateur Web par d&eacute;faut &raquo; &agrave; la page 96). Les applications peuvent
&eacute;galement &ecirc;tre ex&eacute;cut&eacute;es ou d&eacute;bogu&eacute;es dans la version autonome de Flash Player. Il vous suffit pour ce faire de
modifier l&eacute;g&egrave;rement la configuration de lancement.
Ex&eacute;cution et d&eacute;bogage des applications dans la version autonome de Flash Player
1 Dans la bo&icirc;te de dialogue Cr&eacute;ation, gestion et ex&eacute;cution des configurations, s&eacute;lectionnez la configuration de
lancement que vous souhaitez modifier.
2 Dans l’onglet Principal, d&eacute;s&eacute;lectionnez l’option Utiliser la valeur par d&eacute;faut.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 96
Utilisation des projets
3 Cliquez sur le bouton Parcourir du champ Ex&eacute;cuter et/ou du champ D&eacute;boguer.
La bo&icirc;te de dialogue de s&eacute;lection d’un fichier s’ouvre, r&eacute;pertoriant le contenu du dossier de sortie de la g&eacute;n&eacute;ration.
4 S&eacute;lectionnez le fichier d’application SWF du r&eacute;pertoire bin-debug. Ne s&eacute;lectionnez pas le fichier SWF de l’&eacute;ventuel
r&eacute;pertoire bin-release, &eacute;tant donn&eacute; qu’il ne contient aucune information de d&eacute;bogage.
5 Cliquez sur Ouvrir pour s&eacute;lectionner le fichier et retourner &agrave; la bo&icirc;te de dialogue de configuration.
6 Validez les modifications apport&eacute;es et ex&eacute;cutez ou d&eacute;boguez l’application en utilisant la configuration modifi&eacute;e.
Modification du navigateur Web par d&eacute;faut
L’ex&eacute;cution et le d&eacute;bogage des applications sont effectu&eacute;s dans le navigateur Web d&eacute;fini par d&eacute;faut. Vous ne pouvez
pas d&eacute;finir un navigateur Web diff&eacute;rent pour chaque configuration de lancement. Vous pouvez toutefois modifier le
navigateur Web d&eacute;fini pour le workbench, ce qui aura une incidence sur l’ex&eacute;cution et le d&eacute;bogage de toutes les
applications.
Modification du navigateur Web par d&eacute;faut
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Navigateur Web.
2 S&eacute;lectionnez un navigateur dans la liste de ceux install&eacute;s sur le syst&egrave;me.
Remarque : l’option Utiliser le navigateur Web interne ne concerne pas l’ex&eacute;cution et le d&eacute;bogage des applications, ces
op&eacute;rations &eacute;tant toujours effectu&eacute;es dans un navigateur Web externe.
Vous pouvez &eacute;galement ajouter des navigateurs &agrave; la liste, en supprimer ou &eacute;diter ceux qui y sont r&eacute;pertori&eacute;s.
3 Cliquez sur OK pour appliquer les modifications.
Cr&eacute;ation de modules
Adobe&reg; Flash&reg; Builder™ permet de cr&eacute;er, d’ajouter, d’optimiser et de d&eacute;boguer des modules. Pour plus d’informations
sur la r&eacute;daction de code de module, voir Creating modular applications.
Cr&eacute;ation de modules dans Flash Builder
Les &eacute;tapes suivantes d&eacute;crivent la proc&eacute;dure de cr&eacute;ation d’un nouveau module dans Flash Builder. Apr&egrave;s avoir cr&eacute;&eacute; un
nouveau module, vous pouvez le compiler.
Cr&eacute;ation de modules dans Flash Builder
1 Dans Flash Builder, s&eacute;lectionnez Fichier &gt; Nouveau &gt; Module MXML. La bo&icirc;te de dialogue Cr&eacute;ation d’un(e)
module MXML s’affiche.
2 S&eacute;lectionnez un r&eacute;pertoire parent pour le module. Les modules sont habituellement stock&eacute;s dans le m&ecirc;me
r&eacute;pertoire que l’application principale, pour que les chemins relatifs des ressources partag&eacute;es soient identiques.
Les modules &eacute;tant ex&eacute;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&eacute;t&eacute;s Largeur, Hauteur et Pr&eacute;sentation.
5 Indiquez si vous souhaitez ou non optimiser le module.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 97
Utilisation des projets
L’optimisation d’un module pour une application signifie que les classes utilis&eacute;es par l’application sont exclues du
module, ce qui peut contribuer &agrave; r&eacute;duire le volume de t&eacute;l&eacute;chargement des fichiers SWF. Pour plus d’informations,
voir &laquo; Optimisation de modules dans Flash Builder &raquo; &agrave; la page 101.
• Optimiser pour l’application
Si vous activez cette option, sp&eacute;cifiez l’application pour laquelle le module doit &ecirc;tre optimis&eacute;.
• Ne pas optimiser
Si vous activez cette option, toutes les classes sont incluses dans le module, qu’elles soient d&eacute;finies ou non dans
l’application principale, am&eacute;liorant ainsi les performances de la compilation d’incr&eacute;mentation. Vous pouvez en
outre charger le module dans n’importe quelle application, toutes ses d&eacute;pendances y &eacute;tant compil&eacute;es.
6 Cliquez sur Terminer.
Flash Builder ajoute un nouveau fichier de module MXML dans le projet.
Compilation de modules dans Flash Builder
Dans Flash Builder, vous pouvez ex&eacute;cuter le module comme une application ou g&eacute;n&eacute;rer le projet du module. Si les
modules figurent dans le m&ecirc;me projet que l’application, alors Flash Builder compile automatiquement les fichiers SWF
pour tous les modules du projet lorsque vous ex&eacute;cutez l’application. Les fichiers SWF sont ensuite charg&eacute;s dans
l’application lors de l’ex&eacute;cution.
Il est impossible d’ex&eacute;cuter le fichier SWF bas&eacute; sur un module comme une application Flash autonome ou de le charger
dans une fen&ecirc;tre de navigateur. Il doit &ecirc;tre charg&eacute; par une application en tant que module. Si vous ex&eacute;cutez le module
dans Flash Builder pour le compiler, fermez Adobe Flash Player ou la fen&ecirc;tre du navigateur et ignorez les erreurs
&eacute;ventuelles. Les modules ne doivent pas &ecirc;tre sollicit&eacute;s directement par Flash Player ou par l’interm&eacute;diaire d’un
navigateur.
Les fichiers SWF du module et le fichier SWF de l’application principale se trouvent g&eacute;n&eacute;ralement dans le m&ecirc;me
r&eacute;pertoire. Flash Builder compile toutefois les modules en m&ecirc;me temps que l’application, quel que soit leur
emplacement. Les modules peuvent se situer dans le m&ecirc;me r&eacute;pertoire que l’application ou dans des sous-r&eacute;pertoires.
Vous pouvez &eacute;galement cr&eacute;er un projet Flex ou ActionScript distinct pour chaque module ou groupe de modules. Il
en r&eacute;sulte une meilleure ma&icirc;trise de la compilation des modules, les options de compilateur de chaque projet pouvant
diff&eacute;rer de celles de l’application ou des autres modules. Cela permet &eacute;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&egrave;re de proc&eacute;der consiste &agrave; compiler simultan&eacute;ment tous les projets ouverts
dans Flash Builder.
Si vous compilez les modules ind&eacute;pendamment de l’application principale, veillez &agrave; inclure ou exclure les informations
de d&eacute;bogage, selon que vous souhaitez d&eacute;boguer l’application et les modules. Pour plus d’informations, voir
&laquo; D&eacute;bogage de modules dans Flash Builder &raquo; &agrave; la page 101.
Le d&eacute;roulement du travail dans Flash Builder est con&ccedil;u pour l’association de modules avec une m&ecirc;me application.
Pour utiliser des modules dans plusieurs applications, encapsulez &eacute;ventuellement le code dans une classe ou un
composant de biblioth&egrave;que &agrave; inclure dans un module simple pour chaque application. Contrairement aux
biblioth&egrave;ques, les modules ne sont pas destin&eacute;s &agrave; une utilisation dans le code commun &agrave; plusieurs applications.
Utilisation de plusieurs projets pour des modules
Lors de la d&eacute;finition de l’architecture de votre projet, vous pouvez d&eacute;cider d’inclure des modules dans votre projet
d’application, de cr&eacute;er un projet distinct pour chaque module ou de cr&eacute;er un projet distinct pour l’ensemble des
modules.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 98
Utilisation des projets
Utilisation d’un projet pour chaque module
L’utilisation d’un projet pour chaque module pr&eacute;sente les avantages suivants :
• Les projets de module peuvent figurer &agrave; un emplacement quelconque de l’espace de travail.
• Les projets de module peuvent disposer de param&egrave;tres de compilateur distincts, tel qu’un chemin d’acc&egrave;s &agrave; la
biblioth&egrave;que personnalis&eacute;.
Ils peuvent utiliser l’option de compilateur load-externs pour supprimer les d&eacute;pendances qui se recoupent.
L’utilisation d’un projet pour chaque module pr&eacute;sente les inconv&eacute;nients suivants :
• La m&eacute;moire n&eacute;cessaire augmente avec le nombre de projets.
• L’existence de nombreux projets dans un m&ecirc;me espace de travail peut augmenter son encombrement.
• Par d&eacute;faut, lorsque vous compilez l’application, tous les projets de module ne sont pas compil&eacute;s, m&ecirc;me s’ils ont subi
des modifications.
• Pour optimiser la taille du fichier du module, appliquez manuellement les options de compilateur load-externs
et link-report.
Utilisation d’un projet pour tous les modules
Une approche semblable consiste &agrave; utiliser un m&ecirc;me projet pour l’ensemble des modules, en conservant l’application
dans son propre projet distinct. Certains inconv&eacute;nients, li&eacute;s &agrave; l’utilisation d’un m&ecirc;me projet &agrave; la fois pour l’application
et les modules, subsistent. Cette approche apporte toutefois de nombreux avantages d&eacute;coulant de l’utilisation d’un
projet distinct pour chaque module.
L’utilisation d’un projet pour l’ensemble des modules pr&eacute;sente les avantages suivants :
• Le projet de module peut figurer &agrave; un emplacement quelconque de l’espace de travail.
• Vous pouvez compiler s&eacute;par&eacute;ment les modules ou l’application, sans n&eacute;cessit&eacute; de compiler les deux simultan&eacute;ment.
• Le projet de module peut utiliser l’option de compilateur load-externs pour supprimer les d&eacute;pendances qui se
recoupent.
L’utilisation d’un projet de module pour l’ensemble des modules pr&eacute;sente les inconv&eacute;nients suivants :
• Tous les modules du projet de module doivent utiliser les m&ecirc;mes param&egrave;tres de compilateur, tel que le chemin
d’acc&egrave;s &agrave; la biblioth&egrave;que.
• Par d&eacute;faut, lorsque vous compilez l’application, le projet de module n’est pas compil&eacute;, m&ecirc;me s’il a subi des
modifications.
• Pour optimiser la taille du fichier du module, vous devez appliquer manuellement les options de compilateur loadexterns et link-report.
Cr&eacute;ation de projets pour des modules
Lors de la cr&eacute;ation d’un projet s&eacute;par&eacute; pour les modules, vous modifiez le dossier de sortie du projet de module sur un
r&eacute;pertoire utilis&eacute; par l’application. Vous supprimez &eacute;galement la cr&eacute;ation de fichiers d’enveloppe.
Cr&eacute;ation d’un projet distinct pour les modules dans Flash Builder
1 Cr&eacute;ez un projet principal.
2 Cr&eacute;ez un nouveau projet pour le ou les modules.
3 Dans le menu contextuel du projet du module, s&eacute;lectionnez Propri&eacute;t&eacute;s. La bo&icirc;te de dialogue Propri&eacute;t&eacute;s s’ouvre.
4 S&eacute;lectionnez l’option Chemin de g&eacute;n&eacute;ration Flex.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 99
Utilisation des projets
5 Modifiez le dossier de sortie de mani&egrave;re telle &agrave; ce qu’il pointe vers le r&eacute;pertoire des modules MainProject, comme
illustr&eacute; dans l’exemple ci-dessous :
${DOCUMENTS}\MainProject\assets
Cette modification redirige la sortie de compilation du module vers le r&eacute;pertoire des ressources du projet
d’application (MainProject). Dans l’application principale, vous pouvez d&eacute;finir la propri&eacute;t&eacute; url de ModuleLoader
sur les fichiers SWF du r&eacute;pertoire des ressources. La valeur de cette propri&eacute;t&eacute; est relative au dossier de sortie.
6 Cliquez sur OK pour enregistrer vos modifications.
7 Ouvrez &agrave; nouveau les propri&eacute;t&eacute;s du projet et s&eacute;lectionnez l’option Compilateur Flex.
8 D&eacute;s&eacute;lectionnez l’option G&eacute;n&eacute;rer le fichier d’enveloppe HTML afin d’&eacute;viter que le projet du module ne g&eacute;n&egrave;re les
fichiers d’enveloppe HTML. Ces fichiers ne sont g&eacute;n&eacute;ralement utilis&eacute;s que pour l’application et sont inutiles pour
les modules.
9 Cliquez sur OK pour appliquer les modifications.
Compilation de projets pour les modules
La compilation de plusieurs projets dans Flash Builder est une op&eacute;ration courante. Choisissez d’abord l’ordre de
compilation souhait&eacute;, puis compilez l’ensemble des projets simultan&eacute;ment.
Compilation simultan&eacute;e de tous les projets dans Flash Builder
❖ Dans le menu principal, s&eacute;lectionnez Projets &gt; G&eacute;n&eacute;rer tout.
Flex g&eacute;n&egrave;re alors l’ensemble des projets de l’espace de travail. Les fichiers d’application sont ajout&eacute;s au dossier de
sortie de chaque projet. Si vous n’avez pas choisi l’enregistrement automatique des fichiers avant le d&eacute;but d’une
g&eacute;n&eacute;ration, vous &ecirc;tes invit&eacute; &agrave; enregistrer les fichiers.
Pour modifier l’ordre de g&eacute;n&eacute;ration, utilisez la bo&icirc;te de dialogue Ordre de g&eacute;n&eacute;ration. La modification de l’ordre de
g&eacute;n&eacute;ration n’est pas toujours n&eacute;cessaire. Les projets utilisant des modules ne doivent &ecirc;tre compil&eacute;s qu’avant
l’ex&eacute;cution de l’application de projet principale, et non lors de sa compilation. Dans la plupart des cas, l’ordre de
g&eacute;n&eacute;ration par d&eacute;faut ne doit pas &ecirc;tre modifi&eacute;.
Si toutefois vous souhaitez &eacute;liminer les d&eacute;pendances qui se recoupent, vous pouvez modifier l’ordre de g&eacute;n&eacute;ration afin
de compiler d’abord l’application principale. L’option de compilateur link-report permet alors de g&eacute;n&eacute;rer le rapport
de liaison. Lorsque vous compilez les modules, l’option de compilateur load-externs permet d’utiliser le rapport de
liaison g&eacute;n&eacute;r&eacute; r&eacute;cemment par l’application principale. Pour plus d’informations sur la r&eacute;duction de la taille des
modules, voir &laquo; Optimisation de modules dans Flash Builder &raquo; &agrave; la page 101.
Modification de l’ordre de g&eacute;n&eacute;ration des projets
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Espace de travail &gt; Ordre de g&eacute;n&eacute;ration.
La bo&icirc;te de dialogue Ordre de g&eacute;n&eacute;ration appara&icirc;t.
2 D&eacute;s&eacute;lectionnez la case &agrave; cocher Utiliser l’ordre de g&eacute;n&eacute;ration par d&eacute;faut.
3 Utilisez les boutons Haut et Bas pour reclasser les projets de la liste Ordre de g&eacute;n&eacute;ration. Vous pouvez &eacute;galement
utilisez le bouton Supprimer un projet pour supprimer les projets qui ne font pas partie de l’application principale
ou qui ne sont pas des modules utilis&eacute;s par l’application. Dans ce cas, le projet supprim&eacute; sera g&eacute;n&eacute;r&eacute; mais
uniquement apr&egrave;s tous les autres projets de la liste.
4 Cliquez sur OK.
5 Modifiez si n&eacute;cessaire l’ordre de g&eacute;n&eacute;ration, puis cliquez sur OK.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 100
Utilisation des projets
En pr&eacute;sence de d&eacute;pendances entre des projets distincts de l’espace de travail, le compilateur d&eacute;termine
automatiquement l’ordre dans lequel les projets sont g&eacute;n&eacute;r&eacute;s afin de r&eacute;soudre correctement les d&eacute;pendances.
Si vous utilisez un projet distinct pour chaque module, vous pouvez compiler un seul module &agrave; la fois. Cela permet de
gagner du temps par rapport &agrave; la compilation simultan&eacute;e de tous les projets, ou par rapport &agrave; 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&eacute;lectionnez Ex&eacute;cuter l’application. La fen&ecirc;tre du lecteur ou du navigateur tente d’ex&eacute;cuter le module apr&egrave;s sa
compilation. Vous pouvez fermer la fen&ecirc;tre du lecteur ou du navigateur et ignorer les messages d’erreur &eacute;ventuels
qui s’affichent lors de l’ex&eacute;cution. Les modules ne sont pas destin&eacute;s &agrave; une ex&eacute;cution directe dans le lecteur ou dans
un navigateur.
Ajout de modules au projet
Vous serez amen&eacute;, dans certaines situations, &agrave; 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&eacute;es. Vous pouvez &eacute;galement vouloir partager le module entre plusieurs applications. Ajoutez le code source
du module au chemin source de l’application, puis ajoutez le module &agrave; la liste de modules de l’application afin de
pouvoir l’utiliser dans le projet.
Ajout d’un module pr&eacute;alablement compil&eacute; au projet
1 S&eacute;lectionnez l’application principale dans l’Explorateur de packages Flex.
2 S&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Chemin de g&eacute;n&eacute;ration Flex pour ajouter la source du module au chemin source
du projet d’application.
3 Cliquez sur le bouton Ajouter un dossier et acc&eacute;dez au chemin source du module. Cliquez sur OK pour s&eacute;lectionner
le module. R&eacute;p&eacute;tez cette proc&eacute;dure pour chaque module externe &agrave; ajouter au projet de l’application.
4 Cliquez &agrave; nouveau sur OK pour enregistrer vos modifications.
5 S&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Modules Flex pour ajouter le module &agrave; la liste de modules de l’application. La
bo&icirc;te de dialogue Modules Flex liste l’ensemble des modules ajout&eacute;s au projet actif ou figurant dans ce projet. Lors
de la cr&eacute;ation initiale d’un projet, cette bo&icirc;te de dialogue est vide.
6 Cliquez sur le bouton Ajouter. La bo&icirc;te de dialogue Ajouter un module s’affiche.
7 Utilisez le bouton Parcourir ou entrez l’emplacement du fichier MXML du module dans la zone de texte Source.
Tous les modules figurant dans le chemin source du projet peuvent &ecirc;tre ajout&eacute;s &agrave; l’aide de cette bo&icirc;te de dialogue.
8 S&eacute;lectionnez l’un des boutons radio Taille du fichier SWF du module pour activer ou d&eacute;sactiver l’optimisation de
module. Si vous s&eacute;lectionnez Optimiser pour l’application, Flash Builder compile le module pour l’application
s&eacute;lectionn&eacute;e en excluant toutes les classes d&eacute;finies dans l’application principale. Il peut s’agir de classes de structure
ou de classes personnalis&eacute;es. Lorsque vous s&eacute;lectionnez cette option, le module ne peut pas &ecirc;tre utilis&eacute; dans une
autre application car la liste de classes exclues peut &ecirc;tre diff&eacute;rente. Pour plus d’informations, voir &laquo; Optimisation
de modules dans Flash Builder &raquo; &agrave; la page 101.
9 Cliquez sur OK pour enregistrer vos modifications. Flash Builder ajoute le module &agrave; la liste des modules disponibles
dans le projet de l’application.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 101
Utilisation des projets
Optimisation de modules dans Flash Builder
Dans Flash Builder, vous ne s&eacute;lectionnez g&eacute;n&eacute;ralement qu’une seule application par rapport &agrave; laquelle le module doit
&ecirc;tre optimis&eacute; lors de sa cr&eacute;ation initiale ou de son ajout au projet. Si vous d&eacute;cidez par la suite de changer l’application
vis&eacute;e par l’optimisation du module, ou de ne pas optimiser le module, vous pouvez modifier les propri&eacute;t&eacute;s du module
au sein du projet. Pour plus d’informations, voir Reducing module size.
Optimisation de modules avec Flash Builder
Cette proc&eacute;dure part du principe que le module et l’application se trouvent dans le m&ecirc;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
s&eacute;lectionnez Propri&eacute;t&eacute;s. La bo&icirc;te de dialogue Propri&eacute;t&eacute;s du projet s’ouvre.
2 Dans le volet de gauche, s&eacute;lectionnez Modules Flex.
3 S&eacute;lectionnez le module dans la liste et cliquez sur le bouton Modifier. La bo&icirc;te de dialogue Modifier le module
s’affiche.
4 Pour supprimer l’optimisation, s&eacute;lectionnez le bouton radio Ne pas optimiser sous Taille du fichier SWF du
module.
5 Afin d’optimiser le module pour une autre application, s&eacute;lectionnez la nouvelle application dans la liste d&eacute;roulante
Optimiser pour l’application.
6 Cliquez sur OK.
Pour optimiser davantage la taille du fichier d’un module, vous pouvez supprimer les informations de d&eacute;bogage. Lors
de la g&eacute;n&eacute;ration d’un module dans Flash Builder, les informations de d&eacute;bogage y sont incluses par d&eacute;faut. En les
supprimant, vous pouvez r&eacute;duire la taille du module. Pour obtenir des instructions sur la proc&eacute;dure de suppression
des informations de d&eacute;bogage des modules, voir &laquo; D&eacute;bogage de modules dans Flash Builder &raquo; &agrave; la page 101.
D&eacute;bogage de modules dans Flash Builder
Pour d&eacute;boguer des modules et des applications, il est n&eacute;cessaire d’inclure des informations de d&eacute;bogage dans les
fichiers SWF lors de leur compilation. Dans Flash Builder, il suffit d’ex&eacute;cuter l’application, puisque les informations
de d&eacute;bogage sont incluses par d&eacute;faut. A la ligne de commande, d&eacute;finissez l’option de compilateur debug sur true. La
valeur par d&eacute;faut est true, mais si vous l’avez d&eacute;sactiv&eacute;e dans un fichier de configuration, veillez &agrave; le remplacer.
Par d&eacute;faut, Flash Builder g&eacute;n&egrave;re un seul fichier SWF comprenant des symboles de d&eacute;bogage. Les instructions
D&eacute;boguer et Ex&eacute;cuter fonctionnent donc toutes les deux lors de l’ex&eacute;cution d’une application utilisant des modules
dans Flash Builder. Toutefois, l’inclusion de symboles de d&eacute;bogage dans le fichier SWF d’un module augmente sa taille.
Pour exclure les symboles de d&eacute;bogage avant le d&eacute;ploiement, d&eacute;sactivez le d&eacute;bogage pour les modules de l’application.
Pour ce faire, exportez la version valid&eacute;e des modules en s&eacute;lectionnant Projet &gt; Exporter vers une version valid&eacute;e.
Pour exclure les informations de d&eacute;bogage des fichiers SWF dans Flash Builder, vous pouvez d&eacute;finir l’option debug
sur false dans la zone de texte des arguments de compilateur suppl&eacute;mentaires, ou g&eacute;n&eacute;rer des fichiers SWF sans
d&eacute;bogage en les exportant &agrave; l’aide de la fonctionnalit&eacute; Exporter vers une version valid&eacute;e. Cela inclut les modules, s’ils
figurent dans le projet actif.
Si vous cr&eacute;ez un projet distinct pour les modules, vous pouvez activer ou d&eacute;sactiver le d&eacute;bogage pour l’ensemble du
projet sans modifier les param&egrave;tres de l’application principale.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 102
Utilisation des projets
Pour d&eacute;boguer un module, vous devez &eacute;galement d&eacute;boguer son application de chargement. Le d&eacute;bogueur Flex ne se
connecte pas aux applications d&eacute;pourvues d’informations de d&eacute;bogage, m&ecirc;me si les modules charg&eacute;s par l’application
les contiennent. En d’autres termes, vous ne pouvez pas exclure les informations de d&eacute;bogage de l’application si vous
souhaitez d&eacute;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&ecirc;me
r&eacute;pertoire que le fichier SWF de l’application, ou dans l’un de ses sous r&eacute;pertoires.
Derni&egrave;re mise &agrave; jour le 29/4/2010
Chapitre 4 : Modification du code dans
Flash Builder
Dans Adobe&reg; Flash&reg; Builder™, la modification des codes MXML, ActionScript et CSS advient dans des &eacute;diteurs
diff&eacute;rents. Le workbench de Flash Builder int&egrave;gre &agrave; la fois les projets et les documents, permettant ainsi l’ouverture
automatique de l’&eacute;diteur correspondant au type de ressource. Les &eacute;diteurs de Flash Builder partagent les m&ecirc;mes
fonctionnalit&eacute;s, parmi lesquelles les indicateurs de code, la navigation, le formatage, la restructuration ainsi que
d’autres fonctions d’am&eacute;lioration de la productivit&eacute;.
A propos de la modification du code dans Flash Builder
La cr&eacute;ation et le d&eacute;veloppement d’applications Flex et ActionScript a lieu dans la perspective D&eacute;veloppement Flash qui
se compose des &eacute;diteurs Flash Builder ainsi que de toutes les vues prenant en charge les op&eacute;rations de modification et
de cr&eacute;ation de code. La configuration de la perspective de d&eacute;veloppement d&eacute;pend de l’&eacute;diteur et du mode utilis&eacute;s. Lors
de la cr&eacute;ation d’un projet Flex par exemple, l’&eacute;diteur MXML pr&eacute;sente deux modes (Source et Cr&eacute;ation), contenant
chacun sa propre gamme de vues. Pour une pr&eacute;sentation g&eacute;n&eacute;rale de la perspective de d&eacute;veloppement Flash, voir
&laquo; Perspective D&eacute;veloppement Flash &raquo; &agrave; la page 8.
Editeurs MXML, ActionScript et CSS
Flash Builder contient trois &eacute;diteurs pour la r&eacute;daction de code MXML, ActionScript et CSS.
L’&eacute;diteur MXML permet de modifier les fichiers MXML. Il se compose de deux modes : Source et Cr&eacute;ation. Le mode
Source vous permet de r&eacute;diger du code MXML et d’int&eacute;grer les codes ActionScript et CSS contenus dans les balises
&lt;fx:Script&gt; et &lt;fx:Style&gt;. Le mode Cr&eacute;ation vous permet de cr&eacute;er des applications (voir &laquo; Cr&eacute;ation d’une interface
utilisateur avec Flash Builder &raquo; &agrave; la page 188).
L’&eacute;diteur ActionScript permet de modifier les fichiers AS, dont les principaux fichiers des projets ActionScript ainsi
que les fichiers de classe et d’interface. Pour plus d’informations, voir &laquo; Projets ActionScript &raquo; &agrave; la page 66.
L’&eacute;diteur CSS permet d’&eacute;crire des fichiers CSS (Cascading Style Sheets). Pour plus d’informations, voir &laquo; Application
de styles &raquo; &agrave; la page 213 et Styles and themes.
Assistant de contenu MXML, ActionScript et CSS
En cours de r&eacute;daction de code MXML, ActionScript et CSS, des indicateurs et des documents de r&eacute;f&eacute;rence ASDoc
s’affichent afin de faciliter la saisie. Cette fonction porte le nom d’assistant de contenu. Flash Builder acc&eacute;l&egrave;re par
ailleurs le d&eacute;veloppement de code en compl&eacute;tant les balises MXML, en proposant une gestion automatique de
l’importation, en int&eacute;grant le Guide de r&eacute;f&eacute;rence du langage Adobe Flex et en permettant de d&eacute;finir des couleurs et des
polices diff&eacute;rentes pour l’affichage du code dans l’espace de travail. Pour plus d’informations, voir &laquo; Aide au codage
dans Flash Builder &raquo; &agrave; la page 105.
Indicateurs de code pour les composants personnalis&eacute;s ainsi que pour les classes et interfaces ActionScript
Outre la prise en charge int&eacute;gr&eacute;e pour la structure Flex, des indicateurs de code sont fournis pour tous les composants
personnalis&eacute;s ainsi que pour les classes et les interfaces ActionScript comprises dans le projet. Pour plus
d’informations, voir &laquo; Utilisation de l’assistant de contenu &raquo; &agrave; la page 108.
103
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 104
Modification du code dans Flash Builder
S&eacute;lection de types recommand&eacute;s pour les espaces de noms
Flash Builder comporte des filtres et un assistant de contenu pour vous permettre d’identifier les types recommand&eacute;s
pour un espace de noms. Vous pouvez &eacute;galement faire d&eacute;filer les diff&eacute;rents filtres et param&egrave;tres afin de localiser tous
les types, propri&eacute;t&eacute;s et &eacute;v&eacute;nements mis &agrave; disposition par la structure Flex. Pour plus d’informations, voir &laquo; Utilisation
de l’assistant de contenu &raquo; &agrave; la page 108.
G&eacute;n&eacute;ration des fonctions des accesseurs (Get et Set)
Les fonctions des accesseurs Get et Set vous permettent de faire en sorte que les propri&eacute;t&eacute;s d’une classe restent priv&eacute;es
pour une classe ActionScript. Les utilisateurs de la classe peuvent acc&eacute;der &agrave; ces propri&eacute;t&eacute;s de la m&ecirc;me fa&ccedil;on que s’ils
acc&eacute;daient &agrave; une variable de classe (plut&ocirc;t que d’appeler une m&eacute;thode de classe). Flash Builder peut g&eacute;n&eacute;rer des
fonctions d’accesseur Get et Set ActionScript pour les variables de classe. Pour plus d’informations, voir &laquo; G&eacute;n&eacute;ration
des fonctions d’accesseur &raquo; &agrave; la page 68.
Simplification de la navigation dans le code
Afin de faciliter l’acc&egrave;s aux nombreux fichiers et lignes de code que contiennent les projets, Flash Builder propose des
fonctions pratiques telles que, parmi d’autres, le d&eacute;veloppement et la r&eacute;duction de blocs de code, l’ouverture des
sources de d&eacute;finitions de code externes ainsi que la recherche et l’ouverture de types de classe. De plus, la vue Structure
permet d’examiner la structure du code des documents et d’en parcourir les lignes. Pour plus d’informations, voir
&laquo; Navigation et organisation du code &raquo; &agrave; la page 111.
Recherche de r&eacute;f&eacute;rences et restructuration de code
Flash Builder peut rechercher toutes les r&eacute;f&eacute;rences et les d&eacute;clarations correspondant aux identifiants d’un fichier, d’un
projet ou d’un espace de travail donn&eacute;. La recherche porte &eacute;galement sur les &eacute;l&eacute;ments reli&eacute;s &agrave; partir de fichiers SWC
ainsi que les entr&eacute;es des chemins de biblioth&egrave;que (classes, interfaces, fonctions, variables et quelques m&eacute;tadonn&eacute;es, par
exemple). La restructuration renomme les identifiants du code tout en mettant &agrave; jour toutes les r&eacute;f&eacute;rences qui y sont
faites dans l’ensemble de la base de code. Pour plus d’informations, voir &laquo; Recherche de r&eacute;f&eacute;rences et restructuration
de code &raquo; &agrave; la page 118.
V&eacute;rification automatique de la syntaxe
Flash Builder g&eacute;n&egrave;re les projets de mani&egrave;re incr&eacute;mentielle, en vous signalant d’&eacute;ventuelles erreurs au fur et &agrave; mesure
que vous progressez dans votre travail. En cas d’erreurs de syntaxe en cours de r&eacute;daction de code MXML et
ActionScript, des indicateurs d’erreur s’affichent dans l’&eacute;diteur &agrave; la hauteur de la ligne de code concern&eacute;e et un message
appara&icirc;t dans la vue Erreurs. Pour plus d’informations, voir &laquo; Application des pr&eacute;f&eacute;rences de couleurs pour la
syntaxe &raquo; &agrave; la page 125.
Coloration de la syntaxe
La page Couleurs pour la syntaxe des Pr&eacute;f&eacute;rences d&eacute;finit les couleurs &agrave; appliquer au code dans les &eacute;diteurs MXML,
ActionScript et CSS. Vous pouvez &eacute;galement y d&eacute;finir des options de style pour la police et en afficher un aper&ccedil;u. Pour
plus d’informations, voir &laquo; Comment obtenir de l’aide pour la r&eacute;daction de code &raquo; &agrave; la page 110 et &laquo; Utilisation de
l’assistant de contenu &raquo; &agrave; la page 108.
Editeur et int&eacute;gration d’un d&eacute;bogueur
Les &eacute;diteurs MXML et ActionScript associ&eacute;s &agrave; la perspective D&eacute;bogage Flash facilitent le d&eacute;bogage du code. Par la
d&eacute;finition de points d’arr&ecirc;t, vous pouvez interrompre l’application au niveau de lignes de code susceptibles de
provoquer des difficult&eacute;s ou pr&eacute;sentant une importance particuli&egrave;re. Au lancement d’une session de d&eacute;bogage, la
perspective D&eacute;bogage Flash s’affiche lorsque le premier point d’arr&ecirc;t est atteint. Vous pouvez alors examiner l’&eacute;tat de
l’application et isoler, puis r&eacute;soudre tout probl&egrave;me survenant dans le code. Pour plus d’informations sur le d&eacute;bogage
du code, voir &laquo; D&eacute;bogage des applications &raquo; &agrave; la page 141.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 105
Modification du code dans Flash Builder
Aide au codage dans Flash Builder
Les &eacute;diteurs Flash Builder proposent plusieurs fonctions facilitant le d&eacute;veloppement de code.
Assistant de contenu
L’assistant de contenu est disponible dans les &eacute;diteurs MXML, ActionScript et CSS. Il fournit des indicateurs de code
qui vous aident &agrave; compl&eacute;ter les expressions de code. Il facilite &eacute;galement la s&eacute;lection des classes, propri&eacute;t&eacute;s et
&eacute;v&eacute;nements recommand&eacute;s, disponibles dans un espace de noms. Pour plus d’informations, voir &laquo; A propos de
l’assistant de contenu &raquo; &agrave; la page 106.
Gestion automatique de l’importation
Lorsque vous saisissez du code avec l’assistant de contenu, les noms complets des types sont automatiquement
import&eacute;s dans le document. Dans un document ActionScript, le nom complet du type est ajout&eacute; en t&ecirc;te de document
avec les autres instructions d’importation. Dans un document MXML, l’instruction d’importation est ajout&eacute;e au bloc
de script existant. En l’absence de bloc de script, Flash Builder en cr&eacute;e un. Les documents ActionScript offrent
&eacute;galement la possibilit&eacute; de trier les instructions d’importation. Pour plus d’informations, voir &laquo; Organisation des
instructions d’importation &raquo; &agrave; la page 116.
Remplissage des balises MXML
Lors de la saisie de code MXML, de nombreux &eacute;l&eacute;ments de la syntaxe sont ajout&eacute;s automatiquement, dont les balises
de fermeture, les mises en retrait et les nouvelles lignes. En outre, les balises CDATA sont automatiquement plac&eacute;es &agrave;
l’int&eacute;rieur de balises &lt;fx:Script&gt;.
Utilisation des &eacute;tats d’affichage
En mode Source, l’&eacute;diteur MXML facilite l’&eacute;dition des &eacute;tats d’affichage. Lorsque des &eacute;tats d’affichage ont &eacute;t&eacute; d&eacute;finis &agrave;
la racine de l’application, l’&eacute;diteur comporte la liste d&eacute;roulante Afficher &eacute;tat. Servez-vous de cette liste pour mettre en
&eacute;vidence l’&eacute;tat s&eacute;lectionn&eacute; dans l’&eacute;diteur. L’assistant de contenu facilite &eacute;galement la s&eacute;lection des &eacute;tats d’affichage
pour les composants et les propri&eacute;t&eacute;s. Pour plus d’informations sur ce point ainsi que sur d’autres aspects de l’&eacute;dition
des &eacute;tats d’affichage, voir &laquo; Cr&eacute;ation et &eacute;dition d’&eacute;tats d’affichage dans le code source &raquo; &agrave; la page 231.
Documentation de r&eacute;f&eacute;rence ASDoc
Flash Builder affiche les documents de r&eacute;f&eacute;rence ASDoc dans les &eacute;diteurs MXML et ActionScript lorsque vous utilisez
un assistant de contenu ou survolez un type avec le curseur. La documentation ASDoc appara&icirc;t &eacute;galement dans la vue
ASDoc pour les classes s&eacute;lectionn&eacute;es. Cette fonctionnalit&eacute; prend en charge la documentation ASDoc g&eacute;n&eacute;r&eacute;e par les
utilisateurs.
Pour plus d’informations, voir &laquo; D&eacute;finition de commentaires ASDoc pour les composants personnalis&eacute;s &raquo; &agrave; la
page 136.
Cr&eacute;ation de gestionnaires d’&eacute;v&eacute;nement
Les &eacute;diteurs Flash Builder aident l’utilisateur &agrave; cr&eacute;er des gestionnaires d’&eacute;v&eacute;nement pour les composants. Pour chaque
&eacute;v&eacute;nement d’un composant, vous pouvez g&eacute;n&eacute;rer un gestionnaire d’&eacute;v&eacute;nement entour&eacute; de balises &lt;Script&gt;. Ce
gestionnaire est r&eacute;f&eacute;renc&eacute; par la propri&eacute;t&eacute; event dans la balise du composant.
Pour plus d’informations, voir &laquo; Cr&eacute;ation de gestionnaires d’&eacute;v&eacute;nement &raquo; &agrave; la page 208.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 106
Modification du code dans Flash Builder
Aide contextuelle de r&eacute;f&eacute;rence du langage
Le Guide de r&eacute;f&eacute;rence du langage Adobe Flex est int&eacute;gr&eacute; &agrave; l’&eacute;diteur et est facilement accessible en s&eacute;lectionnant un
&eacute;l&eacute;ment de langage ActionScript, une balise de composant MXML ou un attribut, puis en actionnant les touches
Maj+F2. Pour plus d’informations, voir &laquo; Comment obtenir de l’aide pour la r&eacute;daction de code &raquo; &agrave; la page 110.
Aide pour le formatage
Afin de faciliter le codage des applications, les &eacute;diteurs peuvent reformater des blocs de code et proc&eacute;der &agrave; des
modifications en bloc. Pour plus d’informations, voir &laquo; Formatage et modification du code &raquo; &agrave; la page 116.
A propos de l’assistant de contenu
Au cours de la saisie du code dans les &eacute;diteurs Flash Builder, l’assistant de contenu affiche une liste d’options de
remplissage de l’expression de code (g&eacute;n&eacute;ralement d&eacute;sign&eacute;es par indicateurs de code). Un document MXML propose
par exemple une liste de balises pouvant &ecirc;tre ajout&eacute;es &agrave; l’emplacement auquel se trouve le curseur de la souris.
L’assistant de contenu affiche &eacute;galement la documentation de r&eacute;f&eacute;rence ASDoc disponible pour le composant MXML
ou le code ActionScript que vous r&eacute;digez. La documentation ASDoc s’affiche &eacute;galement lors du passage du curseur de
la souris sur un composant MXML ou une classe ActionScript. Si vous s&eacute;lectionnez une classe dans l’&eacute;diteur, le
contenu ASDoc appara&icirc;t &eacute;galement dans la vue ASDoc.
L’assistant de contenu est disponible dans les &eacute;diteurs MXML, ActionScript et CSS. Son utilisation varie en fonction
de l’&eacute;diteur. Les indicateurs s’affichent &agrave; chaque fois qu’une structure ou un langage (MXML, ActionScript et CSS)
fournit des options de remplissage de l’expression en cours de r&eacute;daction.
L’assistant de contenu affiche des indicateurs pour les composants MXML personnalis&eacute;s et les classes ActionScript
cr&eacute;&eacute;s faisant partie du projet. Supposons que vous d&eacute;finissiez un composant MXML personnalis&eacute; et l’ajoutiez au
projet. Les indicateurs de code s’affichent &agrave; chaque cr&eacute;ation d’une r&eacute;f&eacute;rence au composant dans l’application MXML.
Affichage des indicateurs de code avec l’assistant de contenu
Dans l’&eacute;diteur MXML, la saisie dans le cadre d’un composant MXML conduit par exemple &agrave; l’affichage d’une liste
contenant toutes les propri&eacute;t&eacute;s de ce composant. L’exemple suivant illustre les indicateurs de code pour les propri&eacute;t&eacute;s
d’un composant MXML.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 107
Modification du code dans Flash Builder
La s&eacute;lection et la saisie d’une propri&eacute;t&eacute; entra&icirc;nent l’affichage des valeurs possibles (&agrave; condition que des valeurs
pr&eacute;d&eacute;finies existent). L’exemple suivant illustre les indicateurs de code pour les valeurs de propri&eacute;t&eacute;.
Le fonctionnement de l’assistant de contenu dans les &eacute;diteurs ActionScript et CSS est analogue.
Assistant de contenu dans l’&eacute;diteur MXML
Dans l’&eacute;diteur MXML, les indicateurs de code s’affichent automatiquement &agrave; la saisie du code. L’exemple suivant
illustre les indicateurs de code qui s’affichent lorsque vous ajoutez une balise &agrave; une balise Panel ainsi que la
documentation de r&eacute;f&eacute;rence ASDoc.
L’assistant de contenu classe les indicateurs de code par type, r&eacute;pertoriant les composants MXML visuels et non
visuels, par propri&eacute;t&eacute;s, par &eacute;v&eacute;nements et par styles.
Par d&eacute;faut, l’assistant de contenu affiche uniquement les indicateurs correspondant aux types recommand&eacute;s. Les types
recommand&eacute;s sont les composants disponibles dans les espaces de noms ou autres, suivant les balises englobantes. Les
composants dont vous disposez d&eacute;pendent de la d&eacute;claration d’espace de noms de l’application concern&eacute;e ainsi que des
balises englobant le point d’insertion dans l’&eacute;diteur.
Dans certains contextes par exemple, seuls les composants Spark sont autoris&eacute;s. D’autres contextes autorisent les
composants Spark et les composants Halo. L’assistant de contenu filtre les indicateurs de code en fonction du contenu.
Appuyez sur les touches Ctrl+Espace pour faire d&eacute;filer les filtres pour les indicateurs de code affich&eacute;s. Les filtres sont
les suivants :
• Affichage initial : Types recommand&eacute;s
• Tous les composants
• Propri&eacute;t&eacute;s
• Ev&eacute;nements
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 108
Modification du code dans Flash Builder
• Effets
• Styles
• Retour aux types recommand&eacute;s
Les indicateurs de code affich&eacute;s et l’ordre dans lequel ils d&eacute;filent d&eacute;pendent des pr&eacute;f&eacute;rences d&eacute;finies par l’utilisateur.
Pour modifier les param&egrave;tres par d&eacute;faut dans la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences :
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez Flash Builder &gt; Editeurs &gt; Code MXML &gt; Avanc&eacute;es.
2 Sp&eacute;cifiez les types d’indicateurs que vous souhaitez afficher.
3 S&eacute;lectionnez un type d’indicateur et modifiez-en la position dans le cycle de d&eacute;filement en cliquant sur les boutons
Haut et Bas.
Le premier type d’indicateur de la liste sera affich&eacute; en premier.
Affichage des indicateurs de code dans l’&eacute;diteur CSS
L’assistant de contenu affiche des indicateurs pour les styles CSS contenus dans des balises int&eacute;gr&eacute;es &lt;fx:Style&gt; ou
dans des documents CSS autonomes, ainsi que l’illustre l’exemple suivant.
Remarque : dans les documents CSS, les indicateurs de code s’affichent uniquement si vous appuyez sur Ctrl+Espace.
Utilisation de l’assistant de contenu
Les indicateurs de code acc&eacute;l&egrave;rent et facilitent la r&eacute;daction de code MXML, ActionScript et CSS. Ils s’affichent en cours
de saisie du code dans l’&eacute;diteur.
Affichage de l’assistant de contenu et insertion d’indicateurs de code
1 Commencez &agrave; saisir une ligne de code.
• Dans un document MXML, commencez &agrave; saisir une balise :
&lt;
Les indicateurs de code correspondants s’affichent, ainsi que l’illustre l’exemple suivant :
Appuyez sur Ctrl+Espace pour parcourir la liste des indicateurs de code disponibles.
• Dans un document ActionScript ou une balise Script d’un document MXML, saisissez une structure de langage
typique :
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 109
Modification du code dans Flash Builder
public var myVar:
• Dans un document CSS ou dans une balise Style d’un document MXML, saisissez une structure de nom de style,
puis appuyez sur les touches Ctrl+Espace pour afficher la liste des attributs pouvant &ecirc;tre ajout&eacute;s.
Vous pouvez &eacute;galement afficher les indicateurs en cours de saisie d’une ligne de code en actionnant les touches
Ctrl+Espace.
2 Parcourez la liste d’indicateurs de code en utilisant les fl&egrave;ches vers le haut et vers le bas.
3 S&eacute;lectionnez un indicateur de code et appuyez sur Entr&eacute;e pour ins&eacute;rer le code dans l’&eacute;diteur.
Au fur et &agrave; mesure que vous saisissez le code, d’autres indicateurs sont affich&eacute;s.
Affichage de l’assistant de contenu et des commentaires ASDoc
1 Commencez &agrave; entrer une ligne de code qui contient une classe MXML ou ActionScript. Vous pouvez &eacute;galement
survoler la classe avec le curseur de la souris.
Au fur et &agrave; mesure que vous tapez, le contenu ASDoc correspondant &agrave; la classe appara&icirc;t &agrave; c&ocirc;t&eacute; des indicateurs de
code. Si vous passez le curseur de la souris sur une classe, seul le commentaire ASDoc appara&icirc;t.
2 Cliquez &agrave; l’int&eacute;rieur du contenu ASDoc ou appuyez sur la touche F2 pour afficher le contenu dans une fen&ecirc;tre
distincte que vous pouvez faire d&eacute;filer.
3 Lorsque vous avez termin&eacute; la lecture de la documentation, cliquez hors de la fen&ecirc;tre. La fen&ecirc;tre ASDoc se ferme.
D&eacute;termination de la hi&eacute;rarchie d’appels
Flash Builder fournit la vue Hi&eacute;rarchie d’appels qui affiche tous les appelants d’une fonction, d’une variable, d’une
classe ou d’un identifiant d’interface ActionScript ou MXML s&eacute;lectionn&eacute;. La liste des appelants est hi&eacute;rarchique. Vous
pouvez afficher les appelants pour chaque r&eacute;f&eacute;rence trouv&eacute;e.
Vous pouvez &eacute;galement afficher le num&eacute;ro de ligne et le code de ligne de chaque appelant. Double-cliquez sur
l’appelant pour ouvrir le fichier source. Ce dernier met en &eacute;vidence l’appel de fonction ou la r&eacute;f&eacute;rence.
Vous pouvez modifier l’orientation des appelants affich&eacute;s et sp&eacute;cifier la port&eacute;e de la recherche.
Affichage de la hi&eacute;rarchie d’appels d’un &eacute;l&eacute;ment de langage et ouverture du fichier source
d’un appelant
1 En mode Source de l’&eacute;diteur MXML ou de l’&eacute;diteur ActionScript, placez le point d’insertion &agrave; l’int&eacute;rieur d’une
fonction, d’une variable, d’une classe ou d’un identifiant d’interface.
2 Dans le menu Naviguer, s&eacute;lectionnez Ouvrir la hi&eacute;rarchie d’appels.
Vous pouvez &eacute;galement utiliser le menu contextuel ou le raccourci clavier Ctrl+Alt+H.
3 Dans la vue Hi&eacute;rarchie d’appels, d&eacute;veloppez chaque appelant pour afficher la hi&eacute;rarchie des appels.
4 Double-cliquez sur un appelant pour ouvrir le fichier source &agrave; l’origine de l’appel dans l’&eacute;diteur. L’appel est mis en
&eacute;vidence.
Modification de l’orientation et de la port&eacute;e de la hi&eacute;rarchie d’appels
1 Affichez la hi&eacute;rarchie d’appels d’un &eacute;l&eacute;ment de langage.
2 Dans le menu Hi&eacute;rarchie d’appels, s&eacute;lectionnez Pr&eacute;sentation.
Choisissez une option pour modifier la pr&eacute;sentation.
3 Dans le menu Hi&eacute;rarchie d’appels, s&eacute;lectionnez Port&eacute;e de la recherche.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 110
Modification du code dans Flash Builder
S&eacute;lectionnez Espace de travail, Projet ou Fichier. La valeur par d&eacute;faut est Espace de travail.
Cr&eacute;ation de gestionnaires d’&eacute;v&eacute;nement pour les composants
Vous pouvez cr&eacute;er des gestionnaires d’&eacute;v&eacute;nement pour les composants Flex en cliquant sur le bouton G&eacute;n&eacute;rer le
gestionnaire d’&eacute;v&eacute;nement pour les &eacute;v&eacute;nements r&eacute;pertori&eacute;s dans la vue Propri&eacute;t&eacute;s. Vous pouvez attribuer un nom au
gestionnaire d’&eacute;v&eacute;nement avant de le cr&eacute;er. Si vous ne le faites pas, Flash Builder cr&eacute;e un nom bas&eacute; sur la propri&eacute;t&eacute; ID
du composant. En l’absence de propri&eacute;t&eacute; ID, Flash Builder g&eacute;n&egrave;re un nom unique d&eacute;riv&eacute; du nom du composant.
G&eacute;n&eacute;ration d’un gestionnaire d’&eacute;v&eacute;nement pour un composant
1 Dans la vue Cr&eacute;ation de l’&eacute;diteur de code, s&eacute;lectionnez un composant.
2 Dans la vue Propri&eacute;t&eacute;s, s&eacute;lectionnez la Vue par cat&eacute;gories, d&eacute;veloppez la liste des &eacute;v&eacute;nements pour l’&eacute;l&eacute;ment
s&eacute;lectionn&eacute; et localisez l’&eacute;v&eacute;nement pour lequel vous souhaitez g&eacute;n&eacute;rer un gestionnaire d’&eacute;v&eacute;nement.
3 (Facultatif) Saisissez un nom pour le gestionnaire d’&eacute;v&eacute;nement dans le champ Valeur.
4 Cliquez sur le bouton G&eacute;n&eacute;rer le gestionnaire d’&eacute;v&eacute;nement.
L’&eacute;diteur ouvre la vue Source. Flash Builder ins&egrave;re le gestionnaire d’&eacute;v&eacute;nement &agrave; l’int&eacute;rieur d’un bloc &lt;Script&gt; et
ajoute la propri&eacute;t&eacute; d’&eacute;v&eacute;nement au composant. La propri&eacute;t&eacute; d’&eacute;v&eacute;nement &eacute;tablit une r&eacute;f&eacute;rence &agrave; l’&eacute;v&eacute;nement cr&eacute;&eacute;.
Remarque : vous pouvez &eacute;galement utiliser le menu contextuel pour cr&eacute;er des gestionnaires pour les principaux
&eacute;v&eacute;nements d’un composant. Par exemple, le menu contextuel d’un composant Button comporte l’option G&eacute;n&eacute;rer un
gestionnaire Click.
5 Ajoutez le code pour l’impl&eacute;mentation du gestionnaire d’&eacute;v&eacute;nement &agrave; la fonction de gestionnaire d’&eacute;v&eacute;nement
g&eacute;n&eacute;r&eacute;e.
Comment obtenir de l’aide pour la r&eacute;daction de code
Le Guide de r&eacute;f&eacute;rence du langage Adobe Flex est int&eacute;gr&eacute; aux &eacute;diteurs MXML et ActionScript, vous permettant ainsi de
consulter rapidement l’Aide de r&eacute;f&eacute;rence pour une balise MXML ou pour une propri&eacute;t&eacute;, une classe ou tout autre
&eacute;l&eacute;ment de la structure Flex.
Vous pouvez &eacute;galement utiliser l’Aide dynamique, ancr&eacute;e &agrave; proximit&eacute; de la perspective en cours d’utilisation. Elle
affiche les rubriques de r&eacute;f&eacute;rence et d’utilisation portant sur la balise MXML ou la classe ActionScript s&eacute;lectionn&eacute;e.
Affichage de l’Aide de la r&eacute;f&eacute;rence du langage
1 Dans l’&eacute;diteur MXML ou ActionScript, s&eacute;lectionnez un &eacute;l&eacute;ment (un mot du code) de la structure Flex en le mettant
en surbrillance ou en pla&ccedil;ant le curseur de la souris &agrave; l’int&eacute;rieur de l’&eacute;l&eacute;ment (ou du mot).
2 Pour ouvrir la rubrique d’aide directement dans l’afficheur de l’Aide, appuyez sur les touches Maj+F2 ou
s&eacute;lectionnez Aide &gt; Rechercher dans la r&eacute;f&eacute;rence du langage.
Activation de l’aide dynamique
❖ S&eacute;lectionnez Aide &gt; Aide dynamique.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 111
Modification du code dans Flash Builder
Navigation et organisation du code
Les &eacute;diteurs Flash Builder offrent de nombreuses fonctions pour parcourir le code. Vous pouvez par exemple r&eacute;duire
ou d&eacute;velopper des blocs de code, ouvrir les sources de d&eacute;finitions de code ainsi que rechercher et ouvrir des types. Des
blocs de plusieurs lignes peuvent &ecirc;tre r&eacute;duits et d&eacute;velopp&eacute;s afin de faciliter la navigation, l’affichage et la gestion de
documents pr&eacute;sentant un code complexe. Dans Flash Builder, ces deux op&eacute;rations sont d&eacute;sign&eacute;es par les termes de
d&eacute;veloppement et de r&eacute;duction d’instructions de code de plusieurs lignes.
Configuration, r&eacute;duction et d&eacute;veloppement de blocs de code
1 Dans l’&eacute;diteur, cliquez sur le symbole de r&eacute;duction (-) ou sur celui de d&eacute;veloppement (+) dans la marge de gauche.
La r&eacute;duction d’un bloc de code en masque toutes les lignes &agrave; l’exception de la premi&egrave;re.
D&eacute;veloppez le bloc de code pour en afficher &agrave; nouveau le contenu. Placez la souris sur le symbole de d&eacute;veloppement
(+) pour visionner l’ensemble du bloc dans une info-bulle.
2 La r&eacute;duction de code est activ&eacute;e par d&eacute;faut dans Flash Builder. Pour la d&eacute;sactiver, ouvrez la bo&icirc;te de dialogue
Pr&eacute;f&eacute;rences et s&eacute;lectionnez Flash Builder &gt; Editeurs. D&eacute;s&eacute;lectionnez ensuite l’option R&eacute;duction des codes.
Utilisation de la vue Structure pour parcourir et examiner le code
La vue Structure appartient &agrave; la perspective D&eacute;veloppement Flash (voir &laquo; Perspective D&eacute;veloppement Flash &raquo; &agrave; la
page 8). Elle est donc disponible au cours de la modification du code et de la cr&eacute;ation de l’application. Cette vue permet
d’examiner et de parcourir plus facilement la structure des documents MXML, ActionScript et CSS.
Elle pr&eacute;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&ocirc;les, etc.). En mode CSS, elle affiche les s&eacute;lecteurs CSS et les propri&eacute;t&eacute;s imbriqu&eacute;es qu’ils
contiennent.
La s&eacute;lection d’un &eacute;l&eacute;ment dans la vue Structure permet de le localiser et de le mettre en &eacute;vidence dans l’&eacute;diteur,
facilitant ainsi consid&eacute;rablement la navigation &agrave; l’int&eacute;rieur du code.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 112
Modification du code dans Flash Builder
Vue Structure en mode Classe
Lorsque vous &eacute;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&eacute;tadonn&eacute;e, aucun commentaire, aucune d&eacute;claration d’espace de noms et aucun contenu de fonction.
Les nœuds et les &eacute;l&eacute;ments de l’arborescence de la vue Structure repr&eacute;sentent &agrave; la fois les diff&eacute;rents types d’&eacute;l&eacute;ments de
langage et leur visibilit&eacute;. Les ic&ocirc;nes rouges signalent par exemple des &eacute;l&eacute;ments priv&eacute;s ; les ic&ocirc;nes vertes signalent des
&eacute;l&eacute;ments publics ; les ic&ocirc;nes jaunes indiquent que l’&eacute;l&eacute;ment n’a pas &eacute;t&eacute; d&eacute;fini comme &eacute;tant priv&eacute; ou public.
Barre d’outils de la vue Structure en mode Classe
En mode Classe, la barre d’outils de la vue Structure contient les commandes de tri et de filtrage, ainsi que l’illustre
l’exemple suivant :
Vue Structure en mode MXML
La vue Structure d’un document MXML en cours d’&eacute;dition contenant du code MXML et du code ActionScript
pr&eacute;sente les modes Classe et MXML.
En mode MXML, chaque &eacute;l&eacute;ment de la vue repr&eacute;sente une balise MXML. Les types de balise affich&eacute;s sont les suivants :
les composants, les contr&ocirc;les, les balises non visuelles (WebService ou State), les propri&eacute;t&eacute;s des composants
exprim&eacute;es sous forme de balises enfant (contraintes de pr&eacute;sentation, par exemple) et les balises de compilateur (Model,
Array et Script).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 113
Modification du code dans Flash Builder
Le mode MXML de la vue Structure n’affiche aucun commentaire, aucune r&egrave;gle ou propri&eacute;t&eacute; CSS et aucune propri&eacute;t&eacute;
de composant exprim&eacute;e sous forme d’attribut (par opposition aux balises enfant qui sont affich&eacute;es).
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&eacute;mentaires permettant de
basculer de la vue MXML &agrave; la vue des classes.
Pour basculer entre les deux vues, s&eacute;lectionnez Afficher la vue MXML ou Afficher la vue des classes dans le menu de
la barre d’outils.
Utilisation de la vue Structure rapide de l’&eacute;diteur
Vous pouvez ouvrir la vue Structure rapide &agrave; partir des &eacute;diteurs ActionScript et MXML pour afficher la vue Structure
en mode Classe. La vue Structure rapide appara&icirc;t dans une fen&ecirc;tre contextuelle &agrave; l’int&eacute;rieur de l’&eacute;diteur et ne se
pr&eacute;sente donc pas sous forme de vue distincte. Elle permet de parcourir et d’examiner rapidement le code.
Son contenu est identique &agrave; celui du mode Classe, &agrave; ceci pr&egrave;s que la Structure rapide pr&eacute;sente une zone de saisie de
texte permettant de filtrer les &eacute;l&eacute;ments affich&eacute;s. Vous pouvez par exemple entrer le nom d’un &eacute;l&eacute;ment dans la vue
Structure rapide afin de limiter l’affichage aux &eacute;l&eacute;ments contenant les caract&egrave;res saisis.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 114
Modification du code dans Flash Builder
La vue Structure rapide ne contient pas les commandes permettant d’effectuer un tri alphab&eacute;tique des &eacute;l&eacute;ments ou de
les masquer.
De m&ecirc;me que dans la vue Structure, vous pouvez s&eacute;lectionner un &eacute;l&eacute;ment afin de le localiser et de le mettre en &eacute;vidence
dans l’&eacute;diteur.
Ouverture de la vue Structure rapide
❖ Ouvrez un document ActionScript ou MXML dans l’&eacute;diteur. Dans le menu Naviguer, s&eacute;lectionnez Structure
rapide.
Vous pouvez &eacute;galement utiliser le raccourci clavier Ctrl+O.
Fermeture de la vue Structure rapide
❖ L’acc&egrave;s &agrave; tout emplacement situ&eacute; en dehors de la vue Structure rapide conduit &agrave; la fermeture de cette derni&egrave;re. Elle
peut &eacute;galement &ecirc;tre ferm&eacute;e en appuyant sur la touche Echap.
Ouverture de d&eacute;finitions de code
Quelle que soit la complexit&eacute; des applications, les projets contiennent g&eacute;n&eacute;ralement de nombreuses ressources et
lignes de code. Afin de parcourir et d’examiner plus facilement les diff&eacute;rents &eacute;l&eacute;ments du code, vous pouvez ouvrir la
source d’une d&eacute;finition de code externe &agrave; partir de l’emplacement, dans le code, auquel il y est fait r&eacute;f&eacute;rence. Si vous
cr&eacute;ez par exemple un composant MXML personnalis&eacute; et l’importez dans l’application MXML, vous pouvez
s&eacute;lectionner la r&eacute;f&eacute;rence au composant MXML et ouvrir le fichier source dans l’&eacute;diteur.
Ouverture de la source d’une d&eacute;finition de code
1 Dans l’&eacute;diteur, s&eacute;lectionnez la r&eacute;f&eacute;rence du code.
2 Dans le menu Naviguer, s&eacute;lectionnez Acc&eacute;der &agrave; la d&eacute;finition.
Vous pouvez utiliser le raccourci clavier F3.
Le fichier source contenant la d&eacute;finition du code s’ouvre dans l’&eacute;diteur.
Flash Builder prend &eacute;galement en charge la navigation dans le code par hyperliens.
Ouverture de la source d’une d&eacute;finition de code en utilisant la navigation par hyperliens
1 Localisez la r&eacute;f&eacute;rence du code dans l’&eacute;diteur.
2 Appuyez sur la touche Ctrl (Windows) ou la touche Cmd (Mac OS) et maintenez-la enfonc&eacute;e, puis positionnez le
curseur de la souris sur la r&eacute;f&eacute;rence du code pour afficher l’hyperlien.
3 Pour atteindre la r&eacute;f&eacute;rence du code, cliquez sur l’hyperlien.
Recherche et affichage des classes
La bo&icirc;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&icirc;te de dialogue Ouvrir un type, s&eacute;lectionnez une classe pour afficher
l’impl&eacute;mentation.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 115
Modification du code dans Flash Builder
Bo&icirc;te de dialogue Ouvrir un type
La bo&icirc;te de dialogue Ouvrir un type permet &eacute;galement de s&eacute;lectionner des classes comme classe de base pour une
nouvelle classe ActionScript ou un nouveau composant MXML.
Elle comporte une zone de texte permettant de filtrer les classes affich&eacute;es en fonction du texte ou du joker qui y est
saisi. La bo&icirc;te de dialogue fait appel &agrave; diff&eacute;rentes couleurs pour signaler les types recommand&eacute;s et les types exclus. Les
types recommand&eacute;s sont affich&eacute;s en gris. Les types exclus sont affich&eacute;s en marron.
Les types recommand&eacute;s sont les classes disponibles dans l’espace de noms par d&eacute;faut d’un projet. Dans certains
contextes par exemple, seuls les composants Spark sont autoris&eacute;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&eacute;faut pour un projet.
Ouverture de la bo&icirc;te de dialogue Ouvrir un type
• (Parcourir les classes) Pour parcourir les classes et visionner leur impl&eacute;mentation :
1 Dans le menu Flash Builder, s&eacute;lectionnez Naviguer &gt; Ouvrir un type.
2 (Facultatif) Saisissez du texte ou s&eacute;lectionnez des filtres pour modifier les classes visibles dans la liste.
3 S&eacute;lectionnez une classe pour en afficher le code source.
Vous ne pouvez pas modifier le code source des classes dans la structure Flex.
• (Nouvelles classes ActionScript) Pour s&eacute;lectionner une classe de base pour une nouvelle classe ActionScript :
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Classe ActionScript.
2 En regard du champ Superclasse, cliquez sur Parcourir.
3 (Facultatif) Saisissez du texte ou s&eacute;lectionnez des filtres pour modifier les classes visibles dans la liste.
4 S&eacute;lectionnez une classe de base dans la liste.
• (Nouveaux composants MXML) Pour s&eacute;lectionner un composant de base pour un nouveau composant MXML :
1 Cliquez sur Fichier &gt; Nouveau &gt; Composant MXML.
2 Dans la liste des projets de l’espace de travail, s&eacute;lectionnez un projet pour un nouveau composant MXML et
sp&eacute;cifiez un nom pour le fichier.
Les composants de base disponibles varient en fonction des espaces de noms configur&eacute;s pour un projet.
3 En regard du champ Bas&eacute; sur, cliquez sur Parcourir.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 116
Modification du code dans Flash Builder
Remarque : effacez ou modifiez la classe de base par d&eacute;faut r&eacute;pertori&eacute;e dans le champ Bas&eacute; sur pour &eacute;largir vos
choix.
4 (Facultatif) Saisissez du texte ou s&eacute;lectionnez des filtres pour modifier les classes visibles dans la liste.
5 S&eacute;lectionnez un composant de base dans la liste.
Affichage des num&eacute;ros de ligne
Vous pouvez ajouter des num&eacute;ros de ligne dans l’&eacute;diteur afin de faciliter la lecture et la consultation du code.
❖ Dans le menu contextuel de la marge de l’&eacute;diteur, s&eacute;lectionnez Afficher les num&eacute;ros de ligne.
La marge de l’&eacute;diteur se situe entre la barre de rep&egrave;re et l’&eacute;diteur.
Formatage et modification du code
Les &eacute;diteurs de Flash Builder offrent des fonctions acc&eacute;l&eacute;rant la r&eacute;daction et le formatage du code, telles que l’ajout
rapide de blocs de commentaires, la mise en retrait de blocs de code ainsi que la recherche et le remplacement de texte.
Organisation des instructions d’importation
L’utilisation de l’assistant de contenu dans les &eacute;diteurs MXML et ActionScript conduit &agrave; l’importation automatique
dans le document des packages dans lesquels les classes se situent. Les packages sont ajout&eacute;s dans l’ordre dans lequel
ils ont &eacute;t&eacute; saisis dans le code. Les importations qui ne sont pas utilis&eacute;es ou ne sont pas n&eacute;cessaires sont
automatiquement supprim&eacute;es.
Afin de faciliter l’organisation du code dans les documents ActionScript, vous pouvez trier les instructions
d’importation par ordre alphab&eacute;tique. Pour ce faire, ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences, s&eacute;lectionnez Flash Builder
&gt; Editeurs &gt; Code ActionScript, puis Garder les importations organis&eacute;es.
Tri des instructions d’importation
❖ Dans l’&eacute;diteur, ouvrez un document ActionScript contenant les instructions d’importation. Dans le menu Source,
s&eacute;lectionnez Organiser les importations.
Vous pouvez &eacute;galement utiliser le raccourci clavier suivant : Ctrl+Maj+ O (Windows) ou Commande+Maj+O
(Mac).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 117
Modification du code dans Flash Builder
Ajout de commentaires et de blocs de commentaire
Vous pouvez ajouter ou supprimer des commentaires en utilisant les options dans le menu Source ou en faisant appel
aux raccourcis clavier. Vous pouvez ajouter les types de commentaires suivants :
• Commentaires de source pour ActionScript (//)
• Commentaires de bloc pour ActionScript (/*
*/)
• Commentaires ASDoc pour ActionScript (/**
*/)
• Commentaires de bloc pour MXML (&lt;!----&gt;)
• Blocs CDATA pour MXML (&lt;![CDATA[
]]&gt;)
Les commentaires ajout&eacute;s au code ActionScript peuvent &ecirc;tre activ&eacute;s ou d&eacute;sactiv&eacute;s.
Activer/d&eacute;sactiver les commentaires du code ActionScript
1 Dans l’&eacute;diteur, s&eacute;lectionnez au moins une ligne de code ActionScript.
2 Appuyez sur Ctrl+Maj+C (Windows) ou Cmd+Maj+C (Mac OS) pour ajouter ou supprimer des commentaires de
style C.
3 Appuyez sur Ctrl+/ (Windows) ou Cmd+/ (Mac OS) pour ajouter ou supprimer des commentaires de style C++.
Ajout de commentaires XML &agrave; du code MXML
1 Dans l’&eacute;diteur, s&eacute;lectionnez au moins une ligne de code MXML.
2 Appuyez sur Ctrl+Maj+C (Windows) ou Cmd+Maj+C (Mac OS) pour ajouter un commentaire.
Ajout de blocs CDATA &agrave; du code MXML
1 Dans l’&eacute;diteur, s&eacute;lectionnez au moins une ligne de code MXML.
2 Appuyez sur Ctrl+Maj+D (Windows) ou Cmd+Maj+D (Mac OS) pour ajouter un commentaire.
Mise en retrait de blocs de code
L’&eacute;diteur met automatiquement en forme les lignes de code en cours de saisie, am&eacute;liorant ainsi la lisibilit&eacute; et facilitant
la r&eacute;daction. Vous pouvez &eacute;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&eacute;f&eacute;rences.
Pour mettre en retrait un bloc de code en une seule op&eacute;ration, vous pouvez utiliser les commandes D&eacute;caler vers la
droite et D&eacute;caler vers la gauche de l’&eacute;diteur.
D&eacute;placement d’un bloc de code vers la gauche ou vers la droite
1 Dans l’&eacute;diteur, s&eacute;lectionnez un bloc de code.
2 Cliquez sur Source &gt; D&eacute;caler vers la droite ou Source &gt; D&eacute;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
en retrait de blocs de code.
D&eacute;finition des pr&eacute;f&eacute;rences de la mise en retrait
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez Flash Builder &gt; Mise en retrait.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 118
Modification du code dans Flash Builder
2 S&eacute;lectionnez le type de mise en retrait (tabulations ou espaces) et sp&eacute;cifiez la taille de la mise en retrait ou des
tabulations.
Recherche et remplacement de texte dans l’&eacute;diteur
Vous disposez de deux options pour rechercher et &eacute;ventuellement remplacer des cha&icirc;nes de texte dans le code. Vous
pouvez limiter la recherche au document ouvert dans l’&eacute;diteur ou l’&eacute;tendre &agrave; toutes les ressources des projets de
l’espace de travail. Pour plus d’informations sur la recherche portant sur tout l’espace de travail, voir &laquo; Recherche de
r&eacute;f&eacute;rences et restructuration de code &raquo; &agrave; la page 118.
1 Ouvrez le document sur lequel la recherche doit porter.
2 Utilisez l’une des m&eacute;thodes suivantes :
• Appuyez sur Ctrl+F (Windows) ou Cmd+F (Mac OS).
• S&eacute;lectionnez Editer &gt; Rechercher/Remplacer.
3 Saisissez la cha&icirc;ne de texte &agrave; localiser.
4 (Facultatif) Entrez la cha&icirc;ne de texte de remplacement.
5 (Facultatif) D&eacute;finissez les crit&egrave;res de recherche avanc&eacute;s.
6 Cliquez sur Rechercher, Remplacer, Remplacer tout ou Remplacer/Rechercher.
Une fois localis&eacute;e, la cha&icirc;ne de texte est mise en surbrillance et &eacute;ventuellement remplac&eacute;e.
Remarque : pour proc&eacute;der &agrave; une recherche incr&eacute;mentielle, appuyez sur Ctrl+J (Windows) ou Cmd+J (Mac OS).
Recherche de r&eacute;f&eacute;rences et restructuration de code
Flash Builder comporte des fonctions de recherche avanc&eacute;es plus puissantes que les fonctions de
recherche/remplacement. Afin de faciliter la compr&eacute;hension de la mani&egrave;re dont les fonctions, variables et autres
identifiants sont utilis&eacute;s, Flash Builder permet de rechercher et de rep&eacute;rer les r&eacute;f&eacute;rences ou les d&eacute;clarations vers les
identifiants dans les fichiers ActionScript ou MXML, les projets ou les espaces de travail. La restructuration est utilis&eacute;e
pour apporter des modifications au code en renommant les identifiants suivants, puis en mettant &agrave; jour toute r&eacute;f&eacute;rence
y renvoyant.
• Variables
• Fonctions
• Types (interface, classe)
• Accesseurs (getter/setter)
• Attributs
• M&eacute;tadonn&eacute;es en MXML (effets, &eacute;v&eacute;nements, styles)
Marquage des r&eacute;f&eacute;rences
1 En mode Source, cliquez sur le bouton Marquage des occurrences de la barre d’outils.
2 Dans l’&eacute;diteur, cliquez sur un identifiant. Toutes les occurrences sont marqu&eacute;es en fonction des param&egrave;tres des
Pr&eacute;f&eacute;rences.
Pour modifier l’apparence des r&eacute;f&eacute;rences marqu&eacute;es, s&eacute;lectionnez G&eacute;n&eacute;ral &gt; Editeurs &gt; Editeurs de texte &gt; Annotations.
Pour plus d’informations sur les marqueurs, voir &laquo; A propos des marqueurs &raquo; &agrave; la page 122.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 119
Modification du code dans Flash Builder
Recherche de toutes les r&eacute;f&eacute;rences et de toutes les d&eacute;clarations
1 En mode Source, cliquez sur un identifiant dans l’&eacute;diteur.
2 Dans le menu principal, s&eacute;lectionnez Rechercher &gt; R&eacute;f&eacute;rences ou Rechercher &gt; D&eacute;clarations. S&eacute;lectionnez ensuite
Fichier, Projet ou Espace de travail. Les r&eacute;sultats apparaissent dans la vue Recherche.
Restructuration du code
1 En mode Source, cliquez sur un identifiant dans l’&eacute;diteur.
2 Dans le menu principal, s&eacute;lectionnez Source &gt; Restructurer &gt; Renommer.
3 Entrez un nouveau nom.
Flash Builder v&eacute;rifie que les conditions pr&eacute;alables &agrave; la modification du nom sont r&eacute;unies et vous invite &agrave; confirmer
les probl&egrave;mes avant de proc&eacute;der &agrave; la modification du nom. Les conditions pr&eacute;alables &agrave; la modification du nom sont
les suivantes :
• Les r&eacute;f&eacute;rences situ&eacute;es dans des fichiers en lecture seule ne peuvent pas &ecirc;tre renomm&eacute;es.
• Tous les fichiers doivent avoir &eacute;t&eacute; sauvegard&eacute;s.
• Les projets pr&eacute;sentant des erreurs de g&eacute;n&eacute;ration provoquent l’affichage d’un avertissement.
• Le nouveau nom doit se trouver dans l’&eacute;tendue, d&eacute;termin&eacute;e par le type de l’&eacute;l&eacute;ment et son emplacement. Les
erreurs d’occultation de noms sont &eacute;galement signal&eacute;es.
• Le nouveau nom doit &ecirc;tre un identifiant valide.
• La r&eacute;f&eacute;rence d&eacute;finie dans un fichier SWC doit comprendre une connexion de la source.
4 Pour v&eacute;rifier la modification apport&eacute;e, cliquez sur Aper&ccedil;u pour visionner la source d’origine et la source
restructur&eacute;e, ou cliquez sur OK pour poursuivre la modification du code.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 120
Modification du code dans Flash Builder
Ic&ocirc;nes repr&eacute;sentant les &eacute;l&eacute;ments de langage
Flash Builder fait appel &agrave; des ic&ocirc;nes et &agrave; des incrustations afin de fournir des rep&egrave;res visuels pour les &eacute;l&eacute;ments de
langage. Les ic&ocirc;nes sont visibles :
• dans l’Explorateur de packages ;
• dans la vue de d&eacute;bogage Variables ;
• dans les indicateurs des blocs de code ActionScript ;
• dans la vue ASDoc ;
• dans la bo&icirc;te de dialogue Ouvrir un type lors de la cr&eacute;ation ou de la s&eacute;lection de classes.
Explorateur de packages affichant les ic&ocirc;nes des &eacute;l&eacute;ments de langage
Les ic&ocirc;nes repr&eacute;sentent des espaces de noms, des classes, des interfaces, des fonctions et des variables.
Ic&ocirc;ne
Forme
Couleur
Description
Cercle large
Vert
Classe
Cercle large
Violet
Interface
N
Violet
Espace de noms
Cercle (contour)
Vert
Variable, &eacute;tendue publique
Cercle (plein)
Vert
Fonction, &eacute;tendue publique
Triangle (contour)
Bleu
Variable, &eacute;tendue interne
Triangle (plein)
Bleu
Fonction, &eacute;tendue interne
Derni&egrave;re mise &agrave; jour le 29/4/2010
Ic&ocirc;ne
UTILISATION DE FLASH BUILDER 4 121
Modification du code dans Flash Builder
Forme
Couleur
Description
Diamant (contour)
Jaune
Variable, &eacute;tendue prot&eacute;g&eacute;e
Diamant (plein)
Jaune
Fonction, &eacute;tendue prot&eacute;g&eacute;e
Diamant (contour)
Violet
Variable, espace de noms personnalis&eacute;
Diamant (plein)
Violet
Fonction, espace de noms personnalis&eacute;
Carr&eacute; (contour)
Rouge
Variable, &eacute;tendue priv&eacute;e
Carr&eacute; (plein)
Rouge
Fonction, &eacute;tendue priv&eacute;e
Une incrustation est une lettre ou un symbole affich&eacute; avec une ic&ocirc;ne fournissant des informations suppl&eacute;mentaires sur
l’&eacute;l&eacute;ment de langage. Par exemple, l’incrustation &laquo; D &raquo; signale une variable ou une fonction dynamique.
Incrustation
Symbole
Couleur
Description
S
Rouge
Statique
D
Rouge
Dynamique
C
Bleu
Constante
C
Vert
Constructeur pour une fonction
F
Bleu
Final
L
Gris
Local
=
Sans objet
Accesseur, m&eacute;thode Get ou m&eacute;thode Set
=
Sans objet
Exemple de fonction d’accesseur public
Flash Builder fait &eacute;galement appel aux ic&ocirc;nes pour signaler des &eacute;v&eacute;nements, des effets et des styles.
Ic&ocirc;ne
Description
Ev&eacute;nements
Effets
Styles
Affichage d’indicateurs de code dans l’&eacute;diteur ActionScript
L’assistant de contenu pour ActionScript fait appel &agrave; des ic&ocirc;nes avec indicateurs de code pour signaler les types
d’&eacute;l&eacute;ments de langage disponibles.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 122
Modification du code dans Flash Builder
L’assistant de contenu affiche des indicateurs de code pour ActionScript 3.0. Ces indicateurs de code sont disponibles
dans l’&eacute;diteur ActionScript ainsi qu’&agrave; l’int&eacute;rieur des balises &lt;fx:Script&gt; et dans les attributs d’&eacute;v&eacute;nement dans les
documents MXML. L’assistant de contenu fournit des indicateurs pour tous les &eacute;l&eacute;ments du langage ActionScript 3.0
(interfaces, classes, variables, fonctions et types de retour), ainsi que l’illustre l’exemple suivant.
A propos des marqueurs
Les marqueurs sont des raccourcis vers les lignes de code d’un document, vers un document ou vers un dossier. Ils
repr&eacute;sentent des t&acirc;ches, des signets et des probl&egrave;mes. Ils sont affich&eacute;s et peuvent &ecirc;tre g&eacute;r&eacute;s. La s&eacute;lection de marqueurs
provoque l’ouverture du document associ&eacute; dans l’&eacute;diteur et met &eacute;ventuellement en &eacute;vidence la ligne concern&eacute;e du
code.
Pour mettre &agrave; jour les marqueurs de probl&egrave;mes dans Flash Builder, vous devez enregistrer le fichier. Seuls les fichiers
auxquels l’application fait r&eacute;f&eacute;rence sont v&eacute;rifi&eacute;s. La syntaxe d’une classe isol&eacute;e qui n’est pas utilis&eacute;e dans le code n’est
pas contr&ocirc;l&eacute;e.
Le workbench g&eacute;n&egrave;re automatiquement les marqueurs de t&acirc;ches et de probl&egrave;mes suivants. Vous pouvez ajouter des
t&acirc;ches et des signets manuellement.
T&acirc;ches Les marqueurs de t&acirc;ches repr&eacute;sentent un &eacute;l&eacute;ment de travail. Les &eacute;l&eacute;ments de travail sont g&eacute;n&eacute;r&eacute;s
automatiquement par le workbench. Vous pouvez ajouter manuellement une t&acirc;che &agrave; une ligne de code du document
ou au document m&ecirc;me. Par exemple, afin de penser &agrave; d&eacute;finir une propri&eacute;t&eacute; pour un composant, vous pouvez cr&eacute;er une
t&acirc;che nomm&eacute;e &laquo; D&eacute;finir les propri&eacute;t&eacute;s de l’aspect &raquo;. Vous pouvez &eacute;galement ajouter des t&acirc;ches g&eacute;n&eacute;rales qui ne
s’appliquent pas directement aux ressources (&laquo; Cr&eacute;er un composant personnalis&eacute; pour l’invite de connexion de
l’employ&eacute; &raquo;, par exemple). La vue T&acirc;ches permet de g&eacute;rer tous les marqueurs de t&acirc;ches. Pour plus d’informations, voir
&laquo; Ajout de t&acirc;ches &raquo; &agrave; la page 123.
Erreurs Les marqueurs d’erreurs sont g&eacute;n&eacute;r&eacute;s par le compilateur et signalent diff&eacute;rents types d’&eacute;tats non valides. Par
exemple, les erreurs de syntaxe et les avertissements g&eacute;n&eacute;r&eacute;s par le compilateur sont affich&eacute;s comme marqueurs dans
la vue Erreurs. Pour plus d’informations, voir &laquo; Utilisation de la vue Erreurs &raquo; &agrave; la page 125.
Signets Vous pouvez ajouter manuellement des signets &agrave; une ligne de code ou &agrave; une ressource (dossier ou document).
Les signets sont pratiques pour rep&eacute;rer et rechercher facilement des &eacute;l&eacute;ments au sein des projets. Ils sont g&eacute;r&eacute;s dans la
vue Signets. Pour plus d’informations, voir &laquo; Ajout et suppression de signets &raquo; &agrave; la page 124.
Remarque : les vues T&acirc;ches et Signets ne sont pas affich&eacute;es par d&eacute;faut dans la perspective D&eacute;veloppement Flash. Pour plus
d’informations sur l’affichage de ces vues, voir &laquo; Ouverture des vues &raquo; &agrave; la page 26.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 123
Modification du code dans Flash Builder
Recherche de marqueurs
Les marqueurs sont &agrave; la fois des descriptions et des liens vers des &eacute;l&eacute;ments des ressources d’un projet. Qu’ils soient
g&eacute;n&eacute;r&eacute;s automatiquement par le compilateur pour signaler des erreurs dans le code ou ajout&eacute;s manuellement pour
rep&eacute;rer des t&acirc;ches ou des fragments de code, les marqueurs sont affich&eacute;s et g&eacute;r&eacute;s dans les vues associ&eacute;es. Les marqueurs
d’un projet sont facilement rep&eacute;rables dans les vues Signets, Erreurs et T&acirc;ches, &agrave; partir desquelles ils sont accessibles.
Acc&egrave;s &agrave; l’emplacement d’un marqueur
❖ S&eacute;lectionnez un marqueur dans les vues Signets, Erreurs ou T&acirc;ches.
Le fichier contenant le marqueur est localis&eacute; et affich&eacute; dans l’&eacute;diteur. Si l’emplacement du marqueur est une ligne
de code, cette derni&egrave;re est mise en surbrillance.
Ajout de t&acirc;ches
Les t&acirc;ches sont des &eacute;l&eacute;ments de l’espace de travail cr&eacute;&eacute;s automatiquement ou manuellement. Toutes les t&acirc;ches sont
affich&eacute;es et g&eacute;r&eacute;es dans la vue T&acirc;ches (Fen&ecirc;tre &gt; Autres vues &gt; G&eacute;n&eacute;ralit&eacute;s &gt; T&acirc;ches), ainsi que l’illustre l’exemple
suivant.
Ajout d’une t&acirc;che &agrave; une ligne de code ou &agrave; une ressource
1 Ouvrez un fichier dans l’&eacute;diteur, puis rep&eacute;rez et s&eacute;lectionnez la ligne de code &agrave; laquelle vous souhaitez ajouter une
t&acirc;che. Vous pouvez &eacute;galement s&eacute;lectionner une ressource dans l’Explorateur de packages.
2 Dans la vue T&acirc;ches, cliquez sur le bouton Ajouter une t&acirc;che dans la barre d’outils.
3 Entrez le nom de la t&acirc;che et s&eacute;lectionnez une priorit&eacute; (Elev&eacute;e, Normale, Faible), puis cliquez sur OK.
Remarque : ainsi que vous pouvez le constater dans l’Explorateur de packages, la ressource ne signale pas qu’elle contient
un marqueur. Vous pouvez visionner et g&eacute;rer tous les marqueurs de t&acirc;ches dans la vue T&acirc;ches.
Ach&egrave;vement et suppression de t&acirc;ches
Une fois achev&eacute;e, une t&acirc;che peut &ecirc;tre marqu&eacute;e comme ayant &eacute;t&eacute; termin&eacute;e et peut &eacute;ventuellement &ecirc;tre supprim&eacute;e de la
vue T&acirc;ches.
D&eacute;finition d’une t&acirc;che comme &eacute;tant termin&eacute;e
❖ Dans la vue T&acirc;ches, s&eacute;lectionnez une t&acirc;che de la colonne, ainsi que l’illustre l’exemple suivant.
Suppression d’une t&acirc;che
❖ Dans la vue T&acirc;ches, acc&eacute;dez au menu contextuel d’une t&acirc;che et s&eacute;lectionnez Supprimer.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 124
Modification du code dans Flash Builder
Suppression de toutes les t&acirc;ches termin&eacute;es
❖ Dans la vue T&acirc;ches, acc&eacute;dez au menu contextuel et s&eacute;lectionnez Supprimer les t&acirc;ches termin&eacute;es.
Ajout et suppression de signets
Les signets permettent de rep&eacute;rer et rechercher facilement des &eacute;l&eacute;ments au sein des projets. Tous les signets sont
affich&eacute;s et g&eacute;r&eacute;s dans la vue Signets (Fen&ecirc;tre &gt; Autres vues &gt; G&eacute;n&eacute;ralit&eacute;s &gt; Signets), ainsi que l’illustre l’exemple
suivant.
Ajout d’un signet &agrave; une ligne de code ou &agrave; une ressource
1 Ouvrez un fichier dans l’&eacute;diteur, puis localisez et s&eacute;lectionnez la ligne de code &agrave; laquelle vous souhaitez ajouter un
signet.
2 Dans le menu principal, s&eacute;lectionnez Editer &gt; Ajouter un signet.
3 Saisissez le nom du signet et cliquez sur OK.
Une ic&ocirc;ne de signet ( ) appara&icirc;t en regard de la ligne de code.
Remarque : ainsi que vous pouvez le constater dans l’Explorateur de packages, la ressource ne signale pas qu’elle contient
un marqueur. Vous pouvez visionner et g&eacute;rer tous les signets dans la vue Signets.
Suppression d’un signet
1 Dans la vue Signets, s&eacute;lectionnez le signet &agrave; supprimer.
2 Cliquez sur le signet avec le bouton droit de la souris (Windows) ou en appuyant sur la touche Ctrl (Mac OS), puis
s&eacute;lectionnez Supprimer.
A propos de la v&eacute;rification de la syntaxe
Le compilateur Flash Builder d&eacute;tecte les erreurs de syntaxe et les signale afin d’en permettre la correction en cours de
r&eacute;daction, avant d’ex&eacute;cuter l’application. Les couleurs de la syntaxe peuvent &ecirc;tre personnalis&eacute;es.
Lorsqu’une erreur de syntaxe est d&eacute;tect&eacute;e dans le code, elle vous est signal&eacute;e de l’une des mani&egrave;res suivantes.
• Un indicateur d’erreur appara&icirc;t en regard de la ligne de code, ainsi que l’illustre l’exemple suivant.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 125
Modification du code dans Flash Builder
• La vue Structure signale les erreurs par un point d’exclamation affich&eacute; dans les lignes de code concern&eacute;es, ainsi que
l’illustre l’exemple suivant.
• La vue Erreurs r&eacute;pertorie les erreurs en leur attribuant un symbole et en affichant le message correspondant.
Double-cliquez sur le message d’erreur pour localiser et mettre en &eacute;vidence la ligne de code dans l’&eacute;diteur, ainsi que
l’illustre l’exemple suivant.
Les erreurs de syntaxe du code sont d&eacute;tect&eacute;es au cours de la g&eacute;n&eacute;ration des projets. Si elles ne sont pas corrig&eacute;es avant
l’ex&eacute;cution de l’application, un message vous avertit de l’existence d’erreurs. En fonction de la nature et de la gravit&eacute;
des erreurs, il est possible que l’application ne soit ex&eacute;cut&eacute;e correctement qu’apr&egrave;s correction de ces erreurs.
Application des pr&eacute;f&eacute;rences de couleurs pour la syntaxe
❖ Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez Flash Builder &gt; Editeurs &gt; Couleurs pour la syntaxe.
Les couleurs par d&eacute;faut peuvent &eacute;galement &ecirc;tre d&eacute;finies dans les pages Editeurs de texte et Couleurs et polices des
Pr&eacute;f&eacute;rences (voir Pr&eacute;f&eacute;rences &gt; G&eacute;n&eacute;ral &gt; Apparence &gt; Couleurs et polices ; voir &eacute;galement Pr&eacute;f&eacute;rences &gt; G&eacute;n&eacute;ral
&gt; Editeurs &gt; Editeurs de texte).
Utilisation de la vue Erreurs
Au fur et &agrave; mesure que vous saisissez et enregistrez du code, Flash Builder le compile en arri&egrave;re-plan et affiche les
erreurs de syntaxe et les avertissements (erreurs) dans la vue Erreurs. L’Explorateur de packages signale les nœuds
contenant des erreurs.
Chaque erreur ou avertissement contient un message, le fichier et le dossier correspondants ainsi que le num&eacute;ro de la
ligne dans le fichier. Les erreurs demeurent affich&eacute;es dans la vue Erreurs jusqu’&agrave; ce que vous les corrigiez ou qu’elles
soient r&eacute;solues.
Acc&egrave;s &agrave; la ligne de code correspondant &agrave; une erreur ou &agrave; un avertissement
❖ Dans la vue Erreurs, double-cliquez sur une erreur ou s&eacute;lectionnez Aller &agrave; dans le menu contextuel de l’erreur.
Flash Builder ouvre un &eacute;diteur dans lequel la ligne de code contenant l’erreur est mise en &eacute;vidence.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 126
Modification du code dans Flash Builder
Raccourcis clavier d’&eacute;dition de code
Le tableau suivant contient une liste de raccourcis clavier utiles pour l’&eacute;dition de code.
Pour obtenir une liste compl&egrave;te des raccourcis clavier disponibles, voir &laquo; Acc&egrave;s aux raccourcis clavier &raquo; &agrave; la page 33.
Pour plus d’informations sur la modification ou la cr&eacute;ation de raccourcis clavier, voir &laquo; Modification des raccourcis
clavier &raquo; &agrave; la page 30.
Nom
Raccourci clavier
Description
Commuter entre les modes
Source et Cr&eacute;ation
Ctrl+`(guillemet ouvrant)
Permet de commuter entre les modes Source et Cr&eacute;ation
de l’&eacute;diteur MXML.
Acc&eacute;der &agrave; la documentation
(Flash Builder version plug-in)
Maj+F2
Affiche l’aide de r&eacute;f&eacute;rence pour l’&eacute;l&eacute;ment de langage
s&eacute;lectionn&eacute; dans le code MXML ou ActionScript en
appuyant sur Maj+F2. Pour plus d’informations, voir
&laquo; Comment obtenir de l’aide pour la r&eacute;daction de code &raquo;
&agrave; la page 110.
F1 (Windows)
Affiche l’aide contextuelle de l’&eacute;l&eacute;ment s&eacute;lectionn&eacute; dans
le workbench (&eacute;diteur, vue, bo&icirc;te de dialogue et ainsi de
suite).
Rechercher dans la r&eacute;f&eacute;rence API
(Flash Builder version autonome)
Aide contextuelle
Cmd+Maj+/ (Mac OS)
Ajouter un commentaire de bloc Ctrl+Maj+C (Windows)
Cmd+Maj+C (Mac OS)
Ajouter des donn&eacute;es CDATA
Ctrl+Maj+D (Windows)
Cmd+Maj+D (Mac OS)
Rechercher le crochet
correspondant
Ctrl+Maj+P (Windows)
Assistant de contenu
Ctrl+Espace (Windows)
Cmd+Maj+P (Mac OS)
Cmd+Maj+Espacement (Mac OS)
Rechercher toutes les
d&eacute;clarations dans l’espace de
travail
Ctrl+G (Windows)
Cmd+G (Mac OS)
Ajoute la mise en forme de commentaire de bloc aux
lignes de code s&eacute;lectionn&eacute;es ou ajoute un commentaire
au point d’insertion. Pour plus d’informations, voir
&laquo; Ajout de commentaires et de blocs de commentaire &raquo; &agrave;
la page 117.
Ajoute une instruction CDATA au point d’insertion afin de
vous permettre d’ajouter du code ActionScript &agrave; un
document MXML.
D&eacute;place le curseur vers le crochet correspondant de
l’instruction de code s&eacute;lectionn&eacute;e.
Affiche les indicateurs de code. Pour plus d’informations,
voir &laquo; Utilisation de l’assistant de contenu &raquo; &agrave; la page 108.
Recherche les d&eacute;clarations dans la base de code. Voir
&laquo; Recherche de r&eacute;f&eacute;rences et restructuration de code &raquo; &agrave;
la page 118.
Rechercher toutes les r&eacute;f&eacute;rences Ctrl+Maj+G (Windows)
dans l’espace de travail
Cmd+Maj+G (Mac OS)
Recherche dans la base de code les r&eacute;f&eacute;rences
correspondant aux identifiants. Voir &laquo; Recherche de
r&eacute;f&eacute;rences et restructuration de code &raquo; &agrave; la page 118.
Acc&eacute;der &agrave; la d&eacute;finition
F3
Ouvre la source d’une d&eacute;finition de code externe. Pour
plus d’informations, voir &laquo; Ouverture de d&eacute;finitions de
code &raquo; &agrave; la page 114.
Acc&eacute;der &agrave; la ligne
Ctrl+L (Windows)
Cmd+L (Mac OS)
Affiche la bo&icirc;te de dialogue Acc&eacute;der &agrave; la ligne, dans
laquelle vous pouvez saisir un num&eacute;ro de ligne pour
l’afficher dans l’&eacute;diteur.
Emplacement de la derni&egrave;re
&eacute;dition
Ctrl+Q (Windows)
Met en surbrillance la derni&egrave;re ligne de code modifi&eacute;e.
Marquer les occurrences
Sans objet
Ctrl+Q (Mac OS)
Signale chaque occurrence dans le code de l’&eacute;l&eacute;ment
s&eacute;lectionn&eacute;.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 127
Modification du code dans Flash Builder
Nom
Raccourci clavier
Description
Organiser les importations
Ctrl+Maj+O (Windows)
Classe par ordre alphab&eacute;tique les instructions
d’importation du document lorsque vous modifiez du
code ActionScript. Pour plus d’informations, voir
&laquo; Organisation des instructions d’importation &raquo; &agrave; la
page 116.
Cmd+Maj+O (Mac OS)
Ouvrir un type
Ctrl+Maj+T (Windows)
Cmd+Maj+T (Mac OS)
Ouverture d’une ressource
Ctrl+Maj+R (Windows)
Cmd+Maj+R (Mac OS)
Permet de parcourir rapidement tous les types de classe.
Pour plus d’informations, voir &laquo; Recherche et affichage
des classes &raquo; &agrave; la page 114.
Affiche la bo&icirc;te de dialogue Ouverture d’une ressource,
dans laquelle vous pouvez rechercher rapidement une
ressource, puis l’ouvrir dans l’&eacute;diteur.
Structure rapide
Ctrl+O (Windows et Mac OS)
Affiche la vue Structure en mode rapide dans l’&eacute;diteur.
Pour plus d’informations, voir &laquo; Utilisation de la vue
Structure rapide de l’&eacute;diteur &raquo; &agrave; la page 113.
Ajouter/Supprimer la mise en
commentaire
Ctrl+/ (Windows)
Ajoute/supprime les commentaires ActionScript dans le
code ActionScript. Voir &laquo; Ajout de commentaires et de
blocs de commentaire &raquo; &agrave; la page 117.
Ajouter/Supprimer la mise en
commentaire de blocs
Shift+Ctrl+C
Activer/D&eacute;sactiver la r&eacute;duction
Ctrl+Diviser_Pav&eacute; num&eacute;rique
Cmd+/ (Mac OS)
Shift+Cmd+C
Ajoute/supprime les blocs de commentaire MXML. Voir
&laquo; Ajout de commentaires et de blocs de commentaire &raquo; &agrave;
la page 117.
Active/d&eacute;sactive la r&eacute;duction des blocs de code. Voir
&laquo; Configuration, r&eacute;duction et d&eacute;veloppement de blocs de
code &raquo; &agrave; la page 111.
Personnalisation des mod&egrave;les de fichier
Flash Builder vous permet de personnaliser les informations par d&eacute;faut contenues dans les nouveaux fichiers MXML,
ActionScript et CSS. Il peut s’agir par exemple des variables d&eacute;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&eacute;rentes d&eacute;clarations ActionScript, pour
diff&eacute;rents pr&eacute;fixes d’espace de noms et pour presque tout contenu que vous souhaitez inclure dans un mod&egrave;le de
fichier. Les mod&egrave;les de fichier sont utiles notamment pour sp&eacute;cifier des commentaires d’introduction et des
informations de copyright.
Le contenu d’un nouveau fichier est sp&eacute;cifi&eacute; dans un mod&egrave;le de fichier accessible &agrave; partir de Pr&eacute;f&eacute;rences &gt; Flash Builder
&gt; Mod&egrave;les de fichier. Des mod&egrave;les sont disponibles pour les types de fichier suivants.
Derni&egrave;re mise &agrave; jour le 29/4/2010
ActionScript
UTILISATION DE FLASH BUILDER 4 128
Modification du code dans Flash Builder
Fichier ActionScript
Classe ActionScript
Interface ActionScript
MXML
Application Web MXML
Application de bureau MXML
Composant MXML
Module MXML
Habillage MXML
Rendu d’&eacute;l&eacute;ment pour composants Spark
Rendu d’&eacute;l&eacute;ment pour composants MX
Rendu d’&eacute;l&eacute;ment pour composant MX
DataGrid
Rendu d’&eacute;l&eacute;ment pour composant
AdvancedDataGrid
Rendu d’&eacute;l&eacute;ment pour composant MX Tree
FlexUnit
Classe TestCase FlexUnit
Classe TestSuite FlexUnit
Classe TestCase FlexUnit4
Classe TestSuite FlexUnit4
CSS
Fichier CSS
Une fois modifi&eacute;, un mod&egrave;le peut &ecirc;tre export&eacute; afin de pouvoir &ecirc;tre partag&eacute; avec les autres membres de votre &eacute;quipe.
Modification d’un mod&egrave;le de fichier
1 S&eacute;lectionnez Pr&eacute;f&eacute;rences &gt; Flash Builder &gt; Mod&egrave;les de fichier.
2 D&eacute;veloppez les types de fichier et s&eacute;lectionnez le mod&egrave;le que vous souhaitez modifier.
3 Cliquez sur Editer et modifiez le mod&egrave;le.
Vous pouvez saisir les donn&eacute;es directement dans l’&eacute;diteur Mod&egrave;le ou s&eacute;lectionner Variables afin d’ins&eacute;rer des
donn&eacute;es pr&eacute;d&eacute;finies dans le mod&egrave;le.
4 Cliquez sur OK pour enregistrer les modifications.
Les modifications sont appliqu&eacute;es aux nouveaux fichiers.
Exportation et importation de mod&egrave;les de fichier
1 S&eacute;lectionnez Pr&eacute;f&eacute;rences &gt; Flash Builder &gt; Mod&egrave;les de fichier.
2 D&eacute;veloppez les types de fichier et s&eacute;lectionnez un mod&egrave;le.
3 Cliquez sur Exporter pour exporter le mod&egrave;le vers un syst&egrave;me de fichiers ou Importer pour importer un mod&egrave;le
pr&eacute;c&eacute;demment export&eacute;.
Les mod&egrave;les sont export&eacute;s dans des fichiers XML.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 129
Modification du code dans Flash Builder
Restauration des valeurs par d&eacute;faut
Remarque : le bouton Restaurer les valeurs par d&eacute;faut r&eacute;tablit les valeurs par d&eacute;faut de tous les mod&egrave;les de fichier. Vous
ne pouvez pas restaurer les valeurs par d&eacute;faut d’un seul mod&egrave;le.
❖ Pour restaurer les mod&egrave;les par d&eacute;faut, ouvrez la fen&ecirc;tre Pr&eacute;f&eacute;rences &gt; Flash Builder &gt; Mod&egrave;les de fichier et
s&eacute;lectionnez Restaurer les valeurs par d&eacute;faut.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 130
Modification du code dans Flash Builder
Variables des mod&egrave;les
Variables des mod&egrave;les pour tous les types de fichiers
Variable
Description
Exemple
${date}
Date actuelle
15 f&eacute;vrier 2009
${year}
Ann&eacute;e actuelle
2009
${time}
Heure actuelle
15h15
${file_name}
Nom du fichier cr&eacute;&eacute;
HelloWorld.mxml
${project_name}
Nom du projet Flex ou ActionScript
Hello_World_Project
${utilisateur}
Nom d’utilisateur de l’auteur
jdoe
$$
Symbole du dollar
$
${dollar}
Variables des mod&egrave;les pour les fichiers MXML
Variable
Description
Exemple
${application}
Sp&eacute;cifient les noms des balises de
l’application, du composant ou du
module MXML.
Les balises suivantes :
${component}
${module}
Pour une application Web,
${application} s’&eacute;tend &agrave; &laquo; Application &raquo;.
Pour une application de bureau,
${application} s’&eacute;tend &agrave;
&laquo; WindowedApplication &raquo;.
&lt;${application}
${xmlns}${wizard_attributes}${min_size
}&gt;
${wizard_tags}
&lt;/${application}&gt;
s’&eacute;tendent &agrave; :
&lt;s:Application
${component} s’&eacute;tend &agrave; &laquo; Component &raquo;. xmlns:fx=&quot;http://ns.adobe.com/mxml/200
${module} s’&eacute;tend &agrave; &laquo; Module &raquo;.
Ces balises permettent g&eacute;n&eacute;ralement
de positionner les balises d’ouverture et
de fermeture d’un fichier.
9&quot;
xmlns:s=&quot;library://ns.adobe.com/flex/s
park&quot;
xmlns:mx=&quot;library://ns.adobe.com/flex/
halo&quot; minWidth=&quot;1024&quot; minHeight=&quot;768&quot;&gt;
&lt;s:layout&gt;
&lt;s:BasicLayout/&gt;
&lt;/s:layout&gt;
&lt;/s:Application&gt;
${xml_tag}
Version XML
&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
${xmlns}
Correspond &agrave; la d&eacute;finition d’espace de
noms en fonction du type de SDK Flex
du projet et du pr&eacute;fixe d’espace de
noms d&eacute;fini dans les Pr&eacute;f&eacute;rences.
Pour un projet SDK Flex 4 :
Taille minimale d’une application Web
MXML.
minWidth=&quot;1024&quot; minHeight=&quot;768&quot;
${min_size}
xmlns=&quot;http://ns.adobe.com/mxml/2009&quot;
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 131
Modification du code dans Flash Builder
Variable
Description
Exemple
${ns_prefix}
Pr&eacute;fixe d’espace de noms pour le SDK
Flex du projet.
Pour Flex 3 : mx:
Pour Flex 4 : fx:
Vous ne pouvez pas modifier les valeurs
par d&eacute;faut de cette variable.
${wizard_attributes}
Sp&eacute;cifie la position des attributs d&eacute;finis
par l’assistant Nouveau Fichier.
Pour une nouvelle application Web :
${application} ${xmlns}${wizard_attributes}&gt;
s’&eacute;tendent &agrave; :
&lt;Application
xmlns=&quot;http://ns.adobe.com/mxml/2009&quot;
layout=&quot;vertical&quot;&gt;
${wizard_tags}
Sp&eacute;cifie la propri&eacute;t&eacute; de pr&eacute;sentation des Pour une nouvelle application bas&eacute;e sur le SDK
conteneurs d&eacute;finis par l’assistant
Flex 4 :
Nouveau Fichier.
&lt;s:layout&gt;
&lt;s:BasicLayout/&gt;
&lt;/s:layout&gt;
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 132
Modification du code dans Flash Builder
Variables des mod&egrave;les pour les fichiers ActionScript
Variable
Description
Exemple
${package_declaration}
G&eacute;n&egrave;re la d&eacute;claration du package.
Pour un fichier du package com/samples,
g&eacute;n&egrave;re :
package com.samples
${import_declaration}
${interface_declaration}
G&eacute;n&egrave;re les d&eacute;clarations d’importation requises
pour une nouvelle classe ou interface
ActionScript.
Pour une sous-classe de TextBox, g&eacute;n&egrave;re :
G&eacute;n&egrave;re la d&eacute;claration d’interface pour une
nouvelle interface ActionScript.
Pour une nouvelle interface qui &eacute;tend
l’interface IButton, g&eacute;n&egrave;re :
import flex.graphics.TextBox;
public interface IMyButton extends IButton
${class_declaration}
G&eacute;n&egrave;re la d&eacute;claration de classe pour une
nouvelle classe ActionScript.
Pour une nouvelle sous-classe de
CheckBox, g&eacute;n&egrave;re :
public class MyCheckBox extends
CheckBox
${class_body}
G&eacute;n&egrave;re toutes les instructions requises pour
une nouvelle classe.
Pour une nouvelle sous-classe de Button
impl&eacute;mentant l’interface IBorder, g&eacute;n&egrave;re ce
qui suit pour le corps de la classe :
public function MyButton()
{
super(); } public function
get borderMetrics():EdgeMetrics
{
return null; }
${interface_name}
${class_name}
${package_name}
Sp&eacute;cifie le nom de l’interface, de la classe ou du Par exemple, la sp&eacute;cification de mod&egrave;le :
package.
/*
* ${class_name} implements.
Cette variable est utilis&eacute;e g&eacute;n&eacute;ralement lors de . . */
la cr&eacute;ation de commentaires.
g&eacute;n&egrave;re le code :
/* * MyButton implements. . .
*/
Variables de mod&egrave;les pour fichiers CSS
Variable
Description
Exemple
${css_namespaces}
D&eacute;finit les espaces de noms pour les
s&eacute;lecteurs de style Spark et Halo.
Valeurs par d&eacute;faut pour Flex 3 :
&quot;&quot;
(Dans Flex 3, les d&eacute;clarations d’espace de noms ne
sont pas requises dans les fichiers CSS).
Valeurs par d&eacute;faut pour Flex 4 :
@namespace s
&quot;library://ns.adobe.com/flex/spark&quot;;
@namespace mx
&quot;library://ns.adobe.com/flex/halo&quot;;
Exemple de fichier mod&egrave;le
Le code suivant illustre un exemple de mod&egrave;le de fichier de composant MXML, suivi par un nouveau fichier de
composant MXML g&eacute;n&eacute;r&eacute; &agrave; partir du mod&egrave;le.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 133
Modification du code dans Flash Builder
Exemple de mod&egrave;le pour un fichier de composant MXML
${xml_tag}
&lt;!-* ADOBE SYSTEMS Confidential
*
* Copyright ${year}. All rights reserved.
*
* ${user}
* ${project_name}
* Created ${date}
*
--&gt;
&lt;${component} ${xmlns}${wizard_attributes}&gt;
${wizard_tags}
&lt;${ns_prefix}Script&gt;
&lt;![CDATA[
]]&gt;
&lt;/${ns_prefix}Script&gt;
&lt;/${component}&gt;
Nouveau fichier de composant MXML g&eacute;n&eacute;r&eacute; &agrave; partir du mod&egrave;le d’exemple
&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
&lt;!-* ADOBE SYSTEMS Confidential
*
* Copyright 2009. All rights reserved.
*
* jdoe
* FileTemplates
* Created Jul 13, 2009
*
--&gt;
&lt;s:Group xmlns:fx=&quot;http://ns.adobe.com/mxml/2009&quot;
xmlns:s=&quot;library://ns.adobe.com/flex/spark&quot;
xmlns:mx=&quot;library://ns.adobe.com/flex/halo&quot; width=&quot;400&quot; height=&quot;300&quot;&gt;
&lt;s:layout&gt;
&lt;s:BasicLayout/&gt;
&lt;/s:layout&gt;
&lt;fx:Script&gt;
&lt;![CDATA[
]]&gt;
&lt;/fx:Script&gt;
&lt;/s:Group&gt;
Derni&egrave;re mise &agrave; jour le 29/4/2010
Chapitre 5 : Cr&eacute;ation de composants
MXML personnalis&eacute;s
G&eacute;n&eacute;ralement, une application d’Adobe&reg; Flex&reg; se compose d’un fichier d’application MXML (c’est-&agrave;-dire un fichier
contenant une balise parent &lt;s:Application&gt;), d’un ou de plusieurs composants Flex standard ainsi que d’un ou de
plusieurs composants personnalis&eacute;s d&eacute;finis dans des fichiers de composants (SWC) MXML, ActionScript ou Flash. En
scindant l’application en blocs de dimensions maniables, vous pouvez r&eacute;diger et tester chaque composant
individuellement. Dans un souci d’efficacit&eacute;, les composants peuvent &ecirc;tre r&eacute;utilis&eacute;s, dans la m&ecirc;me application ou dans
une application diff&eacute;rente.
Vous pouvez utiliser Adobe Flash&reg; Builder™ pour cr&eacute;er des composants MXML et ActionScript personnalis&eacute;s, puis les
int&eacute;grer &agrave; vos applications. Pour plus d’informations sur la cr&eacute;ation de composants ActionScript, voir &laquo; Cr&eacute;ation d’une
classe ActionScript &raquo; &agrave; la page 67.
Vous pouvez &eacute;galement cr&eacute;er un composant MXML directement &agrave; partir de code. Pour plus d’informations, voir
Simple MXML Components.
A propos des composants personnalis&eacute;s
Les raisons &agrave; l’origine de la personnalisation des composants peuvent &ecirc;tre multiples. Vous voulez par exemple
simplement ajouter certaines fonctions &agrave; un composant existant ou cr&eacute;er un composant r&eacute;utilisable, tel que par
exemple une zone de recherche ou l’affichage d’un &eacute;l&eacute;ment dans une grille de donn&eacute;es. Peut-&ecirc;tre souhaitez-vous
r&eacute;diger un type de composant compl&egrave;tement nouveau, n’existant pas dans la structure Flex.
Si le composant est cr&eacute;&eacute; principalement &agrave; partir de composants existants, l’utilisation de MXML en facilitera la
d&eacute;finition. Toutefois, s’il s’agit d’un type de composant enti&egrave;rement nouveau, il sera pr&eacute;f&eacute;rable de le d&eacute;finir en tant que
composant ActionScript. Pour plus d’informations, voir &laquo; Cr&eacute;ation d’une classe ActionScript &raquo; &agrave; la page 67.
Cr&eacute;ation de composants MXML avec Flash Builder
Flash Builder permet de cr&eacute;er des composants MXML personnalis&eacute;s.
1 Cliquez sur Fichier &gt; Nouveau &gt; Composant MXML.
La bo&icirc;te de dialogue pour la cr&eacute;ation d’un nouveau composant s’affiche.
2 Sp&eacute;cifiez le dossier parent pour le fichier du composant personnalis&eacute;.
Enregistrez le fichier dans un dossier situ&eacute; dans le r&eacute;pertoire du projet actuel ou dans le chemin source du projet
actuel. Le composant s’affichera ainsi dans la vue Composants.
3 Sp&eacute;cifiez le nom de fichier du composant.
Il d&eacute;finit le nom du composant. Par exemple, le nom du composant dont le fichier est nomm&eacute; LoginBox.mxml est
LoginBox.
4 Dans le champ Bas&eacute; sur, s&eacute;lectionnez le composant de base de votre composant personnalis&eacute;.
134
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 135
Cr&eacute;ation de composants MXML personnalis&eacute;s
Les composants personnalis&eacute;s sont g&eacute;n&eacute;ralement d&eacute;riv&eacute;s de composants existants. Les composants de pr&eacute;sentation
personnalis&eacute;s se basent g&eacute;n&eacute;ralement sur des composants Container.
Pour Flex 4, Flash Builder sugg&egrave;re spark.components.Group comme composant de base.
S&eacute;lectionnez Parcourir pour ouvrir la bo&icirc;te de dialogue Ouvrir un type, puis choisissez un composant.
Modifiez ou effacez le composant sugg&eacute;r&eacute; afin d’&eacute;largir la s&eacute;lection dans la bo&icirc;te de dialogue Ouvrir un type. Par
exemple, sp&eacute;cifiez spark.components. avant de cliquer sur Parcourir.
Vous pouvez filtrer la s&eacute;lection dans la bo&icirc;te de dialogue Ouvrir un type en fonction de vos besoins. Pour plus
d’informations sur l’utilisation de la bo&icirc;te de dialogue Ouvrir un type, voir &laquo; Recherche et affichage des classes &raquo; &agrave;
la page 114.
5 (Facultatif) Si vous basez le composant sur un conteneur, vous avez la possibilit&eacute; de d&eacute;finir la largeur et la hauteur
du composant.
Vous pouvez saisir des valeurs fixes ou des pourcentages. Vous pouvez &eacute;galement vider les deux champs. Lorsque
vous cr&eacute;ez une occurrence du composant, vous pouvez remplacer la largeur et la hauteur du composant dans
l’occurrence.
Si vous saisissez des pourcentages ou ne sp&eacute;cifiez aucune valeur, vous avez la possibilit&eacute; de visualiser un aper&ccedil;u du
composant &agrave; diff&eacute;rentes tailles. Pour ce faire, utilisez la liste d&eacute;roulante situ&eacute;e dans la barre d’outils de la vue
Cr&eacute;ation de l’&eacute;diteur MXML. Pour plus d’informations, voir &laquo; Cr&eacute;ation de composants visuels &raquo; &agrave; la page 135.
6 Cliquez sur Terminer.
Flash Builder enregistre le fichier dans le dossier parent et l’ouvre dans l’&eacute;diteur.
Si vous avez enregistr&eacute; le fichier dans le projet actif ou dans le chemin source correspondant, Flash Builder affiche
&eacute;galement le composant dans la vue Composants pour permettre son insertion rapide dans les applications. Pour
plus d’informations, voir &laquo; Ajout de composants en mode Cr&eacute;ation MXML &raquo; &agrave; la page 192.
Remarque : la vue Composants ne r&eacute;pertorie que les composants personnalis&eacute;s visibles (c’est-&agrave;-dire ceux ayant h&eacute;rit&eacute;
de la classe UIComponent). Pour plus d’informations, voir le Guide de r&eacute;f&eacute;rence du langage Adobe Flex.
7 Cr&eacute;ez un composant personnalis&eacute;.
Pour plus d’informations, voir Simple MXML Components.
Cr&eacute;ation de composants visuels
Vous pouvez pr&eacute;senter un composant personnalis&eacute; visuellement dans l’&eacute;diteur MXML &agrave; l’instar d’un fichier
d’application MXML. Tous les outils du mode Cr&eacute;ation sont disponibles. Vous pouvez par exemple ajouter des
contr&ocirc;les enfant &agrave; partir de la vue Composants et d&eacute;finir les propri&eacute;t&eacute;s dans la vue Propri&eacute;t&eacute;s. Pour plus
d’informations, voir &laquo; Utilisation visuelle des composants &raquo; &agrave; la page 196.
La taille du composant personnalis&eacute; dans la vue Cr&eacute;ation d&eacute;pend des r&egrave;gles suivantes :
• Si le composant poss&egrave;de une hauteur et une largeur fixes, Flash Builder adapte automatiquement la zone de cr&eacute;ation
&agrave; ces dimensions.
• Si le composant ne poss&egrave;de pas de largeur et de hauteur ou si ces derni&egrave;res ont une valeur de 100%, vous pouvez
s&eacute;lectionner les dimensions de la zone de cr&eacute;ation dans la liste d&eacute;roulante de la barre d’outils de l’&eacute;diteur.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 136
Cr&eacute;ation de composants MXML personnalis&eacute;s
S&eacute;lectionnez diff&eacute;rentes dimensions afin d’obtenir diff&eacute;rents aper&ccedil;us du composant. Les dimensions par d&eacute;faut de
la zone de cr&eacute;ation sont de 400x300 pixels pour les conteneurs. Pour les contr&ocirc;les, la zone de cr&eacute;ation s’ajuste au
contenu.
• En pr&eacute;sence de valeurs autres que 100% pour la hauteur et la largeur, le composant est repr&eacute;sent&eacute; sous forme de
pourcentage de la dimension s&eacute;lectionn&eacute;e dans le menu de la zone de cr&eacute;ation.
D&eacute;finition de commentaires ASDoc pour les composants
personnalis&eacute;s
Vous pouvez documenter les composants personnalis&eacute;s en ajoutant des commentaires ASDoc au code qui les
impl&eacute;mente. Les commentaires ASDoc sont ensuite disponibles dans l’assistant de contenu des &eacute;diteurs MXML et
ActionScript. Pour plus d’informations, voir &laquo; Utilisation de l’assistant de contenu &raquo; &agrave; la page 108.
Ajoutez des commentaires ASDoc aux fichiers source ActionScript pour fournir la documentation de r&eacute;f&eacute;rence de
l’API. Vous pouvez &eacute;galement ajouter des commentaires ASDoc &agrave; des &eacute;l&eacute;ments MXML du document. Voir ASDoc
pour en savoir plus sur la cr&eacute;ation de commentaires ASDoc pour vos fichiers source.
Modification et distribution des composants MXML
personnalis&eacute;s
Flash Builder repr&eacute;sente tous les composants personnalis&eacute;s visibles (c’est-&agrave;-dire tous ceux ayant h&eacute;rit&eacute; de
UIComponent) dans la vue Cr&eacute;ation de l’&eacute;diteur MXML. Vous pouvez double-cliquer sur un composant personnalis&eacute;
pour en ouvrir le fichier et le modifier.
1 Ouvrez un fichier MXML utilisant un composant personnalis&eacute;.
2 En mode Cr&eacute;ation, double-cliquez sur un composant personnalis&eacute;.
Le fichier du composant s’ouvre dans l’&eacute;diteur.
Vous pouvez &eacute;galement s&eacute;lectionner Ouvrir le composant personnalis&eacute; dans le menu contextuel.
3 Modifiez le composant personnalis&eacute;.
Distribution des composants personnalis&eacute;s
Distribuez les composants personnalis&eacute;s en cr&eacute;ant des projets de biblioth&egrave;que. Pour plus d’informations, voir &laquo; Projets
de biblioth&egrave;que &raquo; &agrave; la page 69.
Derni&egrave;re mise &agrave; jour le 29/4/2010
137
Chapitre 6 : D&eacute;veloppement d’applications
AIR avec Flash Builder
Adobe&reg; Flash&reg; Builder™ comporte les outils permettant la cr&eacute;ation de projets Adobe&reg; AIR&reg;, l’utilisation des composants
Flex AIR ainsi que le d&eacute;bogage et l’assemblage d’applications Adobe AIR. Le processus de d&eacute;veloppement des
applications AIR dans Flash Builder est analogue &agrave; celui de la plupart des applications Flex.
Cr&eacute;ation de projets AIR avec Flash Builder
Si vous ne l’avez pas d&eacute;j&agrave; fait, t&eacute;l&eacute;chargez et installez l’ex&eacute;cution AIR.
1 Ouvrez Flash Builder.
2 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet Flex.
3 Entrez le nom du projet.
4 Dans Flex, les applications AIR sont consid&eacute;r&eacute;es comme un type d’application. Vous disposez de deux options : une
application ex&eacute;cut&eacute;e sur le Web dans Adobe&reg; Flash&reg; Player et une application de bureau ex&eacute;cut&eacute;e dans Adobe AIR.
S&eacute;lectionnez Application de bureau comme type d’application.
5 Sp&eacute;cifiez si n&eacute;cessaire la technologie de serveur &agrave; utiliser avec l’application AIR. En l’absence de technologie de
serveur, s&eacute;lectionnez Aucun/Autre, puis cliquez sur Suivant.
6 S&eacute;lectionnez le dossier dans lequel vous souhaitez cr&eacute;er l’application. Le dossier affich&eacute; par d&eacute;faut est bin-debug.
Cliquez sur Suivant.
7 Modifiez si n&eacute;cessaire les chemins source et d’acc&egrave;s &agrave; la biblioth&egrave;que, puis cliquez sur Terminer pour cr&eacute;er le projet AIR.
Conversion de projets Flex en projets Adobe AIR
Les projets Flex sp&eacute;cifient soit un type d’application Web (ex&eacute;cut&eacute;e dans Adobe Flash Player), soit un type
d’application de bureau (ex&eacute;cut&eacute;e dans Adobe AIR). L’application d’un projet Flex peut &ecirc;tre convertie du type Web au
type de bureau. Voir &laquo; Conversion de projets Flex en projets Adobe AIR &raquo; &agrave; la page 50.
Remarque : si vous importez un projet Catalyst &agrave; partir d’un fichier FXP, Flash Builder importe le projet avec le type
d’application Web. Vous pouvez convertir le projet en type d’application de bureau (ex&eacute;cut&eacute;e dans Adobe AIR).
D&eacute;bogage des applications AIR avec Flash Builder
Flash Builder prend enti&egrave;rement en charge le d&eacute;bogage des applications AIR. Pour plus d’informations sur les
possibilit&eacute;s de d&eacute;bogage de Flash Builder, voir &laquo; D&eacute;bogage des applications &raquo; &agrave; la page 141.
1 Dans Flash Builder, ouvrez un fichier source pour l’application (un fichier MXML, par exemple).
2 Cliquez sur le bouton D&eacute;boguer situ&eacute; dans la barre d’outils principale
Vous pouvez &eacute;galement s&eacute;lectionner Ex&eacute;cuter &gt; D&eacute;boguer.
.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 138
D&eacute;veloppement d’applications AIR avec Flash Builder
L’application est lanc&eacute;e. Elle est ex&eacute;cut&eacute;e dans l’application ADL (AIR Debugger Launcher, application de d&eacute;bogage
du lanceur AIR). Le d&eacute;bogueur Flash Builder d&eacute;tecte les points d’arr&ecirc;t et les erreurs d’ex&eacute;cution. L’application peut
&ecirc;tre d&eacute;bogu&eacute;e comme toute autre application Flex.
Vous pouvez &eacute;galement d&eacute;boguer une application &agrave; partir de la ligne de commande en utilisant l’outil de ligne de
commande de l’application de d&eacute;bogage du lanceur AIR. Pour plus d’informations, voir Utilisation de l’application de
d&eacute;bogage du lanceur AIR (ADL) dans la documentation AIR.
Cr&eacute;ation de packages d’application AIR avec Flash
Builder
Une fois l’application achev&eacute;e et pr&ecirc;te &agrave; &ecirc;tre distribu&eacute;e (ou test&eacute;e &agrave; partir du bureau), elle doit &ecirc;tre mise en package
dans un fichier AIR. La cr&eacute;ation de packages se compose des &eacute;tapes suivantes :
• S&eacute;lection de l’application AIR &agrave; publier
• Affichage du code source (en pr&eacute;sence de l’autorisation requise) et s&eacute;lection des fichiers d’application &agrave; inclure
• S&eacute;lection d’un fichier AIR g&eacute;n&eacute;rique ou d’un programme d’installation natif pour l’installation de l’application
• Signature num&eacute;rique de l’application AIR par un certificat commercial de signature de code ou par la cr&eacute;ation et
l’application d’une signature autosign&eacute;e
• Cr&eacute;ation (facultative) d’un fichier AIR interm&eacute;diaire pouvant &ecirc;tre sign&eacute; ult&eacute;rieurement
Mise en package d’une application AIR
1 Ouvrez le projet et v&eacute;rifiez que l’application ne pr&eacute;sente aucune erreur de compilation ni d’ex&eacute;cution.
2 S&eacute;lectionnez Projet &gt; Exporter vers une version valid&eacute;e.
3 Si plusieurs projets et applications sont ouverts dans Flash Builder, s&eacute;lectionnez le projet AIR &agrave; assembler.
4 Vous pouvez &eacute;galement s&eacute;lectionner Activer l’affichage de la source pour permettre aux utilisateurs de visionner le
code source &agrave; l’ex&eacute;cution de l’application. Cliquez sur Choisir des fichiers source pour s&eacute;lectionner les fichiers &agrave;
exclure. Par d&eacute;faut, tous les fichiers source sont s&eacute;lectionn&eacute;s. Pour plus d’informations sur la publication des
fichiers source dans Flash Builder, voir l’Aide de Flash Builder.
Important : pour les projets pour serveurs, vous pouvez s&eacute;lectionner le dossier des services &agrave; l’exportation des fichiers
source. L’exportation de fichiers impl&eacute;mentant des services a des implications en termes de s&eacute;curit&eacute;. Ces fichiers
peuvent donner acc&egrave;s &agrave; votre base de donn&eacute;es, noms d’utilisateurs et mots de passe inclus. Voir Exportation des fichiers
source avec version valid&eacute;e d’une application.
5 S&eacute;lectionnez l’option Exporter vers un fichier AIR ou l’option Exporter vers le programme d’installation natif.
Cliquez sur Suivant.
L’option Exporter vers un fichier AIR cr&eacute;e un fichier de programme d’installation g&eacute;n&eacute;rique permettant
l’installation de l’application sur les plates-formes Windows ou Mac OS X.
L’option Exporter vers le programme d’installation natif cr&eacute;e un programme d’installation pour la plate-forme cible
(Windows ou Mac OS X).
6 Vous avez &eacute;galement la possibilit&eacute; de renommer le fichier AIR g&eacute;n&eacute;r&eacute;. D&egrave;s que vous &ecirc;tes pr&ecirc;t &agrave; poursuivre, cliquez
sur Suivant pour apposer une signature num&eacute;rique sur l’application.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 139
D&eacute;veloppement d’applications AIR avec Flash Builder
Signature num&eacute;rique des applications AIR
Avant de poursuivre l’exportation vers une version valid&eacute;e, sp&eacute;cifiez comment apposer la signature num&eacute;rique &agrave;
l’application AIR. Vous disposez de plusieurs options. Vous pouvez signer l’application par un certificat commercial
de signature du code, cr&eacute;er et utiliser un certificat num&eacute;rique autosign&eacute; ou mettre l’application en package et la signer
ult&eacute;rieurement.
Les certificats num&eacute;riques d&eacute;livr&eacute;s par des autorit&eacute;s de certification telles que VeriSign, Thawte, GlobalSign et
ChosenSecurity valident votre identit&eacute; d’&eacute;diteur aupr&egrave;s des utilisateurs et v&eacute;rifient que le fichier d’installation n’a pas
&eacute;t&eacute; modifi&eacute; depuis sa signature. Les certificats num&eacute;riques autosign&eacute;s sont utilis&eacute;s dans le m&ecirc;me but, mais se
distinguent par le fait qu’ils ne pr&eacute;sentent aucune validation par un tiers.
Vous pouvez &eacute;galement assembler l’application AIR sans signature num&eacute;rique en cr&eacute;ant un fichier AIR interm&eacute;diaire
(.airi). La validit&eacute; de ce type de fichier est limit&eacute;e. Il ne peut en effet pas &ecirc;tre install&eacute;. Il est utilis&eacute; dans les proc&eacute;dures
de test (effectu&eacute;es par les d&eacute;veloppeurs) et peut &ecirc;tre lanc&eacute; avec l’outil de ligne de commande AIR ADT. AIR destine
cette fonctionnalit&eacute; aux environnements de d&eacute;veloppement au sein desquels la signature est prise en charge par un
d&eacute;veloppeur ou une &eacute;quipe sp&eacute;cifique. Cette mani&egrave;re de proc&eacute;der augmente le degr&eacute; de s&eacute;curit&eacute; de gestion des
certificats num&eacute;riques.
Pour plus d’informations sur la signature des applications, voir Signature num&eacute;rique d’un fichier AIR dans la
documentation AIR.
Signature num&eacute;rique d’une application AIR
Vous pouvez apposer une signature num&eacute;rique sur une application AIR en s&eacute;lectionnant le certificat num&eacute;rique
existant ou en cr&eacute;ant un nouveau certificat autosign&eacute;.
1 S&eacute;lectionnez Projet &gt; Exporter vers une version valid&eacute;e.
S&eacute;lectionnez le projet AIR que vous voulez exporter ainsi que le fichier vers lequel vous souhaitez exporter le projet.
Cliquez sur Suivant.
2 S&eacute;lectionnez l’option Exporter et signer un fichier AIR avec un certificat num&eacute;rique.
3 Si vous disposez d&eacute;j&agrave; d’un certificat num&eacute;rique, cliquez sur Parcourir pour y acc&eacute;der, puis s&eacute;lectionnez-le.
4 Pour cr&eacute;er un certificat num&eacute;rique autosign&eacute;, cliquez sur Cr&eacute;er.
5 Sp&eacute;cifiez les informations requises et cliquez sur OK.
6 (Facultatif) Cliquez sur Suivant. S&eacute;lectionnez les fichiers de sortie qui devront &ecirc;tre inclus dans le fichier AIRI
export&eacute;.
Par d&eacute;faut, tous les fichiers sont inclus.
7 Cliquez sur Terminer pour cr&eacute;er le fichier AIR.
Cr&eacute;ation d’un fichier AIR interm&eacute;diaire
Vous pouvez cr&eacute;er un fichier AIRI interm&eacute;diaire et le signer ult&eacute;rieurement. Utilisez cette option uniquement lorsque
vous proc&eacute;dez &agrave; des tests.
1 S&eacute;lectionnez Projet &gt; Exporter vers une version valid&eacute;e.
S&eacute;lectionnez le projet AIR que vous voulez exporter ainsi que le fichier vers lequel vous souhaitez exporter le projet.
Cliquez sur Suivant.
2 S&eacute;lectionnez l’option Exporter vers un fichier AIRI interm&eacute;diaire &agrave; signer ult&eacute;rieurement.
3 (Facultatif) Cliquez sur Suivant. S&eacute;lectionnez les fichiers de sortie qui devront &ecirc;tre inclus dans le fichier AIRI
export&eacute;.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 140
D&eacute;veloppement d’applications AIR avec Flash Builder
Par d&eacute;faut, tous les fichiers sont inclus.
4 Cliquez sur Terminer.
Une fois g&eacute;n&eacute;r&eacute;, le fichier AIR interm&eacute;diaire peut &ecirc;tre sign&eacute; en utilisant l’outil ADT (AIR Developer Tool). Pour
plus d’informations sur l’outil de ligne de commande ADT, voir Signature d’un fichier interm&eacute;diaire AIR &agrave; l’aide de
l’outil ADT dans la documentation AIR.
Cr&eacute;ation d’un projet de biblioth&egrave;que AIR
Pour cr&eacute;er une biblioth&egrave;que de code AIR pour plusieurs projets AIR, g&eacute;n&eacute;rez un projet de biblioth&egrave;que AIR en faisant
appel &agrave; l’assistant standard de projet de biblioth&egrave;que Flex.
1 S&eacute;lectionnez Fichier &gt; Nouveau &gt; Projet de biblioth&egrave;que Flex.
2 Entrez un nom de projet.
3 Activez l’option Inclure les biblioth&egrave;ques Adobe AIR, puis cliquez sur Suivant.
Remarque : la version du SDK Flex s&eacute;lectionn&eacute;e doit prendre en charge AIR. Le SDK Flex 2.0.1 ne le prend pas en
charge.
4 Modifiez si n&eacute;cessaire le chemin de g&eacute;n&eacute;ration, puis cliquez sur Terminer. Pour plus d’informations sur la cr&eacute;ation
de projets de biblioth&egrave;que, voir &laquo; A propos des projets de biblioth&egrave;que &raquo; dans l’Aide de Flash Builder.
Derni&egrave;re mise &agrave; jour le 29/4/2010
Chapitre 7 : D&eacute;bogage, test et surveillance
des applications
D&eacute;bogage des applications
Le d&eacute;bogage est similaire &agrave; l’ex&eacute;cution des applications. Il diff&egrave;re toutefois par la possibilit&eacute; de contr&ocirc;ler le code en cas
d’arr&ecirc;t de l’application, de surveiller des variables importantes ou de tester les corrections apport&eacute;es au code.
L’ex&eacute;cution et le d&eacute;bogage font appel &agrave; une configuration pour contr&ocirc;ler la mani&egrave;re dont les applications sont lanc&eacute;es.
Le d&eacute;bogage d’une application consiste &agrave; ex&eacute;cuter la version d&eacute;bogu&eacute;e du fichier d’application.
Pour une pr&eacute;sentation g&eacute;n&eacute;rale des outils de d&eacute;bogage disponibles dans la perspective de d&eacute;bogage Flash, voir
&laquo; Perspective D&eacute;bogage Flash &raquo; &agrave; la page 16.
Dans certains cas, le programme vous invite &agrave; consulter le fichier journal Eclipse. Pour plus d’informations, voir
&laquo; Erreurs d’environnement Eclipse dans le fichier journal &raquo; &agrave; la page 76.
Lancement d’une session de d&eacute;bogage
Pour lancer une session de d&eacute;bogage, ex&eacute;cutez la configuration de lancement de l’application dans la perspective
D&eacute;bogage Flash.
D&eacute;bogage d’une application
1 Dans l’Explorateur de packages, s&eacute;lectionnez le projet que vous souhaitez d&eacute;boguer.
2 Cliquez sur le bouton D&eacute;boguer de la barre d’outils principale.
Remarque : le bouton D&eacute;boguer comporte deux &eacute;l&eacute;ments : le bouton d’action principal et la liste d&eacute;roulante affichant
les fichiers d’application du projet pouvant &ecirc;tre ex&eacute;cut&eacute;s ou d&eacute;bogu&eacute;s. Cliquez sur le bouton d’action principal pour
ex&eacute;cuter le fichier d’application par d&eacute;faut du projet. Vous pouvez &eacute;galement cliquer sur la liste d&eacute;roulante et
s&eacute;lectionner l’un des fichiers d’application du projet que vous voulez d&eacute;boguer. Vous pouvez en outre ouvrir la bo&icirc;te
de dialogue des configurations de lancement et cr&eacute;er ou &eacute;diter une configuration en cliquant sur la commande
D&eacute;boguer.
Si le projet n’a pas encore &eacute;t&eacute; g&eacute;n&eacute;r&eacute;, Adobe&reg; Flash&reg; Builder™ le g&eacute;n&egrave;re et l’ex&eacute;cute en mode de d&eacute;bogage.
3 L’application est affich&eacute;e dans le navigateur Web par d&eacute;faut ou dans la version autonome de Flash Player. Vous
pouvez ensuite faire appel au d&eacute;bogueur de Flash Builder pour interagir avec elle.
4 La perspective D&eacute;bogage Flash est activ&eacute;e dans le workbench &agrave; chaque point d’arr&ecirc;t rencontr&eacute;.
Lancement d’une session de d&eacute;bogage dans la configuration plug-in
L’action de la commande D&eacute;boguer de la version plug-in de Flash Builder est l&eacute;g&egrave;rement diff&eacute;rente. Elle n’ex&eacute;cute pas
le projet s&eacute;lectionn&eacute;, mais d&eacute;bogue la derni&egrave;re configuration &agrave; avoir &eacute;t&eacute; lanc&eacute;e. Vous pouvez &eacute;galement s&eacute;lectionner
une configuration parmi la liste de celles qui ont &eacute;t&eacute; lanc&eacute;es en dernier.
141
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 142
D&eacute;bogage, test et surveillance des applications
Ajout et suppression de points d’arr&ecirc;t
Les points d’arr&ecirc;t permettent d’interrompre l’ex&eacute;cution de l’application pour analyser le code et utiliser les outils de
d&eacute;bogage Flash Builder afin de corriger les erreurs. Les points d’arr&ecirc;t sont ajout&eacute;s dans l’&eacute;diteur de code et g&eacute;r&eacute;s dans
la vue Points d’arr&ecirc;t lorsque vous d&eacute;boguez les applications.
Ils sont plac&eacute;s au niveau des lignes de code ex&eacute;cutables. Le d&eacute;bogueur ne s’arr&ecirc;te qu’aux points d’arr&ecirc;t situ&eacute;s sur les
lignes pr&eacute;sentant les &eacute;l&eacute;ments suivants :
• Balises MXML contenant un gestionnaire d’&eacute;v&eacute;nement ActionScript, par exemple &lt;mx:Button
click=&quot;dofunction()&quot; ...&gt;
• Lignes ActionScript, telles que celles contenues dans une balise &lt;mx:Script&gt; ou dans un fichier ActionScript
• Toute ligne de code ex&eacute;cutable dans un fichier ActionScript
Vous pouvez d&eacute;finir des points d’arr&ecirc;t en cours de r&eacute;daction du code ou pendant le d&eacute;bogage.
Positionnement d’un point d’arr&ecirc;t dans l’&eacute;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&ecirc;t et double-cliquez sur la barre de rep&egrave;re
pour en ajouter un.
La barre de rep&egrave;re longe le c&ocirc;t&eacute; gauche de l’&eacute;diteur de code.
Un point d’arr&ecirc;t est ajout&eacute; &agrave; la barre de rep&egrave;re ainsi qu’&agrave; la liste de la vue Points d’arr&ecirc;t de la perspective D&eacute;bogage
Flash.
A chaque fois que le d&eacute;bogueur rencontre un point d’arr&ecirc;t, l’application est interrompue et la perspective D&eacute;bogage
Flash est affich&eacute;e. La ligne de code est signal&eacute;e par un point d’arr&ecirc;t et mise en surbrillance dans l’&eacute;diteur de code. Les
commandes de d&eacute;bogage vous permettent d’interagir avec le code (voir &laquo; Gestion de la session de d&eacute;bogage dans la vue
D&eacute;bogage &raquo; &agrave; la page 144).
Suppression d’un point d’arr&ecirc;t dans l’&eacute;diteur de code
❖ Dans la barre de rep&egrave;re, double-cliquez sur un point d’arr&ecirc;t.
Le point d’arr&ecirc;t est supprim&eacute; de la barre de rep&egrave;re ainsi que de la vue Points d’arr&ecirc;t de la perspective D&eacute;bogage
Flash.
Les points d’arr&ecirc;t sont g&eacute;r&eacute;s dans la vue Points d’arr&ecirc;t. Vous pouvez supprimer un ou tous les points d’arr&ecirc;t de la liste
ou les d&eacute;sactiver, puis les r&eacute;activer ult&eacute;rieurement (voir &laquo; Gestion des points d’arr&ecirc;t dans la vue Points d’arr&ecirc;t &raquo; &agrave; la
page 143).
D&eacute;finition de points d’arr&ecirc;t conditionnels
Vous pouvez sp&eacute;cifier les conditions r&eacute;gissant l’interruption de l’ex&eacute;cution du d&eacute;bogueur par les points d’arr&ecirc;t. La
d&eacute;finition d’un point d’arr&ecirc;t conditionnel consiste &agrave; sp&eacute;cifier une expression ActionScript qui sera &eacute;valu&eacute;e au cours de
la session de d&eacute;bogage. Les points d’arr&ecirc;t conditionnels stoppent l’ex&eacute;cution lorsque l’une des conditions suivantes est
remplie :
• L’expression prend la valeur &laquo; true &raquo;.
• La valeur de l’expression change.
• Le nombre d’occurrences sp&eacute;cifi&eacute; a &eacute;t&eacute; atteint.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 143
D&eacute;bogage, test et surveillance des applications
D&eacute;finition d’un point d’arr&ecirc;t conditionnel
1 Dans le menu contextuel d’un point d’arr&ecirc;t, cliquez sur Propri&eacute;t&eacute;s du point d’arr&ecirc;t.
2 Dans la bo&icirc;te de dialogue qui s’ouvre, sp&eacute;cifiez les param&egrave;tres suivants :
• Activ&eacute;
Activez ou d&eacute;sactivez le point d’arr&ecirc;t.
• Nombre d’occurrences
S&eacute;lectionnez l’option Nombre d’occurrences afin de d&eacute;finir un compteur pour le point d’arr&ecirc;t. Saisissez un
nombre dans le champ Nombre d’occurrences.
Si vous activez les deux options, Nombre d’occurrences et Activer la condition, le nombre d’occurrences
repr&eacute;sente le nombre de fois que la condition sp&eacute;cifi&eacute;e est remplie (elle prend la valeur &laquo; true &raquo; ou elle change).
Si vous n’activez que l’option Nombre d’occurrences, le nombre d’occurrences repr&eacute;sente le nombre de fois que
le point d’arr&ecirc;t est atteint.
• Activer la condition
S&eacute;lectionnez l’option Activer la condition et saisissez une expression ActionScript &agrave; &eacute;valuer. Voir &laquo; Exemples
d’expressions &raquo; &agrave; la page 147.
Remarque : Flash Builder v&eacute;rifie la syntaxe de l’expression et vous en signale les erreurs. La pr&eacute;sence d’un
op&eacute;rateur d’affectation dans l’expression d&eacute;clenche l’affichage d’un avertissement.
• Suspendre lorsque
Sp&eacute;cifiez &agrave; quel moment l’ex&eacute;cution doit &ecirc;tre stopp&eacute;e : lorsque la condition a la valeur &laquo; true &raquo; ou lorsque la
valeur de la condition change.
Gestion des points d’arr&ecirc;t dans la vue Points d’arr&ecirc;t
La vue Points d’arr&ecirc;t vous permet de g&eacute;rer les points d’arr&ecirc;t au cours d’une session de d&eacute;bogage. Vous pouvez les
supprimer, les d&eacute;sactiver et les activer ou les ignorer.
Les commandes disponibles dans la barre d’outils de la vue Points d’arr&ecirc;t sont les suivantes (de gauche &agrave; droite).
Bouton/commande
Description
Supprimer les points d’arr&ecirc;t
s&eacute;lectionn&eacute;s
Cette commande supprime les points d’arr&ecirc;t s&eacute;lectionn&eacute;s.
Supprimer tous les points d’arr&ecirc;t
Cette commande supprime tous les points d’arr&ecirc;t.
Afficher les points d’arr&ecirc;t pris en
charge par la cible s&eacute;lectionn&eacute;e
Cette commande affiche les points d’arr&ecirc;t s’appliquant &agrave; la cible de
d&eacute;bogage s&eacute;lectionn&eacute;e.
Aller au fichier relatif au point d’arr&ecirc;t Cette commande ouvre (s’il n’est pas d&eacute;j&agrave; ouvert) le fichier contenant le
point d’arr&ecirc;t dans l’&eacute;diteur de code et met en surbrillance la ligne de code au
niveau de laquelle le point d’arr&ecirc;t a &eacute;t&eacute; plac&eacute;. Vous pouvez &eacute;galement
double-cliquer sur le point d’arr&ecirc;t pour l’afficher dans l’&eacute;diteur de code.
Ignorer tous les points d’arr&ecirc;t
Cette commande permet d’ignorer tous les points d’arr&ecirc;t.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 144
D&eacute;bogage, test et surveillance des applications
Bouton/commande
Description
D&eacute;velopper tout
Cette commande d&eacute;veloppe tous les points d’arr&ecirc;t.
R&eacute;duire tout
Cette commande r&eacute;duit tous les points d’arr&ecirc;t.
Lier &agrave; la vue D&eacute;bogage
Cette commande cr&eacute;e une liaison &agrave; la vue D&eacute;bogage.
Suppression de points d’arr&ecirc;t de la vue Points d’arr&ecirc;t
Vous pouvez supprimer un seul, plusieurs ou tous les points d’arr&ecirc;t de la vue en utilisant les commandes de la barre
d’outils.
❖ S&eacute;lectionnez un ou plusieurs points d’arr&ecirc;t dans la liste, puis cliquez sur Supprimer les points d’arr&ecirc;t s&eacute;lectionn&eacute;s.
Vous pouvez &eacute;galement supprimer tous les points d’arr&ecirc;t en une seule op&eacute;ration.
Suppression de tous les points d’arr&ecirc;t de la vue Points d’arr&ecirc;t
❖ Dans la vue Points d’arr&ecirc;t, cliquez sur Supprimer tous les points d’arr&ecirc;t.
Gestion de la session de d&eacute;bogage dans la vue D&eacute;bogage
La vue D&eacute;bogage est le centre de contr&ocirc;le de la perspective D&eacute;bogage Flash. Elle permet de contr&ocirc;ler l’ex&eacute;cution d’une
application, d’interrompre, de reprendre ou de terminer l’application ainsi que d’avancer d’un pas dans le code avec
ou sans entr&eacute;e.
Les commandes disponibles dans la barre d’outils de la vue D&eacute;bogage sont les suivantes (de gauche &agrave; droite).
Bouton/commande
Description
Supprime tous les programmes
termin&eacute;s
Cette commande supprime toutes les sessions de d&eacute;bogage termin&eacute;es.
Reprendre
Cette commande provoque la reprise de l’application interrompue.
Interrompre
Cette commande interrompt l’application afin que vous puissiez analyser
le code, avancer d’un pas dans le code avec entr&eacute;e et ainsi de suite.
Arr&ecirc;ter
Cette commande termine la session de d&eacute;bogage.
D&eacute;connecter
Cette commande d&eacute;connecte le d&eacute;bogueur en cas de d&eacute;bogage &agrave;
distance.
Avancer d’un pas avec entr&eacute;e
Cette commande permet d’avancer dans la fonction appel&eacute;e et de
stopper &agrave; la premi&egrave;re ligne de la fonction.
Avancer d’un pas sans entr&eacute;e
Cette commande ex&eacute;cute la ligne actuelle de la fonction, puis s’arr&ecirc;te &agrave;
la ligne suivante.
Ex&eacute;cuter jusqu’&agrave; l’instruction de retour
Cette commande provoque la poursuite de l’ex&eacute;cution jusqu’&agrave; ce que la
fonction actuelle soit retourn&eacute;e &agrave; son appelant.
Passer au cadre
Cette commande n’est pas prise en charge dans Flash Builder.
Utiliser les filtres de progression
Cette commande n’est pas prise en charge dans Flash Builder.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 145
D&eacute;bogage, test et surveillance des applications
Utilisation de la vue Console
La vue Console affiche la sortie des instructions trace du code ActionScript ainsi que les r&eacute;troactions du d&eacute;bogueur
(&eacute;tats, avertissements, erreurs, etc.).
Les commandes disponibles dans la barre d’outils de la vue Console sont les suivantes (de gauche &agrave; droite).
Bouton/commande
Description
Arr&ecirc;ter
Cette commande termine la session de d&eacute;bogage.
Supprimer le lancement
Cette commande supprime toutes les sessions de d&eacute;bogage lanc&eacute;es.
Supprimer tous les programmes
termin&eacute;s
Cette commande supprime toutes les sessions de d&eacute;bogage termin&eacute;es.
Effacer la console
Cette commande efface le contenu de la vue Console.
Arr&ecirc;ter le d&eacute;filement
Cette commande permet d’&eacute;viter le d&eacute;filement de la vue.
Afficher la console en cas de
modification de la sortie standard
Cette commande affiche la console en cas d’&eacute;criture dans la sortie
standard.
Afficher la console en cas de
modification de l’erreur standard
Cette commande affiche la console en cas d’&eacute;criture dans l’erreur
standard.
Fixer la console
Cette commande bloque l’actualisation du contenu de la console
lorsqu’un autre processus est s&eacute;lectionn&eacute;.
Afficher la console s&eacute;lectionn&eacute;e
Cette commande affiche les consoles s&eacute;lectionn&eacute;es.
Ouvrir la console
Cette commande ouvre une nouvelle console et affiche une liste
d&eacute;roulante permettant de s&eacute;lectionner d’autres consoles.
Gestion des variables dans la vue Variables
La vue Variables affiche les variables d&eacute;finies par le cadre de pile actuellement s&eacute;lectionn&eacute; (dans la vue D&eacute;bogage). Les
variables simples (nom et valeur) sont affich&eacute;es sur une seule ligne. Les ic&ocirc;nes affich&eacute;es avec les variables fournissent
des informations sur le type de la variable.
Les variables complexes peuvent &ecirc;tre d&eacute;velopp&eacute;es pour en afficher les membres. La vue Variables permet de contr&ocirc;ler
les variables en les ajoutant &agrave; la vue Expressions. Elle permet &eacute;galement de modifier la valeur des variables au cours de
la session de d&eacute;bogage. Vous pouvez &eacute;galement y d&eacute;finir des points de contr&ocirc;le (voir &laquo; Utilisation des points de
contr&ocirc;le &raquo; &agrave; la page 149).
Tous les membres de super-classes sont group&eacute;s dans un nœud d’arborescence distinct. Par d&eacute;faut, seuls les membres
de la classe actuelle sont affich&eacute;s. Cela permet de limiter le nombre de variables affich&eacute;es dans la vue.
Les commandes disponibles dans la barre d’outils de la vue Variables sont les suivantes (de gauche &agrave; droite).
Commande
Description
Afficher les noms de type
Cette commande affiche les noms de types des variables.
Afficher la structure logique
Cette commande n’est pas prise en charge dans Flash Builder.
R&eacute;duire tout
Cette commande r&eacute;duit la vue Variables.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 146
D&eacute;bogage, test et surveillance des applications
Modification de la valeur d’une variable
1 S&eacute;lectionnez la variable que vous souhaitez modifier.
2 Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Ctrl enfonc&eacute;e (Mac OS) pour
afficher le menu contextuel et s&eacute;lectionnez Modifier la valeur.
3 Saisissez la nouvelle valeur et cliquez sur OK.
La variable contient la nouvelle valeur.
Les variables modifi&eacute;es sont affich&eacute;es en rouge.
Recherche de variables
❖ Pour localiser une variable ou un membre de variable dans la vue Variables, s&eacute;lectionnez la vue, puis commencez
&agrave; saisir le nom de la variable recherch&eacute;e. Vous pouvez utiliser le caract&egrave;re g&eacute;n&eacute;rique (*) pour rechercher les mots
figurant dans le nom d’une variable (&laquo; *couleur &raquo;, par exemple).
Ic&ocirc;nes repr&eacute;sentant des variables dans la vue Variables
La vue Variables fait appel &agrave; des ic&ocirc;nes et &agrave; des incrustations pour fournir des informations visuelles sur le type des
variables affich&eacute;es. Pour obtenir une liste des ic&ocirc;nes avec leurs significations respectives, voir &laquo; Ic&ocirc;nes repr&eacute;sentant les
&eacute;l&eacute;ments de langage &raquo; &agrave; la page 120.
Vue Variables
Utilisation de la vue Expressions
Acc&eacute;dez &agrave; la vue Expressions pour contr&ocirc;ler les variables s&eacute;lectionn&eacute;es dans la vue Variables et pour ajouter et &eacute;valuer
des expressions de contr&ocirc;le en cours de d&eacute;bogage des applications.
En cours de d&eacute;bogage, vous pouvez analyser et modifier la valeur des variables contr&ocirc;l&eacute;es. Vous pouvez &eacute;galement
ajouter des expressions de contr&ocirc;le. Il s’agit d’expressions de code &eacute;valu&eacute;es &agrave; chaque interruption du d&eacute;bogage. Les
expressions de contr&ocirc;le sont utiles pour contr&ocirc;ler les variables susceptibles de d&eacute;passer l’&eacute;tendue et de ne pas &ecirc;tre
visibles dans la vue lorsque vous avancez d’un pas avec entr&eacute;e dans une fonction diff&eacute;rente.
Les commandes disponibles dans la barre d’outils de la vue Expressions sont les suivantes (de gauche &agrave; droite) :
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 147
D&eacute;bogage, test et surveillance des applications
Commande
Description
Afficher les noms de type
Cette commande affiche les types d’objet des &eacute;l&eacute;ments de la vue Expressions.
Afficher la structure logique
Cette commande n’est pas prise en charge dans Flash Builder.
R&eacute;duire tout
Cette commande r&eacute;duit toutes les expressions de la vue.
Supprimer les expressions
s&eacute;lectionn&eacute;es
Cette commande supprime la variable ou l’expression de contr&ocirc;le s&eacute;lectionn&eacute;e.
Supprimer toutes les expressions
Cette commande supprime toutes les variables et expressions de contr&ocirc;le de la vue Expressions.
Faites glisser le curseur de la souris sur une expression ou une variable dans l’&eacute;diteur de source pour en afficher la
valeur dans une info-bulle. Vous pouvez ajouter l’expression &agrave; la vue correspondante en cliquant avec le bouton droit
de la souris, puis en s&eacute;lectionnant la commande de contr&ocirc;le dans le menu contextuel.
Exemples d’expressions
Le d&eacute;bogueur de Flash Builder prend en charge une large gamme d’expressions simples et complexes. Le tableau
suivant r&eacute;pertorie des exemples d’expressions pouvant &ecirc;tre &eacute;valu&eacute;es en cours de session de d&eacute;bogage. Cette liste
d’expressions prises en charge n’est pas exhaustive et est fournie uniquement &agrave; titre indicatif.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 148
D&eacute;bogage, test et surveillance des applications
Exemples d’expressions prises en charge
Expression
Description
myString.length
Retourne la longueur d’une cha&icirc;ne.
myString.indexOf(‘@’)
Effectue le suivi de l’index du caract&egrave;re &laquo; @ &raquo;.
&quot;constant string&quot;.charAt(0)
Effectue le suivi du caract&egrave;re &agrave; un emplacement sp&eacute;cifique de la cha&icirc;ne.
Les constantes de cha&icirc;ne sont prises en charge.
employees.employee.@nom
&laquo; employees &raquo; est une variable XML. Ce type d’expression est utile pour
d&eacute;boguer les applications E4X.
x == null
Mots r&eacute;serv&eacute;s repr&eacute;sentant des valeurs dans les expressions.
user1 === user2
La plupart des op&eacute;rateurs ActionScript sont pris en charge.
MyClass.myStaticFunc()
Fonctions interpr&eacute;t&eacute;es comme une classe.
this.myMemberFunc()
Fonctions interpr&eacute;t&eacute;es en utilisant le mot-cl&eacute; this.
String.fromCharCode(33)
String est en fait une fonction, et non une classe, dont
String.fromCharCode est un membre dynamique.
myStaticFunc()
Ne peut &ecirc;tre &eacute;valu&eacute; que si myStaticFunc est visible &agrave; partir de la cha&icirc;ne
d’&eacute;tendue actuelle.
myMemberFunc()
Ne peut &ecirc;tre &eacute;valu&eacute; que si myMemberFunc est visible &agrave; partir de la
cha&icirc;ne d’&eacute;tendue actuelle.
Math.max(1,2,3)
Les fonctions math&eacute;matiques sont prises en charge.
mystring.search(/myregex/i)
Les expressions r&eacute;guli&egrave;res sont prises en charge.
[&quot;my&quot;, &quot;literal&quot;, &quot;array&quot;]
Cr&eacute;ation de tableaux.
new MyClass()
Instanciation de classes.
&quot;string&quot; + 3
Traitement correct d’une cha&icirc;ne plus un nombre entier.
x &gt;&gt;&gt; 2
Les op&eacute;rations de d&eacute;calage logique sont prises en charge.
3.5 + 2
Ex&eacute;cution correcte des op&eacute;rations arithm&eacute;tiques.
Limitations de l’&eacute;valuation des expressions
Il existe quelques limitations &agrave; l’&eacute;valuation des expressions :
• Les espaces de noms ne sont pas pris en charge.
• Les objets ins&eacute;r&eacute;s ne sont pas pris en charge.
• Le mot-cl&eacute; super n’est pas pris en charge.
• Les noms de classe complets ne sont pas pris en charge.
Par exemple, vous ne pouvez pas &eacute;valuer mx.controls.Button.
Vous pouvez faire r&eacute;f&eacute;rence au nom de classe non qualifi&eacute;. Par exemple, vous pouvez sp&eacute;cifier que Button fait
r&eacute;f&eacute;rence &agrave; mx.controls.Button.
En pr&eacute;sence d’un nom de classe ambigu (deux classes portant le m&ecirc;me nom dans deux packages diff&eacute;rents), il vous
est impossible de contr&ocirc;ler quelle classe est &eacute;valu&eacute;e. Vous pouvez cependant sp&eacute;cifier :
getDefinitionByName(&quot;mx.controls.Button&quot;)
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 149
D&eacute;bogage, test et surveillance des applications
• La plupart des expressions E4X peuvent &ecirc;tre &eacute;valu&eacute;es, mais les expressions de filtre E4X ne sont pas prises en
charge.
Par exemple, vous ne pouvez pas &eacute;valuer myxml.(@id=='3')).
• Vous ne pouvez pas appeler des fonctions d&eacute;finies en tant que variables.
Utilisation des points de contr&ocirc;le
Au cours du d&eacute;bogage d’une application, vous pouvez d&eacute;finir des points de contr&ocirc;le pour des occurrences sp&eacute;cifiques
de variables. Ils auront pour t&acirc;che d’interrompre l’ex&eacute;cution &agrave; tout changement de valeur de la variable contr&ocirc;l&eacute;e. Les
points de contr&ocirc;le &eacute;tant d&eacute;finis pour l’occurrence sp&eacute;cifique d’une variable, ils ne peuvent pas &ecirc;tre plac&eacute;s dans l’&eacute;diteur
de code. Ils sont donc d&eacute;finis &agrave; partir de la vue Variables au cours de la session de d&eacute;bogage.
Pour la d&eacute;finition des points de contr&ocirc;le, veillez aux points suivants :
• A la fin d’une session de d&eacute;bogage, tous les points de contr&ocirc;le sont supprim&eacute;s.
• Vous ne pouvez pas d&eacute;finir des points de contr&ocirc;le sur les getter, mais vous pouvez en d&eacute;finir sur les champs des
getter.
Par exemple, vous ne pouvez pas d&eacute;finir un point de contr&ocirc;le sur width, mais vous pouvez en d&eacute;finir un sur
_width.
• Vous ne pouvez pas d&eacute;finir des points de contr&ocirc;le sur des variables locales, mais vous pouvez en d&eacute;finir sur les
membres des variables locales, ainsi que l’illustre le fragment de code suivant :
public class MyClass
{
// These are fields of a class, so you can set a watchpoint on
// 'memberInt', and on 'memberButton', and on 'memberButton._width':
private var memberInt:int = 0;
private var memberButton:Button = new Button();
public function myFunction():void {
// You CANNOT set a watchpoint on 'i', because it is local:
var i:int = 0;
// You CANNOT set a watchpoint on 'someButton', because it is local;
// but you CAN set a watchpoint on 'someButton._width':
var someButton:Button = new Button();
...
}
• L’ex&eacute;cution s’interrompt pour un point de contr&ocirc;le lorsque la valeur d’origine d’une occurrence d’objet change.
Ce comportement diff&egrave;re de l’utilisation d’une expression dans un point d’arr&ecirc;t conditionnel pour arr&ecirc;ter
l’ex&eacute;cution lorsque la valeur d’une variable change.
D&eacute;finition de points de contr&ocirc;le
❖ Deux m&eacute;thodes permettent de d&eacute;finir un point de contr&ocirc;le au cours d’une session de d&eacute;bogage :
• Dans la vue Variables, ouvrez le menu contextuel d’une variable et s&eacute;lectionnez Ajouter/Supprimer un point de
contr&ocirc;le.
• Dans le menu Ex&eacute;cuter de Flash Builder, s&eacute;lectionnez Ajouter un point de contr&ocirc;le.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 150
D&eacute;bogage, test et surveillance des applications
Dans la bo&icirc;te de dialogue d’ajout d’un point de contr&ocirc;le, s&eacute;lectionnez la variable que vous souhaitez contr&ocirc;ler.
La vue Variables affiche une ic&ocirc;ne repr&eacute;sentant un crayon en regard de la variable pour laquelle un point de
contr&ocirc;le a &eacute;t&eacute; d&eacute;fini.
Remarque : si vous tentez de d&eacute;finir un point de contr&ocirc;le pour un getter, une bo&icirc;te de dialogue s’ouvre. Elle sugg&egrave;re
une variable valide pour le point d’arr&ecirc;t. Si vous supprimez la variable sugg&eacute;r&eacute;e, la bo&icirc;te de dialogue r&eacute;pertorie toutes
les variables valides de l’objet.
Utilisation de la commande Ex&eacute;cuter jusqu’&agrave; la ligne
La commande Ex&eacute;cuter jusqu’&agrave; la ligne permet de quitter une boucle au cours d’une session de d&eacute;bogage.
En cours de d&eacute;bogage, vous constaterez peut-&ecirc;tre que le code est ex&eacute;cut&eacute; en boucle &agrave; plusieurs reprises. Pour quitter
cette boucle, faites appel &agrave; la commande Ex&eacute;cuter jusqu’&agrave; la ligne situ&eacute;e dans le menu Ex&eacute;cuter.
Environnement de test FlexUnit
L’environnement de test FlexUnit permet de g&eacute;n&eacute;rer et de modifier des tests reproduisibles pouvant &ecirc;tre ex&eacute;cut&eacute;s &agrave;
partir de scripts ou directement dans Flash Builder. Flash Builder prend en charge les structures &laquo; open source &raquo;
FlexUnit 4 et FlexUnit 1.
Proc&eacute;dez comme suit :
• Cr&eacute;ez des scripts et des suites de tests unitaires.
Les assistants de Flash Builder vous guident tout au long de la cr&eacute;ation de scripts et de suites de tests en g&eacute;n&eacute;rant
du code stub pour les tests.
• Ex&eacute;cutez les scripts et les suites de tests.
Vous pouvez ex&eacute;cuter des scripts et des suites de tests de diff&eacute;rentes mani&egrave;res &agrave; partir de Flash Builder ou en dehors
de l’environnement Flash Builder. Les r&eacute;sultats des tests sont affich&eacute;s dans une application de test. Flash Builder
ouvre la vue R&eacute;sultat des tests unitaires FlexUnit permettant d’analyser l’ex&eacute;cution du test.
• A partir de la vue R&eacute;sultat des tests unitaires FlexUnit, acc&eacute;dez au code source.
Dans le panneau R&eacute;sultats des tests, double-cliquez sur un test pour en ouvrir l’impl&eacute;mentation.
Le panneau D&eacute;tails des tests ayant &eacute;chou&eacute; r&eacute;pertorie la source et le num&eacute;ro de la ligne correspondant &agrave; l’&eacute;chec. S la
source r&eacute;pertori&eacute;e se trouve dans l’espace de travail en cours d’utilisation, double-cliquez sur son nom pour acc&eacute;der
directement &agrave; l’&eacute;chec.
Cr&eacute;ation de tests FlexUnit
Vous pouvez cr&eacute;er des classes de scripts de tests et des suites de scripts de tests unitaires FlexUnit pour les types de
projets suivants :
• Projet Flex
• Projet ActionScript
• Projet de biblioth&egrave;que Flex
• Projet AIR
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 151
D&eacute;bogage, test et surveillance des applications
Lorsque vous cr&eacute;ez une classe de scripts de tests, vous pouvez sp&eacute;cifier les options suivantes :
• Le dossier src d’un projet Flex pour la classe
• Un package pour la classe
• Les classes &agrave; tester
• Les m&eacute;thodes &agrave; tester pour chaque classe sp&eacute;cifi&eacute;e
Une suite de scripts de tests unitaires FlexUnit est une s&eacute;rie de tests bas&eacute;s sur des classes de scripts d&eacute;j&agrave; cr&eacute;&eacute;es, des
m&eacute;thodes sp&eacute;cifi&eacute;es dans ces classes et d’autres suites de scripts de tests.
Cr&eacute;ation d’une classe de scripts de tests unitaires FlexUnit
Lors de la cr&eacute;ation d’une classe de scripts de tests unitaires FlexUnit, Flash Builder g&eacute;n&egrave;re un fichier ActionScript pour
la classe de scripts de tests et le place dans un package de scripts de tests.
La proc&eacute;dure suivante part du principe que vous avez cr&eacute;&eacute; un projet Flash Builder, dans lequel vous souhaitez g&eacute;n&eacute;rer
et ex&eacute;cuter des tests unitaires FlexUnit.
1 S&eacute;lectionnez le projet Flex, puis Nouveau &gt; Classe de script de tests dans le menu contextuel.
Si le fichier du projet s&eacute;lectionn&eacute; correspond &agrave; une classe ActionScript, cette classe sera automatiquement
s&eacute;lectionn&eacute;e pour le script de test FlexUnit dans l’assistant Nouvelle classe de script de tests.
2 Dans l’assistant de cr&eacute;ation d’une classe de script de tests, indiquez si vous souhaitez cr&eacute;er une classe de style
FlexUnit 4 ou FlexUnit 1.
3 Attribuez-lui un nom.
4 (Facultatif) Sp&eacute;cifiez un dossier source et un package pour la classe de script de tests ou validez les param&egrave;tres par
d&eacute;faut.
Le dossier source par d&eacute;faut est le dossier src du projet en cours. Le package par d&eacute;faut est flexUnitTests, qui
correspond au niveau sup&eacute;rieur de la structure de packages par d&eacute;faut du projet.
5 (Facultatif) Activez la case S&eacute;lectionner la classe &agrave; tester et recherchez la classe voulue. Cliquez sur Suivant.
6 (Facultatif) S&eacute;lectionnez les m&eacute;thodes que vous souhaitez tester.
7 Cliquez sur Terminer.
Codez le script de test cr&eacute;&eacute; en vous basant sur les stubs de code g&eacute;n&eacute;r&eacute;s.
Cr&eacute;ation d’une suite de scripts de tests unitaires FlexUnit
Cette proc&eacute;dure part du principe que vous avez d&eacute;j&agrave; cr&eacute;&eacute; des classes de script de tests.
1 S&eacute;lectionnez le projet Flex, puis cr&eacute;ez une suite de script de tests &agrave; partir des menus contextuels en s&eacute;lectionnant
Nouveau &gt; Classe de suite de tests.
2 Dans l’assistant de cr&eacute;ation d’une classe de suite de tests, indiquez si vous souhaitez cr&eacute;er une classe de style
FlexUnit 4 ou FlexUnit 1.
3 Nommez la suite de tests.
4 Recherchez ensuite, dans les suites et les scripts de tests, les classes et les m&eacute;thodes &agrave; inclure dans la suite de tests.
Cliquez sur Terminer.
Personnalisation des classes de script et de suite de tests FlexUnit
Vous pouvez personnaliser les classes de suite et de script de tests FlexUnit par d&eacute;faut cr&eacute;&eacute;es par Flash Builder. Flash
Builder fait appel &agrave; des mod&egrave;les de fichiers pour cr&eacute;er les versions par d&eacute;faut de ces fichiers.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 152
D&eacute;bogage, test et surveillance des applications
Les mod&egrave;les de fichiers pour les tests FlexUnit se trouvent dans la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences, sous Flash Builder &gt;
Mod&egrave;les de fichier &gt; FlexUnit. Les classes de suite et de script de tests FlexUnit 1 et FlexUnit 4 correspondent &agrave; des
mod&egrave;les distincts.
Pour plus d’informations sur la modification des mod&egrave;les de fichiers par d&eacute;faut, voir &laquo; Personnalisation des mod&egrave;les
de fichier &raquo; &agrave; la page 127.
Remarque : FlexUnitCompilerApplication.mxml et FlexUnitApplication.mxml d&eacute;rivent du mod&egrave;le pour
applications MXML Web ou de bureau. Le mod&egrave;le utilis&eacute; d&eacute;pend de la configuration du projet Flex : pour une application
Web (s’ex&eacute;cute dans Adobe&reg; Flash&reg; Player) ou une application de bureau (s’ex&eacute;cute dans Adobe AIR&reg;).
Voir aussi
R&eacute;f&eacute;rence de langage &laquo; open source &raquo; pour FlexUnit
Documentation &laquo; open source &raquo; pour FlexUnit
Ex&eacute;cution de tests FlexUnit
Les tests unitaires FlexUnit peuvent s’ex&eacute;cuter &agrave; l’int&eacute;rieur comme &agrave; l’ext&eacute;rieur de Flash Builder &agrave; l’aide des fichiers
SWF g&eacute;n&eacute;r&eacute;s pour le test unitaire FlexUnit. Dans les deux cas, les r&eacute;sultats des tests s’affichent dans la vue R&eacute;sultat des
tests unitaires FlexUnit.
Vous pouvez &eacute;galement configurer et enregistrer un test unitaire FlexUnit avant de l’ex&eacute;cuter.
Par d&eacute;faut, les tests FlexUnit sont ex&eacute;cut&eacute;s dans la perspective D&eacute;bogage Flash. Vous pouvez les lancer &agrave; partir des
perspectives de d&eacute;veloppement et de profilage Flash. Dans ce cas, Flash Builder basculera toutefois vers la perspective
de d&eacute;bogage &agrave; l’ex&eacute;cution du test.
Vous pouvez modifier la perspective par d&eacute;faut des tests FlexUnit. Ouvrez la fen&ecirc;tre des pr&eacute;f&eacute;rences et acc&eacute;dez &agrave; Flash
Builder &gt; FlexUnit.
Application de compilation FlexUnit et application FlexUnit
Lorsque vous cr&eacute;ez un script de test FlexUnit, Flash Builder cr&eacute;e l’application de compilation FlexUnit suivante et une
application FlexUnit :
• FlexUnitCompilerApplication.mxml
• FlexUnitApplication.mxml
Flash Builder utilise ces applications lors de la compilation et de l’ex&eacute;cution des tests FlexUnit. Flash Builder place les
applications dans le r&eacute;pertoire src du projet.
Cette application contient des r&eacute;f&eacute;rences &agrave; tous les scripts et &agrave; toutes les suites de tests FlexUnit g&eacute;n&eacute;r&eacute;s par Flash
Builder. Ce dernier place tous les tests FlexUnit &agrave; l’int&eacute;rieur des balises &lt;fx:Declarations&gt; de cette application. Vous
ne serez g&eacute;n&eacute;ralement pas amen&eacute; &agrave; &eacute;diter ou &agrave; modifier ce fichier directement.
Actualisez l’application de compilation FlexUnit dans les circonstances suivantes :
• Vous ajoutez manuellement un script de tests.
Si vous cr&eacute;ez une classe de script de tests sans utiliser l’assistant de cr&eacute;ation de script de tests, actualisez
FlexUnitCompilerApplication.mxml. Placez le nouveau script de tests dans le package avec les autres scripts.
• Vous renommez un script de tests.
• Vous supprimez un script de tests.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 153
D&eacute;bogage, test et surveillance des applications
Actualisez FlexUnitCompilerApplication.mxml :
1 Si la vue R&eacute;sultat des tests unitaires FlexUnit n’est pas ouverte, vous pouvez y acc&eacute;der en s&eacute;lectionnant Fen&ecirc;tres &gt;
Autres vues &gt; R&eacute;sultat des tests unitaires FlexUnit. Cliquez sur OK.
2 Dans la vue R&eacute;sultat des tests unitaires FlexUnit, cliquez sur le bouton Actualiser.
Ex&eacute;cution d’un test unitaire FlexUnit dans Flash Builder
Vous pouvez ex&eacute;cuter des tests FlexUnit pour un projet dans son ensemble ou pour des scripts de tests individuels.
Vous lancerez g&eacute;n&eacute;ralement l’ex&eacute;cution &agrave; partir du menu contextuel d’un projet ou d’un script de test individuel.
Vous pouvez toutefois &eacute;galement lancer les tests en acc&eacute;dant au menu Ex&eacute;cuter, en cliquant sur le bouton Ex&eacute;cuter ou
en s&eacute;lectionnant le bouton Ex&eacute;cuter des tests unitaires FlexUnit dans la vue R&eacute;sultat des tests unitaires FlexUnit.
L’ex&eacute;cution &agrave; partir du menu Ex&eacute;cuter de Flash Builder entra&icirc;ne l’ouverture d’une bo&icirc;te de dialogue de configuration
du test, dans laquelle vous pouvez s&eacute;lectionner les classes de test et les m&eacute;thodes &agrave; ex&eacute;cuter. Les scripts de tests pour
les projets de biblioth&egrave;que ne peuvent pas &ecirc;tre ex&eacute;cut&eacute;s &agrave; partir du menu Ex&eacute;cuter de Flash Builder.
Flash Builder fournit les raccourcis clavier suivants pour faciliter le lancement des tests FlexUnit :
•
Alt+Maj+A,F
Ex&eacute;cute tous les tests FlexUnit du projet.
•
Alt+Maj+E,F
Ex&eacute;cute le test FlexUnit s&eacute;lectionn&eacute;.
Ex&eacute;cutez les tests FlexUnit de la s&eacute;lection actuelle dans l’&eacute;diteur (voir &laquo; Configuration des tests FlexUnit &raquo; &agrave; la
page 154).
1 S&eacute;lectionnez un projet et ex&eacute;cutez les tests :
Dans le menu contextuel du projet, s&eacute;lectionnez Ex&eacute;cuter des tests unitaires FlexUnit.
Dans le menu Ex&eacute;cuter ou dans la liste d&eacute;roulante du bouton Ex&eacute;cuter, s&eacute;lectionnez Ex&eacute;cuter &gt; Tests FlexUnit.
2 (Menu Ex&eacute;cuter de Flash Builder) Dans la bo&icirc;te de dialogue Ex&eacute;cution d’une configuration de test unitaire
FlexUnit, s&eacute;lectionnez les scripts de tests et les m&eacute;thodes &agrave; ex&eacute;cuter dans le cadre des tests. Cliquez sur OK pour
ex&eacute;cuter les tests.
3 Visionnez les r&eacute;sultats des tests.
Flash Builder g&eacute;n&egrave;re un fichier SWF dans le dossier bin-debug du projet.
Une application s’ouvre pour afficher des informations sur les tests et en indiquer la fin.
Le panneau R&eacute;sultat des tests unitaires FlexUnit s’ouvre et affiche les r&eacute;sultats des tests. Voir &laquo; Affichage des
r&eacute;sultats de l’ex&eacute;cution d’un test FlexUnit &raquo; &agrave; la page 154.
Ex&eacute;cution de tests FlexUnit individuels :
1 Dans l’Explorateur de projets, acc&eacute;dez au package flexUnitTest :
Dans le menu contextuel du fichier de test FlexUnit, s&eacute;lectionnez Ex&eacute;cuter des tests unitaires FlexUnit.
2 Visionnez les r&eacute;sultats des tests.
Flash Builder g&eacute;n&egrave;re un fichier SWF dans le dossier bin-debug du projet.
Une application s’ouvre pour afficher des informations sur les tests et en indiquer la fin.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 154
D&eacute;bogage, test et surveillance des applications
Le panneau R&eacute;sultat des tests unitaires FlexUnit s’ouvre et affiche les r&eacute;sultats des tests. Voir &laquo; Affichage des
r&eacute;sultats de l’ex&eacute;cution d’un test FlexUnit &raquo; &agrave; la page 154.
Ex&eacute;cution d’un test unitaire FlexUnit en dehors de l’environnement Flash Builder
Cette proc&eacute;dure part du principe que vous avez d&eacute;j&agrave; ex&eacute;cut&eacute; un test unitaire FlexUnit dans Flash Builder et que Flash
Builder est en cours d’ex&eacute;cution.
1 Copiez le fichier SWF g&eacute;n&eacute;r&eacute; pour un test du dossier bin-debug du projet vers un dossier situ&eacute; en dehors de votre
environnement de d&eacute;veloppement.
Vous pouvez copier le fichier SWF g&eacute;n&eacute;r&eacute; automatiquement ou un fichier SWF provenant d’un test unitaire
FlexUnit que vous avez pr&eacute;c&eacute;demment enregistr&eacute; et configur&eacute;.
2 Ex&eacute;cutez la copie du fichier SWF.
Flash Player appara&icirc;t pour afficher des informations sur le test et indiquer la fin du test.
La vue R&eacute;sultat des tests unitaires FlexUnit s’ouvre dans Flash Builder et affiche les r&eacute;sultats du test.
Configuration des tests FlexUnit
1 Ouvrez la bo&icirc;te de dialogue Ex&eacute;cution d’une configuration de test unitaire FlexUnit.
Vous pouvez y acc&eacute;der &agrave; partir du menu Ex&eacute;cuter ou &agrave; partir de la vue R&eacute;sultat des tests unitaires FlexUnit :
• S&eacute;lectionnez un projet. Dans le menu Flash Builder, s&eacute;lectionnez Ex&eacute;cuter &gt; Ex&eacute;cuter &gt; Tests FlexUnit.
• Dans la vue R&eacute;sultat des tests unitaires FlexUnit, cliquez sur le bouton Ex&eacute;cuter des tests unitaires FlexUnit.
Si cette vue n’est pas ouverte, vous pouvez y acc&eacute;der en s&eacute;lectionnant Fen&ecirc;tre &gt; Autres vues &gt; Flash Builder &gt;
R&eacute;sultat des tests unitaires FlexUnit.
2 Dans la bo&icirc;te de dialogue Configuration de test, s&eacute;lectionnez les scripts et les m&eacute;thodes &agrave; enregistrer comme
configuration de test.
Remarque : la bo&icirc;te de dialogue Configuration de test n’est pas disponible si vous ex&eacute;cutez un test &agrave; partir du menu
contextuel de l’Explorateur de packages.
3 (Facultatif) S&eacute;lectionnez Charger pour importer une configuration pr&eacute;c&eacute;demment sauvegard&eacute;e dans un fichier XML.
4 Cliquez sur Enregistrer.
Flash Builder enregistre un fichier XML et un fichier MXML dans le dossier .FlexUnitSettings du projet.
Vous pouvez utiliser le fichier XML dans les scripts de g&eacute;n&eacute;ration pour ex&eacute;cuter le test.
Vous pouvez g&eacute;n&eacute;rer un fichier SWF &agrave; partir du fichier MXML. Ce fichier SWF peut servir &agrave; effectuer des tests en
dehors de l’environnement Flash Builder. Pour g&eacute;n&eacute;rer le fichier SWF, le fichier MXML est g&eacute;n&eacute;ralement copi&eacute;
dans le dossier src du projet.
Affichage des r&eacute;sultats de l’ex&eacute;cution d’un test FlexUnit
Le panneau de la vue R&eacute;sultat des tests unitaires FlexUnit affiche les r&eacute;sultats d’un test unitaire FlexUnit, en d&eacute;taillant
les &eacute;checs. Vous pouvez parcourir les r&eacute;sultats, filtrer l’affichage, &eacute;crire les r&eacute;sultats dans un fichier et charger les
r&eacute;sultats &agrave; partir d’un fichier.
Vous pouvez &eacute;galement relancer les tests, annuler un test en cours d’ex&eacute;cution et effacer les r&eacute;sultats de la vue.
Si cette vue n’est pas ouverte, vous pouvez y acc&eacute;der en s&eacute;lectionnant Fen&ecirc;tre &gt; Autres vues &gt; Flash Builder &gt; R&eacute;sultat
des tests unitaires FlexUnit.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 155
D&eacute;bogage, test et surveillance des applications
Panneau R&eacute;sultats des tests
Ce panneau r&eacute;pertorie tous les tests de la s&eacute;rie, en indiquant si le test a &eacute;chou&eacute; ou r&eacute;ussi.
Double-cliquez sur un test de la liste pour y acc&eacute;der dans l’&eacute;diteur ActionScript.
Panneau D&eacute;tails des tests ayant &eacute;chou&eacute;
S&eacute;lectionnez un test dans le panneau R&eacute;sultats des tests pour afficher les d&eacute;tails de l’&eacute;chec.
Chaque d&eacute;tail indique le fichier source et la m&eacute;thode, y compris le num&eacute;ro de la ligne correspondant &agrave; l’&eacute;chec.
Si le fichier source appartient &agrave; l’espace de travail, double-cliquez dans la liste pour acc&eacute;der &agrave; l’&eacute;chec dans l’&eacute;diteur
ActionScript.
Menu de la vue R&eacute;sultat des tests unitaires FlexUnit
Le menu de la vue R&eacute;sultat des tests unitaires FlexUnit donne acc&egrave;s aux fonctions suivantes.
• Filtrage des r&eacute;sultats affich&eacute;s
Masquage du panneau D&eacute;tails des tests ayant &eacute;chou&eacute;.
Limitation de l’affichage aux tests ayant &eacute;chou&eacute;
• D&eacute;filement des tests affich&eacute;s dans le panneau R&eacute;sultat des tests
• Annulation d’un test en cours d’ex&eacute;cution
• Enregistrement des r&eacute;sultats ou de la configuration d’un test
• Chargement des r&eacute;sultats pr&eacute;c&eacute;demment enregistr&eacute;s dans un fichier
• Suppression des r&eacute;sultats du panneau
• R&eacute;ex&eacute;cution du test actuel. Vous pouvez choisir :
• d’ex&eacute;cuter tous les tests ;
• d’ex&eacute;cuter uniquement les &eacute;checs ;
• d’ex&eacute;cuter le test s&eacute;lectionn&eacute;.
• Actualisation de la configuration FlexUnit
Si vous avez modifi&eacute; un test ou avez ajout&eacute; ou supprim&eacute; des tests, cliquez sur le bouton d’actualisation pour charger
la nouvelle configuration FlexUnit.
• Configuration et ex&eacute;cution de tests FlexUnit
Utilisez le bouton Ex&eacute;cuter des tests unitaires FlexUnit pour configurer et ex&eacute;cuter des tests FlexUnit.
Surveillance des applications acc&eacute;dant aux services de
donn&eacute;es
Le Moniteur de r&eacute;seau est un outil ing&eacute;nieux permettant de surveiller et de d&eacute;boguer les applications acc&eacute;dant aux
services de donn&eacute;es. Le Moniteur de r&eacute;seau permet d’analyser les donn&eacute;es transmises entre une application et un
service de donn&eacute;es. Il examine &eacute;galement les donn&eacute;es XML, AMF et JSON envoy&eacute;es avec les protocoles SOAP, AMF,
HTTP et HTTPS.
Le Moniteur de r&eacute;seau est disponible dans les vues Flash de d&eacute;veloppement et de d&eacute;bogage.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 156
D&eacute;bogage, test et surveillance des applications
Activation de la surveillance du r&eacute;seau
Le Moniteur de r&eacute;seau peut &ecirc;tre activ&eacute; individuellement pour chaque projet Flex. L’&eacute;tat du moniteur (activ&eacute; ou
d&eacute;sactiv&eacute;) s’applique &agrave; toutes les applications de ce projet. Il est impossible d’activer ou de d&eacute;sactiver le Moniteur de
r&eacute;seau pour des applications individuelles.
Par d&eacute;faut, le Moniteur de r&eacute;seau n’est pas activ&eacute;. Activez le Moniteur de r&eacute;seau en s&eacute;lectionnant l’ic&ocirc;ne Activer le
moniteur dans la barre d’outils de la vue du Moniteur.
Activation du Moniteur de r&eacute;seau
Pour effectuer cette proc&eacute;dure, vous devez vous trouvez dans la perspective de d&eacute;veloppement ou de d&eacute;bogage Flash.
1 Si la vue Moniteur de r&eacute;seau n’est pas ouverte, s&eacute;lectionnez Fen&ecirc;tre dans le menu Flash Builder, puis Autres vues &gt;
Flash Builder &gt; Moniteur de r&eacute;seau.
2 Si le Moniteur de r&eacute;seau n’est pas activ&eacute;, cliquez sur l’ic&ocirc;ne Activer le moniteur dans la barre d’outils de la vue
Moniteur de r&eacute;seau.
Cette ic&ocirc;ne permet de l’activer et de le d&eacute;sactiver.
Surveillance des services distants
Pour surveiller l’application, activez le Moniteur de r&eacute;seau et ex&eacute;cutez la version de d&eacute;veloppement ou de d&eacute;bogage de
l’application.
En g&eacute;n&eacute;ral, le Moniteur de r&eacute;seau capture et stocke toutes les donn&eacute;es d’&eacute;v&eacute;nements jusqu’&agrave; ce que vous quittiez
l’application ou effaciez les donn&eacute;es de mani&egrave;re explicite. Les &eacute;v&eacute;nements s’affichent dans l’ordre chronologique.
D&eacute;marrage d’une session de surveillance
1 Ex&eacute;cutez la version de d&eacute;veloppement ou de d&eacute;bogage de l’application qui acc&egrave;de aux services distants.
2 Pour chaque acc&egrave;s &agrave; un service distant, le Moniteur de r&eacute;seau r&eacute;pertorie les &eacute;l&eacute;ments suivants :
• Heure de la requ&ecirc;te
• Service
• Demande d’un service
• Heure de la r&eacute;ponse
• Temps &eacute;coul&eacute;
3 S&eacute;lectionnez un en-t&ecirc;te de colonne pour trier les donn&eacute;es renvoy&eacute;es en fonction des valeurs de ladite colonne.
Cliquez de nouveau sur la colonne pour inverser l’ordre des donn&eacute;es.
4 S&eacute;lectionnez les onglets de requ&ecirc;te et de param&egrave;tres situ&eacute;s au bas du moniteur pour afficher les d&eacute;tails de
l’op&eacute;ration.
Les donn&eacute;es envoy&eacute;es dans la requ&ecirc;te, ainsi que les autres informations concernant la requ&ecirc;te, peuvent &ecirc;tre
visualis&eacute;es &agrave; partir de ces onglets.
5 S&eacute;lectionnez les onglets de r&eacute;ponse et de r&eacute;sultats situ&eacute;s au bas du moniteur pour afficher les d&eacute;tails de la r&eacute;ponse.
Les donn&eacute;es envoy&eacute;es dans la requ&ecirc;te, ainsi que les autres informations concernant la r&eacute;ponse, peuvent &ecirc;tre
visualis&eacute;es &agrave; partir de ces onglets.
6 Double-cliquez sur une entr&eacute;e pour acc&eacute;der au code source de l’op&eacute;ration.
L’&eacute;diteur de source de Flash Builder s’ouvre ; la ligne correspondante du code source est mise en &eacute;vidence.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 157
D&eacute;bogage, test et surveillance des applications
Remarque : dans la plupart des cas, le Moniteur de r&eacute;seau peut faire correspondre un &eacute;v&eacute;nement au code source Flex.
Certains &eacute;v&eacute;nements toutefois sont d&eacute;clench&eacute;s en dehors de la port&eacute;e du Moniteur de r&eacute;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&eacute;seau pour inscrire toutes les informations
saisies dans un fichier XML.
Remarque : utilisez le fichier XML g&eacute;n&eacute;r&eacute; pour &eacute;tudier les donn&eacute;es hors ligne. Il est impossible d’importer des donn&eacute;es
de ce fichier vers le Moniteur de r&eacute;seau.
8 Cliquez sur l’ic&ocirc;ne Effacer dans la barre d’outils du Moniteur de r&eacute;seau pour en supprimer toutes les informations.
Interruption d’une session de surveillance
Vous pouvez interrompre, puis reprendre, la surveillance du r&eacute;seau. L’interruption et la reprise d’une session
s’appliquent &agrave; toutes les applications du projet Flex. Par exemple, il est impossible d’interrompre l’application d’un
projet et de continuer la surveillance d’une autre.
1 Cliquez sur le bouton Interrompre dans la barre d’outils du Moniteur de r&eacute;seau pour interrompre la surveillance
d’une session.
2 Cliquez sur le bouton Reprendre pour continuer la surveillance de la session.
Arr&ecirc;t d’une session de surveillance
Pour arr&ecirc;ter la surveillance d’une session, d&eacute;sactivez le Moniteur de r&eacute;seau.
1 (Facultatif) Fermez le Moniteur de r&eacute;seau.
Remarque : la fermeture du Moniteur de r&eacute;seau ne suffit pas &agrave; mettre un terme &agrave; la session de surveillance. La
surveillance reste active, m&ecirc;me si le Moniteur de r&eacute;seau est ferm&eacute;.
2 Cliquez sur le bouton Activer le moniteur.
Cette ic&ocirc;ne permet de l’activer et de le d&eacute;sactiver.
Remarque : la d&eacute;sactivation du Moniteur de r&eacute;seau s’applique &agrave; toutes les applications du projet Flex.
Prise en charge du protocole HTTPS
Le Moniteur de r&eacute;seau prend en charge la surveillance des appels HTTPS dirig&eacute;s vers un serveur certifi&eacute; par une
autorit&eacute; de certification ou par un certificat autosign&eacute;.
Pour surveiller les appels pass&eacute;s par protocole HTTPS, modifiez la pr&eacute;f&eacute;rence par d&eacute;faut du Moniteur de r&eacute;seau en
activant l’option Ignorer les v&eacute;rifications de s&eacute;curit&eacute; SSL. Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et acc&eacute;dez &agrave; Flash
Builder &gt; Moniteur de r&eacute;seau.
Affichage des donn&eacute;es du Moniteur de r&eacute;seau
Le volet de gauche du Moniteur de r&eacute;seau fournit des informations sur la source des donn&eacute;es. Il affiche les
informations suivantes :
• L’URL source du service de donn&eacute;es
• Le type de service affich&eacute; :
Par exemple RemoteService, HTTPService ou WebService.
• Le temps de demande, le temps de r&eacute;ponse et le temps &eacute;coul&eacute; pour la demande de donn&eacute;es
• Le nom de l’op&eacute;ration appel&eacute;e &agrave; partir du service de donn&eacute;es
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 158
D&eacute;bogage, test et surveillance des applications
Le Moniteur de r&eacute;seau comporte deux onglets, l’un pour l’affichage des donn&eacute;es de demande et l’autre pour l’affichage
des donn&eacute;es de r&eacute;ponse.
Les donn&eacute;es des demandes et r&eacute;ponses peuvent &ecirc;tre visionn&eacute;es en structure arborescente, dans une vue brute ou en
affichage hexad&eacute;cimal. Passez d’un affichage &agrave; l’autre en s&eacute;lectionnant l’ic&ocirc;ne correspondante.
• Arborescence
Affiche les donn&eacute;es XML, JSON et AMF en structure arborescente. L’arborescence est la vue par d&eacute;faut.
• Vue brute
Affiche les donn&eacute;es en cours de transfert.
• Affichage hexad&eacute;cimal
Affiche les donn&eacute;es au format hexad&eacute;cimal. Cet affichage est indiqu&eacute; en particulier pour le d&eacute;bogage des donn&eacute;es
binaires envoy&eacute;es par l’interm&eacute;diaire d’un r&eacute;seau.
Par d&eacute;faut, le Moniteur de r&eacute;seau efface toutes les donn&eacute;es enregistr&eacute;es &agrave; chaque lancement d’une application. Vous
pouvez cependant modifier ce comportement par d&eacute;faut et conserver toutes les donn&eacute;es de surveillance. Les donn&eacute;es
conserv&eacute;es sont celles issues de toutes les applications de tous les projets. Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et
acc&eacute;dez &agrave; Flash Builder &gt; Moniteur de r&eacute;seau. D&eacute;sactivez l’option Effacer les entr&eacute;es au d&eacute;marrage.
Enregistrement des donn&eacute;es du Moniteur de r&eacute;seau
Vous pouvez enregistrer les donn&eacute;es du Moniteur de r&eacute;seau dans un fichier XML. Pour ce faire, cliquez sur le bouton
Enregistrer de la vue Moniteur de r&eacute;seau.
Surveillance de plusieurs applications
Vous pouvez surveiller plusieurs applications en m&ecirc;me temps. Il existe deux sc&eacute;narios possibles pour surveiller
plusieurs applications :
• Surveillance de plusieurs applications d’un m&ecirc;me projet
Vous pouvez uniquement disposer d’un Moniteur de r&eacute;seau par projet Flex. Lors de la surveillance de plusieurs
applications d’un m&ecirc;me projet, les &eacute;v&eacute;nements de toutes les applications s’affichent dans le moniteur en fonction
de l’heure &agrave; laquelle ils surviennent.
Le moniteur ne permet pas de filtrer les &eacute;v&eacute;nements selon une application sp&eacute;cifique.
• Surveillance de plusieurs applications dans diff&eacute;rents projets
Vous pouvez ouvrir un Moniteur de r&eacute;seau pour chaque projet Flex actif. Chaque Moniteur de r&eacute;seau est
ind&eacute;pendant : il affiche uniquement les &eacute;v&eacute;nements de son projet sp&eacute;cifique.
L’interruption ou la d&eacute;sactivation d’un Moniteur de r&eacute;seau dans un projet ne s’applique pas aux moniteurs d’autres
projets.
Limites du Moniteur de r&eacute;seau
La surveillance des donn&eacute;es du r&eacute;seau pr&eacute;sente les deux restrictions suivantes :
• Le Moniteur de r&eacute;seau ne prend pas en charge les applications cr&eacute;&eacute;es dans le cadre de projets purement
ActionScript ou de biblioth&egrave;que.
• De m&ecirc;me, il ne prend pas en charge le protocole Real Time Messaging Protocol (RTMP). Vous ne pouvez pas, par
exemple, surveiller de la vid&eacute;o en flux continu.
Derni&egrave;re mise &agrave; jour le 29/4/2010
Chapitre 8 : Profilage des applications Flex
Le profileur d’Adobe&reg; Flex&reg; d’Adobe Flash&reg; Builder™ vous permet d’identifier les goulets d’&eacute;tranglement des
performances et les fuites de m&eacute;moire des applications avec lesquelles vous interagissez. Il est disponible uniquement
avec Flash Builder Premium.
A propos du profilage
Le profileur d’Adobe Flex d&eacute;tecte tout ralentissement des performances ainsi que les fuites de m&eacute;moire de vos
applications. Le profileur est lanc&eacute; &agrave; partir d’Adobe Flash Builder. Il enregistre les donn&eacute;es concernant l’&eacute;tat de
l’application avec laquelle vous interagissez, notamment le nombre d’objets, leur taille, le nombre d’appels de m&eacute;thode
et le temps pass&eacute; dans ces appels.
Le profilage d’une application peut vous aider &agrave; comprendre les &eacute;l&eacute;ments suivants.
Fr&eacute;quence des appels Vous pouvez dans certains cas vous rendre compte que certaines m&eacute;thodes faisant appel &agrave; un
grand nombre de ressources sont appel&eacute;es plusieurs fois, alors qu’un seul appel est n&eacute;cessaire. En identifiant les
m&eacute;thodes les plus fr&eacute;quemment appel&eacute;es, vous pouvez concentrer le temps que vous passez &agrave; ajuster les performances
sur une zone plus r&eacute;duite de l’application, o&ugrave; l’impact sur les performances est plus important.
Dur&eacute;e de la m&eacute;thode Le profileur peut vous indiquer le temps pass&eacute; dans une m&eacute;thode particuli&egrave;re, ou, si la m&eacute;thode
est appel&eacute;e plusieurs fois, le laps de temps moyen pass&eacute; dans cette m&eacute;thode au cours d’une session de profilage. Si vous
trouvez que certaines m&eacute;thodes entra&icirc;nent des goulets d’&eacute;tranglement des performances, vous pouvez tenter de les
optimiser.
Piles d’appels En suivant la pile d’appels d’une m&eacute;thode, vous pouvez voir l’int&eacute;gralit&eacute; du chemin que poursuit
l’application lorsqu’elle appelle des m&eacute;thodes successives. Cela peut vous amener &agrave; constater que certains appels de
m&eacute;thodes sont superflus.
Nombre d’occurrences (allocation d’objet) Si vous constatez que le m&ecirc;me objet est cr&eacute;&eacute; plusieurs fois alors que seul un
nombre sp&eacute;cifique d’occurrences est requis, vous pouvez envisager de mettre en œuvre un patron Singleton, pour
autant que vous n’ayez vraiment besoin que d’un seul de ces objets. Vous pouvez &eacute;galement appliquer d’autres
techniques visant &agrave; r&eacute;duire l’allocation excessive d’objets. Si le nombre d’objets est important, mais n&eacute;cessaire, vous
pouvez optimiser l’objet m&ecirc;me afin de r&eacute;duire sa ressource Agr&eacute;gat et l’utilisation qu’il fait de la m&eacute;moire.
Taille de l’objet Si vous remarquez que certains objets sont de taille disproportionn&eacute;e, vous pouvez tenter de les
optimiser pour r&eacute;duire leur encombrement m&eacute;moire. Cette op&eacute;ration s’av&egrave;re particuli&egrave;rement utile si vous optimisez
des objets cr&eacute;&eacute;s de nombreuses fois dans l’application.
R&eacute;cup&eacute;ration de place Lors de la comparaison d’instantan&eacute;s de profilage, vous pouvez vous rendre compte que
certains objets qui ne sont plus requis par l’application restent stock&eacute;s dans la m&eacute;moire. Pour pr&eacute;venir ces fuites de
m&eacute;moire, vous pouvez ajouter une logique qui supprime toute r&eacute;f&eacute;rence restante &agrave; ces objets.
Ne consid&eacute;rez pas le profilage seulement comme une &eacute;tape unique, distincte, du processus de d&eacute;veloppement d’une
application. Il doit plut&ocirc;t faire partie int&eacute;grante de chaque &eacute;tape du d&eacute;veloppement d’une application. Vous devez, si
possible, profiler une application pr&eacute;cocement et fr&eacute;quemment pendant son d&eacute;veloppement, de mani&egrave;re &agrave; identifier
rapidement les &eacute;ventuels probl&egrave;mes. Le profilage &eacute;tant un processus it&eacute;ratif, vous tirez un maximum de b&eacute;n&eacute;fices en
profilant le plus souvent possible.
159
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 160
Profilage des applications Flex
A propos des types de profilage
Avant de faire appel au profileur, vous devez d&eacute;cider du type de profilage que vous allez effectuer : profilage des
performances ou profilage de la m&eacute;moire.
Le profilage des performances est le processus de recherche des m&eacute;thodes de l’application qui s’ex&eacute;cutent lentement et
qui peuvent &ecirc;tre am&eacute;lior&eacute;es. Une fois identifi&eacute;es, ces zones &agrave; probl&egrave;mes peuvent &ecirc;tre optimis&eacute;es pour acc&eacute;l&eacute;rer
l’ex&eacute;cution de l’application et pour que celle-ci r&eacute;ponde plus rapidement aux interactions de la part de l’utilisateur.
Lors du profilage des performances, vous cherchez g&eacute;n&eacute;ralement deux choses : une m&eacute;thode appel&eacute;e une seule fois
mais qui met plus de temps &agrave; s’ex&eacute;cuter que des m&eacute;thodes similaires, ou une m&eacute;thode qui ne met pas autant de temps
&agrave; s’ex&eacute;cuter, mais qui est appel&eacute;e de nombreuses fois. Les donn&eacute;es de profilage des performances permettent
d’identifier les m&eacute;thodes que vous optimisez par la suite. Vous trouverez peut-&ecirc;tre que le fait de r&eacute;duire le nombre
d’appels &agrave; une m&eacute;thode est plus efficace que la restructuration du code au sein de la m&eacute;thode.
Le profilage de la m&eacute;moire est l’examen de la quantit&eacute; de m&eacute;moire qu’utilise chaque objet ou type d’objet de
l’application. Les donn&eacute;es de profilage de la m&eacute;moire s’utilisent de diverses fa&ccedil;ons : pour voir si des objets sont plus
volumineux que n&eacute;cessaire, pour voir si trop d’objets d’un m&ecirc;me type existent et pour identifier des objets qui ne sont
pas nettoy&eacute;s dans la m&eacute;moire (fuites de m&eacute;moire). Gr&acirc;ce aux donn&eacute;es de profilage de la m&eacute;moire, vous pouvez tenter
de r&eacute;duire la taille des objets, le nombre des objets cr&eacute;&eacute;s ou permettre le nettoyage des objets dans la m&eacute;moire en
supprimant les r&eacute;f&eacute;rences &agrave; ces objets.
Le profilage de la m&eacute;moire peut ralentir les performances de l’application car il fait appel &agrave; une plus grande quantit&eacute;
de m&eacute;moire que le profilage des performances. N’effectuez le profilage de la m&eacute;moire que lorsque cela s’av&egrave;re
n&eacute;cessaire.
Il convient souvent d’effectuer &agrave; la fois un profilage des performances et un profilage de la m&eacute;moire pour trouver la
source des probl&egrave;mes de performances. Le profilage des performances permet d’identifier les m&eacute;thodes qui entra&icirc;nent
une allocation de m&eacute;moire excessive et un allongement des temps d’ex&eacute;cution. Vous pouvez ensuite recourir au
profilage de la m&eacute;moire afin d’identifier les fuites de m&eacute;moire dans ces m&eacute;thodes.
Lorsque vous savez le type de profilage que vous allez effectuer, vous pouvez d&eacute;marrer le profileur.
Ressources suppl&eacute;mentaires
Le profileur seul n’am&eacute;liore ni la taille, ni la vitesse, ni les performances per&ccedil;ues d’une application. Apr&egrave;s avoir utilis&eacute;
le profileur pour identifier les m&eacute;thodes et classes qui posent probl&egrave;mes, consultez les ressources suivantes dans la
documentation Flex, qui vous aideront &agrave; am&eacute;liorer l’application :
• Optimizing Flex Applications dans Utilisation d’Adobe Flex 4
• Improving Startup Performance dans Utilisation d’Adobe Flex 4
Fonctionnement du profileur Flex
Le profileur est un agent qui communique avec l’application s’ex&eacute;cutant dans Flash Player. Il se connecte &agrave;
l’application par l’interm&eacute;diaire d’une connexion &agrave; un socket local. Vous devrez donc &eacute;ventuellement d&eacute;sactiver votre
logiciel antivirus si ce dernier entrave la communication avec les sockets.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 161
Profilage des applications Flex
Lorsque le profileur est en cours d’ex&eacute;cution, il prend un instantan&eacute; des donn&eacute;es &agrave; intervalles tr&egrave;s courts et enregistre
les actions d’Adobe Flash Player &agrave; ces moments. C’est ce qu’on appelle l’&eacute;chantillonnage. Le profileur enregistre par
exemple une m&eacute;thode ex&eacute;cut&eacute;e par l’application au moment de la prise de l’instantan&eacute;. Si au moment de l’instantan&eacute;
suivant, l’application ex&eacute;cute toujours la m&ecirc;me m&eacute;thode, le profileur continue d’enregistrer l’heure. Lorsque le
profileur effectue l’instantan&eacute; suivant et que l’application est pass&eacute;e &agrave; l’op&eacute;ration suivante, le profileur peut consigner
le temps qu’il a fallu &agrave; la m&eacute;thode pour s’ex&eacute;cuter.
L’&eacute;chantillonnage vous permet de profiler sans ralentir notablement l’application. L’intervalle &eacute;coul&eacute; s’appelle la
fr&eacute;quence d’&eacute;chantillonnage, qui survient environ toutes les millisecondes pendant la p&eacute;riode de profilage. Cela signifie
que les op&eacute;rations ne sont pas toutes enregistr&eacute;es et que les instantan&eacute;s ne sont pas tous pr&eacute;cis &agrave; une fraction de
milliseconde pr&egrave;s. Cela vous permet toutefois d’avoir une id&eacute;e plus pr&eacute;cise des op&eacute;rations qui prennent plus de temps
que les autres.
En analysant les donn&eacute;es d’&eacute;chantillonnage, le profileur peut afficher toutes les op&eacute;rations effectu&eacute;es dans l’application
et enregistrer leur d&eacute;lai d’ex&eacute;cution. Il consigne &eacute;galement l’utilisation de la m&eacute;moire et les traces de pile et affiche les
donn&eacute;es dans une s&eacute;rie de vues, ou panneaux. Les appels de m&eacute;thode sont class&eacute;s par dur&eacute;e d’ex&eacute;cution et nombre
d’appels, ainsi que par nombre d’objets cr&eacute;&eacute;s dans la m&eacute;thode.
Le profileur calcule &eacute;galement les valeurs cumul&eacute;es des donn&eacute;es. Par exemple, si vous consultez des statistiques li&eacute;es
aux m&eacute;thodes, les donn&eacute;es cumul&eacute;es comprennent le temps et la m&eacute;moire allou&eacute;s au cours de cette m&eacute;thode, ainsi que
le temps et la m&eacute;moire allou&eacute;s au cours de toutes les m&eacute;thodes appel&eacute;es &agrave; partir de cette m&eacute;thode. Vous pouvez
effectuer une analyse plus pouss&eacute;e des appels de m&eacute;thode suivants, jusqu’&agrave; trouver la source des probl&egrave;mes de
performances.
A propos des API de profilage
Le profileur utilise les API ActionScript d&eacute;finies dans le packageflash.sampler.*. Ce package contient les classes
Sample, StackFrame, NewObjectSample et DeleteObjectSample. Vous pouvez faire appel aux m&eacute;thodes et aux classes
contenues dans ce package pour &eacute;crire votre propre application de profileur ou pour inclure un sous-ensemble de
fonctionnalit&eacute;s de profilage dans vos applications.
Outre les classes du package flash.sampler.*, le profileur utilise les m&eacute;thodes contenues dans la classe System.
A propos des actions internes de Flash Player
Le profileur enregistre g&eacute;n&eacute;ralement des donn&eacute;es sur les m&eacute;thodes de la classe dont l’ex&eacute;cution &eacute;tait en cours au
moment de l’instantan&eacute; d’&eacute;chantillonnage. Il arrive toutefois que le profileur enregistre &eacute;galement des actions internes
de Flash Player. Ces actions, consign&eacute;es entre crochets, sont notamment [keyboardEvent], [mark] et [sweep].
Par exemple, si [keyboardEvent] se trouve dans la liste des m&eacute;thodes avec une valeur de 100, vous savez que le lecteur
a effectu&eacute; une action interne li&eacute;e &agrave; cet &eacute;v&eacute;nement au moins 100 fois au cours de la p&eacute;riode d’interaction.
Le tableau suivant d&eacute;crit les actions internes de Flash Player qui apparaissent dans les donn&eacute;es de profilage.
Action
Description
[generate]
Le compilateur juste &agrave; temps (JIT) g&eacute;n&egrave;re du code machine AS3.
[mark]
Flash Player marque les objets actifs pour la r&eacute;cup&eacute;ration de place.
[newclass]
Flash Player d&eacute;finit une classe. Cette op&eacute;ration a g&eacute;n&eacute;ralement lieu au d&eacute;marrage. Le chargement
d’une nouvelle classe peut avoir cependant lieu &agrave; tout moment.
[pre-render]
Flash Player se pr&eacute;pare &agrave; rendre les objets (notamment les calculs de g&eacute;om&eacute;trie et le parcours de la liste
d’affichage qui se produisent avant l’affichage).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 162
Profilage des applications Flex
Action
Description
[reap]
Flash Player r&eacute;cup&egrave;re les objets de d&eacute;compte diff&eacute;r&eacute; des r&eacute;f&eacute;rences (DRC, deferred reference counting).
[render]
Flash Player rend les objets dans la liste d’affichage (pixel par pixel).
[sweep]
Flash Player r&eacute;cup&egrave;re la m&eacute;moire des objets non marqu&eacute;s.
[verify]
Le compilateur JIT effectue la v&eacute;rification du code binaire d’ActionScript 3.0.
[event_typeEvent]
Flash Player distribue l’&eacute;v&eacute;nement sp&eacute;cifi&eacute;.
Ces informations peuvent vous aider &agrave; identifier d’&eacute;ventuels probl&egrave;mes de performances. Par exemple, si vous voyez
un grand nombre d’entr&eacute;es pour [mark] et [sweep], vous pouvez partir du principe qu’un grand nombre d’objets sont
en cours de cr&eacute;ation, puis sont marqu&eacute;s pour la r&eacute;cup&eacute;ration de place. En comparant ces nombres dans diff&eacute;rents
profils de performances, vous pouvez constater par vous-m&ecirc;me si les modifications que vous apportez ont un effet.
Pour consulter les donn&eacute;es correspondant &agrave; ces actions internes, affichez un profil de performances dans la vue Profil
de performance ou un profil de m&eacute;moire dans la vue Suivi des allocations. Pour plus d’informations, voir &laquo; Utilisation
de la vue Profil de performance &raquo; &agrave; la page 176 et &laquo; Utilisation de la vue Suivi des allocations &raquo; &agrave; la page 173.
Utilisation du profileur
Le profileur n&eacute;cessite Flash Player version 9.0.124 ou une version ult&eacute;rieure. Vous pouvez profiler des applications qui
ont &eacute;t&eacute; compil&eacute;es pour Flex 2, Flex 2.0.1 et Flex 3. Vous pouvez utiliser le profileur pour profiler des applications
ActionScript 3.0 cr&eacute;&eacute;es avec Flash Authoring, ainsi que des applications de bureau ex&eacute;cut&eacute;es sur Adobe&reg; AIR™.
Le profileur a besoin d’informations de d&eacute;bogage dans l’application que vous &ecirc;tes en train de profiler. Lorsque vous
compilez une application et que vous lancez le profileur, Flash Builder inclut par d&eacute;faut les informations de d&eacute;bogage
dans l’application. Vous pouvez inclure explicitement les informations de d&eacute;bogage dans n’importe quelle application
en d&eacute;finissant l’option d&eacute;bug du compilateur sur true. Si vous exportez une application par le biais de l’option
Exporter vers une version valid&eacute;e, l’application ne contient aucune information de d&eacute;bogage.
Lancement, arr&ecirc;t et reprise du profileur
Vous pouvez profiler des applications que vous &ecirc;tes en train de cr&eacute;er dans Flash Builder. Flash Builder inclut des
informations de d&eacute;bogage lors de la compilation et de l’ex&eacute;cution d’une application lors d’une session de d&eacute;bogage.
Vous pouvez &eacute;galement profiler dans Flash Builder des applications externes que vous n’&ecirc;tes pas en train de
d&eacute;velopper, mais dont le fichier SWF est disponible avec une URL ou dans le syst&egrave;me de fichiers. Le fichier SWF d’une
application doit contenir des informations de d&eacute;bogage pour que vous puissiez la profiler. Pour plus d’informations,
voir &laquo; Profilage d’applications externes &raquo; &agrave; la page 167.
Lancement du profilage d’une application Flex
1 Fermez toutes les occurrences du navigateur.
2 Ouvrez l’application dans Flash Builder.
3 Cliquez sur le bouton Profiler nom_application dans la barre d’outils principale. Flash Builder vous informe que
vous devez fermer toutes les occurrences de vos navigateurs si ce n’est pas d&eacute;j&agrave; fait.
4 Cliquez sur le bouton OK. Flash Builder compile l’application et la lance dans une fen&ecirc;tre de navigateur distincte.
Flash Builder ouvre &eacute;galement la bo&icirc;te de dialogue Configurer le profileur.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 163
Profilage des applications Flex
5 S&eacute;lectionnez les options de la bo&icirc;te de dialogue Configurer le profileur puis cliquez sur Reprendre. Pour profiler
une application, vous devez s&eacute;lectionner l’option Activer le profilage de la m&eacute;moire ou l’option Activer le profilage
des performances. Vous pouvez s&eacute;lectionner ces deux options lors du profilage d’une application.
Le tableau suivant pr&eacute;sente les options disponibles.
Param&egrave;tre
Description
Connect&eacute; &agrave; partir de
Indique le serveur depuis lequel vous lancez l’application. Si l’application
s’ex&eacute;cute sur le m&ecirc;me ordinateur que le profileur, cette valeur est localhost.
Vous ne pouvez pas modifier cette valeur. Vous pouvez toutefois profiler
une application s’ex&eacute;cutant sur un ordinateur distinct. Voir &laquo; Profilage
d’applications externes &raquo; &agrave; la page 167.
Application
Pr&eacute;cise l’application que vous &ecirc;tes sur le point de profiler. Vous ne pouvez
pas modifier cette valeur.
Activer le profilage de la
m&eacute;moire
Demande au profileur de recueillir des donn&eacute;es concernant la m&eacute;moire
Utilisez cette option pour d&eacute;tecter des fuites de m&eacute;moire ou un nombre
excessif de cr&eacute;ations d’objets.
Si vous &ecirc;tes en train d’effectuer le profilage des performances, vous pouvez
d&eacute;s&eacute;lectionner cette option.
L’option Activer le profilage de la m&eacute;moire est s&eacute;lectionn&eacute;e par d&eacute;faut.
Surveiller les donn&eacute;es de
m&eacute;moire active
Demande au profileur d’afficher des donn&eacute;es concernant la m&eacute;moire dans
la vue Objets actifs lors du profilage. Cela n’est pas obligatoire pour le
profilage de la m&eacute;moire ni le profilage des performances. Vous pouvez
s&eacute;lectionner cette option uniquement si vous avez s&eacute;lectionn&eacute; Activer le
profilage de la m&eacute;moire.
L’option Surveiller les donn&eacute;es de m&eacute;moire active est s&eacute;lectionn&eacute;e par
d&eacute;faut.
G&eacute;n&eacute;rer des traces de pile
d’allocation d’objets
Demande au profileur de capturer une trace de pile &agrave; chaque cr&eacute;ation
d’objet. L’activation de cette option ralentit le profilage. Cette option n’est
g&eacute;n&eacute;ralement s&eacute;lectionn&eacute;e qu’en cas de n&eacute;cessit&eacute;. Elle n’est disponible que
si l’option Activer le profilage de la m&eacute;moire a &eacute;t&eacute; activ&eacute;e.
L’option G&eacute;n&eacute;rer des traces de pile d’allocation d’objets est d&eacute;sactiv&eacute;e par
d&eacute;faut.
Elle doit &ecirc;tre activ&eacute;e pour pouvoir afficher les informations li&eacute;es au suivi des
allocations dans la vue R&eacute;f&eacute;rences de l’objet ou Suivi des allocations.
Activer le profilage des
performances
Demande au profileur de recueillir les donn&eacute;es li&eacute;es &agrave; la trace de la pile aux
intervalles d’&eacute;chantillonnage. Utilisez ces &eacute;chantillons pour d&eacute;terminer les
processus auxquels la majeure partie du temps d’ex&eacute;cution de l’application
est employ&eacute;e.
Si vous &ecirc;tes en train d’effectuer le profilage de la m&eacute;moire, vous pouvez
d&eacute;s&eacute;lectionner cette option.
L’option Activer le profilage des performances est s&eacute;lectionn&eacute;e par d&eacute;faut.
Vous pouvez changer les valeurs par d&eacute;faut de ces options en modifiant les pr&eacute;f&eacute;rences de profilage. Pour plus
d’informations, voir &laquo; D&eacute;finition des pr&eacute;f&eacute;rences du profileur &raquo; &agrave; la page 167.
6 Vous pouvez maintenant commencer &agrave; interagir avec l’application et &agrave; examiner les donn&eacute;es du profileur.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 164
Profilage des applications Flex
Interruption et reprise du profilage d’une application Flex
Une fois que vous avez d&eacute;marr&eacute; le profileur, vous pouvez interrompre et red&eacute;marrer les applications dans la vue
Profiler. S&eacute;lectionnez une application puis s&eacute;lectionnez l’action &agrave; effectuer sur cette application. L’exemple suivant
illustre la vue Profiler avec plusieurs applications. Une application est en cours d’ex&eacute;cution ; toutes les autres sont
ferm&eacute;es.
Arr&ecirc;t du profilage d’une application Flex
1 S&eacute;lectionnez l’application dans la vue Profiler.
2 Cliquez sur le bouton Arr&ecirc;ter pour mettre fin &agrave; la session de profilage. Cette op&eacute;ration ne ferme pas le navigateur
ni ne termine le processus Flash Player. Vous devrez y proc&eacute;der manuellement.
3 Pour retourner &agrave; la perspective D&eacute;veloppement Flex, s&eacute;lectionnez D&eacute;veloppement Flex dans la liste d&eacute;roulante de
perspective. Vous pouvez &eacute;galement changer les perspectives en appuyant sur les touches Ctrl+F8 sous Windows.
A propos des boutons du profileur
Le tableau suivant pr&eacute;sente les boutons de la barre d’outils du profileur.
Bouton
Nom
Description
Reprendre
Reprend la session de profilage. Cette option est active uniquement si le
nom d’une application est s&eacute;lectionn&eacute; et qu’elle est interrompue.
Interrompre
Interrompt la session de profilage. Cette option est active uniquement si
le nom d’une application est s&eacute;lectionn&eacute; et qu’elle est en cours
d’ex&eacute;cution.
Arr&ecirc;ter
Met fin &agrave; la session de profilage. Cette option est active uniquement si le
nom d’une application est s&eacute;lectionn&eacute; et qu’elle n’a pas d&eacute;j&agrave; &eacute;t&eacute; ferm&eacute;e.
Lancer la r&eacute;cup&eacute;ration de Demande &agrave; Flash Player de r&eacute;cup&eacute;rer de la place. Cette option est active
place
uniquement si le nom d’une application est s&eacute;lectionn&eacute; et qu’elle est en
cours d’ex&eacute;cution.
Pour plus d’informations sur la r&eacute;cup&eacute;ration de place, voir &laquo; A propos de
la r&eacute;cup&eacute;ration de place &raquo; &agrave; la page 182.
Prendre un instantan&eacute; de Enregistre l’utilisation que fait une application de la m&eacute;moire pour que
la m&eacute;moire
vous puissiez la consulter ou la comparer &agrave; d’autres instantan&eacute;s.
Cette option est active uniquement si le nom d’une application est
s&eacute;lectionn&eacute;, que celle-ci est en cours d’ex&eacute;cution et si vous s&eacute;lectionnez
Activer le profilage de la m&eacute;moire dans la bo&icirc;te de dialogue de
lancement. Le profileur ajoute de nouveaux instantan&eacute;s de la m&eacute;moire
en tant qu’enfants de l’application s&eacute;lectionn&eacute;e dans la vue Profiler.
Pour ouvrir le nouvel instantan&eacute; de m&eacute;moire dans la vue Instantan&eacute; de la
m&eacute;moire, double-cliquez sur l’entr&eacute;e d’instantan&eacute; de la m&eacute;moire.
La r&eacute;cup&eacute;ration de place se fait implicitement avant l’enregistrement
d’instantan&eacute;s de la m&eacute;moire. En d’autres termes, un clic sur le bouton
Prendre un instantan&eacute; de la m&eacute;moire &eacute;quivaut &agrave; un clic sur le bouton
Lancer la r&eacute;cup&eacute;ration de place puis &agrave; un clic sur le bouton Prendre un
instantan&eacute; de la m&eacute;moire.
Pour plus d’informations sur l’utilisation des instantan&eacute;s de m&eacute;moire,
voir &laquo; Utilisation de la vue Instantan&eacute; de la m&eacute;moire &raquo; &agrave; la page 171.
Derni&egrave;re mise &agrave; jour le 29/4/2010
Bouton
UTILISATION DE FLASH BUILDER 4 165
Profilage des applications Flex
Nom
Description
Rechercher les objets
vagabonds
Compare deux instantan&eacute;s de la m&eacute;moire dans la vue Objets vagabonds.
Cette option est active uniquement si deux instantan&eacute;s de m&eacute;moire sont
s&eacute;lectionn&eacute;s et que l’option Activer le profilage de la m&eacute;moire est
s&eacute;lectionn&eacute;e dans la bo&icirc;te de dialogue de lancement.
Pour plus d’informations sur la vue Objets vagabonds, voir &laquo; Utilisation
de la vue Objets vagabonds &raquo; &agrave; la page 180.
Afficher le suivi des
allocations
Compare les m&eacute;thodes entre deux instantan&eacute;s de la m&eacute;moire dans la vue
Suivi des allocations.
Cette option est active uniquement si deux instantan&eacute;s de m&eacute;moire sont
s&eacute;lectionn&eacute;s et que l’option Activer le profilage de la m&eacute;moire est
s&eacute;lectionn&eacute;e dans la bo&icirc;te de dialogue de lancement.
Pour plus d’informations sur la vue Suivi des allocations, voir &laquo; Utilisation
de la vue Suivi des allocations &raquo; &agrave; la page 173.
R&eacute;initialiser les donn&eacute;es
de performance
Efface les donn&eacute;es de profilage des performances.
Cette option est active uniquement si le nom d’une application est
s&eacute;lectionn&eacute;, que celle-ci est en cours d’ex&eacute;cution, et si vous s&eacute;lectionnez
Activer le profilage de la m&eacute;moire dans la bo&icirc;te de dialogue de
lancement.
G&eacute;n&eacute;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&eacute; des performances de
l’application &agrave; partir du moment o&ugrave; vous r&eacute;initialisez les donn&eacute;es.
Pour plus d’informations sur la vue Profil de performance, voir
&laquo; Utilisation de la vue Profil de performance &raquo; &agrave; la page 176.
Capturer le profil de
performance
Enregistre un nouvel instantan&eacute; des performances en tant qu’enfant de
l’application s&eacute;lectionn&eacute;e.
Cette option est active uniquement si le nom d’une application est
s&eacute;lectionn&eacute;, que celle-ci est en cours d’ex&eacute;cution, et si vous s&eacute;lectionnez
Activer le profilage de la m&eacute;moire dans la bo&icirc;te de dialogue de
lancement.
Pour ouvrir la vue Profil de performance, double-cliquez sur l’entr&eacute;e
d’instantan&eacute; des performances.
Pour plus d’informations sur la vue Profil de performance, voir
&laquo; Utilisation de la vue Profil de performance &raquo; &agrave; la page 176.
Supprimer
Supprime de la m&eacute;moire les donn&eacute;es de l’instantan&eacute; s&eacute;lectionn&eacute;. Un clic
sur ce bouton supprime aussi l’application de la vue du profil, si
l’application a &eacute;t&eacute; ferm&eacute;e.
Cette option est activ&eacute;e uniquement si un instantan&eacute; de performances
ou de m&eacute;moire est s&eacute;lectionn&eacute;.
Sans objet
Enregistrer
Enregistre les donn&eacute;es de profilage sur le disque.
L’option Enregistrer est &eacute;galement disponible &agrave; partir du menu de la vue
Profiler. Cette option est active uniquement si le nom d’une application
est s&eacute;lectionn&eacute;.
Certaines vues du profileur, telles que Statistiques de la m&eacute;thode et Statistiques de l’objet, poss&egrave;dent des boutons de
navigation qui permettent de parcourir la pile ou de modifier la vue. Le tableau suivant pr&eacute;sente les boutons de
navigation dans ces vues du profileur.
Derni&egrave;re mise &agrave; jour le 29/4/2010
Bouton
UTILISATION DE FLASH BUILDER 4 166
Profilage des applications Flex
Nom
Description
Pr&eacute;c&eacute;dent
Affiche toutes les m&eacute;thodes que vous avez parcourues &agrave; partir de la premi&egrave;re
m&eacute;thode s&eacute;lectionn&eacute;e, jusqu’&agrave; la m&eacute;thode en cours d’affichage.
Suivant
Affiche la m&eacute;thode en cours d’affichage et les m&eacute;thodes qui m&egrave;nent &agrave; la m&eacute;thode
s&eacute;lectionn&eacute;e. Cet &eacute;l&eacute;ment est actif une fois que vous &ecirc;tes revenu en arri&egrave;re.
Valeur par
d&eacute;faut
Affiche la m&eacute;thode s&eacute;lectionn&eacute;e.
Ouvrir le
fichier source
Ouvre un &eacute;diteur de source qui affiche le code source de la m&eacute;thode s&eacute;lectionn&eacute;e.
Filtres
Permet de contr&ocirc;ler les m&eacute;thodes &agrave; inclure dans la table. Pour plus d’informations,
voir &laquo; A propos des filtres du profileur &raquo; &agrave; la page 186.
Afficher/Masq Affiche ou masque les m&eacute;thodes comportant un temps &eacute;gal &agrave; 0,00 dans la colonne
uer les
de temps moyen, car elles n’apparaissent dans aucun &eacute;chantillon.
m&eacute;thodes de
dur&eacute;e nulle
Enregistrement et chargement des donn&eacute;es de profilage
Une fois le profileur ex&eacute;cut&eacute;, vous pouvez enregistrer les donn&eacute;es afin de comparer un instantan&eacute; de la session de
profilage en cours avec un instantan&eacute; pris apr&egrave;s avoir apport&eacute; des modifications au code. Vous pouvez ainsi
d&eacute;terminer si vous avez identifi&eacute; les causes responsables des probl&egrave;mes et si les modifications apport&eacute;es am&eacute;liorent les
performances et l’utilisation de la m&eacute;moire par l’application.
Lors de l’enregistrement des donn&eacute;es de profilage, vous enregistrez toutes les donn&eacute;es de l’application dans ce profil,
&agrave; savoir tous les profils de performance, les instantan&eacute;s de la m&eacute;moire et le suivi des allocations. Flash Builder
enregistre ces informations dans un groupe de fichiers binaires &agrave; l’emplacement que vous sp&eacute;cifiez.
Enregistrement des donn&eacute;es de profilage
1 S&eacute;lectionnez l’application dans la vue Profiler.
2 Ouvrez la liste d&eacute;roulante dans la vue Profiler et s&eacute;lectionnez Enregistrer. La bo&icirc;te de dialogue Rechercher un
dossier appara&icirc;t.
3 Choisissez un emplacement pour enregistrer les donn&eacute;es de profil et cliquez sur OK. Vous devez cr&eacute;er un dossier
pour chaque jeu de donn&eacute;es de profilage &agrave; enregistrer. Dans le cas contraire, les nouvelles donn&eacute;es remplacent les
anciennes si vous s&eacute;lectionnez le m&ecirc;me dossier.
R&eacute;cup&eacute;ration des donn&eacute;es de profilage enregistr&eacute;es
1 S&eacute;lectionnez la vue Donn&eacute;es de profilage enregistr&eacute;es.
2 Cliquez sur le bouton Ouvrir. La bo&icirc;te de dialogue Rechercher un dossier appara&icirc;t.
3 Recherchez le dossier contenant les donn&eacute;es de profilage de l’application, puis cliquez sur OK. Flash Builder affiche
les donn&eacute;es de profilage disponibles dans la vue Donn&eacute;es de profilage enregistr&eacute;es. Vous ne pouvez pas reprendre
l’application dans cette vue, mais vous pouvez afficher les instantan&eacute;s de la m&eacute;moire ou les autres donn&eacute;es que vous
avez enregistr&eacute;es.
Vous ne pouvez pas supprimer les donn&eacute;es d’application enregistr&eacute;es depuis Flash Builder.
Suppression des donn&eacute;es de profilage
1 S&eacute;lectionnez l’instantan&eacute; de l’application dans la vue Profiler.
2 Cliquez sur le bouton Supprimer.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 167
Profilage des applications Flex
D&eacute;finition des pr&eacute;f&eacute;rences du profileur
Vous pouvez d&eacute;finir certaines pr&eacute;f&eacute;rences du profileur de mani&egrave;re telle &agrave; ce que les param&egrave;tres s’appliquent &agrave; toutes
les sessions de profilage. Ces param&egrave;tres vous permettent de d&eacute;finir le Flash Player/navigateur dans lequel vous
profilez l’application, ainsi que les filtres par d&eacute;faut et le num&eacute;ro de port sur lequel l’application est disponible, si
l’application profil&eacute;e s’ex&eacute;cute sur un serveur.
D&eacute;finition des pr&eacute;f&eacute;rences de Flash Builder pour plusieurs sessions de profilage
❖ Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez Flash Builder &gt; Profileur.
S&eacute;lectionnez les options du menu Profileur pour y acc&eacute;der. Le tableau suivant r&eacute;pertorie les pr&eacute;f&eacute;rences que vous
pouvez d&eacute;finir.
Option de menu
Description
Profileur
S&eacute;lectionnez la m&eacute;thode de profilage par d&eacute;faut. Vous pouvez activer ou d&eacute;sactiver le
profilage de la m&eacute;moire et le profilage des performances.
Connexions
D&eacute;finissez le num&eacute;ro du port sur lequel Flash Builder &eacute;coute l’application profil&eacute;e.
Le num&eacute;ro de port par d&eacute;faut est 9999. Vous ne pouvez pas changer le port en 7935, car
c’est le port utilis&eacute; par le d&eacute;bogueur.
Filtres d’exclusion
D&eacute;finissez les packages par d&eacute;faut qui sont exclus des vues du profileur. Pour plus
d’informations sur l’utilisation des filtres, voir &laquo; A propos des filtres du profileur &raquo; &agrave; la
page 186.
Filtres d’inclusion
D&eacute;finissez les packages par d&eacute;faut qui sont inclus dans les vues du profileur. Tous les
autres packages sont exclus. Pour plus d’informations sur l’utilisation des filtres, voir &laquo; A
propos des filtres du profileur &raquo; &agrave; la page 186.
Lecteur/Navigateur
D&eacute;finissez l’emplacement du fichier ex&eacute;cutable de Flash Player et du navigateur que
Flash Builder utilise pour ex&eacute;cuter votre application profil&eacute;e.
Profilage d’applications externes
Outre les applications que vous d&eacute;veloppez dans Flash Builder, vous pouvez profiler des applications externes. Il peut
s’agir de fichiers SWF situ&eacute;s dans n’importe quel emplacement accessible, notamment des applications situ&eacute;es sur un
serveur Web distant ou d’une application se trouvant dans votre syst&egrave;me de fichiers local.
Dans le cas d’un fichier SWF, vous pouvez sp&eacute;cifier une URL ou un emplacement de syst&egrave;me de fichiers. Si vous
indiquez une URL, Flash Builder lance le fichier SWF de l’application dans le navigateur par d&eacute;faut. Le navigateur doit
utiliser la version d&eacute;bogueur de Flash Player pour pouvoir profiler l’application correctement.
Si vous sp&eacute;cifiez un emplacement de syst&egrave;me de fichiers pour le fichier SWF, Flash Builder ouvre l’application dans la
version d&eacute;bogueur du Flash Player autonome. Vous devez en r&egrave;gle g&eacute;n&eacute;rale demander le fichier par le biais d’une URL.
L’ex&eacute;cution des applications dans la version autonome de Flash Player peut produire des r&eacute;sultats inattendus, plus
particuli&egrave;rement si l’application utilise des services distants ou des appels r&eacute;seau.
Profilage d’une application externe
1 Placez-vous dans la perspective Profil Flash.
2 S&eacute;lectionnez Profiler &gt; Profiler une application externe. La bo&icirc;te de dialogue Profiler une application externe
appara&icirc;t.
3 S&eacute;lectionnez l’option (par d&eacute;faut) Lancer l’application s&eacute;lectionn&eacute;e puis cliquez sur le bouton Nouveau. La bo&icirc;te de
dialogue Ajouter une application appara&icirc;t.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 168
Profilage des applications Flex
Vous pouvez aussi lancer l’application manuellement en s&eacute;lectionnant l’option Lancer l’application manuellement
hors Flash Builder.
4 Saisissez l’emplacement du fichier SWF puis cliquez sur OK ou sur le bouton Parcourir et localisez votre application
dans votre syst&egrave;me de fichiers.
5 Cliquez sur le bouton Lancer. Si vous avez indiqu&eacute; une URL comme emplacement de l’application, Flash Builder
lance l’application &agrave; partir du navigateur par d&eacute;faut. Si vous avez sp&eacute;cifi&eacute; un emplacement de syst&egrave;me de fichiers
pour l’application, Flash Builder ouvre l’application dans la version autonome de Flash Player.
Si vous avez sp&eacute;cifi&eacute; un fichier SWF qui a &eacute;t&eacute; compil&eacute; sans informations de d&eacute;bogage, Flash Builder retourne une
erreur. Recompilez l’application avec l’option debug du compilateur d&eacute;finie sur true, puis relancez-la.
A propos des vues du profileur
Le profileur Flex se compose de plusieurs vues (ou panneaux) pr&eacute;sentant de diff&eacute;rentes mani&egrave;res les donn&eacute;es de
profilage. Le tableau suivant pr&eacute;sente chacune de ces vues.
Vue
Description
Profiler
Affiche les applications actuellement connect&eacute;es, leur &eacute;tat et tous les instantan&eacute;s de
m&eacute;moire et de performances associ&eacute;s.
Les sessions de profilage d&eacute;marrent sans instantan&eacute;s de performances ou de m&eacute;moire.
Donn&eacute;es de profilage
enregistr&eacute;es
Affiche une liste d’instantan&eacute;s enregistr&eacute;s, class&eacute;s par application. Vous pouvez charger
des donn&eacute;es de profilage enregistr&eacute;es en double-cliquant sur l’instantan&eacute; enregistr&eacute;
dans cette liste.
Pour plus d’informations, voir &laquo; Enregistrement et chargement des donn&eacute;es de
profilage &raquo; &agrave; la page 166.
Objets actifs
Affiche des informations concernant les classes utilis&eacute;es par l’application en cours. Cette
vue montre les classes qui sont instanci&eacute;es, le nombre cr&eacute;&eacute;, combien se trouvent dans
le segment m&eacute;moire et la quantit&eacute; de m&eacute;moire que les objets actifs occupent.
Pour plus d’informations, voir &laquo; Affichage des informations dans la vue Objets actifs &raquo; &agrave;
la page 169.
Instantan&eacute; de la m&eacute;moire Affiche l’&eacute;tat de l’application &agrave; un moment donn&eacute;. Cette vue contraste avec la vue
Objets actifs, mise &agrave; jour en continu. La vue Instantan&eacute; de la m&eacute;moire affiche le nombre
d’objets r&eacute;f&eacute;renc&eacute;s et utilis&eacute;s dans l’application et la quantit&eacute; de m&eacute;moire que chaque
type d’objets utilisait &agrave; ce moment-l&agrave;.
Deux instantan&eacute;s de la m&eacute;moire pris &agrave; des moments diff&eacute;rents sont compar&eacute;s en vue de
d&eacute;terminer les fuites de m&eacute;moire qui existent entre les deux moments.
Vous pouvez afficher la vue Instantan&eacute; de la m&eacute;moire en cliquant sur le bouton Prendre
un instantan&eacute; de la m&eacute;moire puis en double-cliquant sur l’instantan&eacute; de m&eacute;moire dans
la vue Profiler.
Pour plus d’informations, voir &laquo; Utilisation de la vue Instantan&eacute; de la m&eacute;moire &raquo; &agrave; la
page 171.
Objets vagabonds
Affiche les objets cr&eacute;&eacute;s entre deux instantan&eacute;s de m&eacute;moire qui existent toujours dans la
m&eacute;moire ou qui n’ont pas &eacute;t&eacute; nettoy&eacute;s. Vous pouvez double-cliquer sur le nom d’une
classe dans la table pour ouvrir la vue R&eacute;f&eacute;rences de l’objet. Celle-ci vous permet
d’examiner la relation entre les objets s&eacute;lectionn&eacute;s et d’autres objets.
Vous pouvez afficher la vue Objets vagabonds en s&eacute;lectionnant deux instantan&eacute;s de
m&eacute;moire et en cliquant sur le bouton Objets vagabonds.
Pour plus d’informations, voir &laquo; Utilisation de la vue Objets vagabonds &raquo; &agrave; la page 180.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 169
Profilage des applications Flex
Vue
Description
Suivi des allocations
Affiche des statistiques li&eacute;es aux m&eacute;thodes lors de la comparaison de deux instantan&eacute;s
de m&eacute;moire.
Vous pouvez afficher la vue Suivi des allocations en s&eacute;lectionnant deux instantan&eacute;s de
m&eacute;moire et en cliquant sur le bouton Afficher le suivi des allocations.
Pour plus d’informations, voir &laquo; Utilisation de la vue Suivi des allocations &raquo; &agrave; la page 173.
R&eacute;f&eacute;rences de l’objet
Affiche les objets et les objets qui les r&eacute;f&eacute;rencent.
Vous pouvez afficher la vue R&eacute;f&eacute;rences de l’objet en double-cliquant sur le nom d’une
classe dans la vue Instantan&eacute; de la m&eacute;moire ou Objets vagabonds.
Pour plus d’informations, voir &laquo; Utilisation de la vue R&eacute;f&eacute;rences de l’objet &raquo; &agrave; la
page 172.
Statistiques de l’objet
Affiche des informations concernant l’appelant et l’appel&eacute; du groupe d’objets
s&eacute;lectionn&eacute;.
Vous pouvez afficher la vue Statistiques de l’objet en double-cliquant sur une entr&eacute;e de
la vue Suivi des allocations.
Pour plus d’informations, voir &laquo; Utilisation de la vue Statistiques de l’objet &raquo; &agrave; la
page 175.
Profil de performance
Affiche les performances des m&eacute;thodes de l’application au cours d’une p&eacute;riode donn&eacute;e.
Cliquez ensuite sur le nom d’une m&eacute;thode dans la table pour ouvrir la vue Statistiques
de la m&eacute;thode, qui vous permet de d&eacute;tecter les goulets d’&eacute;tranglement des
performances.
Vous pouvez afficher la vue Profil de performance en double-cliquant sur l’un des
instantan&eacute;s des performances dans la vue Profiler.
Pour plus d’informations, voir &laquo; Utilisation de la vue Profil de performance &raquo; &agrave; la
page 176.
Statistiques de la
m&eacute;thode
Affiche des statistiques concernant les performances du groupe de m&eacute;thodes
s&eacute;lectionn&eacute;.
Vous pouvez afficher la vue Statistiques de la m&eacute;thode en double-cliquant sur une ligne
de la vue Profil de performance ou en y s&eacute;lectionnant une m&eacute;thode et en cliquant sur le
bouton Ouvrir les statistiques de la m&eacute;thode.
Pour plus d’informations, voir &laquo; Identification des caract&eacute;ristiques des performances des
m&eacute;thodes &raquo; &agrave; la page 178.
Utilisation de la m&eacute;moire Affiche sous forme de graphique les pics d’utilisation de la m&eacute;moire et l’utilisation
actuelle de la m&eacute;moire dans le temps.
Pour plus d’informations, voir &laquo; Utilisation du graphique Utilisation de la m&eacute;moire &raquo; &agrave; la
page 181.
Affichage des informations dans la vue Objets actifs
La vue Objets actifs affiche des informations concernant les classes utilis&eacute;es par l’application en cours. Cette vue
montre les classes qui sont instanci&eacute;es, le nombre cr&eacute;&eacute;, combien se trouvent dans la m&eacute;moire et la quantit&eacute; de m&eacute;moire
que les objets actifs occupent.
Le profileur met &agrave; jour en continu les donn&eacute;es dans la vue Objets actifs &agrave; mesure que vous profilez l’application. Vous
n’avez pas besoin d’actualiser la vue ou de garder le focus dessus pour mettre &agrave; jour les donn&eacute;es.
Pour pouvoir utiliser la vue Objets actifs, vous devez activer le profilage de la m&eacute;moire au d&eacute;marrage du profileur. C’est
la valeur par d&eacute;faut. Si vous fermez la vue Objets actifs et que vous voulez la rouvrir, d&eacute;ployez la liste d&eacute;roulante dans
la vue Profiler et s&eacute;lectionnez Surveiller les objets actifs.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 170
Profilage des applications Flex
L’exemple suivant illustre la vue Objets actifs.
Le tableau suivant r&eacute;pertorie les colonnes de la vue Objets actifs.
Colonne
Description
Classe
Classes poss&eacute;dant des occurrences dans l’application en cours d’ex&eacute;cution.
Package
Package dans lequel se trouve chaque classe. Si la classe n’est pas dans un package, la
valeur de ce champ est le nom du fichier dans lequel se trouve la classe. Le nombre
suivant le signe du dollar est un identifiant unique de cette classe.
Si le champ Package est vide, la classe se trouve dans le package global ou le package
non nomm&eacute;.
Occurrences cumul&eacute;es
Nombre total d’occurrences de chaque classe cr&eacute;&eacute;es depuis le d&eacute;marrage de
l’application.
Occurrences
Nombre d’occurrences de chaque classe actuellement dans la m&eacute;moire. Cette valeur est
toujours inf&eacute;rieure ou &eacute;gale &agrave; la valeur contenue dans la colonne Occurrences
cumul&eacute;es.
M&eacute;moire cumul&eacute;e
Quantit&eacute; totale de m&eacute;moire, exprim&eacute;e en octets, que toutes les occurrences de chaque
classe ont utilis&eacute;e, y compris les classes n’&eacute;tant plus dans la m&eacute;moire.
M&eacute;moire
Quantit&eacute; totale de m&eacute;moire, exprim&eacute;e en octets, que toutes les occurrences de chaque
classe ont utilis&eacute;e, y compris les classes n’&eacute;tant plus dans la m&eacute;moire. Cette valeur est
toujours inf&eacute;rieure ou &eacute;gale &agrave; la valeur contenue dans la colonne M&eacute;moire cumul&eacute;e.
Vous utilisez g&eacute;n&eacute;ralement les donn&eacute;es contenues dans la vue Objets actifs pour voir la quantit&eacute; de m&eacute;moire utilis&eacute;e
par les objets. A mesure que les objets sont nettoy&eacute;s de la m&eacute;moire, l’utilisation du nombre d’occurrences et de la
m&eacute;moire diminue, mais l’utilisation des occurrences cumul&eacute;es et de la m&eacute;moire cumul&eacute;e augmente. Cette vue indique
&eacute;galement la fa&ccedil;on dont la m&eacute;moire est utilis&eacute;e lors de l’ex&eacute;cution de l’application.
Pour plus d’informations sur l’ex&eacute;cution et l’analyse des r&eacute;sultats du nettoyage de la m&eacute;moire, voir &laquo; A propos de la
r&eacute;cup&eacute;ration de place &raquo; &agrave; la page 182.
Vous pouvez limiter les donn&eacute;es affich&eacute;es dans la vue Objets actifs gr&acirc;ce aux filtres du profileur. Pour plus
d’informations, voir &laquo; A propos des filtres du profileur &raquo; &agrave; la page 186.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 171
Profilage des applications Flex
Utilisation de la vue Instantan&eacute; de la m&eacute;moire
La vue Instantan&eacute; de la m&eacute;moire propose des informations concernant l’utilisation des objets et de la m&eacute;moire de
l’application &agrave; un moment donn&eacute;. A la diff&eacute;rence de la vue Objets actifs, les donn&eacute;es de la vue Instantan&eacute; de la m&eacute;moire
ne sont pas mises &agrave; jour en continu.
Pour pouvoir utiliser la vue Instantan&eacute; de la m&eacute;moire, vous devez activer le profilage de la m&eacute;moire au d&eacute;marrage du
profileur. C’est la valeur par d&eacute;faut.
Cr&eacute;ation et affichage d’un instantan&eacute; de la m&eacute;moire
1 D&eacute;marrez une session de profilage.
2 Interagissez avec votre application jusqu’&agrave; atteindre un point dans l’&eacute;tat de l’application o&ugrave; vous voulez prendre un
instantan&eacute; de la m&eacute;moire.
3 S&eacute;lectionnez l’application dans la vue Profiler.
4 Cliquez sur le bouton Prendre un instantan&eacute; de la m&eacute;moire.
Le profileur cr&eacute;e un instantan&eacute; de la m&eacute;moire et y appose un cachet de date. Il d&eacute;clenche &eacute;galement implicitement
la r&eacute;cup&eacute;ration de place avant l’enregistrement de l’instantan&eacute; de m&eacute;moire.
5 Pour afficher les donn&eacute;es dans l’instantan&eacute; de m&eacute;moire, double-cliquez sur l’instantan&eacute; de m&eacute;moire dans la vue
Profiler.
L’exemple suivant illustre la vue Instantan&eacute; de la m&eacute;moire.
Le tableau suivant r&eacute;pertorie les colonnes de la vue Instantan&eacute; de la m&eacute;moire.
Colonne
Description
Classe
Classes qui avaient des occurrences dans la m&eacute;moire au moment o&ugrave; vous avez
enregistr&eacute; l’instantan&eacute; de la m&eacute;moire.
Package
Package dans lequel se trouve chaque classe. Si la classe n’est pas dans un package, la
valeur de ce champ est le nom du fichier dans lequel se trouve la classe. Le nombre
suivant le signe du dollar est un identifiant unique de cette classe.
Si le champ Package est vide, la classe se trouve dans le package global ou le package
non nomm&eacute;.
Occurrences
Nombre d’occurrences de chaque classe dans la m&eacute;moire au moment o&ugrave; vous avez
enregistr&eacute; l’instantan&eacute; de la m&eacute;moire.
M&eacute;moire
Quantit&eacute; de m&eacute;moire, exprim&eacute;e en octets, que toutes les occurrences de chaque classe
utilisaient au moment de la prise de l’instantan&eacute; de m&eacute;moire.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 172
Profilage des applications Flex
L’instantan&eacute; de m&eacute;moire est g&eacute;n&eacute;ralement utilis&eacute; comme point de d&eacute;part pour d&eacute;terminer sur quelles classes vous
devez vous concentrer pour optimiser la m&eacute;moire ou trouver des fuites de m&eacute;moire. Pour ce faire, cr&eacute;ez plusieurs
instantan&eacute;s de m&eacute;moire &agrave; diff&eacute;rents moments, puis comparez les diff&eacute;rences dans les vues Objets vagabonds ou Suivi
des allocations.
Vous pouvez enregistrer des instantan&eacute;s de la m&eacute;moire pour comparer l’&eacute;tat d’une application au cours d’une session
de profilage diff&eacute;rente. Pour plus d’informations, voir &laquo; Enregistrement et chargement des donn&eacute;es de profilage &raquo; &agrave; la
page 166.
Lorsque vous double-cliquez sur une ligne de la vue Instantan&eacute; de la m&eacute;moire, le profileur affiche la vue R&eacute;f&eacute;rences de
l’objet. Cette vue affiche les traces de pile correspondant aux occurrences de la classe en cours. Vous pouvez consulter
les traces de pile pour les occurrences de la classe en cours dans la vue R&eacute;f&eacute;rences de l’objet. Pour plus d’informations
sur la vue R&eacute;f&eacute;rences de l’objet, voir &laquo; Utilisation de la vue R&eacute;f&eacute;rences de l’objet &raquo; &agrave; la page 172.
Vous pouvez &eacute;galement sp&eacute;cifier quelles donn&eacute;es afficher dans la vue Instantan&eacute; de la m&eacute;moire gr&acirc;ce aux filtres du
profileur. Pour plus d’informations, voir &laquo; A propos des filtres du profileur &raquo; &agrave; la page 186.
Utilisation de la vue R&eacute;f&eacute;rences de l’objet
La vue R&eacute;f&eacute;rences de l’objet affiche les traces de pile pour les classes qui ont &eacute;t&eacute; instanci&eacute;es dans l’application.
Pour ouvrir la vue R&eacute;f&eacute;rences de l’objet, double-cliquez sur le nom d’une classe dans les vues Instantan&eacute; de la m&eacute;moire
ou Objets vagabonds. La vue R&eacute;f&eacute;rences de l’objet propose des informations concernant les occurrences de la classe
s&eacute;lectionn&eacute;e.
La vue R&eacute;f&eacute;rences de l’objet affiche les donn&eacute;es dans deux tables : Occurrences et Suivi des allocations.
La table Occurrences r&eacute;pertorie tous les objets contenant des r&eacute;f&eacute;rences &agrave; l’objet actuel. Le nombre entre parenth&egrave;ses
apr&egrave;s le nom de la classe est le nombre total de r&eacute;f&eacute;rences &agrave; l’objet en cours. Vous ne pouvez pas voir le nombre de
r&eacute;f&eacute;rences futures d’un objet. Si aucun objet ne contient de r&eacute;f&eacute;rences &agrave; l’objet sp&eacute;cifi&eacute;, aucun objet n’est r&eacute;pertori&eacute;
dans cette table. Cela ne devrait pas se produire, car l’objet en question doit &ecirc;tre nettoy&eacute; de la m&eacute;moire s’il ne poss&egrave;de
aucune r&eacute;f&eacute;rence.
L’exemple suivant illustre la table Occurrences de la vue R&eacute;f&eacute;rences de l’objet.
Le tableau suivant r&eacute;pertorie les colonnes de la table Occurrences.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 173
Profilage des applications Flex
Colonne
Description
Occurrence
Classe de l’objet contenant une r&eacute;f&eacute;rence &agrave; l’objet sp&eacute;cifi&eacute;. D&eacute;veloppez l’occurrence
d’une classe pour afficher les chemins menant &agrave; l’objet. Le nombre de chemins peut &ecirc;tre
configur&eacute; en acc&eacute;dant &agrave; l’option Filtres de la vue Instantan&eacute; de la m&eacute;moire.
Propri&eacute;t&eacute;
Propri&eacute;t&eacute; de l’objet contenant une r&eacute;f&eacute;rence &agrave; l’objet sp&eacute;cifi&eacute;. Par exemple, si vous avez
un objet o avec une propri&eacute;t&eacute; i et si vous attribuez cette propri&eacute;t&eacute; pour qu’elle pointe
sur l’&eacute;tiquette du bouton :
o.i = myButton.label;
Une r&eacute;f&eacute;rence est cr&eacute;&eacute;e &agrave; l’&eacute;tiquette monBouton.label &agrave; partir de la propri&eacute;t&eacute; i.
ID
Identifiant de r&eacute;f&eacute;rence de l’objet contenant la r&eacute;f&eacute;rence &agrave; l’objet s&eacute;lectionn&eacute;.
Racine de la RP
Indique si un objet poss&egrave;de une r&eacute;f&eacute;rence arri&egrave;re &agrave; la racine de la RP (r&eacute;cup&eacute;ration de
place). D&eacute;veloppez un chemin menant &agrave; une occurrence d’un objet pour voir s’il existe
une r&eacute;f&eacute;rence arri&egrave;re &agrave; la racine de la RP.
La table Suivi des allocations affiche la trace de la pile de l’occurrence s&eacute;lectionn&eacute;e dans la table Occurrences. Lorsque
vous s&eacute;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&eacute;f&eacute;rences de l’objet.
Le tableau suivant r&eacute;pertorie les colonnes de la table Suivi des allocations.
Colonne
Description
M&eacute;thode
La m&eacute;thode de niveau sup&eacute;rieur de cette table est celle qui a cr&eacute;&eacute; l’occurrence de la
classe r&eacute;pertori&eacute;e dans la table Occurrences.
Vous pouvez d&eacute;velopper la m&eacute;thode pour en afficher la trace de pile. Cela peut vous
aider &agrave; d&eacute;terminer l’endroit o&ugrave; la pile d’appels a commenc&eacute;.
Emplacement
Fichier dans lequel la m&eacute;thode est d&eacute;finie.
Ligne
Num&eacute;ro de la ligne dans le fichier.
Vous pouvez afficher des donn&eacute;es dans cette table uniquement si vous activez le suivi d’allocations au d&eacute;marrage du
profileur.
Vous pouvez ouvrir le code source de la classe s&eacute;lectionn&eacute;e en double-cliquant sur une classe dans cette table.
Utilisation de la vue Suivi des allocations
La vue Suivi des allocations indique les m&eacute;thodes qui ont &eacute;t&eacute; appel&eacute;es entre deux instantan&eacute;s de m&eacute;moire et la quantit&eacute;
de m&eacute;moire consomm&eacute;e lors de ces appels de m&eacute;thode. Pour ouvrir la vue Suivi des allocations, s&eacute;lectionnez deux
instantan&eacute;s de m&eacute;moire puis cliquez sur le bouton Afficher le suivi des allocations. Pour plus d’informations sur
l’enregistrement d’un instantan&eacute; de la m&eacute;moire, voir &laquo; Utilisation de la vue Instantan&eacute; de la m&eacute;moire &raquo; &agrave; la page 171.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 174
Profilage des applications Flex
Le r&eacute;sultat de la comparaison des instantan&eacute;s de la m&eacute;moire est une liste de m&eacute;thodes que Flash Player a ex&eacute;cut&eacute;es
entre les deux instantan&eacute;s de m&eacute;moire. Pour chacune de ces m&eacute;thodes, le profileur indique le nombre d’objets cr&eacute;&eacute;s
dans cette m&eacute;thode.
Ces informations peuvent vous aider &agrave; optimiser les performances. Une fois que vous avez identifi&eacute; des m&eacute;thodes qui
cr&eacute;ent un nombre excessif d’objets, vous pouvez optimiser ces zones &agrave; probl&egrave;me.
Pour pouvoir utiliser la vue Suivi des allocations, vous devez activer le suivi des allocations au d&eacute;marrage du profileur.
Cette option est d&eacute;sactiv&eacute;e par d&eacute;faut.
L’exemple suivant illustre la vue Suivi des allocations.
Le tableau suivant r&eacute;pertorie les colonnes de la vue Suivi des allocations.
Colonne
Description
M&eacute;thode
M&eacute;thode appel&eacute;e pendant l’intervalle de l’instantan&eacute;. Cette colonne contient aussi la
classe dont l’occurrence a appel&eacute; cette m&eacute;thode.
Package
Package dans lequel se trouve chaque classe. Si la classe n’est pas dans un package, la
valeur de ce champ est le nom du fichier dans lequel se trouve la classe. Le nombre
suivant le signe du dollar est un identifiant unique de cette classe.
Si le champ Package est vide, la classe se trouve dans le package global ou le package
non nomm&eacute;.
Occurrences cumul&eacute;es
Nombre d’objets instanci&eacute;s dans cette m&eacute;thode et toutes les m&eacute;thodes appel&eacute;es &agrave;
partir de cette m&eacute;thode.
Occurrences propres
Nombre d’objets instanci&eacute;s dans cette m&eacute;thode, &agrave; l’exception des objets instanci&eacute;s
dans des appels de m&eacute;thode suivants &agrave; partir de cette m&eacute;thode.
M&eacute;moire cumul&eacute;e
Quantit&eacute; de m&eacute;moire, exprim&eacute;e en octets, utilis&eacute;e par les objets instanci&eacute;s dans cette
m&eacute;thode et toutes les m&eacute;thodes appel&eacute;es &agrave; partir de cette m&eacute;thode.
M&eacute;moire propre
Quantit&eacute; de m&eacute;moire, exprim&eacute;e en octets, utilis&eacute;e par les objets instanci&eacute;s dans cette
m&eacute;thode, &agrave; l’exception de la m&eacute;moire utilis&eacute;e par les objets instanci&eacute;s dans des appels
de m&eacute;thode suivants &agrave; partir de cette m&eacute;thode.
Lors de l’enregistrement de m&eacute;thodes au cours d’intervalles d’&eacute;chantillonnage, le profileur consigne aussi les actions
internes de Flash Player. Ces actions apparaissent dans la liste de m&eacute;thodes entre crochets sous la forme [mouseEvent]
ou [newclass] ou avec des noms similaires. Pour plus d’informations sur les actions internes de Flash Player, voir
&laquo; Fonctionnement du profileur Flex &raquo; &agrave; la page 160.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 175
Profilage des applications Flex
Pour ouvrir la vue Statistiques de l’objet, double-cliquez sur une ligne de la table Suivi des allocations. Cette vue fournit
des informations concernant les objets cr&eacute;&eacute;s dans la m&eacute;thode que vous avez s&eacute;lectionn&eacute;e. Elle permet aussi de
consulter en d&eacute;tail les objets cr&eacute;&eacute;s dans des m&eacute;thodes appel&eacute;es &agrave; partir de cette m&eacute;thode. Pour plus d’informations,
voir &laquo; Utilisation de la vue Statistiques de l’objet &raquo; &agrave; la page 175.
Vous pouvez limiter les donn&eacute;es affich&eacute;es dans la vue Suivi des allocations gr&acirc;ce aux filtres du profileur. Pour plus
d’informations, voir &laquo; A propos des filtres du profileur &raquo; &agrave; la page 186.
Utilisation de la vue Statistiques de l’objet
La vue Statistiques de l’objet propose des statistiques concernant les performances du groupe d’objets s&eacute;lectionn&eacute;.
Cette vue permet d’identifier quelles m&eacute;thodes appellent un nombre disproportionn&eacute; d’autres m&eacute;thodes. Elle indique
&eacute;galement la quantit&eacute; de m&eacute;moire que les objets instanci&eacute;s dans ces appels de m&eacute;thode consomment. Vous pouvez
faire appel &agrave; la vue Statistiques de l’objet pour identifier d’&eacute;ventuelles fuites de m&eacute;moire et d’autres sources de
probl&egrave;mes de performances dans votre application.
Pour acc&eacute;der &agrave; la vue Statistiques de l’objet, s&eacute;lectionnez deux instantan&eacute;s de m&eacute;moire dans la vue Profiler et affichez
la comparaison dans la vue Suivi des allocations. Double-cliquez ensuite sur une ligne pour afficher les informations
dans la vue Statistiques de l’objet.
La vue comporte trois sections :
• Un r&eacute;capitulatif des statistiques de l’objet s&eacute;lectionn&eacute;, notamment le nombre d’occurrences et la quantit&eacute; de
m&eacute;moire utilis&eacute;e.
• La table Occurrences propres : liste d’objets instanci&eacute;s dans la m&eacute;thode s&eacute;lectionn&eacute;e dans la vue Suivi des
allocations. Elle ne r&eacute;pertorie pas les objets instanci&eacute;s dans les appels de m&eacute;thode suivants &agrave; partir de cette m&eacute;thode.
Le nombre d’objets dans cette liste correspond au nombre d’objets sp&eacute;cifi&eacute; dans la colonne Occurrences propres de
la vue Suivi des allocations.
• La table Occurrences de l’appel&eacute; : liste d’objets instanci&eacute;s dans les m&eacute;thodes appel&eacute;es par la m&eacute;thode s&eacute;lectionn&eacute;e
dans la vue Suivi des allocations. Elle ne comprend pas les objets instanci&eacute;s dans la m&eacute;thode m&ecirc;me. Le nombre
d’objets dans cette liste correspond au nombre d’objets sp&eacute;cifi&eacute; dans la colonne Occurrences cumul&eacute;es de la vue
Suivi des allocations.
L’exemple suivant illustre le r&eacute;capitulatif de m&eacute;thodes et les tables Occurrences propres et Occurrences de l’appel&eacute; de
la vue Statistiques de l’objet.
Le tableau suivant r&eacute;pertorie les champs de la table Occurrences propres de la vue Statistiques de l’objet.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 176
Profilage des applications Flex
Colonne
Description
Classe
Classes qui ont &eacute;t&eacute; instanci&eacute;es uniquement dans la m&eacute;thode s&eacute;lectionn&eacute;e, &agrave; l’exception
des classes instanci&eacute;es dans des appels suivants &agrave; partir de cette m&eacute;thode.
Package
Package dans lequel se trouve chaque classe. Si la classe n’est pas dans un package, la
valeur de ce champ est le nom du fichier dans lequel se trouve la classe. Le nombre
suivant le signe du dollar est un identifiant unique de cette classe.
Si le champ Package est vide, la classe se trouve dans le package global ou le package
non nomm&eacute;.
Occurrences propres
Nombre d’occurrences de cette classe cr&eacute;&eacute;es uniquement dans la m&eacute;thode
s&eacute;lectionn&eacute;e, &agrave; l’exception des occurrences cr&eacute;&eacute;es dans des appels suivants &agrave; partir de
cette m&eacute;thode.
M&eacute;moire propre
Quantit&eacute; de m&eacute;moire, exprim&eacute;e en octets, utilis&eacute;e par les occurrences cr&eacute;&eacute;es
uniquement dans la m&eacute;thode s&eacute;lectionn&eacute;e, &agrave; l’exception de la m&eacute;moire utilis&eacute;e par les
occurrences cr&eacute;&eacute;es dans des appels suivants &agrave; partir de cette m&eacute;thode.
L’exemple suivant illustre la table Occurrences de l’appel&eacute; de la vue Statistiques de l’objet.
Le tableau suivant r&eacute;pertorie les champs de la table Occurrences de l’appel&eacute; de la vue Statistiques de l’objet.
Colonne
Description
Classe
Classes qui ont &eacute;t&eacute; instanci&eacute;es dans la m&eacute;thode s&eacute;lectionn&eacute;e, y compris les classes
instanci&eacute;es dans des appels suivants &agrave; partir de cette m&eacute;thode.
Package
Package dans lequel se trouve chaque classe. Si la classe n’est pas dans un package, la
valeur de ce champ est le nom du fichier dans lequel se trouve la classe. Le nombre
suivant le signe du dollar est un identifiant unique de cette classe.
Si le champ Package est vide, la classe se trouve dans le package global ou le package
non nomm&eacute;.
Occurrences cumul&eacute;es
Nombre d’occurrences de cette classe cr&eacute;&eacute;es dans la m&eacute;thode s&eacute;lectionn&eacute;e et dans des
appels suivants &agrave; partir de cette m&eacute;thode.
M&eacute;moire cumul&eacute;e
Quantit&eacute; de m&eacute;moire, exprim&eacute;e en octets, utilis&eacute;e par les occurrences cr&eacute;&eacute;es dans la
m&eacute;thode s&eacute;lectionn&eacute;e et dans des appels suivants &agrave; partir de cette m&eacute;thode.
Utilisation de la vue Profil de performance
La vue Profil de performance est la principale vue &agrave; utiliser lors du profilage des performances. Elle propose des
statistiques telles que le nombre d’appels, la dur&eacute;e propre et la dur&eacute;e cumul&eacute;e pour les m&eacute;thodes appel&eacute;es au cours d’un
intervalle d’&eacute;chantillonnage particulier. Ces donn&eacute;es permettent d’identifier les goulets d’&eacute;tranglement des
performances.
Le processus de profilage des performances conserve une liste des m&eacute;thodes et des informations concernant ces
m&eacute;thodes qui ont &eacute;t&eacute; appel&eacute;es entre le moment o&ugrave; vous supprimez les donn&eacute;es de performances et le moment o&ugrave; vous
capturez les nouvelles donn&eacute;es. Cet &eacute;cart de temps est d&eacute;sign&eacute; par le terme de p&eacute;riode d’interaction.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 177
Profilage des applications Flex
Pour pouvoir utiliser la vue Profil de performance, vous devez activer le profilage des performances au d&eacute;marrage du
profileur. C’est la valeur par d&eacute;faut.
G&eacute;n&eacute;ration d’un profil de performance
1 Activez le profilage des performances et d&eacute;marrez une session de profilage.
2 Interagissez avec l’application jusqu’&agrave; atteindre le point o&ugrave; vous voulez commencer le profilage.
3 Cliquez sur le bouton R&eacute;initialiser les donn&eacute;es de performance.
4 Interagissez avec l’application et effectuez les actions &agrave; profiler.
5 Cliquez sur le bouton Capturer le profil de performance.
L’&eacute;cart de temps entre le moment o&ugrave; vous cliquez sur R&eacute;initialiser les donn&eacute;es de performance et le moment o&ugrave;
vous cliquez sur Capturer le profil de performance est la p&eacute;riode d’interaction. Si vous ne cliquez pas sur
R&eacute;initialiser les donn&eacute;es de performance, le profil de performance contiendra toutes les donn&eacute;es captur&eacute;es depuis
le premier d&eacute;marrage de l’application.
6 Double-cliquez sur le profil de performance dans la vue Profiler.
L’exemple suivant illustre la vue Profil de performance.
Le tableau suivant r&eacute;pertorie les colonnes de la vue Profil de performance.
Colonne
Description
M&eacute;thode
Nom de la m&eacute;thode et classe &agrave; laquelle appartient la m&eacute;thode.
Les actions internes ex&eacute;cut&eacute;es par Flash Player s’affichent sous la forme d’entr&eacute;es entre
crochets : par exemple, [mark] et [sweep]. Vous ne pouvez pas changer le
comportement de ces actions internes, mais vous pouvez utiliser les informations les
concernant pour aider au profilage et &agrave; l’optimisation. Pour plus d’informations sur ces
actions, voir &laquo; Fonctionnement du profileur Flex &raquo; &agrave; la page 160.
Package
Package dans lequel se trouve la classe. Si la classe n’est pas dans un package, la valeur
de ce champ est le nom du fichier dans lequel se trouve la classe. Le nombre suivant le
signe du dollar est un identifiant unique de cette classe.
Si le champ Package est vide, la classe se trouve dans le package global ou le package
non nomm&eacute;.
Appels
Nombre de fois o&ugrave; la m&eacute;thode a &eacute;t&eacute; appel&eacute;e au cours de la p&eacute;riode d’interaction. Si une
m&eacute;thode est appel&eacute;e un nombre disproportionn&eacute; de fois par rapport aux autres
m&eacute;thodes, vous pouvez tenter d’optimiser cette m&eacute;thode en vue de r&eacute;duire le temps
d’ex&eacute;cution.
Dur&eacute;e cumul&eacute;e
Laps de temps total, exprim&eacute; en millisecondes, qu’ont mis &agrave; s’ex&eacute;cuter tous les appels &agrave;
cette m&eacute;thode, et tous les appels &agrave; des m&eacute;thodes suivantes, au cours de la p&eacute;riode
d’interaction.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 178
Profilage des applications Flex
Colonne
Description
Dur&eacute;e propre
Laps de temps, exprim&eacute; en millisecondes, qu’ont mis &agrave; s’ex&eacute;cuter tous les appels &agrave; cette
m&eacute;thode au cours de la p&eacute;riode d’interaction.
Dur&eacute;e cumul&eacute;e moyenne Laps de temps moyen, exprim&eacute; en millisecondes, qu’ont mis &agrave; s’ex&eacute;cuter tous les appels
&agrave; cette m&eacute;thode, et tous les appels &agrave; des m&eacute;thodes suivantes, au cours de la p&eacute;riode
d’interaction.
Dur&eacute;e propre moyenne
Laps de temps moyen, exprim&eacute; en millisecondes, qu’a mis &agrave; s’ex&eacute;cuter cette m&eacute;thode
au cours de la p&eacute;riode d’interaction.
Si vous double-cliquez sur une m&eacute;thode dans la vue Profil de performance, Flex affiche des informations concernant
cette m&eacute;thode dans la vue Statistiques de la m&eacute;thode. Cela vous permet de consulter le d&eacute;tail de la pile d’appels d’une
m&eacute;thode donn&eacute;e. Pour plus d’informations, voir &laquo; Identification des caract&eacute;ristiques des performances des m&eacute;thodes &raquo;
&agrave; la page 178.
Vous pouvez limiter les donn&eacute;es affich&eacute;es dans la vue Profil de performance gr&acirc;ce aux filtres du profileur. Pour plus
d’informations, voir &laquo; A propos des filtres du profileur &raquo; &agrave; la page 186.
Vous pouvez enregistrer les profils de performances pour une utilisation ult&eacute;rieure. Pour plus d’informations, voir
&laquo; Enregistrement et chargement des donn&eacute;es de profilage &raquo; &agrave; la page 166.
Identification des caract&eacute;ristiques des performances des m&eacute;thodes
La vue Statistiques de la m&eacute;thode pr&eacute;sente les caract&eacute;ristiques des performances de la m&eacute;thode s&eacute;lectionn&eacute;e. Vous
pouvez faire appel &agrave; la vue Statistiques de la m&eacute;thode pour identifier des goulets d’&eacute;tranglement dans l’application. En
affichant, par exemple, les temps d’ex&eacute;cution d’une m&eacute;thode, vous pouvez voir les m&eacute;thodes qui prennent un temps
disproportionn&eacute; pour s’ex&eacute;cuter. Vous pouvez ensuite optimiser de mani&egrave;re s&eacute;lective ces m&eacute;thodes.
Pour plus d’informations, voir &laquo; Utilisation de la vue Profil de performance &raquo; &agrave; la page 176.
Affichage des informations concernant les m&eacute;thodes dans la vue Statistiques de la m&eacute;thode
1 Double-cliquez sur une ligne dans la vue Profil de performance ou s&eacute;lectionnez une m&eacute;thode dans cette m&ecirc;me vue.
2 Cliquez sur le bouton Ouvrir les statistiques de la m&eacute;thode.
La vue comporte trois sections :
• Un r&eacute;capitulatif des performances de la m&eacute;thode s&eacute;lectionn&eacute;e, notamment le nombre d’appels, la dur&eacute;e cumul&eacute;e et
la dur&eacute;e propre.
• La table Appelants : informations concernant les m&eacute;thodes qui ont appel&eacute; la m&eacute;thode s&eacute;lectionn&eacute;e. Dans certains
cas, il est important de savoir si la m&eacute;thode s&eacute;lectionn&eacute;e est trop appel&eacute;e, la fa&ccedil;on dont elle est utilis&eacute;e et si elle est
utilis&eacute;e correctement.
• La table Appel&eacute;s : informations concernant les m&eacute;thodes appel&eacute;es par la m&eacute;thode s&eacute;lectionn&eacute;e.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 179
Profilage des applications Flex
L’exemple suivant illustre le r&eacute;capitulatif de m&eacute;thodes et les tables Appelants et Appel&eacute;s de la vue Statistiques de la
m&eacute;thode.
Le tableau suivant r&eacute;pertorie les champs de la table Appelants de la vue Statistiques de la m&eacute;thode.
Colonne
Description
M&eacute;thode
M&eacute;thodes qui ont appel&eacute; la m&eacute;thode apparaissant dans le r&eacute;capitulatif de la partie
sup&eacute;rieure de cette vue. Si cette liste est vide, la m&eacute;thode cible n’a &eacute;t&eacute; appel&eacute;e par
aucune m&eacute;thode qui n’est pas filtr&eacute;e.
Package
Package dans lequel se trouve chaque classe. Si la classe n’est pas dans un package, la
valeur de ce champ est le nom du fichier dans lequel se trouve la classe. Le nombre
suivant le signe du dollar est un identifiant unique de cette classe.
Si le champ Package est vide, la classe se trouve dans le package global ou le package
non nomm&eacute;.
Dur&eacute;e cumul&eacute;e
Laps de temps, exprim&eacute; en millisecondes, qu’a mis &agrave; s’ex&eacute;cuter chaque m&eacute;thode
appelante, et toutes les m&eacute;thodes suivantes.
Dur&eacute;e propre
Laps de temps, exprim&eacute; en millisecondes, qu’a mis &agrave; s’ex&eacute;cuter, chaque m&eacute;thode
appelante, &agrave; l’exception des m&eacute;thodes appel&eacute;es par les m&eacute;thodes suivantes.
Le tableau suivant r&eacute;pertorie les champs de la table Appel&eacute;s de la vue Statistiques de la m&eacute;thode.
Colonne
Description
M&eacute;thode
M&eacute;thodes appel&eacute;es par la m&eacute;thode apparaissant dans le r&eacute;capitulatif de la partie
sup&eacute;rieure de cette vue. Si cette liste est vide, la m&eacute;thode cible n’a &eacute;t&eacute; appel&eacute;e par
aucune m&eacute;thode qui n’est pas filtr&eacute;e.
Package
Package dans lequel se trouve chaque classe. Si la classe n’est pas dans un package, la
valeur de ce champ est le nom du fichier dans lequel se trouve la classe. Le nombre
suivant le signe du dollar est un identifiant unique de cette classe.
Si le champ Package est vide, la classe se trouve dans le package global ou le package
non nomm&eacute;.
Dur&eacute;e cumul&eacute;e
Laps de temps (exprim&eacute; en millisecondes) qu’a mis &agrave; s’ex&eacute;cuter chaque m&eacute;thode
appel&eacute;e et toutes les m&eacute;thodes suivantes.
Dur&eacute;e propre
Laps de temps (exprim&eacute; en millisecondes) qu’a mis &agrave; s’ex&eacute;cuter chaque m&eacute;thode
appel&eacute;e, &agrave; l’exception des m&eacute;thodes appel&eacute;es par les m&eacute;thodes suivantes.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 180
Profilage des applications Flex
Vous pouvez parcourir la pile d’appels pour rechercher des goulets d’&eacute;tranglement des performances en cliquant sur
les m&eacute;thodes dans la table Appelants ou Appel&eacute;s. Si vous double-cliquez sur une m&eacute;thode dans ces tables, le profileur
affiche le r&eacute;capitulatif de cette m&eacute;thode dans la partie sup&eacute;rieure de la vue Statistiques de la m&eacute;thode puis affiche les
appelants et les appel&eacute;s pour la m&eacute;thode nouvellement s&eacute;lectionn&eacute;e dans les deux tables.
Remarque : la dur&eacute;e cumul&eacute;e moins la dur&eacute;e propre dans cette vue n’&eacute;quivaut pas toujours &agrave; la dur&eacute;e cumul&eacute;e des
appelants. La raison en est que si vous remontez &agrave; un appelant, la dur&eacute;e cumul&eacute;e correspond &agrave; la dur&eacute;e propre de cet
appelant plus toutes les cha&icirc;nes &agrave; partir desquelles la m&eacute;thode d’origine a &eacute;t&eacute; appel&eacute;e, mais pas les autres appel&eacute;s.
Vous pouvez aussi utiliser les boutons Pr&eacute;c&eacute;dent, Suivant et Valeur par d&eacute;faut du profileur pour parcourir la pile
d’appels.
Vous pouvez limiter les donn&eacute;es affich&eacute;es dans la vue Statistiques de la m&eacute;thode gr&acirc;ce aux filtres du profileur. Pour
plus d’informations, voir &laquo; A propos des filtres du profileur &raquo; &agrave; la page 186.
Utilisation de la vue Objets vagabonds
La vue Objets vagabonds pr&eacute;sente les diff&eacute;rences entre deux instantan&eacute;s de m&eacute;moire de l’application que vous profilez.
Les diff&eacute;rences que cette vue illustre sont le nombre d’occurrences d’objets dans la m&eacute;moire et la quantit&eacute; de m&eacute;moire
que ces objets utilisent. Ces donn&eacute;es sont utiles pour identifier les fuites de m&eacute;moire. Le laps de temps &eacute;coul&eacute; entre
deux instantan&eacute;s de la m&eacute;moire est l’intervalle d’instantan&eacute;s.
Pour ouvrir la vue Objets vagabonds, s&eacute;lectionnez deux instantan&eacute;s de m&eacute;moire et cliquez sur le bouton Objets
vagabonds. Pour plus d’informations sur l’enregistrement d’un instantan&eacute; de la m&eacute;moire, voir &laquo; Utilisation de la vue
Instantan&eacute; de la m&eacute;moire &raquo; &agrave; la page 171.
L’exemple suivant illustre la vue Objets vagabonds.
Le tableau suivant r&eacute;pertorie les colonnes de la vue Objets vagabonds.
Colonne
Description
Classe
Classes cr&eacute;&eacute;es mais pas d&eacute;truites pendant l’intervalle d’instantan&eacute;s.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 181
Profilage des applications Flex
Colonne
Description
Package
Package dans lequel se trouve chaque classe. Si la classe n’est pas dans un package, la
valeur de ce champ est le nom du fichier dans lequel se trouve la classe. Le nombre
suivant le signe du dollar est un identifiant unique de cette classe.
Si le champ Package est vide, l’objet se trouve dans le package global ou le package non
nomm&eacute;.
Occurrences
Nombre d’occurrences cr&eacute;&eacute;es pendant l’intervalle d’instantan&eacute;s. Diff&eacute;rence entre le
nombre d’occurrences de chaque classe dans le premier intervalle et dans le second
intervalle.
Par exemple, si le premier instantan&eacute; contient 22 567 cha&icirc;nes et le second
22 861 cha&icirc;nes, la valeur de ce champ est 294.
M&eacute;moire
Quantit&eacute; de m&eacute;moire allou&eacute;e pendant l’intervalle d’instantan&eacute;s. Diff&eacute;rence entre la
quantit&eacute; de m&eacute;moire que les occurrences de chaque classe ont utilis&eacute; lors de la prise du
premier instantan&eacute; et lors de la prise du second instantan&eacute;.
Par exemple, si la classe Strings occupe 2 031 053 octets dans le premier instantan&eacute; et
2 029 899 dans le second, la valeur de ce champ est 1 154 octets.
Pour plus d’informations sur l’identification de fuites de m&eacute;moire, voir &laquo; Localisation des fuites de m&eacute;moire &raquo; &agrave; la
page 182.
Utilisation du graphique Utilisation de la m&eacute;moire
Le graphique Utilisation de la m&eacute;moire pr&eacute;sente la m&eacute;moire utilis&eacute;e par l’application que vous profilez. Cette valeur
est diff&eacute;rente de l’utilisation de la m&eacute;moire de Flash Player et son navigateur. La raison en est que cette valeur ne
comprend pas l’utilisation de la m&eacute;moire de l’agent du profileur ou du navigateur. Elle correspond uniquement &agrave; la
somme des objets actifs de l’application profil&eacute;e. En cons&eacute;quence, si vous comparez la valeur de l’utilisation de la
m&eacute;moire dans ce graphique &agrave; la quantit&eacute; de m&eacute;moire que le navigateur utilise telle qu’indiqu&eacute;e, par exemple, dans le
Gestionnaire des t&acirc;ches de Windows, vous obtenez des r&eacute;sultats tr&egrave;s diff&eacute;rents.
L’image suivante illustre un graphique de la vue Utilisation de la m&eacute;moire.
La valeur de M&eacute;moire actuelle est &eacute;gale &agrave; la somme des totaux de la colonne M&eacute;moire de la vue Objets actifs, en
supposant que tous les filtres soient d&eacute;sactiv&eacute;s.
La valeur de M&eacute;moire maximale correspond &agrave; la quantit&eacute; la plus &eacute;lev&eacute;e de m&eacute;moire que cette application a utilis&eacute;e au
cours de la session de profilage en cours.
Le graphique Utilisation de la m&eacute;moire montre l’&eacute;tat de la m&eacute;moire de l’application au cours des 100 derni&egrave;res
secondes. Vous ne pouvez pas configurer ce nombre et vous ne pouvez pas enregistrer de donn&eacute;es historiques pour le
diagramme.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 182
Profilage des applications Flex
Si vous fermez le graphique Utilisation de la m&eacute;moire et que vous voulez le rouvrir, cliquez sur le bouton du menu
d&eacute;roulant dans la vue Profiler et s&eacute;lectionnez Utilisation de la m&eacute;moire.
A propos de la r&eacute;cup&eacute;ration de place
La r&eacute;cup&eacute;ration de place est l’action de supprimer de la m&eacute;moire des objets qui ne sont plus n&eacute;cessit&eacute;s. La m&eacute;moire
utilis&eacute;e par des occurrences n’ayant plus de r&eacute;f&eacute;rences &agrave; ces objets doit &ecirc;tre d&eacute;sallou&eacute;e pendant ce processus.
Flash Player nettoie la m&eacute;moire en fonction des besoins au cours du cycle de vie d’une application. Le d&eacute;r&eacute;f&eacute;rencement
d’un objet ne d&eacute;clenche pas le nettoyage de la m&eacute;moire. Ainsi, lorsque vous supprimez toutes les r&eacute;f&eacute;rences &agrave; un objet,
le nettoyage de la m&eacute;moire ne d&eacute;salloue pas n&eacute;cessairement la m&eacute;moire pour cet objet. Cet objet devient une cible
potentielle du nettoyage de la m&eacute;moire.
Le fait de cliquer sur le bouton Lancer la r&eacute;cup&eacute;ration de place ne garantit pas que tous les objets susceptibles d’&ecirc;tre
nettoy&eacute;s le soient. La r&eacute;cup&eacute;ration de place est g&eacute;n&eacute;ralement d&eacute;clench&eacute;e par l’allocation de m&eacute;moire &agrave; de nouvelles
ressources. En effet, lorsque de nouvelles ressources n&eacute;cessitent de la m&eacute;moire qui n’est pas disponible dans l’allocation
actuelle, la fonction de r&eacute;cup&eacute;ration de place s’ex&eacute;cute et lib&egrave;re de la m&eacute;moire signal&eacute;e pour la d&eacute;sallocation. Par
cons&eacute;quent, la suppression de toutes les r&eacute;f&eacute;rences &agrave; la m&eacute;moire ne signifie pas qu’elle sera nettoy&eacute;e imm&eacute;diatement,
mais bien qu’elle le sera probablement lors de la cr&eacute;ation et de l’utilisation d’autres occurrences. Si une application est
inactive, vous pouvez consulter l’allocation de sa m&eacute;moire. M&ecirc;me si certains objets sont marqu&eacute;s pour le nettoyage,
l’utilisation de la m&eacute;moire d’une application inactive ne change pas tant que vous ne commencez pas &agrave; interagir avec elle.
Flash Player alloue la m&eacute;moire en blocs de plusieurs octets, et non octet par octet. Si une partie d’un bloc est marqu&eacute;e
pour le nettoyage sans que d’autres parties le soient, le bloc n’est pas lib&eacute;r&eacute;. La r&eacute;cup&eacute;ration de place tente d’associer
les parties de la m&eacute;moire non utilis&eacute;es dans des blocs plus volumineux pouvant &ecirc;tre nettoy&eacute;s, mais cela ne se produit
pas syst&eacute;matiquement &agrave; chaque tentative de r&eacute;cup&eacute;ration.
La r&eacute;cup&eacute;ration de place se fait implicitement avant l’enregistrement d’instantan&eacute;s de la m&eacute;moire. En d’autres termes,
un clic sur le bouton Prendre un instantan&eacute; de la m&eacute;moire &eacute;quivaut &agrave; un clic sur le bouton Lancer la r&eacute;cup&eacute;ration de
place puis &agrave; un clic sur le bouton Prendre un instantan&eacute; de la m&eacute;moire.
Ex&eacute;cution de la r&eacute;cup&eacute;ration de place pendant le profilage d’une application
❖ S&eacute;lectionnez l’application dans la vue Profiler, puis cliquez sur le bouton Lancer la r&eacute;cup&eacute;ration de place.
Vous pouvez analyser l’efficacit&eacute; de ce processus en comparant deux instantan&eacute;s de m&eacute;moire, avant et apr&egrave;s le
nettoyage de la m&eacute;moire.
Identification des zones &agrave; probl&egrave;mes
Le profileur propose diff&eacute;rentes techniques d’identification des zones &agrave; probl&egrave;mes des applications.
Localisation des fuites de m&eacute;moire
L’un des probl&egrave;mes les plus courants auxquels les d&eacute;veloppeurs d’applications sont confront&eacute;s est celui des fuites de
m&eacute;moire. Celles-ci prennent souvent la forme d’objets qui ont &eacute;t&eacute; cr&eacute;&eacute;s dans un laps de temps donn&eacute; mais qui n’ont
pas &eacute;t&eacute; r&eacute;cup&eacute;r&eacute;s.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 183
Profilage des applications Flex
L’une des fa&ccedil;ons de les identifier consiste &agrave; observer le nombre de r&eacute;f&eacute;rences &agrave; un objet dans la table Occurrences de
la vue R&eacute;f&eacute;rences de l’objet. Vous pouvez g&eacute;n&eacute;ralement ignorer les r&eacute;f&eacute;rences provenant de propri&eacute;t&eacute;s et de liaisons
d’un document et rechercher des r&eacute;f&eacute;rences inattendues ou inhabituelles, plus particuli&egrave;rement des objets qui ne sont
pas des enfants de l’objet. Pour plus d’informations, voir &laquo; Utilisation de la vue R&eacute;f&eacute;rences de l’objet &raquo; &agrave; la page 172.
Vous pouvez &eacute;galement examiner les chemins menant aux occurrences d’un objet pour d&eacute;terminer si un chemin
poss&egrave;de une r&eacute;f&eacute;rence arri&egrave;re &agrave; la r&eacute;cup&eacute;ration de place (racine de la RP). Une occurrence dont la lib&eacute;ration &eacute;tait
attendue mais qui poss&egrave;de des r&eacute;f&eacute;rences &agrave; la racine de la RP indique une perte de m&eacute;moire. Dans ce cas, modifiez le
code de l’application de mani&egrave;re &agrave; supprimer toute r&eacute;f&eacute;rence &agrave; la racine de la RP. Une occurrence ne poss&eacute;dant plus
aucune r&eacute;f&eacute;rence &agrave; la racine de la RP est pr&ecirc;te &agrave; faire l’objet d’une r&eacute;cup&eacute;ration de place. Flash Player lib&egrave;re finalement
cette m&eacute;moire.
Une autre fa&ccedil;on de localiser les fuites de m&eacute;moire consiste &agrave; comparer deux instantan&eacute;s de m&eacute;moire dans la vue Objets
vagabonds, afin de d&eacute;terminer quels objets se trouvent toujours dans la m&eacute;moire apr&egrave;s une s&eacute;rie particuli&egrave;re
d’&eacute;v&eacute;nements. Ce processus est d&eacute;crit dans la pr&eacute;sente section.
Il est courant, pour nettoyer les liens de la m&eacute;moire, de faire appel aux m&eacute;thodes disconnect(), clearInterval()
et removeEventListener().
Recherche d’une r&eacute;f&eacute;rence arri&egrave;re &agrave; la racine de la RP pour une occurrence
1 Cr&eacute;ez un instantan&eacute; de la m&eacute;moire.
Voir &laquo; Cr&eacute;ation et affichage d’un instantan&eacute; de la m&eacute;moire &raquo; &agrave; la page 171.
2 Sp&eacute;cifiez le nombre de chemins de r&eacute;f&eacute;rence arri&egrave;re &agrave; rechercher.
Dans la vue Instantan&eacute; de la m&eacute;moire, indiquez le nombre maximal de chemins &agrave; rechercher ou s&eacute;lectionnez
Afficher tous les chemins de r&eacute;f&eacute;rences arri&egrave;re.
3 Double-cliquez sur une classe dans la vue Instantan&eacute; de la m&eacute;moire pour ouvrir la vue R&eacute;f&eacute;rences de l’objet.
4 D&eacute;veloppez les chemins r&eacute;pertori&eacute;s et regardez s’il existe une r&eacute;f&eacute;rence arri&egrave;re &agrave; la racine de la RP.
Rechercher les objets vagabonds
1 Cr&eacute;ez deux instantan&eacute;s de la m&eacute;moire.
Voir &laquo; Cr&eacute;ation et affichage d’un instantan&eacute; de la m&eacute;moire &raquo; &agrave; la page 171.
2 S&eacute;lectionnez les deux instantan&eacute;s de m&eacute;moire &agrave; comparer.
Remarque : si vous avez plus de deux instantan&eacute;s de la m&eacute;moire, vous ne pouvez pas en s&eacute;lectionner un troisi&egrave;me.
Vous pouvez seulement comparer deux instantan&eacute;s de m&eacute;moire en m&ecirc;me temps.
3 Cliquez sur le bouton Rechercher les objets vagabonds.
La vue Objets vagabonds mat&eacute;rialise d’&eacute;ventuelles fuites de m&eacute;moire. Les colonnes Occurrences et M&eacute;moire
indiquent les diff&eacute;rences entre le nombre d’occurrences d’une classe et la quantit&eacute; de m&eacute;moire consomm&eacute;e par ces
occurrences au cours de l’intervalle entre deux instantan&eacute;s. Si vous voyez une classe que vous ne vous attendiez pas
&agrave; voir cr&eacute;&eacute;e pendant ce laps de temps ou une classe que vous pensiez voir d&eacute;truite pendant ce laps de temps,
examinez l’application pour d&eacute;tecter si ces &eacute;l&eacute;ments peuvent &ecirc;tre &agrave; l’origine d’une fuite de m&eacute;moire.
4 Pour d&eacute;terminer la fa&ccedil;on dont un objet de la vue Rechercher les objets vagabonds a &eacute;t&eacute; instanci&eacute;, double-cliquez
sur l’objet dans la vue. La vue R&eacute;f&eacute;rences de l’objet pr&eacute;sente la trace de pile de chaque occurrence que vous avez
s&eacute;lectionn&eacute;e.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 184
Profilage des applications Flex
Un moyen d’identifier une fuite de m&eacute;moire consiste dans un premier temps &agrave; d&eacute;terminer un ensemble d’&eacute;tapes que
vous pouvez r&eacute;p&eacute;ter de nombreuses fois avec l’application, l&agrave; o&ugrave; l’utilisation de la m&eacute;moire ne cesse d’augmenter. Il
est important d’effectuer ces &eacute;tapes au moins une fois dans l’application avant de prendre le premier instantan&eacute; de la
m&eacute;moire, de mani&egrave;re que tous les objets mis en m&eacute;moire cache ou que toute autre occurrence soient inclus dans cet
instantan&eacute;.
R&eacute;p&eacute;tez ces &eacute;tapes un certain nombre de fois (3, 7 ou un autre nombre premier) dans l’application. Prenez un second
instantan&eacute; de m&eacute;moire pour le comparer &agrave; l’instantan&eacute; de d&eacute;part. Dans la vue Rechercher les objets vagabonds, vous
trouverez peut-&ecirc;tre des objets vagabonds dot&eacute;s d’occurrences au nombre de multiples de 3 ou de 7. Ces objets
pr&eacute;sentent probablement des fuites. Double-cliquez sur les classes pour consulter les traces de pile de chacune des
occurrences.
Un autre moyen consiste &agrave; r&eacute;p&eacute;ter la s&eacute;quence d’&eacute;tapes sur une longue p&eacute;riode et d’attendre que l’utilisation de la
m&eacute;moire atteigne son maximum. Si elle n’augmente pas apr&egrave;s cela, il n’y a aucune fuite de m&eacute;moire pour cet ensemble
d’&eacute;tapes.
Parmi d’autres causes, les &eacute;couteurs d’&eacute;v&eacute;nement en attente sont souvent &agrave; l’origine de fuites de m&eacute;moire. La m&eacute;thode
removeEventListener() permet de supprimer un &eacute;couteur d’&eacute;v&eacute;nement qui n’est plus utilis&eacute;. Pour plus
d’informations, voir Object creation and destruction dans Utilisation d’Adobe Flex 4.
Analyse des temps d’ex&eacute;cution
En analysant les temps d’ex&eacute;cution des m&eacute;thodes et la quantit&eacute; de m&eacute;moire allou&eacute;e pendant ces appels de m&eacute;thode,
vous pouvez d&eacute;terminer &agrave; quels niveaux les ralentissements des performances surviennent.
Cette op&eacute;ration est utile notamment pour identifier le temps d’ex&eacute;cution des m&eacute;thodes appel&eacute;es fr&eacute;quemment, plut&ocirc;t
que celui des m&eacute;thodes qui le sont rarement.
D&eacute;termination de la fr&eacute;quence des appels de m&eacute;thodes
1 D&eacute;marrez une session de profilage et veillez &agrave; activer le profilage des performances lors de la configuration du
profileur sur l’&eacute;cran de d&eacute;marrage.
2 S&eacute;lectionnez l’application dans la vue Profiler.
3 Interagissez avec l’application jusqu’&agrave; atteindre le point o&ugrave; vous voulez commencer &agrave; analyser le nombre d’appels
de m&eacute;thode. Pour voir le nombre de fois qu’une m&eacute;thode a &eacute;t&eacute; appel&eacute;e lors du d&eacute;marrage de l’application,
n’interagissez pas avec l’application.
4 Cliquez sur le bouton R&eacute;initialiser les donn&eacute;es de performance. Toutes les donn&eacute;es de performance sont alors
effac&eacute;es, de mani&egrave;re telle &agrave; ce que le profil de performance suivant n’inclue que les donn&eacute;es saisies &agrave; compter de la
r&eacute;initialisation.
5 Interagissez avec l’application jusqu’&agrave; atteindre le point o&ugrave; vous voulez v&eacute;rifier le nombre d’appels de m&eacute;thode
depuis la r&eacute;initialisation des donn&eacute;es.
6 Cliquez sur le bouton Capturer le profil de performance.
7 Double-cliquez sur le profil de performance dans la vue Profiler.
8 Dans la vue Profil de performance, triez les donn&eacute;es selon la colonne M&eacute;thode et localisez votre m&eacute;thode dans la
liste.
La valeur figurant dans la colonne Appels correspond au nombre de fois que cette m&eacute;thode a &eacute;t&eacute; appel&eacute;e au cours
de cet intervalle d’&eacute;chantillonnage. Il s’agit de l’&eacute;cart de temps qui s&eacute;pare le moment o&ugrave; vous avez cliqu&eacute; sur
R&eacute;initialiser les donn&eacute;es de performance et le moment o&ugrave; vous avez cliqu&eacute; sur Capturer le profil de performance.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 185
Profilage des applications Flex
Examinez les valeurs contenues dans les colonnes Dur&eacute;e cumul&eacute;e, Dur&eacute;e propre, Dur&eacute;e cumul&eacute;e moyenne et Dur&eacute;e
propre moyenne de la vue Profil de performance. Elles indiquent le temps d’ex&eacute;cution des m&eacute;thodes.
Comparez le temps mis par chaque m&eacute;thode pour s’ex&eacute;cuter au temps que mettent &agrave; s’ex&eacute;cuter toutes les m&eacute;thodes
appel&eacute;es par une m&eacute;thode particuli&egrave;re. En r&egrave;gle g&eacute;n&eacute;rale, si la dur&eacute;e propre ou la dur&eacute;e propre moyenne d’une
m&eacute;thode est &eacute;lev&eacute;e ou &eacute;lev&eacute;e par rapport &agrave; celle d’autres m&eacute;thodes, observez de plus pr&egrave;s la fa&ccedil;on dont la m&eacute;thode est
impl&eacute;ment&eacute;e et tentez de r&eacute;duire le temps d’ex&eacute;cution.
De la m&ecirc;me fa&ccedil;on, si la dur&eacute;e propre ou la dur&eacute;e propre moyenne d’une m&eacute;thode est faible, mais que la dur&eacute;e cumul&eacute;e
ou la dur&eacute;e cumul&eacute;e moyenne est &eacute;lev&eacute;, observez les m&eacute;thodes que cette m&eacute;thode appelle pour localiser les goulets
d’&eacute;tranglement.
Localisation d’une allocation excessive d’objets
Un moyen d’identifier les zones &agrave; probl&egrave;mes d’une application consiste &agrave; d&eacute;terminer &agrave; quels niveaux un nombre
excessif d’objets est cr&eacute;&eacute;. La cr&eacute;ation d’une occurrence d’un objet peut consommer un grand nombre de ressources,
plus particuli&egrave;rement si cet objet se trouve dans la liste d’affichage. L’ajout d’un objet &agrave; la liste d’affichage peut
engendrer un grand nombre d’appels des m&eacute;thodes de style et de pr&eacute;sentation, ce qui risque de ralentir l’application.
Dans certains cas, vous pouvez restructurer le code afin de r&eacute;duire le nombre d’objets cr&eacute;&eacute;s.
Une fois que vous avez d&eacute;termin&eacute; si la cr&eacute;ation de certains objets est superflue, vous pouvez d&eacute;cider s’il est raisonnable
ou utile de r&eacute;duire le nombre d’occurrences de cette classe. Vous pouvez par exemple d&eacute;terminer la taille des objets,
car les objets volumineux pr&eacute;sentent g&eacute;n&eacute;ralement le plus grand potentiel d’optimisation.
Pour savoir quels objets sont cr&eacute;&eacute;s en nombre important, vous pouvez comparer les instantan&eacute;s de m&eacute;moire de
l’application &agrave; deux moments.
Affichage du nombre d’occurrences d’une classe sp&eacute;cifique
1 D&eacute;marrez une session de profilage et veillez &agrave; activer le profilage de la m&eacute;moire lors de la configuration du profileur
sur l’&eacute;cran de d&eacute;marrage.
2 Interagissez avec l’application jusqu’&agrave; atteindre l’endroit dont vous souhaitez prendre un instantan&eacute; de la m&eacute;moire.
3 Cliquez sur le bouton Prendre un instantan&eacute; de la m&eacute;moire. Le profileur ajoute un nouvel instantan&eacute; de la m&eacute;moire
&agrave; la liste d’applications dans la vue Profiler.
4 Dans la vue Profiler, double-cliquez sur l’instantan&eacute; de la m&eacute;moire pour l’ouvrir.
5 Pour afficher le nombre d’occurrences d’une classe particuli&egrave;re, ainsi que la quantit&eacute; de m&eacute;moire que ces
occurrences utilisent, effectuez un tri selon la colonne Classe et localisez la classe dans cette colonne. Vous pouvez
aussi effectuer un tri selon les autres colonnes afin d’identifier rapidement les objets qui occupent le plus de
m&eacute;moire ou les objets comptant le plus grand nombre d’occurrences. Dans la plupart des cas, la classe Strings est
celle qui compte le plus d’occurrences et qui utilise le plus de m&eacute;moire.
Pour plus d’informations sur la vue Instantan&eacute; de la m&eacute;moire, voir &laquo; Utilisation de la vue Instantan&eacute; de la m&eacute;moire &raquo;
&agrave; la page 171.
Localisation d’occurrences d’allocation excessive d’objets
1 D&eacute;marrez une session de profilage et veillez &agrave; activer le profilage de la m&eacute;moire lors de la configuration du profileur
sur l’&eacute;cran de d&eacute;marrage.
2 Interagissez avec l’application jusqu’&agrave; atteindre le premier endroit dont vous souhaitez prendre un instantan&eacute; de la
m&eacute;moire.
3 Cliquez sur le bouton Prendre un instantan&eacute; de la m&eacute;moire.
Le profileur enregistre l’instantan&eacute; de la m&eacute;moire dans la vue Profiler en indiquant la date et l’heure.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 186
Profilage des applications Flex
4 Interagissez avec l’application jusqu’&agrave; atteindre le deuxi&egrave;me endroit dont vous souhaitez prendre un instantan&eacute; de
la m&eacute;moire.
5 Cliquez &agrave; nouveau sur le bouton Prendre un instantan&eacute; de la m&eacute;moire.
Le profileur enregistre le deuxi&egrave;me instantan&eacute; de la m&eacute;moire dans la vue Profiler en indiquant la date et l’heure.
6 S&eacute;lectionnez les deux instantan&eacute;s de m&eacute;moire &agrave; comparer.
Remarque : si vous avez plus de deux instantan&eacute;s de la m&eacute;moire, vous ne pouvez pas en s&eacute;lectionner un troisi&egrave;me.
Vous ne pouvez comparer que deux instantan&eacute;s de m&eacute;moire &agrave; la fois.
7 Cliquez sur le bouton Afficher le suivi des allocations.
La vue Suivi des allocations indique les m&eacute;thodes qui ont &eacute;t&eacute; appel&eacute;es entre les deux instantan&eacute;s et la quantit&eacute; de
m&eacute;moire consomm&eacute;e lors de ces appels de m&eacute;thode. Voir &laquo; Utilisation de la vue Suivi des allocations &raquo; &agrave; la
page 173.
A propos des filtres du profileur
La quantit&eacute; de donn&eacute;es contenue dans une vue du profileur peut quelquefois &ecirc;tre consid&eacute;rable et le niveau de d&eacute;tail
trop important. Les actions internes de Flash Player peuvent occulter les donn&eacute;es qui vous int&eacute;ressent v&eacute;ritablement,
telles que vos propres m&eacute;thodes et classes. En outre, Flash Player cr&eacute;e et d&eacute;truit de nombreux objets sans votre
intervention directe. Vous pouvez par cons&eacute;quent constater que des milliers de cha&icirc;nes ou de tableaux sont utilis&eacute;s
dans votre application.
Vous pouvez d&eacute;finir des filtres dans les vues suivantes :
• Objets actifs
• Instantan&eacute; de la m&eacute;moire
• Profil de performance
• Statistiques de la m&eacute;thode
• Suivi des allocations
Vous pouvez d&eacute;finir quels packages doivent figurer dans les vues du profileur gr&acirc;ce aux filtres. 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
correspondent aux motifs de sa liste de motifs. Si vous faites appel, par exemple, &agrave; des commandes de cr&eacute;ation de
graphiques, mais que vous ne voulez pas les profiler, vous pouvez ajouter le motif mx.charts.* au filtre d’exclusion.
Vous pouvez &eacute;galement exclure des &eacute;l&eacute;ments int&eacute;gr&eacute;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
packages qui correspondent aux motifs de sa liste de motifs. Si vous poss&eacute;dez, par exemple, un package personnalis&eacute;
nomm&eacute; com.mycompany.*, vous pouvez afficher des informations uniquement sur les classes contenues dans ce
package en l’ajoutant au filtre d’inclusion.
Les exclusions par d&eacute;faut sont les classes flash.*.*, spark.*.*, mx.*.*, ainsi que les classes d’infrastructure Flex dans le
package global ou non nomm&eacute;, ce qui comprend les classes globales String et Array. Cela signifie que les inclusions par
d&eacute;faut sont des classes personnalis&eacute;es se trouvant dans le package non nomm&eacute; et des classes personnalis&eacute;es dans des
packages hors infrastructure (telles que com.mycompany.MyClass).
Vous pouvez exclure les classes personnalis&eacute;es se trouvant dans le package non nomm&eacute; &agrave; partir des donn&eacute;es de
profilage. Pour ce faire, ajoutez &laquo; * &raquo; &agrave; la liste d’exclusion.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 187
Profilage des applications Flex
Nombre maximal de lignes visibles L’option Nombre maximal de lignes visibles d&eacute;finit le nombre de rang&eacute;es de
donn&eacute;es qui peuvent &ecirc;tre affich&eacute;es dans une vue. Augmentez cette valeur si les donn&eacute;es que vous recherchez ne
s’affichent pas dans la vue. R&eacute;duisez cette valeur pour am&eacute;liorer les performances du profileur. Utilisez d’autres filtres
pour v&eacute;rifier que vous affichez les donn&eacute;es qui vous int&eacute;ressent.
Nombre maximal de chemins de r&eacute;f&eacute;rences arri&egrave;re &agrave; rechercher L’option Nombre maximal de chemins de r&eacute;f&eacute;rences
arri&egrave;re &agrave; rechercher d&eacute;finit le nombre de chemins vers un objet r&eacute;f&eacute;renc&eacute; &agrave; afficher lorsque vous examinez les
r&eacute;f&eacute;rences d’un objet. Les chemins s’affichent selon le chemin le plus court. Par d&eacute;faut, les dix chemins les plus courts
s’affichent. Augmentez cette valeur pour afficher d’autres chemins ou s&eacute;lectionnez Afficher tous les chemins de
r&eacute;f&eacute;rences arri&egrave;re. L’affichage de chemins suppl&eacute;mentaires peut vous aider &agrave; trouver les objets qui ne sont plus
r&eacute;f&eacute;renc&eacute;s. Voir &laquo; Localisation des fuites de m&eacute;moire &raquo; &agrave; la page 182.
D&eacute;finition de pr&eacute;f&eacute;rences de filtres par d&eacute;faut
❖ Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez Flash Builder &gt; Profileur &gt; Filtres d’inclusion ou Filtres
d’exclusion.
Lors de l’affichage des donn&eacute;es du profileur, celui-ci applique d’abord les filtres d’exclusion, puis les filtres d’inclusion.
Supposons que vous d&eacute;finissiez le filtre d’exclusion sur mx.controls.*, mais que vous d&eacute;finissiez le filtre d’inclusion sur
mx.*.*. Le profileur n’affiche aucune information concernant les classes du package mx.controls, m&ecirc;me si leur motif
correspond &agrave; la liste de motifs d’inclusion, car ce package est exclu. Supposons &eacute;galement que vous d&eacute;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 &eacute;t&eacute; exclues avant l’inclusion du package.
Lorsque vous filtrez certains points de donn&eacute;es, les valeurs de pourcentage des colonnes sont ajust&eacute;es afin de refl&eacute;ter
uniquement le pourcentage de donn&eacute;es non filtr&eacute;es.
Le profileur conserve les filtres d’une session de profilage &agrave; l’autre pour la m&ecirc;me application.
Les param&egrave;tres de filtres ne sont pas h&eacute;rit&eacute;s par les vues secondaires. Par exemple, si vous appliquez un filtre aux
donn&eacute;es contenues dans la vue Instantan&eacute; de la m&eacute;moire, puis acc&eacute;dez &agrave; la vue R&eacute;f&eacute;rences de l’objet en double-cliquant
sur une m&eacute;thode, la vue R&eacute;f&eacute;rences de l’objet n’applique pas le m&ecirc;me filtre.
D&eacute;terminer si les donn&eacute;es sont filtr&eacute;es
1 Cliquez sur le bouton Filtres ou examinez le titre des tables de donn&eacute;es. Si des filtres sont appliqu&eacute;s, l’en-t&ecirc;te de la
colonne Package est Package (filtr&eacute;).
2 (Facultatif) R&eacute;initialisez les filtres aux valeurs par d&eacute;faut en cliquant sur le bouton Restaurer les valeurs par d&eacute;faut.
Derni&egrave;re mise &agrave; jour le 29/4/2010
Chapitre 9 : Cr&eacute;ation d’une interface
utilisateur avec Flash Builder
A propos de la structure des interfaces utilisateur dans
Flex
Les &eacute;l&eacute;ments constituants des interfaces utilisateur dans Flex sont les conteneurs et les contr&ocirc;les MXML. Un conteneur
est une r&eacute;gion rectangulaire qui permet d’organiser et de mettre en forme les contr&ocirc;les, d’autres conteneurs et les
composants personnalis&eacute;s. Un contr&ocirc;le est un composant d’interface utilisateur tel que Button, TextArea ou
ComboBox. Les composants personnalis&eacute;s sont ceux que vous avez d&eacute;finis dans des fichiers MXML ou ActionScript
distincts et que vous incluez dans votre application.
Remarque : vous pouvez &eacute;galement ajouter &agrave; votre application des ressources cr&eacute;&eacute;es avec Adobe Flash&reg; Professional&reg;.
Voir &laquo; Cr&eacute;ation et modification de composants Flash &raquo; &agrave; la page 194.
Composants Spark
Flex 4 comporte de nouveaux composants Spark, d&eacute;finis dans les packages spark.*. Les composants MX, qui &eacute;taient
disponibles dans les versions pr&eacute;c&eacute;dentes de Flex, sont d&eacute;finis dans les packages mx.*.
La principale diff&eacute;rence entre les composants Spark et les composants MX r&eacute;side dans l’utilisation des styles CSS et
dans l’habillage. Pour plus d’informations sur l’utilisation de composants visuels dans une application, voir Visual
components.
Conteneurs Spark et MX
Flex d&eacute;finit deux types de conteneurs : les conteneurs Spark et les conteneurs MX. Les conteneurs Spark sont d&eacute;finis
dans le package spark.components, alors que les conteneurs MX sont d&eacute;finis dans les packages mx.core et
mx.containers. Les conteneurs Spark d&eacute;finissent la pr&eacute;sentation diff&eacute;remment des conteneurs MX.
Bien que les conteneurs MX fournissent la plupart des options de pr&eacute;sentation offertes par les conteneurs Spark,
Adobe recommande d’utiliser les conteneurs Spark.
Pour plus d’informations sur l’utilisation de conteneurs pour pr&eacute;senter une application, voir Introduction to
containers.
Conteneurs Spark
Les applications dans Flex sont g&eacute;n&eacute;ralement constitu&eacute;es d’un fichier d’application MXML (fichier dot&eacute; d’un
conteneur &lt;s:Application&gt; comme balise parent) et d’un ou de plusieurs composants d&eacute;finis dans des fichiers
MXML, des fichiers ActionScript ou des fichiers de composants Flash (fichiers SWC) distincts. Vous pouvez ins&eacute;rer
des conteneurs et contr&ocirc;les directement dans le fichier d’application MXML ou dans des fichiers MXML distincts pour
cr&eacute;er des composants personnalis&eacute;s et les ins&eacute;rer ensuite dans le fichier d’application.
188
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 189
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
L’exemple suivant illustre une structure d’application simple. Les conteneurs et contr&ocirc;les sont ins&eacute;r&eacute;s directement
dans le fichier d’application MXML.
&lt;s:Application&gt;
&lt;s:HGroup&gt;
&lt;s:VGroup&gt;
&lt;s:VGroup&gt;
Composant
Composant
Composant
Composant
Component
Composant
Control H
Voici un exemple analogue qui fait appel au conteneur Panel comme structure de base pour les conteneurs et les
composants.
&lt;s:Application&gt;
&lt;s:Panel&gt;
&lt;s:HGroup&gt;
&lt;s:VGroup&gt;
&lt;s:VGroup&gt;
Composant
Composant
Composant
Composant
Component
Composant
Control H
Pour plus d’informations sur les conteneurs, les composants et la pr&eacute;sentation d’une interface utilisateur, voir Building
the user interface, y compris les sections Introduction to containers et Visual components.
Structure d’application bas&eacute;e sur des composants
Une structure bas&eacute;e sur des composants est utile si votre interface utilisateur est compos&eacute;e d’&eacute;l&eacute;ments fonctionnels
distincts. Par exemple, votre pr&eacute;sentation peut comporter un &eacute;l&eacute;ment qui extrait et affiche un catalogue de produits,
un autre &eacute;l&eacute;ment qui extrait et affiche des informations concernant tous les produits sur lesquels l’utilisateur peut
cliquer dans le catalogue et un &eacute;l&eacute;ment qui permet &agrave; l’utilisateur d’ajouter le produit s&eacute;lectionn&eacute; &agrave; un panier d’achats.
Cette interface utilisateur peut &ecirc;tre structur&eacute;e sous la forme de trois composants personnalis&eacute;s ou sous la forme d’une
association de composants personnalis&eacute;s et de contr&ocirc;les ins&eacute;r&eacute;s directement dans la pr&eacute;sentation.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 190
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
L’exemple suivant illustre une structure d’application bas&eacute;e sur des composants. Vous regroupez les contr&ocirc;les des
&eacute;l&eacute;ments d’interface utilisateur dans des fichiers de composants personnalis&eacute;s s&eacute;par&eacute;s, que vous ins&eacute;rez par la suite
dans le fichier d’application MXML.
Composant personnalis&eacute; 1
Composant
Composant personnalis&eacute; 2
Control C
Composant
Composant
Composant
Composant
&lt;s:Application&gt;
Voir aussi
&laquo; Cr&eacute;ation de composants MXML personnalis&eacute;s &raquo; &agrave; la page 134
Pr&eacute;sentations pour conteneurs Spark
La plupart des conteneurs Spark, dont le conteneur de niveau sup&eacute;rieur &lt;s:Application&gt;, vous permettent de
sp&eacute;cifier une pr&eacute;sentation d&eacute;finissant le positionnement des composants ajout&eacute;s au conteneur. Par d&eacute;faut, ces
conteneurs Spark font appel &agrave; BasicLayout.
Vous pouvez sp&eacute;cifier les pr&eacute;sentations suivantes pour les conteneurs Spark :
• BasicLayout
Cette pr&eacute;sentation utilise le positionnement absolu. Tous les enfants du conteneur sont positionn&eacute;s explicitement
ou &agrave; l’aide de contraintes. Cette pr&eacute;sentation est celle appliqu&eacute;e par d&eacute;faut &agrave; tous les conteneurs, &agrave; l’exception de
HGroup et VGroup.
• HorizontalLayout
Cette pr&eacute;sentation positionne les enfants sur une seule ligne horizontale.
• VerticalLayout
Cette pr&eacute;sentation positionne les enfants sur une seule colonne verticale.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 191
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
• TileLayout
Cette pr&eacute;sentation positionne les enfants en colonnes verticales ou en lignes horizontales, entamant des nouvelles
lignes ou colonnes si n&eacute;cessaire.
Les conteneurs HGroup et VGroup sp&eacute;cifient respectivement HorizontalLayout et VerticalLayout. Vous ne devrez
g&eacute;n&eacute;ralement pas remplacer la pr&eacute;sentation par d&eacute;faut de ces conteneurs.
Voir aussi
&laquo; Conteneurs MX &raquo; &agrave; la page 191
Enfants des conteneurs Spark
Tous les conteneurs Spark peuvent avoir des composants visuels Spark et MX comme enfants.
Bien que les conteneurs MX fournissent la plupart des options de pr&eacute;sentation offertes par les conteneurs Spark,
Adobe recommande d’utiliser les conteneurs Spark.
Conteneurs MX
L’une des principales diff&eacute;rences entre les conteneurs Spark et MX r&eacute;side dans le fait que l’algorithme de pr&eacute;sentation
des conteneurs MX est fixe, alors que celui des conteneurs Spark peut &ecirc;tre s&eacute;lectionn&eacute;. MX d&eacute;finit donc un conteneur
diff&eacute;rent pour chaque type de pr&eacute;sentation. Spark d&eacute;finit moins de conteneurs, mais vous permet de modifier
l’algorithme de pr&eacute;sentation, ce qui accro&icirc;t la flexibilit&eacute; des conteneurs.
Les conteneurs Spark peuvent avoir des composants visuels Spark et MX comme enfants. Les composants de
navigateur MX ne peuvent toutefois pas avoir des composants Spark comme enfants. Les composants de navigateur
MX comptent parmi d’autres les conteneurs ViewStack, TabNavigator et Accordion, ainsi que les composants TabBar
ou ButtonBar et des composants similaires.
Certains composants impl&eacute;ment&eacute;s dans MX n’ont pas d’&eacute;quivalents dans Spark. Dans ce cas, les composants MX sont
r&eacute;pertori&eacute;s comme composants recommand&eacute;s dans la vue Composants et dans l’assistant de contenu.
Voir aussi
&laquo; Vue Composants &raquo; &agrave; la page 192
&laquo; A propos de l’assistant de contenu &raquo; &agrave; la page 106
Ajout et modification des composants
Flash Builder vous permet d’ajouter des composants &agrave; une application ainsi que d’en d&eacute;finir la taille, de les modifier
ou de les supprimer. Vous pouvez &eacute;galement ajouter et modifier des composants personnalis&eacute;s d&eacute;finis dans des fichiers
MXML et ActionScript distincts.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 192
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Ajout de composants en mode Cr&eacute;ation MXML
Le mode Cr&eacute;ation MXML vous permet d’ajouter des conteneurs et des contr&ocirc;les standard &agrave; l’interface utilisateur. Pour
ce faire, vous faites glisser les composants de la vue Composants vers la zone de cr&eacute;ation du fichier MXML et vous les
positionnez en fonction de la r&egrave;gle de pr&eacute;sentation du conteneur. Vous pouvez aussi ajouter des composants
personnalis&eacute;s que vous d&eacute;finissez dans des fichiers MXML et ActionScript distincts et que vous enregistrez dans le
projet en cours ou dans son chemin source.
1 En mode Cr&eacute;ation de l’&eacute;diteur MXML, ouvrez le fichier MXML dans lequel vous voulez ins&eacute;rer le composant.
Le fichier MXML doit &ecirc;tre ouvert en mode Cr&eacute;ation pour que vous puissiez utiliser la vue Composants. Le fichier
MXML peut &ecirc;tre le fichier de l’application principale (fichier dot&eacute; d’un conteneur Application) ou un fichier de
composant MXML personnalis&eacute;.
2 Dans la vue Composants, localisez le composant &agrave; ajouter.
Si la vue n’est pas ouverte, s&eacute;lectionnez Fen&ecirc;tre &gt; Composants.
La vue Composants classe les composants par cat&eacute;gories. Elle affiche &eacute;galement les composants recommand&eacute;s pour
un projet. Vous pouvez modifier les param&egrave;tres d’affichage de mani&egrave;re &agrave; obtenir la liste compl&egrave;te des composants.
Pour plus d’informations, voir &laquo; Vue Composants &raquo; &agrave; la page 192.
3 Faites glisser un composant de la vue Composants vers le fichier MXML.
Le composant est plac&eacute; en fonction de la r&egrave;gle de pr&eacute;sentation du conteneur parent.
Vue Composants
La vue Composants s’affiche lorsque vous acc&eacute;dez au mode Cr&eacute;ation de l’&eacute;diteur MXML. Faites-en glisser les
composants vers la zone de cr&eacute;ation pour d&eacute;finir la pr&eacute;sentation de votre application.
Cette vue affiche par d&eacute;faut les composants recommand&eacute;s pour un projet. La version du SDK Flex d’un projet
d&eacute;termine quels composants sont r&eacute;pertori&eacute;s comme composants recommand&eacute;s.
Lors de la cr&eacute;ation d’un projet par exemple, Flash Builder utilise par d&eacute;faut le SDK Flex 4. Les composants
recommand&eacute;s pour le SDK Flex 4 sont les composants Spark. Les composants MX ne poss&eacute;dant aucun &eacute;quivalent
Spark sont &eacute;galement r&eacute;pertori&eacute;s dans la liste des composants recommand&eacute;s.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 193
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
La vue Composants regroupe les composants en cat&eacute;gories, telles que Contr&ocirc;les, Pr&eacute;sentations, Navigateurs et
Graphiques. La cat&eacute;gorie Personnaliser contient les composants d&eacute;finis dans des fichiers MXML et ActionScript
distincts. Pour plus d’informations, voir &laquo; Cr&eacute;ation de composants MXML personnalis&eacute;s &raquo; &agrave; la page 134.
Remarque : la vue Composants r&eacute;pertorie les composants visibles.
Modification de l’affichage des composants dans la vue Composants
Acc&eacute;dez au menu de la vue Composants pour en modifier l’affichage.
1 Pour afficher tous les composants, d&eacute;s&eacute;lectionnez Afficher uniquement les composants recommand&eacute;s.
En mode d’affichage de tous les composants, la vue regroupe les composants en composants Spark et MX.
2 Pour afficher les noms qualifi&eacute;s complets des classes, s&eacute;lectionnez Afficher les noms qualifi&eacute;s complets des classes.
Ajout de composants par la r&eacute;daction de code
En mode Source de l’&eacute;diteur MXML, les indicateurs de code vous assistent lors de l’ajout de conteneurs et de contr&ocirc;les
Flex standard &agrave; l’interface utilisateur. Dans Flash Builder, tout comme dans Eclipse, les indicateurs de code sont
d&eacute;sign&eacute;s par le terme Assistant de contenu.
L’assistant de contenu de Flash Builder vous aide &agrave; ins&eacute;rer des composants recommand&eacute;s. L’exemple suivant illustre
comment utiliser les indicateurs de code pour ins&eacute;rer un conteneur &lt;s:VGroup&gt; dans un conteneur &lt;s:HGroup&gt;.
HGroup &eacute;tant un composant Spark, l’assistant privil&eacute;gie l’utilisation d’un conteneur VGroup &agrave; celle de &lt;mx:VBox&gt;.
1 Ouvrez un fichier MXML en mode Source dans l’&eacute;diteur MXML.
Le fichier MXML peut &ecirc;tre le fichier de l’application principale (fichier dot&eacute; d’un conteneur Application) ou un
fichier de composants MXML personnalis&eacute;s.
2 Placez le point d’insertion dans la balise de conteneur parent.
Pour ins&eacute;rer par exemple un conteneur VGroup dans un conteneur parent HGroup, placez le point d’insertion
apr&egrave;s la balise d’ouverture &lt;s:HGroup&gt;.
&lt;s:HGroup&gt;
insertion point here
&lt;/s:HGroup&gt;
3 Saisissez la balise du composant.
En cours de saisie, l’assistant de contenu s’affiche pour vous sugg&eacute;rer des entr&eacute;es possibles. Les composants
recommand&eacute;s s’affichent en noir. Les composants non recommand&eacute;s s’affichent en gris.
Dans cet exemple, VGroup est recommand&eacute;, contrairement &agrave; VBox qui ne l’est pas.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 194
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
4 Appuyez le cas &eacute;ch&eacute;ant sur les touches repr&eacute;sentant des fl&egrave;ches pour s&eacute;lectionner une balise dans le menu, puis
appuyez sur Entr&eacute;e.
Outre les composants standard, l’assistant de contenu r&eacute;pertorie les composants personnalis&eacute;s que vous avez
d&eacute;finis dans des fichiers MXML et ActionScript distincts et que vous avez enregistr&eacute;s dans le projet en cours ou
dans son chemin source.
L’assistant de contenu peut &eacute;galement sugg&eacute;rer des propri&eacute;t&eacute;s, des &eacute;v&eacute;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&icirc;te de dialogue
Pr&eacute;f&eacute;rences, s&eacute;lectionnez Flash Builder &gt; Editeurs &gt; Code MXML &gt; Avanc&eacute;es.
Voir aussi
&laquo; A propos de l’assistant de contenu &raquo; &agrave; la page 106
&laquo; Cr&eacute;ation de composants MXML personnalis&eacute;s &raquo; &agrave; la page 134
Cr&eacute;ation et modification de composants Flash
Adobe Flash&reg; Professional CS5 cr&eacute;e des applications compatibles avec Adobe Flash Player 10. Les applications Adobe
prennent &eacute;galement en charge Flash Player 10, ce qui signifie que vous pouvez importer dans vos applications des
ressources issues de Flash Professional CS5. Vous pouvez cr&eacute;er des contr&ocirc;les, des conteneurs, des habillages et d’autres
ressources dans Flash Professional CS5, puis les importer dans vos applications sous la forme de fichiers SWC. Pour
plus d’informations sur la cr&eacute;ation de composants &agrave; l’aide de Flash Professional CS5, voir Extensions pour la cr&eacute;ation
d’habillages Flex et kit de composants Flex pour Flash Professional.
La vue Cr&eacute;ation de l’&eacute;diteur Flash Builder vous permet d’ins&eacute;rer un nouveau composant Flash en ajoutant un espace
r&eacute;serv&eacute; pour un composant ou un conteneur Flash. Vous pouvez appeler Flash Professional CS5 &agrave; partir de Flash
Builder pour cr&eacute;er le composant ou conteneur. Vous pouvez &eacute;galement appeler Flash Professional CS5 pour modifier
les composants Flash cr&eacute;&eacute;s pr&eacute;c&eacute;demment.
Si l’application contient un composant SWFLoader destin&eacute; &agrave; lancer des fichiers d’animation Flash, vous pouvez
d&eacute;marrer Flash Professional CS5 pour cr&eacute;er ou modifier les fichiers FLA et SWF associ&eacute;s.
Insertion d’un composant ou d’un conteneur Flash
1 Dans l’&eacute;diteur Flash Builder, s&eacute;lectionnez la vue Cr&eacute;ation et 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
Nouveau conteneur Flash vers la zone de cr&eacute;ation.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 195
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Vous pouvez ensuite redimensionner ou positionner le composant ou conteneur.
3 Dans le menu contextuel ou dans la Vue standard des Propri&eacute;t&eacute;s du fichier, s&eacute;lectionnez Cr&eacute;er dans Adobe Flash.
Remarque : vous pouvez &eacute;galement double-cliquer sur le composant dans la vue Cr&eacute;ation pour cr&eacute;er l’&eacute;l&eacute;ment dans
Adobe Flash.
4 Dans la bo&icirc;te de dialogue qui s’ouvre, pr&eacute;cisez le nom de la classe et du fichier SWC, puis cliquez sur Cr&eacute;er pour
ouvrir Adobe Flash Professional CS5.
5 Dans Flash Professional CS5, modifiez le composant ou conteneur. S&eacute;lectionnez Terminer lorsque vous avez fini
pour retourner &agrave; Flash Builder.
Modification d’un composant ou d’un conteneur Flash
Cette proc&eacute;dure suppose que vous avez d&eacute;j&agrave; ins&eacute;r&eacute; un composant ou un conteneur Flash dans Flash Builder.
1 Dans la vue Cr&eacute;ation de l’&eacute;diteur Flash Builder, s&eacute;lectionnez le composant ou le conteneur Flash &agrave; modifier.
2 Dans le menu contextuel ou dans la Vue standard des Propri&eacute;t&eacute;s Flex, s&eacute;lectionnez Editer dans Adobe Flash.
Remarque : vous pouvez &eacute;galement double-cliquer sur le composant dans la vue Cr&eacute;ation pour modifier l’&eacute;l&eacute;ment
dans Adobe Flash.
3 Dans Flash Professional CS5, modifiez le composant ou conteneur. S&eacute;lectionnez Terminer lorsque vous avez fini
pour retourner &agrave; Flash Builder.
Cr&eacute;ation ou modification d’une animation Flash associ&eacute;e &agrave; un composant SWFLoader
Cette proc&eacute;dure suppose que l’application contient un composant SWFLoader.
1 Dans la vue Cr&eacute;ation de l’&eacute;diteur Flex, s&eacute;lectionnez le composant SWFLoader.
2 A partir du menu contextuel du composant ou de la Vue standard de la fen&ecirc;tre Propri&eacute;t&eacute;s, lancez Flash
Professional CS5 en effectuant l’une des op&eacute;rations suivantes :
• S&eacute;lectionnez Cr&eacute;er dans Adobe Flash pour cr&eacute;er une animation Flash associ&eacute;e au composant SWFLoader.
• S&eacute;lectionnez Editer dans Adobe Flash pour modifier l’animation Flash associ&eacute;e au composant SWFLoader.
3 Une fois que vous avez fini de modifier l’animation, s&eacute;lectionnez Terminer pour retourner &agrave; Flash Builder.
Importation de ressources Flash CS3
Vous pouvez ajouter &agrave; l’interface utilisateur des composants Flash cr&eacute;&eacute;s avec Adobe Flash CS3 Professional.
Remarque : pour pouvoir cr&eacute;er des composants Flex dans Flash CS3, vous devez installer le kit de composants Flex pour
Flash CS3. Pour plus d’informations, consultez l’article Importing Flash CS3 Assets into Flex.
1 V&eacute;rifiez que le composant Flash est enregistr&eacute; dans le chemin d’acc&egrave;s &agrave; la biblioth&egrave;que du projet en cours.
Le chemin d’acc&egrave;s &agrave; la biblioth&egrave;que pr&eacute;cise l’emplacement d’un ou de plusieurs fichiers SWC que l’application lie
au moment de l’ex&eacute;cution. Il est d&eacute;fini dans les param&egrave;tres du compilateur Flex pour le projet. Dans les nouveaux
projets, le dossier libs se trouve par d&eacute;faut sur le chemin d’acc&egrave;s &agrave; la biblioth&egrave;que.
Pour d&eacute;finir ou d&eacute;couvrir le chemin d’acc&egrave;s &agrave; la biblioth&egrave;que, s&eacute;lectionnez le projet dans l’Explorateur de packages,
puis s&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s. Dans la bo&icirc;te de dialogue Propri&eacute;t&eacute;s, s&eacute;lectionnez la cat&eacute;gorie Chemin de
g&eacute;n&eacute;ration Flex, puis cliquez sur l’onglet Chemin d’acc&egrave;s &agrave; la biblioth&egrave;que. Pour plus d’informations, voir
&laquo; G&eacute;n&eacute;ration manuelle de projets &raquo; &agrave; la page 81.
Il est &eacute;galement possible de d&eacute;finir le chemin d’acc&egrave;s &agrave; la biblioth&egrave;que dans le fichier de configuration flexconfig.xml d’Adobe LiveCycle Data Services ES&reg;.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 196
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
2 Ouvrez un fichier MXML et ajoutez un composant Flash de l’une des fa&ccedil;ons suivantes :
• En mode Cr&eacute;ation dans l’&eacute;diteur MXML, d&eacute;veloppez la cat&eacute;gorie Personnaliser de la vue Composants puis faites
glisser le composant Flash vers le fichier MXML. Dans le cas de documents d&eacute;j&agrave; ouverts, cliquez sur le bouton
Actualiser (l’ic&ocirc;ne verte contenant des fl&egrave;ches) pour afficher le composant apr&egrave;s l’avoir ins&eacute;r&eacute;.
• En mode Source, entrez la balise de composant, puis faites appel &agrave; l’Assistant de contenu pour terminer
rapidement la balise.
Utilisation visuelle des composants
Flash Builder vous permet de travailler visuellement avec les composants dans l’&eacute;diteur MXML pour que vous puissiez
voir l’aspect de votre application &agrave; mesure que vous la construisez. L’&eacute;diteur MXML poss&egrave;de deux modes : le mode
Source pour la r&eacute;daction de code et le mode Cr&eacute;ation pour le d&eacute;veloppement visuel des applications.
Utilisation de l’&eacute;diteur MXML en mode Cr&eacute;ation
Le mode Cr&eacute;ation vous permet d’afficher, de s&eacute;lectionner, de d&eacute;placer, de redimensionner, de faire d&eacute;filer, d’agrandir
ou d’effectuer un panoramique des &eacute;l&eacute;ments dans la zone de cr&eacute;ation.
Affichage d’un fichier MXML
1 Si le fichier MXML n’est pas d&eacute;j&agrave; ouvert dans l’&eacute;diteur MXML, double-cliquez sur le fichier dans l’Explorateur de
packages pour l’ouvrir.
2 Si l’&eacute;diteur MXML affiche le code source, cliquez sur Cr&eacute;ation dans la partie sup&eacute;rieure de la zone de l’&eacute;diteur.
Vous pouvez passer rapidement d’un mode &agrave; l’autre en appuyant sur les touches Ctrl+`(Guillemet ouvrant).
Le basculement entre les modes Source et Cr&eacute;ation affiche ou masque automatiquement les vues li&eacute;es &agrave; la cr&eacute;ation,
telles que Composants, Propri&eacute;t&eacute;s et Etats. Pour activer et d&eacute;sactiver ce comportement, acc&eacute;dez &agrave; la bo&icirc;te de
dialogue Pr&eacute;f&eacute;rences et s&eacute;lectionnez Flash Builder &gt; Editeurs &gt; Mode Cr&eacute;ation et enfin l’option Afficher
automatiquement les vues li&eacute;es &agrave; la cr&eacute;ation.
S&eacute;lection et d&eacute;placement de composants dans la zone de cr&eacute;ation
❖ Cliquez sur le bouton Mode S&eacute;lection (en forme de fl&egrave;che) sur la droite de la barre d’outils de l’&eacute;diteur. Ce mode
est activ&eacute; par d&eacute;faut lorsque vous ouvrez un document. Appuyez sur la touche V du clavier pour passer en mode
S&eacute;lection. Cliquez sur un composant et faites-le glisser jusqu’&agrave; l’emplacement voulu. Vous pouvez aussi le faire
glisser pour le redimensionner et cliquer dessus pour le s&eacute;lectionner.
Panoramique et d&eacute;filement dans la zone de cr&eacute;ation
❖ Cliquez sur le bouton Mode Panoramique sur le c&ocirc;t&eacute; droit de la barre d’outils de l’&eacute;diteur. Appuyez sur H pour
entrer en mode Panoramique &agrave; partir du clavier. Pour entrer temporairement en mode Panoramique, appuyez sur
la barre d’espacement du clavier et maintenez-la enfonc&eacute;e. Vous pouvez s&eacute;lectionner ou d&eacute;placer des &eacute;l&eacute;ments en
mode Panoramique.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 197
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Zoom dans la zone de cr&eacute;ation
Il existe plusieurs fa&ccedil;ons d’utiliser l’outil de zoom. Vous pouvez s&eacute;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&eacute; dans la barre d’outils.
• Dans le menu principal, s&eacute;lectionnez Cr&eacute;ation &gt; Zoom avant ou Cr&eacute;ation &gt; Zoom arri&egrave;re. Vous pouvez &eacute;galement
s&eacute;lectionner le sous-menu Agrandissement et choisir un pourcentage sp&eacute;cifique.
• Cliquez sur le bouton Mode Zoom dans la barre d’outils ou appuyez sur la touche Z du clavier. Un curseur de
symbole + s’affiche dans la zone de cr&eacute;ation.
• S&eacute;lectionnez un pourcentage dans le menu contextuel en regard des boutons S&eacute;lectionner, Panoramique et Mode
zoom de la barre d’outils de l’&eacute;diteur. La zone de cr&eacute;ation prend le pourcentage s&eacute;lectionn&eacute; ou s’ajuste &agrave; la taille de
la fen&ecirc;tre.
• Cliquez avec le bouton droit dans la zone de cr&eacute;ation pour s&eacute;lectionner le sous-menu Zoom avant, Zoom arri&egrave;re
ou Agrandissement. La zone de cr&eacute;ation change selon votre choix.
Vous pouvez recourir aux raccourcis clavier suivants dans la zone de cr&eacute;ation :
• Zoom avant : Ctrl+= (Commande+= sous Mac OS)
• Zoom arri&egrave;re : Ctrl+- (Commande+- sous Mac OS)
Pour conna&icirc;tre d’autres raccourcis clavier, s&eacute;lectionnez Aide &gt; Assistant de touches.
S&eacute;lection de plusieurs composants dans un fichier MXML
Vous pouvez s&eacute;lectionner plusieurs composants dans un fichier MXML. Cela peut s’av&eacute;rer utile si vous voulez d&eacute;finir
une valeur commune pour une propri&eacute;t&eacute; partag&eacute;e.
• Appuyez sur la touche Ctrl tout en cliquant sur (Commande-clic sous Macintosh) chaque composant de la
pr&eacute;sentation.
• Cliquez sur l’arri&egrave;re-plan de la page et dessinez un rectangle chevauchant les composants.
• Dans la vue Structure (Fen&ecirc;tre &gt; Structure), appuyez sur la touche Ctrl tout en cliquant sur (Commande-clic sous
Macintosh) les composants dans le contr&ocirc;le d’arborescence.
D&eacute;s&eacute;lection de plusieurs composants
• Cliquez sur le conteneur d’arri&egrave;re-plan.
• Cliquez sur un composant d&eacute;s&eacute;lectionn&eacute;.
• Cliquez dans la marge grise encadrant le composant racine.
Positionnement de composants
Vous pouvez changer la position des composants visuellement en fonction de la propri&eacute;t&eacute; layout du conteneur parent.
Si le conteneur parent sp&eacute;cifie que le positionnement est absolu, vous pouvez faire glisser les composants pour les
repositionner. Dans le cas contraire, les composants repositionn&eacute;s appliquent les r&egrave;gles de pr&eacute;sentation du conteneur
parent.
Par d&eacute;faut, les conteneurs Spark font appel &agrave; la propri&eacute;t&eacute; BasicLayout qui autorise le positionnement absolu. Pour
certains conteneurs MX, vous pouvez &eacute;galement d&eacute;finir la propri&eacute;t&eacute; layout sur absolute. Pour plus d’informations,
voir MX layout containers.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 198
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Remarque : vous pouvez &eacute;galement utiliser des contraintes de pr&eacute;sentation pour positionner un composant dans un
conteneur. Ces contraintes d&eacute;finissent de quelle mani&egrave;re les composants doivent &ecirc;tre repositionn&eacute;s en cas de
redimensionnement d’un conteneur. Elles permettent toutefois aussi d’en sp&eacute;cifier la position dans des conteneurs dont
la taille est fixe. Voir &laquo; D&eacute;finition de contraintes de pr&eacute;sentation pour les composants &raquo; &agrave; la page 207.
1 En mode Cr&eacute;ation de l’&eacute;diteur MXML, s&eacute;lectionnez le composant dans la pr&eacute;sentation et faites-le glisser vers une
nouvelle position.
Le composant est plac&eacute; en fonction des r&egrave;gles de pr&eacute;sentation du conteneur parent.
Si le conteneur b&eacute;n&eacute;ficie du positionnement absolu, vous pouvez faire glisser les composants et les positionner
n’importe o&ugrave; dans le conteneur.
Par exemple, si vous d&eacute;placez un conteneur VGroup dans un conteneur HGroup, le conteneur VGroup est plac&eacute; &agrave;
l’horizontale avec les autres conteneurs enfant (s’ils existent).
2 En mode Cr&eacute;ation, s&eacute;lectionnez le conteneur parent du composant et modifiez ses propri&eacute;t&eacute;s de pr&eacute;sentation dans
la vue Propri&eacute;t&eacute;s.
Dans certains cas, vous pouvez changer la position des composants enfant en modifiant les propri&eacute;t&eacute;s du conteneur
parent. Vous pouvez par exemple utiliser les propri&eacute;t&eacute;s verticalGap et horizontalGap du conteneur pour d&eacute;finir
l’espacement entre les composants enfant et la propri&eacute;t&eacute; direction pour pr&eacute;ciser une pr&eacute;sentation &agrave; lignes ou &agrave;
colonnes.
Voir aussi
&laquo; Conteneurs Spark et MX &raquo; &agrave; la page 188
&laquo; D&eacute;finition de contraintes de pr&eacute;sentation pour les composants &raquo; &agrave; la page 207
Dimensionnement des composants
En mode Cr&eacute;ation, vous pouvez modifier la taille d’un composant en faisant glisser la poign&eacute;e de redimensionnement,
en s&eacute;lectionnant des options dans les menus ou en modifiant ses propri&eacute;t&eacute;s dans la vue Propri&eacute;t&eacute;s.
Remarque : utilisez une pr&eacute;sentation bas&eacute;e sur contrainte pour sp&eacute;cifier la mani&egrave;re dont un composant est
redimensionn&eacute; dynamiquement lors du redimensionnement d’un conteneur. Pour plus d’informations, voir &laquo; D&eacute;finition
de contraintes de pr&eacute;sentation pour les composants &raquo; &agrave; la page 207.
Dimensionnement d’un composant visuellement
❖ En mode Cr&eacute;ation de l’&eacute;diteur MXML, cliquez sur le composant et faites glisser la poign&eacute;e de dimensionnement
pour le redimensionner.
• Pour contraindre les proportions du composant, maintenez enfonc&eacute;e la touche Maj tout en le faisant glisser.
• Si l’alignement est activ&eacute;, lorsque vous effectuez le redimensionnement, des lignes d’accrochage s’affichent pour
vous aider &agrave; aligner les bords du composant avec les composants voisins. Pour activer ou d&eacute;sactiver l’alignement
dans le menu principal, s&eacute;lectionnez &gt; Activer l’accrochage.
Harmonisation de la largeur ou de la hauteur de deux composants ou plus
1 En mode Cr&eacute;ation, s&eacute;lectionnez deux composants ou plus.
2 Dans le menu Cr&eacute;ation, s&eacute;lectionnez l’une des options de dimensionnement suivantes :
Rendre de la m&ecirc;me largeur D&eacute;finit la propri&eacute;t&eacute; width de tous les composants s&eacute;lectionn&eacute;s sur celle du composant
que vous avez s&eacute;lectionn&eacute; en premier.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 199
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Rendre de la m&ecirc;me hauteur D&eacute;finit la propri&eacute;t&eacute; height de tous les composants s&eacute;lectionn&eacute;s sur celle du
composant que vous avez s&eacute;lectionn&eacute; en premier.
Si tous les composants s&eacute;lectionn&eacute;s se trouvent dans le m&ecirc;me conteneur, et que le premier composant que vous
s&eacute;lectionnez a un pourcentage de largeur ou de hauteur sp&eacute;cifi&eacute;, tous les &eacute;l&eacute;ments sont d&eacute;finis selon ce pourcentage.
Dans le cas contraire, tous les composants sont d&eacute;finis avec la m&ecirc;me largeur ou hauteur de pixel.
Dimensionnement d’un composant en modifiant ses propri&eacute;t&eacute;s
1 En mode Cr&eacute;ation, s&eacute;lectionnez le composant.
Pour d&eacute;finir la taille de plusieurs composants simultan&eacute;ment, appuyez sur la touche Ctrl en cliquant (ou Maj-clic
sous Mac OS) sur ces composants.
2 Dans la vue Propri&eacute;t&eacute;s (Fen&ecirc;tre &gt; Propri&eacute;t&eacute;s), d&eacute;finissez la propri&eacute;t&eacute; height ou width du ou des composants
s&eacute;lectionn&eacute;s.
La vue Propri&eacute;t&eacute;s propose trois vues pour l’affichage des propri&eacute;t&eacute;s d’un composant : une vue standard sous forme
de formulaire, une vue par cat&eacute;gories sous forme de tableau et une vue alphab&eacute;tique sous forme de tableau. Vous
pouvez passer d’une vue &agrave; l’autre en cliquant sur les boutons correspondants dans la barre d’outils.
Utilisation de l’alignement pour positionner les composants
Lorsque vous faites glisser un composant visuellement dans un conteneur dot&eacute; 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 &agrave; la verticale ou &agrave; l’horizontale.
Par d&eacute;faut, les conteneurs Spark font appel &agrave; la propri&eacute;t&eacute; BasicLayout qui autorise le positionnement absolu. Pour
certains conteneurs MX, vous pouvez &eacute;galement d&eacute;finir la propri&eacute;t&eacute; layout sur absolute. Pour plus d’informations,
voir Using Layout Containers.
Vous pouvez d&eacute;sactiver l’alignement pour un composant ou pour tous les composants.
Activation ou d&eacute;sactivation de l’accrochage
❖ Le fichier MXML &eacute;tant ouvert en mode Cr&eacute;ation dans l’&eacute;diteur MXML, s&eacute;lectionnez (ou d&eacute;s&eacute;lectionnez) Cr&eacute;ation
&gt; Activer l’accrochage.
Activation ou d&eacute;sactivation de l’accrochage dans les Pr&eacute;f&eacute;rences
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences.
2 S&eacute;lectionnez Flash Builder &gt; Editeurs &gt; Mode Cr&eacute;ation dans le panneau lat&eacute;ral de la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences.
3 S&eacute;lectionnez ou d&eacute;s&eacute;lectionnez l’option Activer l’accrochage.
Accrochage de composants
Vous pouvez aligner visuellement les composants les uns par rapport aux autres dans un conteneur dot&eacute; du
positionnement absolu. Par d&eacute;faut, les conteneurs Spark font appel &agrave; la propri&eacute;t&eacute; BasicLayout qui autorise le
positionnement absolu. Pour certains conteneurs MX, vous pouvez &eacute;galement d&eacute;finir la propri&eacute;t&eacute; layout sur
absolute.
Vous pouvez &eacute;galement centrer les composants dans un conteneur gr&acirc;ce &agrave; une pr&eacute;sentation bas&eacute;e sur des contraintes.
Pour plus d’informations, voir &laquo; D&eacute;finition de contraintes de pr&eacute;sentation pour les composants &raquo; &agrave; la page 207.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 200
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Accrochage de composants dans un conteneur dot&eacute; du positionnement absolu
1 En mode Cr&eacute;ation de l’&eacute;diteur MXML, s&eacute;lectionnez deux composants ou plus dans le conteneur.
Pour plus d’informations, voir &laquo; S&eacute;lection de plusieurs composants dans un fichier MXML &raquo; &agrave; la page 197.
2 S&eacute;lectionnez l’une des options d’alignement suivantes dans le menu Cr&eacute;ation.
Aligner &agrave; gauche Positionne tous les composants s&eacute;lectionn&eacute;s de mani&egrave;re que leur bord gauche s’aligne avec celui
du premier composant que vous avez s&eacute;lectionn&eacute;.
Aligner les centres &agrave; la verticale Positionne tous les composants s&eacute;lectionn&eacute;s de mani&egrave;re que leur centre s’aligne &agrave;
la verticale avec celui du premier composant que vous avez s&eacute;lectionn&eacute;.
Aligner &agrave; droite Positionne tous les composants s&eacute;lectionn&eacute;s de mani&egrave;re que leur bord droit s’aligne avec celui du
premier composant que vous avez s&eacute;lectionn&eacute;.
Aligner en haut Positionne tous les objets s&eacute;lectionn&eacute;s de mani&egrave;re que leur bord sup&eacute;rieur s’aligne avec celui du
premier composant que vous avez s&eacute;lectionn&eacute;.
Aligner les centres &agrave; l’horizontale Positionne tous les composants s&eacute;lectionn&eacute;s de mani&egrave;re que leur centre s’aligne
&agrave; l’horizontale avec celui du premier composant que vous avez s&eacute;lectionn&eacute;.
Aligner en bas Positionne tous les composants s&eacute;lectionn&eacute;s de mani&egrave;re que leur bord inf&eacute;rieur s’aligne avec celui
du premier composant que vous avez s&eacute;lectionn&eacute;.
Aligner les lignes de base Positionne tous les composants s&eacute;lectionn&eacute;s de mani&egrave;re que leur ligne de base de texte
horizontal s’aligne avec celui du premier composant que vous avez s&eacute;lectionn&eacute;. Pour les composants d&eacute;pourvus de
ligne de base de texte (tels que HGroup), le bord inf&eacute;rieur est consid&eacute;r&eacute; comme la ligne de base.
Pour les objets d&eacute;pourvus de contraintes de pr&eacute;sentation, Flash Builder ajuste la propri&eacute;t&eacute; x pour changer
l’alignement vertical et la propri&eacute;t&eacute; y pour modifier l’alignement horizontal.
Pour les objets d&eacute;pourvus de contraintes de pr&eacute;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&eacute;es ; aucune nouvelle contrainte n’est ajout&eacute;e.
Supposons, par exemple, que le composant A poss&egrave;de une contrainte gauche et aucune contrainte droite, et que le
composant B soit dot&eacute; d’une contrainte gauche et d’une droite. Si vous s&eacute;lectionnez les composants A et B et que
vous s&eacute;lectionnez Cr&eacute;ation &gt; Aligner les centres &agrave; la verticale, 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&eacute;cifi&eacute;e de l’objet A reste
non sp&eacute;cifi&eacute;e.
Ajustement de composants
Vous pouvez ajuster la position de composants dans un conteneur dot&eacute; du positionnement absolu en les d&eacute;pla&ccedil;ant
d’un ou de dix pixels &agrave; la fois en utilisant les touches de direction.
Ajustement des composants d’un pixel
❖ S&eacute;lectionnez un ou plusieurs composants en mode Cr&eacute;ation de l’&eacute;diteur MXML et appuyez sur l’une des touches
de direction.
Ajustement des composants de dix pixels
❖ S&eacute;lectionnez un ou plusieurs composants en mode Cr&eacute;ation de l’&eacute;diteur MXML et appuyez sur l’une des touches
de direction tout en maintenant la touche Maj enfonc&eacute;e.
Maintenez la touche de direction enfonc&eacute;e pour continuer &agrave; d&eacute;placer le composant.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 201
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
D&eacute;finition des propri&eacute;t&eacute;s des composants
Vous pouvez d&eacute;finir visuellement les propri&eacute;t&eacute;s de composants dans la zone de cr&eacute;ation ou dans la vue Propri&eacute;t&eacute;s.
Modification du texte affich&eacute; par un composant
❖ Pour &eacute;diter le texte affich&eacute; par un composant tel qu’un contr&ocirc;le Label ou TextInput, double-cliquez sur le
composant et saisissez vos modifications.
Changement du texte dans le champ ID
Lorsque vous modifiez du texte dans le champ ID, vous &ecirc;tes invit&eacute; &agrave; mettre &agrave; jour toutes les r&eacute;f&eacute;rences de l’espace de
travail avec le nouvel identifiant. Vous pouvez d&eacute;finir la suppression de cette bo&icirc;te de dialogue &agrave; la page Mode Cr&eacute;ation
des Pr&eacute;f&eacute;rences :
1 Ouvrez la fen&ecirc;tre Pr&eacute;f&eacute;rences.
2 S&eacute;lectionnez Flash Builder &gt; Editeurs &gt; Mode Cr&eacute;ation.
3 S&eacute;lectionnez ou d&eacute;s&eacute;lectionnez Toujours mettre &agrave; jour les r&eacute;f&eacute;rences lors de la modification des ID dans la vue
Propri&eacute;t&eacute;s.
D&eacute;finition des autres propri&eacute;t&eacute;s d’un composant
❖ S&eacute;lectionnez un composant et d&eacute;finissez-en les propri&eacute;t&eacute;s dans la vue du m&ecirc;me nom (Fen&ecirc;tre &gt; Autres vues &gt; Flash
Builder &gt; Propri&eacute;t&eacute;s).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 202
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Vue Propri&eacute;t&eacute;s d’un composant DataGrid
Pour d&eacute;finir les propri&eacute;t&eacute;s dans la Vue par cat&eacute;gories ou dans la Vue alphab&eacute;tique, cliquez sur les boutons
correspondant aux vues dans la barre d’outils.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 203
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Vue par cat&eacute;gories pour un composant Button
Remarque : pour appliquer votre derni&egrave;re modification, appuyez sur la touche Entr&eacute;e ou de tabulation, ou cliquez en
dehors de la vue.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 204
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Examen de la structure du code MXML
La vue Structure (Fen&ecirc;tre &gt; Structure) en mode Cr&eacute;ation permet d’examiner la structure de l’application et de
s&eacute;lectionner un ou plusieurs composants. Lorsque vous avez plusieurs &eacute;tats d’affichage, la vue Structure affiche la
structure de l’&eacute;tat d’affichage actif.
1 Le fichier MXML &eacute;tant ouvert en mode Cr&eacute;ation, s&eacute;lectionnez la vue Structure.
2 Dans la vue Structure, s&eacute;lectionnez un ou plusieurs composants.
Ces composants apparaissent &eacute;galement s&eacute;lectionn&eacute;s en mode Cr&eacute;ation de l’&eacute;diteur.
En mode Source, seul le premier composant s&eacute;lectionn&eacute; dans la vue Structure appara&icirc;t comme &eacute;tant s&eacute;lectionn&eacute;
dans l’&eacute;diteur.
Masquage des bordures d’un conteneur
Flash Builder affiche par d&eacute;faut les bordures des conteneurs en mode Cr&eacute;ation de l’&eacute;diteur MXML. Vous pouvez
toutefois les masquer.
❖ S&eacute;lectionnez Cr&eacute;ation &gt; Afficher les bordures des conteneurs.
Cette commande est un bouton bascule. S&eacute;lectionnez-la &agrave; nouveau pour afficher les bordures.
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&eacute;rifiez que les deux fichiers MXML sont ouverts en mode Cr&eacute;ation de l’&eacute;diteur MXML.
2 S&eacute;lectionnez des composants dans l’un des fichiers. Cliquez ensuite sur Editer &gt; Copier.
3 Acc&eacute;dez &agrave; l’autre fichier, cliquez &agrave; l’int&eacute;rieur d’un conteneur et s&eacute;lectionnez Editer &gt; Coller.
Suppression de composants
Vous pouvez supprimer des composants de l’interface utilisateur. S&eacute;lectionnez un composant, puis proc&eacute;dez de l’une
des mani&egrave;res suivantes :
• Appuyez sur la touche de suppression de votre clavier.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 205
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
• Dans le menu contextuel du composant, s&eacute;lectionnez Supprimer.
• Dans le menu Editer de Flash Builder, s&eacute;lectionnez Supprimer.
Utilisation de pr&eacute;sentations bas&eacute;es sur des contraintes
Vous pouvez appliquer des contraintes &agrave; un composant pour en ajuster automatiquement la taille et la position dans
le conteneur lorsque l’utilisateur redimensionne la fen&ecirc;tre de l’application.
Les contraintes de pr&eacute;sentation sont g&eacute;n&eacute;ralement d&eacute;finies en mode Cr&eacute;ation de l’&eacute;diteur MXML. Vous pouvez
&eacute;galement d&eacute;finir des contraintes de pr&eacute;sentation pour un composant en modifiant ses propri&eacute;t&eacute;s en mode Source.
A propos des pr&eacute;sentations bas&eacute;es sur des contraintes
Flex prend en charge les pr&eacute;sentations bas&eacute;es sur des contraintes. Ce type de pr&eacute;sentation est disponible avec les
conteneurs qui prennent en charge le positionnement absolu. Pour les conteneurs Spark, le positionnement absolu est
pris en charge par la pr&eacute;sentation par d&eacute;faut (BasicLayout).
L’application de pr&eacute;sentations bas&eacute;es sur des contraintes se traduit pas l’ancrage d’un ou de plusieurs c&ocirc;t&eacute;s d’un
composant aux bords d’un conteneur ou de sa r&eacute;gion de contrainte. Vous pouvez &eacute;galement d&eacute;finir le d&eacute;calage du
composant par rapport &agrave; l’ancrage. Lorsqu’un conteneur est redimensionn&eacute; par l’utilisateur, la taille et la position de
ses composants sont d&eacute;termin&eacute;es par les points d’ancrage d&eacute;finis.
Exemple de pr&eacute;sentation bas&eacute;e sur des contraintes
Dans l’exemple suivant, tous les contr&ocirc;les b&eacute;n&eacute;ficient d’un positionnement absolu dans un conteneur, soit en les
faisant glisser, soit en d&eacute;finissant les coordonn&eacute;es x et y dans la vue Propri&eacute;t&eacute;s. Les fl&egrave;ches du sch&eacute;ma indiquent de
quelle mani&egrave;re les contraintes, d&eacute;finies conform&eacute;ment aux points &eacute;num&eacute;r&eacute;s ci-dessous, influent sur le comportement
des contr&ocirc;les en cas de redimensionnement de la pr&eacute;sentation.
&lt;s:Panel&gt;
Label A
TextInput A
Label B
TextInput B
Label C
TextArea C
220px
Button
350px
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 206
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Un certain nombre de contraintes de pr&eacute;sentation sont appliqu&eacute;es aux contr&ocirc;les pour garantir un ajustement correct
de la pr&eacute;sentation lorsque l’utilisateur redimensionne l’application :
• Label A, Label B et Label C sont ancr&eacute;s sur les bords gauche et sup&eacute;rieur, de mani&egrave;re que les &eacute;tiquettes restent en
place lorsque l’utilisateur redimensionne la pr&eacute;sentation.
• TextInput A et TextInput B sont ancr&eacute;s sur les bords gauche et droit, pour pouvoir s’&eacute;tirer ou se comprimer &agrave;
l’horizontale lorsque l’utilisateur redimensionne la pr&eacute;sentation.
• TextArea C est ancr&eacute; sur les bords gauche et droit et sup&eacute;rieur et inf&eacute;rieur, afin de s’&eacute;tirer ou de se comprimer &agrave;
l’horizontale et &agrave; la verticale lorsque l’utilisateur redimensionne la pr&eacute;sentation.
• Le contr&ocirc;le Button est ancr&eacute; aux bords droit et gauche, de fa&ccedil;on que le contr&ocirc;le conserve sa position par rapport au
coin inf&eacute;rieur droit du conteneur lorsque l’utilisateur redimensionne la pr&eacute;sentation.
Les contr&ocirc;les TextInput A et TextInput B s’&eacute;tirent &agrave; l’horizontale lorsque la pr&eacute;sentation est agrandie. Le contr&ocirc;le
TextArea C s’&eacute;tire &agrave; l’horizontale et &agrave; la verticale. Le contr&ocirc;le Button se d&eacute;place vers le bas et vers la droite.
Pr&eacute;sentations bas&eacute;es sur des contraintes et positionnement absolu
Pour cr&eacute;er une pr&eacute;sentation bas&eacute;e sur des contraintes, utilisez un conteneur prenant en charge le positionnement
absolu. Pour les conteneurs Spark, d&eacute;finissez la propri&eacute;t&eacute; layout sur BasicLayout. La propri&eacute;t&eacute; par d&eacute;faut BasicLayout
est appliqu&eacute;e &agrave; tout conteneur Spark pour lequel aucune propri&eacute;t&eacute; layout n’a &eacute;t&eacute; d&eacute;finie.
Pour les conteneurs MX, la pr&eacute;sentation absolute ne peut &ecirc;tre appliqu&eacute;e qu’&agrave; Application, Canvas et Panel. Pour le
conteneur Canvas, absolute est la pr&eacute;sentation par d&eacute;faut. Pour les conteneurs MX Application et Panel, d&eacute;finissez la
propri&eacute;t&eacute; layout sur absolute pour appliquer le positionnement absolu.
La propri&eacute;t&eacute; layout=&quot;absolute&quot; des conteneurs MX remplace la r&egrave;gle de pr&eacute;sentation du conteneur et vous permet
de faire glisser les composants et de les positionner n’importe o&ugrave; dans le conteneur.
Utilisation de pr&eacute;sentations bas&eacute;es sur des contraintes avanc&eacute;es
Vous pouvez d&eacute;finir des contraintes provoquant l’ancrage &agrave; des r&eacute;gions de contrainte horizontales et verticales. Les
contraintes avanc&eacute;es sont utiles dans les situations suivantes :
• Les contr&ocirc;les sont redimensionn&eacute;s dynamiquement en fonction de leur contenu, par exemple lorsqu’ils affichent
des cha&icirc;nes localis&eacute;es.
• Vous voulez plusieurs colonnes de taille identique ou devant respecter un pourcentage de largeur sp&eacute;cifique.
Remarque : les conteneurs HGroup et VGroup imbriqu&eacute;s permettent d’obtenir des r&eacute;sultats proches de ceux obtenus avec
les contraintes avanc&eacute;es.
Pour les pr&eacute;sentations bas&eacute;es sur des contraintes avanc&eacute;es, d&eacute;finissez des r&eacute;gions ConstraintColumn et
ConstraintRow. Ancrez les composants aux bords ou au centre de ces r&eacute;gions. Les colonnes de contraintes sont
dispos&eacute;es dans le conteneur de gauche &agrave; droite et les lignes de contraintes du haut vers le bas.
Les r&eacute;gions de contraintes peuvent &ecirc;tre d&eacute;finies par des dimensions de pixels fixes (largeur ou hauteur) ou sous la
forme d’un pourcentage d’espace dans le conteneur parent. L’ensemble de colonnes et de lignes de contraintes peut
poss&eacute;der un m&eacute;lange de dimensions fixes et de pourcentage.
Les composants situ&eacute;s dans un conteneur parent peuvent &ecirc;tre ancr&eacute;s au conteneur, &agrave; des r&eacute;gions de contraintes ou &agrave;
toute association de conteneurs et de r&eacute;gions de contraintes.
Utilisez l’&eacute;diteur MXML en mode Source pour sp&eacute;cifier des contraintes avanc&eacute;es.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 207
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
D&eacute;finition de contraintes de pr&eacute;sentation pour les composants
Vous pouvez d&eacute;finir une pr&eacute;sentation bas&eacute;e sur des contraintes pour les composants d’un conteneur dot&eacute; de
positionnement absolu.
Remarque : les contraintes de pr&eacute;sentation d&eacute;finies par des colonnes et lignes de contraintes peuvent &ecirc;tre sp&eacute;cifi&eacute;es
uniquement par l’&eacute;dition du code source.
1 Assurez-vous que le fichier MXML contient un conteneur dot&eacute; du positionnement absolu.
2 En mode Cr&eacute;ation de l’&eacute;diteur MXML, faites glisser un composant de la vue Composants vers le conteneur.
3 Positionnez le composant dans le conteneur en le d&eacute;pla&ccedil;ant dans la zone de cr&eacute;ation ou en d&eacute;finissant ses propri&eacute;t&eacute;s
x et y dans la vue Propri&eacute;t&eacute;s (Fen&ecirc;tre &gt; Propri&eacute;t&eacute;s).
4 S&eacute;lectionnez un composant dans la zone de cr&eacute;ation.
5 Dans la vue Propri&eacute;t&eacute;s, acc&eacute;dez &agrave; l’outil de contraintes dans la cat&eacute;gorie Pr&eacute;sentation.
6 En vous servant du tableau suivant comme guide, cochez les cases de contraintes pour obtenir l’effet voulu lorsque
l’utilisateur redimensionne l’application.
Effet
Contraintes
Conserver la position et la taille du composant
Aucun(e)
D&eacute;placer le composant &agrave; l’horizontale
Gauche ou Droite
D&eacute;placer le composant &agrave; la verticale
Haut ou Bas
D&eacute;placer le composant &agrave; l’horizontale et &agrave; la verticale
Gauche et Haut ou
Droite et Bas
Redimensionner le composant &agrave; l’horizontale
Gauche et Droite
Redimensionner le composant &agrave; la verticale
Haut et Bas
Redimensionner le composant &agrave; l’horizontale et &agrave; la verticale
Gauche et Droite et
Haut et Bas
Centrer le composant &agrave; l’horizontale
Centre horizontal
Centrer le composant &agrave; la verticale
Centre vertical
Centrer le composant &agrave; l’horizontale et &agrave; la verticale
Centre horizontal et Centre vertical
7 Sp&eacute;cifiez la distance des contraintes par rapport aux bords du conteneur.
Par exemple, vous pouvez d&eacute;finir le composant de mani&egrave;re &agrave; conserver sa position &agrave; 90 pixels du bord gauche et &agrave;
60 pixels du bord droit. Si l’utilisateur redimensionne l’application, le composant s’&eacute;tire ou se comprime pour
conserver ces distances par rapport aux bords de la fen&ecirc;tre de l’application.
Flash Builder exprime ces contraintes en code MXML comme suit :
&lt;s:TextInput y=&quot;160&quot; left=&quot;90&quot; right=&quot;60&quot;/&gt;
Remarque : la valeur de y varie en fonction des valeurs d&eacute;finies pour les contraintes Gauche et Droite.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 208
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Cr&eacute;ation de gestionnaires d’&eacute;v&eacute;nement
Les applications Flex sont orient&eacute;es &eacute;v&eacute;nements. Les composants de l’interface utilisateur r&eacute;agissent &agrave; divers
&eacute;v&eacute;nements, par exemple lorsqu’un utilisateur clique sur un bouton ou lorsque l’initialisation d’un objet est termin&eacute;e.
Les gestionnaires d’&eacute;v&eacute;nement, r&eacute;dig&eacute;s en code ActionScript, d&eacute;finissent la mani&egrave;re dont les composants r&eacute;agissent &agrave;
l’&eacute;v&eacute;nement.
Remarque : vous pouvez &eacute;galement g&eacute;n&eacute;rer des gestionnaires d’&eacute;v&eacute;nement pour des &eacute;l&eacute;ments non visibles, tels que
RemoteObject et HTTPService.
Flash Builder assiste l’utilisateur par la g&eacute;n&eacute;ration des fonctions des gestionnaires d’&eacute;v&eacute;nement pour un composant.
Dans la fonction g&eacute;n&eacute;r&eacute;e, r&eacute;digez le code qui d&eacute;finit le comportement du composant en r&eacute;ponse &agrave; l’&eacute;v&eacute;nement.
L’assistance pour la g&eacute;n&eacute;ration des gestionnaires d’&eacute;v&eacute;nement est accessible :
• &agrave; partir de la vue Propri&eacute;t&eacute;s ;
• &agrave; partir du menu contextuel d’un &eacute;l&eacute;ment en mode Cr&eacute;ation de l’&eacute;diteur MXML ;
• &agrave; partir du menu contextuel d’un &eacute;l&eacute;ment en mode Source de l’&eacute;diteur MXML.
A propos des gestionnaires d’&eacute;v&eacute;nement g&eacute;n&eacute;r&eacute;s
Lorsque Flash Builder g&eacute;n&egrave;re une fonction de gestionnaire d’&eacute;v&eacute;nement, il place le gestionnaire d’&eacute;v&eacute;nement dans le
premier bloc Script du fichier. La fonction est plac&eacute;e &agrave; la fin du bloc Script. Le gestionnaire d’&eacute;v&eacute;nement g&eacute;n&eacute;r&eacute; a un
acc&egrave;s prot&eacute;g&eacute; et accepte la sous-classe appropri&eacute;e de la classe Event comme seul param&egrave;tre.
Flash Builder g&eacute;n&egrave;re soit un nom unique pour le gestionnaire d’&eacute;v&eacute;nement en fonction du nom de la classe du
composant, soit un nom personnalis&eacute; pour le gestionnaire d’&eacute;v&eacute;nement sp&eacute;cifi&eacute;. Si vous ne pr&eacute;cisez pas de nom
personnalis&eacute;, le nom est g&eacute;n&eacute;r&eacute; selon le processus suivant :
• Si une propri&eacute;t&eacute; ID est d&eacute;finie, Flash Builder en d&eacute;rive le nom.
• Si aucune propri&eacute;t&eacute; ID n’est d&eacute;finie pour le composant, Flash Builder g&eacute;n&egrave;re un nom unique, bas&eacute; sur le nom de la
classe du composant.
Vous devez fournir le corps du gestionnaire d’&eacute;v&eacute;nement. Le bloc de code suivant contient un gestionnaire
d’&eacute;v&eacute;nement g&eacute;n&eacute;r&eacute; pour un contr&ocirc;le Button.
. . .
&lt;fx:Script&gt;
&lt;![CDATA[
protected function myButton_clickHandler(event:MouseEvent):void
{
// TODO Auto-generated method stub
}
]]&gt;
&lt;/fx:Script&gt;
&lt;s:Button label=&quot;Button&quot; id=&quot;myButton&quot; click=&quot;myButton_clickHandler(event)&quot;/&gt;
. . .
Flash Builder d&eacute;signe un &eacute;v&eacute;nement par d&eacute;faut pour chaque composant de l’interface utilisateur. Par exemple,
l’&eacute;v&eacute;nement par d&eacute;faut d’un contr&ocirc;le Button est l’&eacute;v&eacute;nement click. Vous pouvez pr&eacute;ciser le gestionnaire d’&eacute;v&eacute;nement
pour l’&eacute;v&eacute;nement par d&eacute;faut dans la Vue standard de la vue Propri&eacute;t&eacute;s. Pour sp&eacute;cifier les gestionnaires d’autres
&eacute;v&eacute;nements, s&eacute;lectionnez Vue par cat&eacute;gories &gt; Ev&eacute;nements.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 209
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Vous pouvez &eacute;galement g&eacute;n&eacute;rer des gestionnaires d’&eacute;v&eacute;nement en faisant appel &agrave; l’Assistant de contenu en mode
Source.
G&eacute;n&eacute;ration de gestionnaires d’&eacute;v&eacute;nement &agrave; partir de la vue Propri&eacute;t&eacute;s
1 En mode Cr&eacute;ation, s&eacute;lectionnez un &eacute;l&eacute;ment, puis s&eacute;lectionnez la Vue standard dans la vue Propri&eacute;t&eacute;s.
La zone Commun comporte un champ d’&eacute;dition pour le gestionnaire d’&eacute;v&eacute;nement par d&eacute;faut.
2 Pour g&eacute;n&eacute;rer un gestionnaire pour l’&eacute;v&eacute;nement par d&eacute;faut :
a (Facultatif) Dans le champ de texte Lors d’un Ev&eacute;nement, saisissez un nom pour l’&eacute;v&eacute;nement.
Dans le champ Lors d’un clic d’un composant Button, indiquez par exemple MyButtonClick.
Si vous ne sp&eacute;cifiez aucun nom, Flash Builder g&eacute;n&egrave;re un nom unique pour l’&eacute;v&eacute;nement.
Lorsque vous pr&eacute;cisez un nom pour le gestionnaire d’&eacute;v&eacute;nement, vous avez la possibilit&eacute; de sp&eacute;cifier un
param&egrave;tre d’&eacute;v&eacute;nement. Si vous ne le faites pas, Flash Builder g&eacute;n&egrave;re le param&egrave;tre avec un type d’&eacute;v&eacute;nement
appropri&eacute;.
b Cliquez sur l’ic&ocirc;ne repr&eacute;sentant un &eacute;clair, puis s&eacute;lectionnez G&eacute;n&eacute;rer un gestionnaire d’&eacute;v&eacute;nement.
L’&eacute;diteur bascule en mode Source et met en &eacute;vidence le corps du gestionnaire d’&eacute;v&eacute;nement g&eacute;n&eacute;r&eacute;. Saisissez
l’impl&eacute;mentation de l’&eacute;v&eacute;nement.
3 Pour g&eacute;n&eacute;rer un gestionnaire pour un &eacute;v&eacute;nement d’un &eacute;l&eacute;ment s&eacute;lectionn&eacute; :
a Dans la Vue par cat&eacute;gories, d&eacute;veloppez le nœud Ev&eacute;nements afin d’afficher tous les &eacute;v&eacute;nements correspondant
&agrave; l’&eacute;l&eacute;ment.
b (Facultatif) Double-cliquez sur le nom de l’&eacute;v&eacute;nement pour activer la zone de texte du nom du gestionnaire
d’&eacute;v&eacute;nement et saisissez le nom.
c Cliquez sur l’ic&ocirc;ne dans le champ Valeur pour cr&eacute;er le gestionnaire d’&eacute;v&eacute;nement.
L’&eacute;diteur bascule en mode Source et met en &eacute;vidence le corps du gestionnaire d’&eacute;v&eacute;nement g&eacute;n&eacute;r&eacute;. Saisissez
l’impl&eacute;mentation de l’&eacute;v&eacute;nement.
G&eacute;n&eacute;ration de gestionnaires d’&eacute;v&eacute;nement &agrave; l’aide du menu contextuel d’un &eacute;l&eacute;ment
1 Dans la vue Cr&eacute;ation, ouvrez le menu contextuel d’un &eacute;l&eacute;ment.
2 Effectuez l’une des actions suivantes :
• S&eacute;lectionnez l’&eacute;v&eacute;nement par d&eacute;faut pour l’&eacute;l&eacute;ment.
Par exemple, pour un &eacute;l&eacute;ment Button, s&eacute;lectionnez G&eacute;n&eacute;ration du gestionnaire de clics.
• Choisissez Afficher tous les &eacute;v&eacute;nements pour ouvrir la liste d’&eacute;v&eacute;nements dans la vue Propri&eacute;t&eacute;s.
Pr&eacute;cisez un gestionnaire d’&eacute;v&eacute;nement dans la vue Propri&eacute;t&eacute;s.
L’&eacute;diteur bascule en mode Source et met en &eacute;vidence le corps du gestionnaire d’&eacute;v&eacute;nement g&eacute;n&eacute;r&eacute;. Saisissez
l’impl&eacute;mentation de l’&eacute;v&eacute;nement.
G&eacute;n&eacute;ration de gestionnaires d’&eacute;v&eacute;nement &agrave; l’aide de l’assistant de contenu
1 Dans un bloc MXML en mode Source, cr&eacute;ez un composant, mais sans pr&eacute;ciser d’&eacute;v&eacute;nements.
2 Activez l’assistant de contenu pour les propri&eacute;t&eacute;s d’un composant en ins&eacute;rant un espace apr&egrave;s le nom de la classe.
3 Dans la liste de propri&eacute;t&eacute;s s&eacute;lectionn&eacute;es, s&eacute;lectionnez un &eacute;v&eacute;nement (doubleClick, par exemple).
4 Appuyez sur Ctrl+Espace et s&eacute;lectionnez G&eacute;n&eacute;rer un gestionnaire d’&eacute;v&eacute;nement.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 210
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Flash Builder g&eacute;n&egrave;re un nom unique pour le gestionnaire d’&eacute;v&eacute;nement et place ce dernier dans le bloc Script.
Remarque : si vous avez sp&eacute;cifi&eacute; un nom personnalis&eacute; pour le gestionnaire d’&eacute;v&eacute;nement, Flash Builder ne peut pas
g&eacute;n&eacute;rer le gestionnaire. Pour utiliser un nom personnalis&eacute;, g&eacute;n&eacute;rez d’abord un gestionnaire d’&eacute;v&eacute;nement, puis
modifiez-en le nom aussi bien dans la propri&eacute;t&eacute; event que dans le gestionnaire g&eacute;n&eacute;r&eacute;.
Application de th&egrave;mes
Les th&egrave;mes permettent de personnaliser l’aspect de vos applications. Flash Builder offre un choix de plusieurs th&egrave;mes.
Vous pouvez &eacute;galement importer d’autres th&egrave;mes ou cr&eacute;er les v&ocirc;tres.
Flash Builder comporte des th&egrave;mes Spark et Halo. Le th&egrave;me par d&eacute;faut des composants Flex 4 est Spark et celui des
composants Flex 3 est Halo.
Pour plus d’informations sur la prise en charge des th&egrave;mes dans Flex, voir About themes.
Sp&eacute;cification d’un th&egrave;me
Sp&eacute;cifiez des th&egrave;mes par projet. Une fois que vous avez pr&eacute;cis&eacute; un th&egrave;me pour un projet, toutes les applications du
projet le partagent.
1 Ouvrez la bo&icirc;te de dialogue S&eacute;lectionner le th&egrave;me du projet &agrave; partir de la vue Cr&eacute;ation ou de la vue Source de
l’&eacute;diteur MXML :
• (Vue Cr&eacute;ation) S&eacute;lectionnez le panneau Aspect. S&eacute;lectionnez ensuite le Th&egrave;me actuel.
• (Vue Source) Dans la barre de menus de Flash Builder, s&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Th&egrave;me Flex.
2 S&eacute;lectionnez un th&egrave;me puis cliquez sur OK.
Importation de th&egrave;mes
Flash Builder vous permet d’importer des th&egrave;mes. Les fichiers correspondant &agrave; un th&egrave;me doivent &ecirc;tre inclus dans un
dossier. Tous les fichiers requis pour un th&egrave;me Flex doivent &ecirc;tre pr&eacute;sents.
Le nom du th&egrave;me est d&eacute;termin&eacute; par l’&eacute;l&eacute;ment de nom du fichier metadata.xml situ&eacute; dans le dossier des th&egrave;mes. Si
l’&eacute;l&eacute;ment de nom n’est pas pr&eacute;cis&eacute; ou si metadata.xml est absent, le th&egrave;me prend le nom du dossier des th&egrave;mes.
Pour plus d’informations sur le format requis pour les th&egrave;mes Flex, voir &laquo; Cr&eacute;ation de th&egrave;mes &raquo; &agrave; la page 211.
Les th&egrave;mes de Flash Builder peuvent prendre les formats suivants :
• Fichier de th&egrave;me ZIP
Extrayez le contenu du fichier ZIP avant d’importer le th&egrave;me. Le contenu extrait doit englober tous les fichiers
requis.
• Fichier CSS ou SWC pour un th&egrave;me
Le fichier CSS ou SWC doit se trouver dans un dossier contenant tous les fichiers requis pour un th&egrave;me Flex.
Lorsque vous importez un th&egrave;me &agrave; l’aide de Flash Builder, vous s&eacute;lectionnez le fichier CSS ou SWC correspondant
&agrave; ce th&egrave;me.
• Fichier MXP
Adobe Extension Manager CS4 vous permet d’assembler des fichiers correspondant &agrave; des th&egrave;mes Flex dans un
fichier MXP. Vous pouvez ensuite importer le th&egrave;me dans Flash Builder par le biais de l’Extension Manager.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 211
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Pour plus d’informations sur l’assemblage de th&egrave;mes dans un fichier MXP, voir &laquo; Cr&eacute;ation d’un fichier d’extension
(fichier MXP) pour un th&egrave;me Flex &raquo; &agrave; la page 213.
Importation de th&egrave;mes Flex &agrave; l’aide de Flash Builder
1 Ouvrez la bo&icirc;te de dialogue S&eacute;lectionner le th&egrave;me du projet &agrave; partir de la vue Cr&eacute;ation ou de la vue Source de
l’&eacute;diteur MXML :
• (Vue Cr&eacute;ation) S&eacute;lectionnez le panneau Aspect. S&eacute;lectionnez ensuite le Th&egrave;me actuel.
• (Vue Source) Dans la barre de menus de Flash Builder, s&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Th&egrave;me Flex.
2 S&eacute;lectionnez Importer un th&egrave;me, acc&eacute;dez au dossier contenant le th&egrave;me &agrave; importer, s&eacute;lectionnez le fichier CSS ou
SWC, puis cliquez sur OK.
Importation de th&egrave;mes Flex assembl&eacute;s dans un fichier MXP
1 Importez Adobe Flash&reg; Builder™ 4 dans Adobe Extension Manager CS4 (pour autant que ce ne soit d&eacute;j&agrave; fait) :
Dans Adobe Extension Manager, s&eacute;lectionnez Fichier &gt; Import Product.
2 Dans Adobe Extension Manager, s&eacute;lectionnez Flash Builder 4.
3 S&eacute;lectionnez Fichier &gt; Installer l’extension, acc&eacute;dez au fichier MXP correspondant au th&egrave;me, puis cliquez sur
Ouvrir.
Une fois que vous avez accept&eacute; la licence, Adobe Extension Manager installe le th&egrave;me dans Flash Builder. Il est
d&eacute;sormais disponible dans la bo&icirc;te de dialogue S&eacute;lectionner le th&egrave;me du projet de Flash Builder.
Remarque : vous pouvez &eacute;galement double-cliquer sur le fichier MXP pour appeler Adobe Extension Manager, qui
installe alors le th&egrave;me automatiquement.
T&eacute;l&eacute;chargement de th&egrave;mes
Vous pouvez t&eacute;l&eacute;charger des th&egrave;mes que vous pourrez ensuite importer dans Flash Builder.
T&eacute;l&eacute;chargement de th&egrave;mes Flex
1 Ouvrez la bo&icirc;te de dialogue S&eacute;lectionner le th&egrave;me du projet &agrave; partir de la vue Cr&eacute;ation ou de la vue Source de
l’&eacute;diteur MXML :
• (Vue Cr&eacute;ation) S&eacute;lectionnez le panneau Aspect. S&eacute;lectionnez ensuite le Th&egrave;me actuel.
• (Vue Source) Dans la barre de menus de Flash Builder, s&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Th&egrave;me Flex.
2 S&eacute;lectionnez D&eacute;couvrir d’autres th&egrave;mes.
Flash Builder ouvre votre navigateur Web par d&eacute;faut &agrave; une page contenant des th&egrave;mes &agrave; t&eacute;l&eacute;charger. Vous pouvez
&eacute;galement acc&eacute;der &agrave; tout autre site contenant des th&egrave;mes Flex t&eacute;l&eacute;chargeables.
3 S&eacute;lectionnez un th&egrave;me Flex &agrave; t&eacute;l&eacute;charger.
Une fois le th&egrave;me t&eacute;l&eacute;charg&eacute;, vous pouvez l’importer, comme d&eacute;crit dans &laquo; Importation de th&egrave;mes &raquo; &agrave; la page 210.
Cr&eacute;ation de th&egrave;mes
Vous pouvez cr&eacute;er vos propres th&egrave;mes et les importer dans Flash Builder. Un th&egrave;me Flex contient g&eacute;n&eacute;ralement les
fichiers suivants :
• Des fichiers SWC, SWF, CSS, PNG et JPEG ainsi que d’autres fichiers composant le th&egrave;me.
Les fichiers composant le th&egrave;me peuvent varier, mais ils doivent comprendre un fichier SWC ou CSS.
Derni&egrave;re mise &agrave; jour le 29/4/2010
•
UTILISATION DE FLASH BUILDER 4 212
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Un fichier preview.jpg.
Il s’agit du fichier image d’aper&ccedil;u pour le th&egrave;me. Si le dossier de th&egrave;me ne contient pas preview.jpg, Flash Builder
fait appel &agrave; une image d’aper&ccedil;u par d&eacute;faut pour le th&egrave;me.
•
Un fichier metadata.xml.
Ce fichier contient des informations relatives au th&egrave;me, notamment les versions du SDK avec lesquelles le th&egrave;me
est compatible. Si le dossier de th&egrave;me ne contient pas ce fichier, Flash Builder en cr&eacute;e un lors de l’importation du
th&egrave;me.
Un th&egrave;me est g&eacute;n&eacute;ralement assembl&eacute; dans un fichier ZIP, mais celui-ci doit &ecirc;tre extrait avant l’importation du th&egrave;me
dans Flash Builder. Vous pouvez aussi assembler les fichiers de th&egrave;mes dans un fichier Adobe Extension Manager
(MXP) et utiliser Adobe Extension Manager pour importer le th&egrave;me dans Flash Builder.
Pour plus d’informations, voir About themes.
Fichier metadata.xml
Le tableau suivant r&eacute;pertorie les &eacute;l&eacute;ments pouvant &ecirc;tre inclus dans le fichier metadata.xml.
Nom d’&eacute;l&eacute;ment
Description
Name
Nom du th&egrave;me tel qu’il appara&icirc;t dans Flash Builder.
Lors de l’importation d’un th&egrave;me avec Flash Builder, vous pouvez remplacer le
nom sp&eacute;cifi&eacute; dans le fichier metadata.xml.
Category
Auteur du th&egrave;me. Cat&eacute;gorie sous laquelle le th&egrave;me est affich&eacute; dans Flash
Builder.
sdks
Pr&eacute;cise les versions du SDK Flex avec lesquelles le th&egrave;me est compatible. C’est
un &eacute;l&eacute;ment parent de minVersionInclusive et maxVersionExclusive.
Si l’&eacute;l&eacute;ment sdks est absent, le th&egrave;me est valide pour tous les SDK.
minVersionInclusive
Version la plus ancienne du SDK Flex avec laquelle ce th&egrave;me est compatible. Si
cette information est absente, ce th&egrave;me est compatible avec toutes les versions
ant&eacute;rieures du SDK Flex.
maxVersionExclusive
Version la plus r&eacute;cente du SDK Flex avec laquelle ce th&egrave;me est compatible. Si
cette information est absente, ce th&egrave;me est compatible avec toutes les versions
ult&eacute;rieures du SDK Flex.
mainFile
Fichier de niveau sup&eacute;rieur pour l’impl&eacute;mentation du th&egrave;me. Ce fichier peut
r&eacute;f&eacute;rencer d’autres fichiers dans le th&egrave;me. Par exemple, un fichier CSS pourrait
r&eacute;f&eacute;rencer un fichier SWC ou SWF.
L’argument -theme du compilateur r&eacute;f&eacute;rence le fichier sp&eacute;cifi&eacute;.
L’exemple suivant illustre un fichier metadata.xml standard correspondant &agrave; un th&egrave;me cr&eacute;&eacute; par la soci&eacute;t&eacute; ABC.
&lt;theme&gt;
&lt;name&gt;WindowsLookAlike&lt;/name&gt;
&lt;category&gt;ABC&lt;/category&gt;
&lt;sdks&gt;
&lt;minVersionInclusive&gt;2.0.1&lt;/minVersionInclusive&gt;
&lt;maxVersionExclusive&gt;4.0.0&lt;/maxVersionExclusive&gt;
&lt;/sdks&gt;
&lt;mainFile&gt;WindowsLookAlike.css&lt;/mainFile&gt;
&lt;/theme&gt;
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 213
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Selon le fichier metadata.xml, le th&egrave;me est compatible avec le SDK Flex 2.0.1. Il est aussi compatible avec des SDK
jusqu’&agrave; la version Flex 4.0.0 (non incluse). Lorsque ce th&egrave;me est s&eacute;lectionn&eacute;, WindowsLookAlike.css est le fichier
ajout&eacute; &agrave; l’argument de compilateur -themes.
Cr&eacute;ation d’un fichier d’extension (fichier MXP) pour un th&egrave;me Flex
Adobe Extension Manager CS4 vous permet de cr&eacute;er un fichier d’extension (fichier MXP) pour un th&egrave;me Flex. Vous
pouvez ensuite importer le fichier MXP dans Flash Builder par le biais d’Adobe Extension Manager CS4.
Placez tous vos fichiers de th&egrave;me dans un dossier hi&eacute;rarchique, puis cr&eacute;ez un fichier d’installation d’extensions (fichier
MXI), qu’Extension Manager utilisera pour cr&eacute;er le fichier MXP. Pour plus d’informations sur le format d’un fichier
MXI, reportez-vous au document Extension File Format.
Lors de la cr&eacute;ation du fichier MXI, vous devez pr&eacute;ciser un chemin de destination pour chacun des fichiers du th&egrave;me.
Les chemins sont au format suivant :
$flexbuilder/&lt;Theme Name&gt;
•
$flexbuilder est d&eacute;fini dans le fichier de configuration Flash Builder, XManConfig.xml. Extension Manager
d&eacute;veloppe $flexbuilder selon cette d&eacute;finition. XManConfig.xml se trouve &agrave; l’emplacement suivant dans votre
syst&egrave;me de fichiers :
/&lt;Install Dir&gt;/Flash Builder 4/configuration/XManConfig.xml
• &lt;Theme Name&gt; est le nom du dossier destin&eacute; &agrave; contenir le th&egrave;me Flex.
Cr&eacute;ation d’un fichier d’extension MXP pour un th&egrave;me Flex
1 Placez tous les fichiers correspondant au th&egrave;me, notamment le fichier MXI, dans un dossier hi&eacute;rarchique.
2 Dans Extension Manager, s&eacute;lectionnez Fichier &gt; Empaqueter l’extension.
3 Acc&eacute;dez au fichier d’installation d’extension souhait&eacute; et s&eacute;lectionnez-le.
4 Recherchez un emplacement pour le fichier de package et nommez-le avec l’extension .mxp.
Vous pouvez ensuite tester le fichier d’extension en l’installant par le biais d’Extension Manager.
Ajout de th&egrave;mes
Vous pouvez d&eacute;finir plusieurs fichiers de th&egrave;mes pour une application. En l’absence de chevauchement de styles, les
deux th&egrave;mes sont appliqu&eacute;s dans leur int&eacute;gralit&eacute;. D’autres aspects doivent &eacute;galement &ecirc;tre pris en consid&eacute;ration lors de
l’ajout de th&egrave;mes. L’un d’eux est l’ordre des fichiers de th&egrave;mes.
Pour ajouter des th&egrave;mes, utilisez le compilateur de ligne de commande mxmlc avec l’option de compilateur theme afin
de sp&eacute;cifier le chemin d’acc&egrave;s aux fichiers de th&egrave;mes.
Using themes fournit des informations sur la d&eacute;finition des arguments du compilateur et sur l’ordre des fichiers de
th&egrave;mes.
Application de styles
Les styles modifient l’aspect de l’application par la d&eacute;finition de valeurs pour les param&egrave;tres visuels des composants.
Vous pouvez d&eacute;finir des styles s’appliquant &agrave; tous les composants d’une application, &agrave; des composants individuels ou
&agrave; des groupes de composants r&eacute;f&eacute;renc&eacute;s par un s&eacute;lecteur de style.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 214
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Vous pouvez par exemple d&eacute;finir les styles suivants :
• Texte
Famille, taille, couleur et &eacute;paisseur de la police ainsi que d’autres param&egrave;tres d’affichage (gras, italique et soulign&eacute;,
par exemple).
• Bordure
Epaisseur, couleur, couleur au survol, style (pleine, incrust&eacute;, sortant, aucune), rayon de l’angle et autres.
• Couleur
Couleur de remplissage et alpha.
Remarque : les styles disponibles varient en fonction des composants.
Vous pouvez d&eacute;finir des propri&eacute;t&eacute;s de style de mani&egrave;re intraligne sur une balise MXML ou s&eacute;par&eacute;ment &agrave; l’aide de code
CSS. Le code CSS peut &ecirc;tre plac&eacute; &agrave; l’int&eacute;rieur de balises &lt;fx:Style&gt; dans une application ou dans un fichier CSS
distinct.
Lorsque vous appliquez des styles intralignes &agrave; des composants, vous pouvez convertir les styles des composants en
r&egrave;gle CSS dans une feuille de style externe. Vous pouvez utiliser l’&eacute;diteur CSS pour modifier les fichiers CSS.
Vous pouvez &eacute;galement convertir en styles les habillages appliqu&eacute;s &agrave; un composant.
Acc&eacute;dez au mode Cr&eacute;ation de l’&eacute;diteur MXML pour appliquer des styles &agrave; une application ou &agrave; des composants
sp&eacute;cifiques d’une application. Le mode Cr&eacute;ation vous permet en outre de convertir les styles ou les habillages appliqu&eacute;s
en feuilles de style CSS.
Comparaison des styles et des habillages
L’application d’un habillage consiste &agrave; changer l’aspect d’un composant par la modification ou le remplacement de ses
&eacute;l&eacute;ments visuels. Ces &eacute;l&eacute;ments peuvent &ecirc;tre constitu&eacute;s d’images bitmap, de fichiers SWF ou de fichiers de classe
contenant des m&eacute;thodes de dessin d&eacute;finissant des images vectorielles. Les habillages peuvent d&eacute;finir l’aspect des
diff&eacute;rents &eacute;tats d’un composant. Vous pouvez par exemple d&eacute;finir l’aspect des &eacute;tats up, down, over et disabled d’un
composant Button.
Flash Builder vous permet de convertir l’habillage d’un composant en styles CSS.
Application de styles
Acc&eacute;dez &agrave; la vue Aspect pour d&eacute;finir les styles valables pour l’ensemble de l’application. Flash Builder enregistre le style
d&eacute;fini dans cette vue en tant que s&eacute;lecteur de style CSS global.
1 En mode Cr&eacute;ation de l’&eacute;diteur MXML, ouvrez une application MXML contenant plusieurs composants.
2 Dans la vue Aspect, sp&eacute;cifiez des styles globaux pour l’application.
Si la vue Aspect n’est pas ouverte, vous pouvez y acc&eacute;der en s&eacute;lectionnant Fen&ecirc;tre &gt; Autres vues &gt; Flash Builder &gt;
Aspect.
Une fois les styles appliqu&eacute;s, Flash Builder cr&eacute;e un s&eacute;lecteur de style CSS global pour le style sp&eacute;cifi&eacute;.
S’il s’agit du premier style r&eacute;f&eacute;renc&eacute; dans l’application, Flash Builder cr&eacute;e un nouveau fichier CSS et le r&eacute;f&eacute;rence
dans le fichier de l’application MXML.
Si l’application r&eacute;f&eacute;rence d&eacute;j&agrave; un fichier CSS ou un bloc &lt;fx:Style&gt;, Flash Builder met &agrave; jour le fichier CSS avec
le s&eacute;lecteur de style global.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 215
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Application de styles intralignes &agrave; un composant
Vous pouvez d&eacute;finir des styles intralignes pour les composants dans la vue Propri&eacute;t&eacute;s.
1 En mode Cr&eacute;ation de l’&eacute;diteur MXML, ouvrez une application MXML contenant plusieurs composants.
2 S&eacute;lectionnez un composant et sp&eacute;cifiez les valeurs des propri&eacute;t&eacute;s de style dans la zone Style de la vue Propri&eacute;t&eacute;s.
La zone Style change, en fonction du composant s&eacute;lectionn&eacute;.
Vue Propri&eacute;t&eacute;s affichant les styles d’un DataGrid
3 Dans la vue Propri&eacute;t&eacute;s, s&eacute;lectionnez la Vue par cat&eacute;gories pour r&eacute;pertorier tous les styles qui peuvent &ecirc;tre appliqu&eacute;s
au composant s&eacute;lectionn&eacute;.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 216
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Remarque : dans Flex, les noms de style compos&eacute;s peuvent &ecirc;tre orthographi&eacute;s &agrave; la mani&egrave;re des identifiants
ActionScript (fontFamily, par exemple) ou des styles HTML (font-family, par exemple).
4 Une fois un style sp&eacute;cifi&eacute;, basculez en mode Source pour afficher le code intraligne g&eacute;n&eacute;r&eacute; qui applique le style.
Application d’un style externe ou int&eacute;gr&eacute;
Vous pouvez int&eacute;grer des styles CSS dans un fichier d’application MXML ou r&eacute;f&eacute;rencer un fichier CSS externe.
L’exemple suivant illustre du code CSS appliquant des styles &agrave; tous les composants Spark Button d’une application. Ce
code g&eacute;n&egrave;re &eacute;galement le s&eacute;lecteurmyStyle qui peut &ecirc;tre appliqu&eacute; &agrave; n’importe quel composant :
@namespace s &quot;library://ns.adobe.com/flex/spark&quot;;
@namespace mx &quot;library://ns.adobe.com/flex/mx&quot;;
s|Button { fontSize: 16pt; color: Red } /* type selector */
.myStyle { color: Red } /* class selector */
Pour les styles appliqu&eacute;s &agrave; des composants (par exemple s|Button), le s&eacute;lecteur pour composants doit sp&eacute;cifier un
espace de noms. Dans cet exemple, s|Button d&eacute;finit un style qui est automatiquement appliqu&eacute; &agrave; tous les composants
Spark Button.
Utilisez la notation &agrave; points CSS pour cr&eacute;er un s&eacute;lecteur pouvant &ecirc;tre appliqu&eacute; &agrave; n’importe quel composant. Dans cet
exemple, .myStyle ne doit pas d&eacute;clarer d’espace de noms et peut &ecirc;tre appliqu&eacute; &agrave; n’importe quel composant.
Flex d&eacute;finit un cadre pr&eacute;cis pour la cr&eacute;ation et l’application de styles. Pour plus d’informations, voir Using styles in Flex.
Application de styles
1 En mode Cr&eacute;ation de l’&eacute;diteur MXML, cr&eacute;ez un fichier d’application MXML contenant plusieurs composants
Spark Button et un composant CheckBox.
2 (Styles int&eacute;gr&eacute;s) En mode Source, ajoutez le code suivant &agrave; l’application :
&lt;fx:Style&gt;
@namespace s &quot;library://ns.adobe.com/flex/spark&quot;;
@namespace mx &quot;library://ns.adobe.com/flex/halo&quot;;
s|Button { fontSize: 16pt; color: Red } /* type selector */
.myStyle { fontSize: 16pt; color: Blue } /* class selector */
&lt;/fx:Style&gt;
3 (Feuilles de style externes) Cr&eacute;ez une feuille de style qui impl&eacute;mente les s&eacute;lecteurs s|Button et .myStyle &agrave;
l’Etape 1. En mode Source, r&eacute;f&eacute;rencez le fichier &agrave; partir du fichier d’application MXML :
&lt;fx:Style source=&quot;styles.css&quot;/&gt;
4 Basculez en mode Cr&eacute;ation. Vous remarquerez que le style a &eacute;t&eacute; appliqu&eacute; aux composants Spark Button.
5 S&eacute;lectionnez le composant CheckBox. Dans la vue Propri&eacute;t&eacute;s, s&eacute;lectionnez ensuite Styles &gt; myStyle.
Vous remarquerez que le stylemyStyle a &eacute;t&eacute; appliqu&eacute; au composant CheckBox.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 217
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Conversion en CSS
Vous pouvez convertir les styles intralignes et les habillages de composants en styles CSS. La proc&eacute;dure de conversion
vous permet de sp&eacute;cifier si les styles doivent &ecirc;tre appliqu&eacute;s de mani&egrave;re globale ou uniquement &agrave; un composant
sp&eacute;cifique. Vous pouvez &eacute;galement d&eacute;finir un s&eacute;lecteur de style CSS pour les styles g&eacute;n&eacute;r&eacute;s.
1 En mode Cr&eacute;ation de l’&eacute;diteur MXML, s&eacute;lectionnez un composant dans la zone de cr&eacute;ation. Choisissez un
composant int&eacute;grant des styles intralignes ou sp&eacute;cifiant une propri&eacute;t&eacute; skinClass.
Pour plus d’informations sur la sp&eacute;cification d’une propri&eacute;t&eacute; skinClass pour un composant, voir &laquo; G&eacute;n&eacute;ration et
modification d’habillages pour des composants Spark &raquo; &agrave; la page 219.
2 Dans la vue Propri&eacute;t&eacute;s, cliquez sur Convertir en CSS.
3 Si l’espace de travail contient plusieurs projets ouverts, s&eacute;lectionnez/d&eacute;s&eacute;lectionnez les fichiers de ressources &agrave;
enregistrer dans la bo&icirc;te de dialogue d’enregistrement de ressources. Cliquez ensuite sur OK.
4 Dans la bo&icirc;te de dialogue Nouvelle r&egrave;gle de style, s&eacute;lectionnez le fichier .css ou cliquez sur Nouveau pour en cr&eacute;er un.
5 Sp&eacute;cifiez le Type de s&eacute;lecteur en s&eacute;lectionnant l’une des options suivantes :
• Tous les composants
Le style est global et est appliqu&eacute; &agrave; tous les composants de l’application.
• Tous les composants ayant le style
Les composants sp&eacute;cifient ce s&eacute;lecteur de style en utilisant l’attribut styleName. Si vous choisissez cette option,
sp&eacute;cifiez un nom pour le s&eacute;lecteur.
• Composant sp&eacute;cifique
Le style ne s’applique qu’au composant s&eacute;lectionn&eacute;.
• Composant sp&eacute;cifique ayant le style
Le style ne s’applique qu’au composant s&eacute;lectionn&eacute; et r&eacute;f&eacute;rence le style d’apr&egrave;s le nom du s&eacute;lecteur de type. Si
vous choisissez cette option, sp&eacute;cifiez un nom pour le s&eacute;lecteur de type.
6 Cliquez sur OK.
Flash Builder g&eacute;n&egrave;re ou met &agrave; jour le fichier CSS sp&eacute;cifi&eacute;. Il modifie &eacute;galement le code source de l’application de
mani&egrave;re &agrave; r&eacute;f&eacute;rencer le s&eacute;lecteur de type dans le fichier CSS.
Il supprime les r&eacute;f&eacute;rences au style intraligne ou &agrave; la propri&eacute;t&eacute; skinClass pour le composant.
Modification de la r&egrave;gle de style
Lorsque des styles CSS externes sont d&eacute;j&agrave; appliqu&eacute;s &agrave; un composant, vous pouvez passer rapidement du composant &agrave;
l’&eacute;dition de ces styles.
1 S&eacute;lectionnez un composant.
2
Dans la vue Propri&eacute;t&eacute;s, cliquez sur le bouton Modifier la r&egrave;gle de style, situ&eacute; &agrave; droite de la liste d&eacute;roulante Style,
puis s&eacute;lectionnez le style &agrave; modifier.
Le fichier CSS s’ouvre en mode Cr&eacute;ation dans l’&eacute;diteur CSS. La vue Propri&eacute;t&eacute;s vous permet d’apporter des
modifications suppl&eacute;mentaires. Vous pouvez &eacute;galement modifier le fichier CSS en mode Source.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 218
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Cr&eacute;ation de fichiers CSS
Utilisez l’assistant Nouveau fichier CSS pour cr&eacute;er des fichiers CSS pour un projet. Cet assistant cr&eacute;e un fichier vide
que vous pouvez utiliser pour d&eacute;finir vos styles CSS.
Par d&eacute;faut, Flash Builder ajoute les espaces de noms par d&eacute;faut pour les styles Spark et MX.
Pour cr&eacute;er un fichier CSS vide :
1 Dans le menu Flash Builder, s&eacute;lectionnez Fichier &gt; Nouveau fichier CSS.
2 Sp&eacute;cifiez un dossier source.
Le dossier source peut se trouver dans le projet actuel ou dans un autre projet.
3 Sp&eacute;cifiez un package pour le fichier.
S&eacute;lectionnez-le dans les packages disponibles dans le projet. Si vous souhaitez placer le fichier dans un nouveau
package, cr&eacute;ez d’abord ce dernier. S&eacute;lectionnez Fichier &gt; Nouveau package.
4 Sp&eacute;cifiez un nom pour le fichier.
5 Cliquez sur Terminer.
Flash Builder utilise des mod&egrave;les qui d&eacute;finissent le contenu des nouveaux fichiers. Vous avez la possibilit&eacute; de
personnaliser ces mod&egrave;les. Voir &laquo; Personnalisation des mod&egrave;les de fichier &raquo; &agrave; la page 127.
Utilisation de l’&eacute;diteur CSS
Flash Builder comporte un &eacute;diteur CSS que vous pouvez utiliser pour cr&eacute;er et modifier des feuilles de style pour votre
application. L’&eacute;diteur CSS est disponible uniquement en mode Source.
A la cr&eacute;ation d’une nouvelle feuille de style, Flash Builder fournit les d&eacute;clarations suivantes pour les espaces de noms
Spark et MX :
@namespace s &quot;library://ns.adobe.com/flex/spark&quot;;
@namespace mx &quot;library://ns.adobe.com/flex/mx&quot;;
Certains composants Spark et MX partagent le m&ecirc;me nom local. Prenons l’exemple d’un composant Spark Button
(dans le package spark.components.*)et d’un composant MX Button (dans le package mx.controls.*). Pour les
distinguer l’un de l’autre, vous pouvez sp&eacute;cifier des espaces de noms s’appliquant aux types dans le fichier CSS.
Si vous n’utilisez pas de s&eacute;lecteurs de type dans vos feuilles de style, vous n’avez pas besoin de d&eacute;clarer des espaces de
noms. Pour plus d’informations (illustr&eacute;es par des exemples), voir About namespaces in CSS.
Remarque : les styles sont trait&eacute;s diff&eacute;remment pour les applications utilisant le SDK Flex 3. Si votre projet Flex repose
sur le SDK Flex 3, l’&eacute;diteur CSS applique le comportement impl&eacute;ment&eacute; avec Flex Builder 3. Pour plus d’informations sur
l’utilisation de l’&eacute;diteur CSS avec les applications reposant sur le SDK Flex 3, voir la documentation de Flex Builder 3.
Modification de l’interface utilisateur &agrave; l’aide des
habillages
Les classes d’habillage modifient l’aspect des contr&ocirc;les dans une interface utilisateur. La cr&eacute;ation, la modification et
l’importation d’habillages varient en fonction des composants (Spark ou MX).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 219
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
A propos des habillages Spark
Les habillages Spark contr&ocirc;lent tous les &eacute;l&eacute;ments visuels d’un composant, dont sa pr&eacute;sentation. Ils peuvent contenir
plusieurs &eacute;l&eacute;ments, tels que des &eacute;l&eacute;ments graphiques, du texte, des images et des transitions. Les habillages Spark
prennent en charge les &eacute;tats. Vous pouvez utiliser un habillage pour d&eacute;finir l’aspect d’un composant pour chacun de
ses &eacute;tats. Les habillages sp&eacute;cifient g&eacute;n&eacute;ralement une taille minimale pour le composant. Pour plus d’informations sur
l’imp&eacute;mentation d’habillages Spark dans Flex, voir About Spark skinning.
Flash Builder vous permet de g&eacute;n&eacute;rer et de modifier des habillages pour les composants Spark. En g&eacute;n&eacute;rant un
habillage, Flash Builder cr&eacute;e une classe d’habillage en MXML. Acc&eacute;dez &agrave; l’&eacute;diteur MXML pour modifier l’aspect d&eacute;fini
par l’habillage. Certaines modifications peuvent &ecirc;tre effectu&eacute;es en mode Cr&eacute;ation ; d’autres n&eacute;cessiteront le passage en
mode Source. Voir &laquo; G&eacute;n&eacute;ration et modification d’habillages pour des composants Spark &raquo; &agrave; la page 219.
A propos des habillages pour les composants MX
Les habillages des composants MX sont soit des graphiques bitmap, soit des graphiques vectoriels. Le graphique
bitmap (ou habillage graphique) se compose de pixels individuels formant une image. Le graphique vectoriel (ou
habillage par programmation) se compose d’une s&eacute;rie de d&eacute;finitions de ligne d&eacute;finissant les points de d&eacute;but et de fin,
l’&eacute;paisseur, la couleur et d’autres caract&eacute;ristiques de la ligne requises par Adobe&reg; Flash&reg; Player pour la dessiner. Pour
plus d’informations sur l’impl&eacute;mentation des habillages pour les composants MX dans Flex, voir About MX
component skinning.
Flash Builder vous permet d’importer des illustrations d’habillage pour des composants MX. Voir &laquo; Importation
d’illustrations d’habillage pour les composants MX &raquo; &agrave; la page 223.
Le package mx.skins.spark d&eacute;finit les habillages Spark pour les composants MX.
G&eacute;n&eacute;ration et modification d’habillages pour des composants Spark
Flash Builder vous permet de g&eacute;n&eacute;rer et de modifier des habillages pour les composants Spark. Lorsque vous g&eacute;n&eacute;rez
un habillage, Flash Builder utilise un habillage du th&egrave;me pour un projet. Le th&egrave;me par d&eacute;faut d’un projet est Spark.
Vous pouvez modifier le th&egrave;me d’un projet dans la vue Aspect. Voir &laquo; Application de th&egrave;mes &raquo; &agrave; la page 210.
Lors de la g&eacute;n&eacute;ration d’un habillage pour un composant, Flash Builder cr&eacute;e un fichier MXML qui impl&eacute;mente la classe
Skin pour le composant. Vous pouvez sp&eacute;cifier si vous souhaitez g&eacute;n&eacute;rer la classe Skin en tant que copie d’un habillage
existant ou g&eacute;n&eacute;rer un fichier de classe Skin vide.
Acc&eacute;dez aux modes Cr&eacute;ation et Source de l’&eacute;diteur MXML pour modifier l’habillage. En mode Cr&eacute;ation, s&eacute;lectionnez
les &eacute;l&eacute;ments d’habillage &agrave; modifier dans la vue Structure. Parcourez les &eacute;tats d’un composant dans la vue Etats.
Certaines parties d’un habillage ne sont pas modifiables en mode Cr&eacute;ation. Utilisez le mode Source pour modifier des
parties d’habillage qui ne sont pas disponibles en mode Cr&eacute;ation.
Certains composants contiennent des sous-composants. Par exemple, un composant HSlider contient des composants
Button qui d&eacute;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&ocirc;te
Les habillages d&eacute;finissent l’aspect de chaque &eacute;tat d’un composant. Un bouton Spark poss&egrave;de par exemple quatre &eacute;tats :
up, over, down et disabled. La g&eacute;n&eacute;ration d’un habillage pour un bouton Spark permet de sp&eacute;cifier l’aspect de chacun
de ces &eacute;tats.
Chaque composant poss&egrave;de des parties auxquelles il est possible d’appliquer un style. Par exemple, pour un composant
Button, vous pouvez choisir la couleur de remplissage, les attributs de texte de l’&eacute;tiquette et les composants Rect
formant la bordure du composant.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 220
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Lors de la cr&eacute;ation d’habillages pour un composant, Flash Builder permet de sp&eacute;cifier un composant h&ocirc;te sur lequel
l’habillage g&eacute;n&eacute;r&eacute; est bas&eacute;. Par d&eacute;faut, le composant h&ocirc;te est la classe de base du composant auquel l’habillage est
appliqu&eacute;. Cependant, vous pouvez s&eacute;lectionner un composant h&ocirc;te diff&eacute;rent.
Remarque : la sp&eacute;cification d’un composant h&ocirc;te pour une classe d’habillage est requise lors de la g&eacute;n&eacute;ration de classes
d’habillage &agrave; l’aide de Flash Builder. Cependant, la cr&eacute;ation de classes d’habillage directement dans le code source ne
n&eacute;cessite pas de composant h&ocirc;te.
Contrat d’habillage entre un habillage et son composant h&ocirc;te
Le contrat d’habillage entre une classe d’habillage et une classe de composants d&eacute;finit les r&egrave;gles &agrave; suivre par chaque
membre afin de pouvoir communiquer entre eux.
La classe d’habillage doit d&eacute;clarer des &eacute;tats d’habillage et d&eacute;finir l’apparence des parties d’habillage. De plus, les classes
d’habillage sp&eacute;cifient habituellement le composant h&ocirc;te et, parfois, effectuent une liaison aux donn&eacute;es d&eacute;finies sur le
composant h&ocirc;te.
La classe de composants d&eacute;clare la classe d’habillage qu’elle utilise. Elle doit &eacute;galement identifier des &eacute;tats d’habillage
et des parties d’habillage &agrave; l’aide de m&eacute;tadonn&eacute;es. Si la classe d’habillage &eacute;tablit une liaison aux donn&eacute;es du composant
h&ocirc;te, ce dernier doit d&eacute;finir ces donn&eacute;es.
Le tableau suivant d&eacute;taille les r&egrave;gles du contrat d’habillage.
Classe d’habillage
Composant h&ocirc;te
Obligatoire
?
Composant h&ocirc;te
&lt;fx:Metadata&gt;
Sans objet
[HostComponent(&quot;spark.components.Button&quot;)]
&lt;/fx:Metadata&gt;
Non
Etats d’habillage
&lt;s:states&gt;
&lt;s:State name=&quot;up&quot;/&gt;
&lt;/s:states&gt;
[SkinStates(&quot;up&quot;)];
public class Button {
...
}
Oui
Parties
d’habillage
&lt;s:Button id=&quot;upButton&quot;/&gt;
[SkinPart(required=&quot;fals
e&quot;)]
public var:upButton
Button;
Oui
Donn&eacute;es
text=&quot;{hostComponent.title}&quot;
[Bindable]
public var title:String;
Non
D&eacute;claration Skin
Dans Flash Builder, une d&eacute;claration Skin est le fichier qui impl&eacute;mente l’habillage pour un composant. Flex d&eacute;finit une
d&eacute;claration Skin pour chaque composant visuel. Lors de la g&eacute;n&eacute;ration d’un nouvel habillage pour un composant, Flash
Builder g&eacute;n&egrave;re la d&eacute;claration Skin.
Vous pouvez afficher la d&eacute;claration Skin de composants que vous avez s&eacute;lectionn&eacute;s :
1 En mode Cr&eacute;ation de l’&eacute;diteur MXML, s&eacute;lectionnez un composant Spark dans la zone de cr&eacute;ation.
2 Dans le menu contextuel du composant, s&eacute;lectionnez Ouvrir une d&eacute;claration d’habillage.
La classe impl&eacute;mentant l’habillage s’ouvre dans le mode Source de l’&eacute;diteur.
S’il s’agit d’une classe que vous avez cr&eacute;&eacute;e, vous pouvez modifier le fichier.
Vous pouvez &eacute;galement proc&eacute;der comme suit pour ouvrir un fichier de d&eacute;claration Skin :
•
Une fois le composant s&eacute;lectionn&eacute;, cliquez sur l’ic&ocirc;ne en regard du champ Habillage dans la section Style de la
vue Propri&eacute;t&eacute;s.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 221
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
• S&eacute;lectionnez un composant Spark. En mode Source, s&eacute;lectionnez ensuite Naviguer &gt; Ouvrir la d&eacute;claration
d’habillage dans le menu Flash Builder.
G&eacute;n&eacute;ration et modification d’un habillage pour un composant Spark Button (mode
Cr&eacute;ation)
Cet exemple illustre la g&eacute;n&eacute;ration d’une classe d’habillage pour un composant Spark Button, puis sa modification en
faisant appel &agrave; diff&eacute;rentes vues de Flash Builder. Il se base sur un projet Flex utilisant le th&egrave;me Spark par d&eacute;faut.
1 Cr&eacute;ez un fichier d’application. En mode Cr&eacute;ation de l’&eacute;diteur, ajoutez un composant Spark Button.
2 Dans le menu contextuel du composant Button, s&eacute;lectionnez Cr&eacute;er un habillage.
La bo&icirc;te de dialogue pour la cr&eacute;ation d’un habillage MXML s’ouvre.
Vous pouvez &eacute;galement proc&eacute;der comme suit pour acc&eacute;der &agrave; cette bo&icirc;te de dialogue :
•
Dans la section Style de la vue Propri&eacute;t&eacute;s, s&eacute;lectionnez l’ic&ocirc;ne en regard du champ Habillage.
• Dans le menu Flash Builder, s&eacute;lectionnez Nouveau &gt; Habillage MXML.
• En mode Cr&eacute;ation de l’&eacute;diteur, s&eacute;lectionnez Cr&eacute;ation &gt; Cr&eacute;er un habillage.
3 Dans la bo&icirc;te de dialogue de cr&eacute;ation d’un habillage MXML, sp&eacute;cifiez les &eacute;l&eacute;ments suivants :
• Dossier source et package de la d&eacute;claration Skin g&eacute;n&eacute;r&eacute;e
• Nom
Nom de la classe Skin cr&eacute;&eacute;e.
• Composant h&ocirc;te
Pour modifier le composant par d&eacute;faut, cliquez sur Parcourir et s&eacute;lectionnez un composant h&ocirc;te.
• (Recommand&eacute;) S&eacute;lectionnez Cr&eacute;er en tant que copie de et ne supprimez pas le code de style ActionScript.
Si vous &ecirc;tes novice en mati&egrave;re d’habillage, utilisez une copie pour vous lancer dans la cr&eacute;ation d’une classe Skin.
Modifiez le code de style ActionScript.
• (Utilisateurs avanc&eacute;s) Si vous savez comment cr&eacute;er des classes Skin, proc&eacute;dez de l’une des mani&egrave;res suivantes :
Supprimez le code de style ActionScript ou ne cr&eacute;ez pas de copie d’une classe existante.
Si vous ne cr&eacute;ez pas de copie d’une classe existante, Flash Builder g&eacute;n&egrave;re un fichier de classe Skin vide
comportant des commentaires pour vous guider.
Les &eacute;tapes restantes de cette proc&eacute;dure supposent que vous avez suivi l’option recommand&eacute;e pour la g&eacute;n&eacute;ration
d’une classe Skin.
4 Cliquez sur Terminer.
Flash Builder g&eacute;n&egrave;re un fichier de classe Skin et l’ouvre en mode Cr&eacute;ation dans l’&eacute;diteur MXML.
Le composant Button est s&eacute;lectionn&eacute;.
L’&eacute;tat Up du composant Button est s&eacute;lectionn&eacute; dans la vue Etats.
5 Pour chaque &eacute;tat du composant Button, modifiez les styles Texte, Arri&egrave;re-plan du contenu et Couleur.
Pour ce faire, utilisez les outils de modification de la section Style de la vue Propri&eacute;t&eacute;s.
6 Ouvrez la vue Structure.
Notez que le nœud de niveau sup&eacute;rieur (SparkSkin) est s&eacute;lectionn&eacute;.
7 Dans la vue Structure, s&eacute;lectionnez Rect shadow pour d&eacute;finir les styles de l’ombre du composant Button.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 222
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Notez que les outils de la section Style ne sont pas disponibles.
8 Passez en mode Source de l’&eacute;diteur.
Flash Builder met en &eacute;vidence le composant Rect qui d&eacute;finit l’ombre du composant Button. Modifiez l’ombre du
composant Button.
9 Enregistrez le fichier de classe Skin et le fichier d’application.
Le mode Cr&eacute;ation de l’&eacute;diteur MXML vous permet d’afficher l’habillage du bouton, en supposant que vous avez
suivi l’option recommand&eacute;e &agrave; l’&eacute;tape 3. Si les styles ne s’affichent pas, s&eacute;lectionnez l’ic&ocirc;ne Actualiser de la zone de
cr&eacute;ation.
Notez que le fichier d’application a ajout&eacute; une r&eacute;f&eacute;rence &agrave; la classe Skin que vous avez cr&eacute;&eacute;e.
10 Ex&eacute;cutez l’application pour voir comment l’habillage change en fonction des &eacute;tats Up, Over et Down du composant
Button.
Cr&eacute;ation et modification d’habillages pour les composants Spark (mode Source)
Vous pouvez ouvrir la bo&icirc;te de dialogue de cr&eacute;ation d’un habillage MXML directement en mode Source de l’&eacute;diteur.
Par exemple, pour cr&eacute;er une classe skinClass pour un composant Spark Button, proc&eacute;dez comme suit.
1 En mode Source de l’&eacute;diteur, placez votre curseur dans une balise &lt;s:Button&gt; et saisissez ce qui suit :
&lt;s:Button skinClass=&quot;
Apr&egrave;s avoir saisi le premier guillemet pour le nom de la classe skinClass, un menu contextuel s’affiche.
2 Avec Create Skin en surbrillance dans les indicateurs de code, la touche Entr&eacute;e ouvre la bo&icirc;te de dialogue de
cr&eacute;ation d’un habillage MXML.
Cette bo&icirc;te de dialogue est identique &agrave; celle qui s’ouvre en mode Cr&eacute;ation.
Pour cr&eacute;er une classe skinClass, voir les instructions dans &laquo; G&eacute;n&eacute;ration et modification d’un habillage pour un
composant Spark Button (mode Cr&eacute;ation) &raquo; &agrave; la page 221.
3 Cliquez sur Terminer.
Flash Builder g&eacute;n&egrave;re une nouvelle classe skinClass en fonction des s&eacute;lections effectu&eacute;es dans la bo&icirc;te de dialogue de
cr&eacute;ation d’un habillage MXML. L’&eacute;diteur passe en mode Source pour la nouvelle classe g&eacute;n&eacute;r&eacute;e.
4 Modifiez la classe skinClass.
Enregistrez le fichier de classe et le fichier d’application.
Remarque : vous pouvez convertir la classe d’habillage g&eacute;n&eacute;r&eacute;e au format CSS pour afficher les styles appliqu&eacute;s. Voir
&laquo; Conversion d’un habillage en style CSS &raquo; &agrave; la page 222.
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&eacute;side dans la possibilit&eacute; d’utiliser le style en tant que s&eacute;lecteur de type pour tous les composants de cette classe. Sinon,
d&eacute;finissez la propri&eacute;t&eacute; skinClass pour chaque composant.
La proc&eacute;dure suivante illustre la conversion de l’habillage d’un composant Spark Button en style CSS.
1 G&eacute;n&eacute;rez et &eacute;ditez l’habillage d’un composant Button.
2 En mode Cr&eacute;ation, s&eacute;lectionnez le composant. Dans la zone Style de la vue Propri&eacute;t&eacute;s, cliquez sur Convertir en CSS.
3 Dans la bo&icirc;te de dialogue Nouvelle r&egrave;gle de style, s&eacute;lectionnez un fichier CSS pour le style ou cr&eacute;ez-en un.
En l’absence de fichier CSS dans le projet que vous souhaitez utiliser, cliquez sur Nouveau pour en cr&eacute;er un.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 223
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
4 Sp&eacute;cifiez le Type de s&eacute;lecteur en s&eacute;lectionnant l’une des options suivantes :
• Tous les composants
Le style est appliqu&eacute; &agrave; tous les composants de l’application.
• Tous les composants ayant le style
Les composants sp&eacute;cifient ce s&eacute;lecteur de style d’apr&egrave;s son nom. Si vous choisissez cette option, sp&eacute;cifiez un nom
pour le s&eacute;lecteur de type.
• Composant sp&eacute;cifique
Le style ne s’applique qu’au composant s&eacute;lectionn&eacute;.
• Composant sp&eacute;cifique ayant le style
Le style ne s’applique qu’au composant s&eacute;lectionn&eacute; et r&eacute;f&eacute;rence le style d’apr&egrave;s le nom du s&eacute;lecteur de type. Si
vous choisissez cette option, sp&eacute;cifiez un nom pour le s&eacute;lecteur de type.
5 Apr&egrave;s avoir sp&eacute;cifi&eacute; un Type de s&eacute;lecteur, cliquez sur OK.
Flash Builder g&eacute;n&egrave;re ou met &agrave; jour le fichier CSS sp&eacute;cifi&eacute;. Il modifie &eacute;galement le code source de l’application de
mani&egrave;re &agrave; r&eacute;f&eacute;rencer le s&eacute;lecteur de type dans le fichier CSS.
Il supprime les r&eacute;f&eacute;rences &agrave; la propri&eacute;t&eacute; skinClass pour le composant.
Importation d’illustrations d’habillage pour les composants MX
L’assistant Importation d’illustrations d’habillage permet l’importation d’illustrations graphiques vectorielles ainsi que
d’illustrations bitmap &agrave; partir des versions CS4 de Flash Professional, Fireworks, Illustrator et Photoshop (pour les
illustrations bitmap, tout fichier .PNG, .JPG ou .GIF peut &ecirc;tre utilis&eacute;). L’illustration peut alors servir d’habillage pour
les composants Flex.
Remarque : Adobe propose un ensemble de mod&egrave;les d’habillage destin&eacute;s &agrave; faciliter la cr&eacute;ation d’habillages pour les
composants Flex int&eacute;gr&eacute;s. Ces mod&egrave;les, utilis&eacute;s avec Flash, Fireworks, Illustrator ou Photoshop, permettent de cr&eacute;er
l’illustration. Gr&acirc;ce &agrave; Flash, vous pouvez aussi cr&eacute;er des composants Flex personnalis&eacute;s totalement fonctionnels. Pour plus
d’informations, voir les articles sous Importation de ressources Flash Professional dans Flex.
1 S&eacute;lectionnez Fichier &gt; Importer &gt; Illustrations d’habillage.
Dans la version plug-in, s&eacute;lectionnez Fichier &gt; Importer &gt; Illustration.
2 Dans la bo&icirc;te de dialogue Importation d’illustrations d’habillage :
• Choisissez un dossier de bitmaps ou un fichier SWC ou SWF &agrave; partir duquel importer des habillages ou cliquez
sur Parcourir pour en localiser un. Les types de fichiers pris en charge sont les suivants :
• Les fichiers SWF AS3 et SWC AS3 cr&eacute;&eacute;s dans Adobe Flash Professional CS5
• Les fichiers de graphiques vectoriels cr&eacute;&eacute;s dans Adobe Illustrator&reg; et export&eacute;s en tant que fichiers SWF pour
Flash Player 8
• Les fichiers graphiques bitmap aux formats PNG, GIF et JPG
• S&eacute;lectionnez un dossier dans lequel importer les habillages. Il doit s’agir du dossier source d’un projet Flex (vous
pouvez &eacute;galement indiquer un sous-dossier du dossier source). Le dossier du projet Flex ouvert est s&eacute;lectionn&eacute;
par d&eacute;faut.
• Dans le champ Copier les illustrations dans le sous-dossier, le nom du dossier par d&eacute;faut est d&eacute;riv&eacute; du dossier
ou des ressources en cours d’importation. Cliquez sur Parcourir pour choisir un emplacement diff&eacute;rent.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 224
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
• Dans le champ Cr&eacute;er des r&egrave;gles de style d’habillage dans, pr&eacute;cisez un nom pour le fichier CSS qui contiendra les
r&egrave;gles de style. Le nom par d&eacute;faut est d&eacute;riv&eacute; du nom du dossier de l’illustration ou du fichier Flash en cours
d’importation.
• Cochez la case Supprimer toutes les r&egrave;gles existantes dans le fichier si vous voulez que le fichier CSS sp&eacute;cifi&eacute; soit
remplac&eacute; lors de l’importation (plut&ocirc;t que d’importer les habillages et de conserver d’autres d&eacute;finitions
existantes dans le fichier CSS). Par d&eacute;faut, la case est d&eacute;s&eacute;lectionn&eacute;e. Si le fichier CSS n’existe pas, elle est
d&eacute;sactiv&eacute;e.
• Dans le champ Appliquer les styles &agrave; l’application, la valeur par d&eacute;faut est le fichier s&eacute;lectionn&eacute; dans le
Navigateur Flex ou dans la vue d’&eacute;diteur active, ou le fichier de l’application principale du projet.
• Cliquez sur Suivant.
3 Dans la bo&icirc;te de dialogue Importation d’illustrations d’habillage suivante, s&eacute;lectionnez les habillages &agrave; importer et
pr&eacute;cisez quel type de style CSS et propri&eacute;t&eacute; de partie d’habillage seront utilis&eacute;s. Vous pouvez cocher les &eacute;l&eacute;ments un
par un ou cliquer sur S&eacute;lectionner tout ou D&eacute;s&eacute;lectionner tout.
• Si les &eacute;l&eacute;ments n’ont pas de style valide ou de nom de propri&eacute;t&eacute; de partie d’habillage, ils ne sont pas coch&eacute;s par
d&eacute;faut. Les exemples suivants illustrent la convention d’attribution de noms dans Flash Builder :
• Button_upSkin
• Button_glow_downSkin (correspond &agrave; la propri&eacute;t&eacute; downSkin de la r&egrave;gle de style Button.glow)
• TabBar-tab_upSkin (la propri&eacute;t&eacute; upSkin correspond &agrave; la propri&eacute;t&eacute; tabStyleName de la r&egrave;gle de style TabBar)
• MyCustomComponent_borderSkin
Pour les composants personnalis&eacute;s, l’&eacute;l&eacute;ment est coch&eacute; si le composant a &eacute;t&eacute; d&eacute;fini dans le projet vers lequel vous
effectuez l’importation.
• Choisissez au besoin un style et une partie d’habillage dans les listes d&eacute;roulantes de chaque colonne.
• Cliquez sur Terminer.
Un fichier CSS est cr&eacute;&eacute; et affich&eacute; dans la vue Source. Le fichier CSS sera attach&eacute; &agrave; l’application sp&eacute;cifi&eacute;e dans
l’assistant. Si vous importez un fichier SWC, il est ajout&eacute; automatiquement au chemin d’acc&egrave;s &agrave; la biblioth&egrave;que
du projet.
G&eacute;n&eacute;ration de rendus d’&eacute;l&eacute;ment personnalis&eacute;s
Les contr&ocirc;les bas&eacute;s sur une liste Spark, tels que List et ComboBox, prennent en charge les rendus d’&eacute;l&eacute;ment
personnalis&eacute;s. Vous pouvez &eacute;galement utiliser les rendus d’&eacute;l&eacute;ment Spark avec certains contr&ocirc;les MX, tels que MX
DataGrid et MX Tree.
Utilisez des rendus d’&eacute;l&eacute;ment personnalis&eacute;s pour contr&ocirc;ler l’affichage d’un &eacute;l&eacute;ment de donn&eacute;es dans un conteneur
DataGroup, SkinnableDataContainer ou dans une sous-classe de ces conteneurs. L’aspect d&eacute;fini par un rendu
d’&eacute;l&eacute;ment peut inclure la police, la couleur d’arri&egrave;re-plan, la bordure et tout autre aspect visuel de l’&eacute;l&eacute;ment de
donn&eacute;es. Un rendu d’&eacute;l&eacute;ment peut &eacute;galement d&eacute;finir l’aspect d’un &eacute;l&eacute;ment de donn&eacute;es au moment o&ugrave; l’utilisateur
interagit avec celui-ci. Par exemple, le rendu d’&eacute;l&eacute;ment peut afficher l’&eacute;l&eacute;ment de donn&eacute;es d’une certaine mani&egrave;re
lorsque l’utilisateur d&eacute;place la souris sur ce dernier. Il l’affiche diff&eacute;remment lorsque l’utilisateur clique sur l’&eacute;l&eacute;ment
de donn&eacute;es.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 225
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Flash Builder permet de g&eacute;n&eacute;rer et de modifier des rendus d’&eacute;l&eacute;ment. Il utilise l’un des mod&egrave;les suivants pour g&eacute;n&eacute;rer
les rendus d’&eacute;l&eacute;ment :
• Composants Spark
Utilisez ce mod&egrave;le pour les contr&ocirc;les bas&eacute;s sur une liste Spark, tels que List et ComboBox.
• MX Advanced DataGrid
• MX DataGrid
• MX Tree
Vous pouvez ouvrir l’assistant de cr&eacute;ation d’un rendu d’&eacute;l&eacute;ment MXML en mode Cr&eacute;ation et en mode Source de
l’&eacute;diteur MXML. Dans l’assistant de cr&eacute;ation d’un rendu d’&eacute;l&eacute;ment MXML, sp&eacute;cifiez un nom et un mod&egrave;le pour le
rendu d’&eacute;l&eacute;ment. Flash Builder g&eacute;n&egrave;re un fichier MXML qui impl&eacute;mente le rendu d’&eacute;l&eacute;ment.
Les composants de l’application r&eacute;f&eacute;rencent le rendu d’&eacute;l&eacute;ment g&eacute;n&eacute;r&eacute; &agrave; l’aide de la propri&eacute;t&eacute; itemRenderer.
Pour plus d’informations sur la cr&eacute;ation et l’utilisation des rendus d’&eacute;l&eacute;ment, voir Custom Spark Item Renderers.
G&eacute;n&eacute;ration et modification d’un rendu d’&eacute;l&eacute;ment pour un composant MX Tree
(mode Cr&eacute;ation)
Cet exemple g&eacute;n&egrave;re un rendu d’&eacute;l&eacute;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&egrave;me Spark par d&eacute;faut.
1 Cr&eacute;ez un fichier d’application. En mode Cr&eacute;ation de l’&eacute;diteur, ajoutez un composant MX Tree &agrave; l’application.
Renseignez le composant Tree de donn&eacute;es affichables &agrave; l’ex&eacute;cution de l’application.
2 Dans le menu contextuel du composant Tree, s&eacute;lectionnez Cr&eacute;er un rendu d’&eacute;l&eacute;ment.
La bo&icirc;te de dialogue de cr&eacute;ation d’un rendu d’&eacute;l&eacute;ment MXML s’ouvre.
Pour ouvrir cette bo&icirc;te de dialogue, vous pouvez &eacute;galement proc&eacute;der comme suit.
•
Dans la section Commun de la vue Propri&eacute;t&eacute;s, s&eacute;lectionnez l’ic&ocirc;ne en regard du champ Rendu d’&eacute;l&eacute;ment.
• Dans le menu Flash Builder, s&eacute;lectionnez Nouveau &gt; Rendu d’&eacute;l&eacute;ment MXML.
3 Dans la bo&icirc;te de dialogue de cr&eacute;ation d’un rendu d’&eacute;l&eacute;ment MXML, sp&eacute;cifiez ce qui suit :
• Dossier source et package pour la d&eacute;claration du rendu d’&eacute;l&eacute;ment g&eacute;n&eacute;r&eacute;
• Nom
Nom de la classe de rendu d’&eacute;l&eacute;ment cr&eacute;&eacute;e.
• Mod&egrave;le
S&eacute;lectionnez le mod&egrave;le &agrave; utiliser lors de la g&eacute;n&eacute;ration du rendu d’&eacute;l&eacute;ment.
4 Cliquez sur Terminer.
Flash Builder g&eacute;n&egrave;re un fichier de classe ItemRenderer et l’ouvre en mode Cr&eacute;ation de l’&eacute;diteur MXML.
Le composant ItemRenderer est s&eacute;lectionn&eacute;.
L’&eacute;tat normal du composant Tree est s&eacute;lectionn&eacute; dans la vue Etats.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 226
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
5 Modifiez l’aspect de chaque &eacute;tat du composant Tree dans la classe ItemRenderer g&eacute;n&eacute;r&eacute;e.
a Ouvrez la vue Structure.
Notez que le nœud de niveau sup&eacute;rieur (MXTreeItemRenderer) est s&eacute;lectionn&eacute;.
Dans la section Style de la vue Propri&eacute;t&eacute;s, modifiez l’aspect des &eacute;l&eacute;ments d’arborescence.
b Dans la vue Structure, s&eacute;lectionnez d’autres composants de MXTreeItemRenderer pour en modifier l’aspect.
Notez que les outils de la section Style ne sont pas toujours disponibles.
S’ils ne sont pas disponibles, utilisez le mode Source de l’&eacute;diteur pour d&eacute;finir l’aspect. Lorsque vous passez en
mode Source, la source du composant s&eacute;lectionn&eacute; dans la vue Structure est mise en &eacute;vidence.
6 Ex&eacute;cutez l’application pour d&eacute;couvrir comment la classe ItemRenderer modifie l’aspect du composant Tree.
Cr&eacute;ation et modification des rendus d’&eacute;l&eacute;ment (mode Source)
Vous pouvez ouvrir la bo&icirc;te de dialogue de cr&eacute;ation d’un rendu d’&eacute;l&eacute;ment MXML directement en mode Source de
l’&eacute;diteur. Par exemple, proc&eacute;dez comme suit pour cr&eacute;er un rendu d’&eacute;l&eacute;ment pour un composant Spark List.
1 En mode Source de l’&eacute;diteur, placez votre curseur dans une balise &lt;s:List&gt; et saisissez ce qui suit :
&lt;s:List itemRender=&quot;
Apr&egrave;s avoir saisi le premier guillemet du nom de la classe du rendu d’&eacute;l&eacute;ment, un menu contextuel s’affiche.
2 Double-cliquez sur Cr&eacute;er un rendu d’&eacute;l&eacute;ment pour ouvrir la bo&icirc;te de dialogue de cr&eacute;ation d’un rendu d’&eacute;l&eacute;ment MXML.
Cette derni&egrave;re est identique &agrave; celle qui s’ouvre en mode Cr&eacute;ation.
Pour plus d’informations sur la cr&eacute;ation d’un rendu d’&eacute;l&eacute;ment, voir les instructions dans &laquo; G&eacute;n&eacute;ration et
modification d’un rendu d’&eacute;l&eacute;ment pour un composant MX Tree (mode Cr&eacute;ation) &raquo; &agrave; la page 225.
3 Cliquez sur Terminer.
Flash Builder g&eacute;n&egrave;re un nouveau rendu d’&eacute;l&eacute;ment en fonction des s&eacute;lections effectu&eacute;es dans la bo&icirc;te de dialogue de
cr&eacute;ation d’un rendu d’&eacute;l&eacute;ment MXML. L’&eacute;diteur passe en mode Source pour la nouvelle classe g&eacute;n&eacute;r&eacute;e.
4 Modifiez la classe du rendu d’&eacute;l&eacute;ment.
Enregistrez le fichier de classe et le fichier d’application.
D&eacute;claration ItemRenderer
Dans Flash Builder, une d&eacute;claration ItemRenderer est le fichier qui impl&eacute;mente le rendu ItemRenderer personnalis&eacute;
pour un composant.
Vous pouvez afficher la d&eacute;claration du rendu ItemRenderer personnalis&eacute; pour les composants que vous avez
s&eacute;lectionn&eacute;s :
1 En mode Cr&eacute;ation de l’&eacute;diteur MXML, s&eacute;lectionnez un composant pour lequel vous avez impl&eacute;ment&eacute; un rendu
d’&eacute;l&eacute;ment personnalis&eacute;.
2 Dans le menu contextuel du composant, s&eacute;lectionnez Ouvrir la d&eacute;claration d’un rendu d’&eacute;l&eacute;ment.
La classe impl&eacute;mentant le rendu d’&eacute;l&eacute;ment s’ouvre en mode Source de l’&eacute;diteur. Pour ouvrir la d&eacute;claration du rendu
d’&eacute;l&eacute;ment, vous pouvez &eacute;galement proc&eacute;der comme suit :
• S&eacute;lectionnez le composant en mode Cr&eacute;ation. Dans la section Commun de la vue Propri&eacute;t&eacute;s, s&eacute;lectionnez l’ic&ocirc;ne
en regard du champ Rendu d’&eacute;l&eacute;ment.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 227
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
• S&eacute;lectionnez le composant. En mode Source, s&eacute;lectionnez ensuite Naviguer &gt; Ouvrir la d&eacute;claration d’habillage
dans le menu Flash Builder.
Actualisation du mode Cr&eacute;ation pour un rendu correct
Vous pouvez le cas &eacute;ch&eacute;ant actualiser le mode Cr&eacute;ation des &eacute;diteurs MXML et CSS pour rendre correctement la
pr&eacute;sentation. Le rendu de la pr&eacute;sentation peut en effet dans certains cas devenir obsol&egrave;te, par exemple si vous modifiez
un &eacute;l&eacute;ment visuel dans un composant Flash d&eacute;pendant (SWC). Les styles et habillages peuvent en outre ne pas &ecirc;tre
rendus correctement si Flash Builder doit reg&eacute;n&eacute;rer le fichier.
❖ Cliquez sur le bouton Actualiser de la barre d’outils de l’&eacute;diteur.
Ajout d’&eacute;tats d’affichage et de transitions
Adobe&reg; Flash&reg; Builder™ permet de cr&eacute;er des applications dont l’apparence varie selon les t&acirc;ches ex&eacute;cut&eacute;es par
l’utilisateur. Par exemple, l’&eacute;tat de base de l’application peut repr&eacute;senter la page d’accueil et inclure un logo, une barre
lat&eacute;rale et un message de bienvenue. Lorsque l’utilisateur clique sur un bouton de la barre lat&eacute;rale, l’apparence (l’&eacute;tat)
de l’application change de fa&ccedil;on dynamique et la zone de contenu principale est remplac&eacute;e par un formulaire de bon
de commande sans modifier la position du logo et de la barre lat&eacute;rale.
Flex vous permet d’appliquer cette interaction aux &eacute;tats d’affichage et aux transitions. Un &eacute;tat d’affichage repr&eacute;sente
l’un des diff&eacute;rents affichages que vous d&eacute;finissez pour une application ou un composant personnalis&eacute;. Une transition
consiste en un ou plusieurs effets regroup&eacute;s pour &ecirc;tre lanc&eacute;s lorsqu’un &eacute;tat d’affichage est modifi&eacute;. Une transition vise
&agrave; am&eacute;liorer le changement visuel d’un &eacute;tat &agrave; un autre.
A propos des &eacute;tats d’affichage et des transitions
Un &eacute;tat d’affichage repr&eacute;sente l’une des diff&eacute;rentes mises en forme que vous d&eacute;finissez pour une application ou un
composant MXML unique. Vous cr&eacute;ez une application ou un composant qui passe d’un affichage &agrave; un autre en
fonction des actions de l’utilisateur. Vous pouvez utiliser les &eacute;tats d’affichage pour cr&eacute;er une interface que l’utilisateur
peut personnaliser ou qui pr&eacute;sente progressivement davantage d’informations au fur et &agrave; mesure que l’utilisateur
ex&eacute;cute des t&acirc;ches sp&eacute;cifiques.
Chaque application ou composant d&eacute;fini dans un fichier MXML affiche toujours au moins un &eacute;tat, l’&eacute;tat de base,
repr&eacute;sent&eacute; par la pr&eacute;sentation par d&eacute;faut du fichier. Vous pouvez utiliser un &eacute;tat de base comme un r&eacute;f&eacute;rentiel de
contenus tels que des barres de navigation ou des logos partag&eacute;s par tous les affichages d’une application ou d’un
composant et garantir ainsi une pr&eacute;sentation homog&egrave;ne.
Vous pouvez cr&eacute;er un &eacute;tat d’affichage en modifiant la pr&eacute;sentation d’un &eacute;tat existant ou en cr&eacute;ant une nouvelle
pr&eacute;sentation. Les modifications pouvant &ecirc;tre apport&eacute;es &agrave; un &eacute;tat existant sont l’&eacute;dition, le d&eacute;placement, l’ajout ou la
suppression de composants. La nouvelle pr&eacute;sentation correspond &agrave; ce que l’utilisateur voit lorsqu’il change d’&eacute;tat.
Pour obtenir une pr&eacute;sentation conceptuelle compl&egrave;te des &eacute;tats d’affichage, y compris des exemples, voir View states.
En r&egrave;gle g&eacute;n&eacute;rale, l’ajout de pages &agrave; une application Flex est diff&eacute;rent de l’ajout de pages &agrave; une application de type
HTML. Vous cr&eacute;ez un fichier d’application MXML unique puis ajoutez diff&eacute;rentes mises en forme modifiables lorsque
l’application est ex&eacute;cut&eacute;e. Tout comme vous pouvez utiliser des &eacute;tats d’affichage pour ces mises en forme, il est
&eacute;galement possible d’utiliser le conteneur de navigateur ViewStack avec d’autres conteneurs de navigateur.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 228
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
La modification des &eacute;tats d’affichage de l’application change &eacute;galement l’apparence de l’interface utilisateur. Par
d&eacute;faut, les composants semblent sauter d’un &eacute;tat d’affichage &agrave; un autre. Vous pouvez adoucir cet effet en ajoutant des
transitions.
Une transition repr&eacute;sente un ou plusieurs effets visuels appliqu&eacute;s de fa&ccedil;on s&eacute;quentielle ou simultan&eacute;e lors du
changement d’un &eacute;tat d’affichage. Par exemple, vous souhaitez redimensionner un composant pour inclure un
nouveau composant lorsque l’application passe d’un &eacute;tat &agrave; un autre. Vous pouvez d&eacute;finir une transition qui r&eacute;duit
progressivement le premier composant tandis qu’un nouveau composant appara&icirc;t petit &agrave; petit &agrave; l’&eacute;cran.
Prise en charge des &eacute;tats d’affichage Flex 3
Flash Builder prend en charge les &eacute;tats d’affichage impl&eacute;ment&eacute;s dans Flex 3. Pour les projets bas&eacute;s sur le SDK Flex 3,
l’&eacute;diteur MXML r&eacute;tablit l’impl&eacute;mentation Flex Builder 3 pour ses deux modes (Cr&eacute;ation et Source). Pour plus
d’informations sur la modification des &eacute;tats pour le SDK Flex 3, voir la documentation de Flex Builder 3.
Cr&eacute;ation d’un &eacute;tat d’affichage
Par d&eacute;faut, une application comporte un seul &eacute;tat d’affichage, que vous utilisez g&eacute;n&eacute;ralement comme &eacute;tat de base.
Utilisez la vue Etats de Flash Builder pour ajouter des &eacute;tats suppl&eacute;mentaires et modifier la pr&eacute;sentation et les
composants de chaque &eacute;tat.
1 A l’aide des outils de pr&eacute;sentation de Flash Builder, cr&eacute;ez la pr&eacute;sentation de l’&eacute;tat de base de l’application ou du
composant.
Pour plus d’informations, voir &laquo; Cr&eacute;ation d’une interface utilisateur avec Flash Builder &raquo; &agrave; la page 188.
2 Dans la vue Etats (Fen&ecirc;tre &gt; Autres vues &gt; Flash Builder &gt; Etats), cliquez sur le bouton Nouvel &eacute;tat de la barre
d’outils.
La bo&icirc;te de dialogue Nouvel &eacute;tat appara&icirc;t.
3 Entrez le nom du nouvel &eacute;tat.
4 Indiquez si vous voulez cr&eacute;er une copie d’un &eacute;tat existant ou si vous pr&eacute;f&eacute;rez cr&eacute;er un nouvel &eacute;tat vide. Cliquez sur OK.
5 Utilisez les outils de pr&eacute;sentation de Flash Builder pour modifier l’apparence de l’&eacute;tat.
Vous pouvez &eacute;diter, d&eacute;placer, ajouter ou supprimer des composants. Au fur et &agrave; mesure de vos modifications, les
changements d&eacute;finissant le nouvel &eacute;tat sont int&eacute;gr&eacute;s au code MXML.
6 D&eacute;finissez un gestionnaire d’&eacute;v&eacute;nement permettant &agrave; l’utilisateur d’afficher le nouvel &eacute;tat.
Pour plus d’informations, voir &laquo; Changement d’&eacute;tat d’affichage lors de l’ex&eacute;cution &raquo; &agrave; la page 229.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 229
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
D&eacute;finition d’un &eacute;tat non de base comme &eacute;tat d’affichage de d&eacute;part
Par d&eacute;faut, une application affiche l’&eacute;tat de base au d&eacute;marrage. Vous pouvez toutefois param&eacute;trer l’affichage d’un autre
&eacute;tat au d&eacute;marrage de l’application.
1 Dans la vue Etats (Fen&ecirc;tre &gt; Etats), double-cliquez sur l’&eacute;tat d’affichage que vous voulez utiliser au d&eacute;marrage.
2 Dans la bo&icirc;te de dialogue Modifier les propri&eacute;t&eacute;s de l’&eacute;tat qui appara&icirc;t, s&eacute;lectionnez l’option D&eacute;finir comme &eacute;tat de
d&eacute;part, puis cliquez sur OK.
D&eacute;finition de l’&eacute;tat d’affichage d’un composant
Si l’application comporte plusieurs &eacute;tats, vous pouvez d&eacute;finir l’&eacute;tat d’affichage d’un seul composant.
1 Dans la vue Cr&eacute;ation de l’&eacute;diteur MXML, s&eacute;lectionnez un composant de la pr&eacute;sentation.
2 Dans la vue Propri&eacute;t&eacute;s, utilisez le champ Etats pour s&eacute;lectionner les &eacute;tats dans lesquels le composant est visible.
Changement d’&eacute;tat d’affichage lors de l’ex&eacute;cution
Lors de l’ex&eacute;cution de l’application, les utilisateurs doivent passer d’un &eacute;tat d’affichage &agrave; un autre. Vous pouvez d&eacute;finir
des gestionnaires d’&eacute;v&eacute;nement au niveau des contr&ocirc;les des utilisateurs afin que ces derniers puissent changer d’&eacute;tat lors
de l’ex&eacute;cution.
La m&eacute;thode la plus simple consiste &agrave; affecter la propri&eacute;t&eacute; currentState &agrave; l’&eacute;v&eacute;nement de clic d’un contr&ocirc;le tel qu’un
bouton ou un lien. La propri&eacute;t&eacute; currentState s&eacute;lectionne le nom de l’&eacute;tat d’affichage que vous souhaitez consulter
lorsque l’&eacute;v&eacute;nement de clic se produit. Dans le code, sp&eacute;cifiez la propri&eacute;t&eacute; currentState de la fa&ccedil;on suivante :
click=&quot;currentState='viewstatename'&quot;
Si l’&eacute;tat d’affichage est d&eacute;fini pour un composant sp&eacute;cifique, vous devez &eacute;galement pr&eacute;ciser le nom du composant,
comme illustr&eacute; ci-dessous :
click=&quot;currentState='componentID.viewstatename'&quot;
Pour plus d’informations, voir Using View States.
1 V&eacute;rifiez que l’&eacute;tat initial comporte un contr&ocirc;le cliquable, par exemple un contr&ocirc;le de type Button.
En mode Cr&eacute;ation de l’&eacute;diteur MXML, s&eacute;lectionnez le contr&ocirc;le et entrez la valeur suivante dans le champ Lors d’un
clic de la vue Propri&eacute;t&eacute;s :
currentState='viewstatename'
viewstatename est le nom de l’&eacute;tat.
2 Pour passer &agrave; l’&eacute;tat de base, saisissez :
currentState=''
'' est une cha&icirc;ne vide repr&eacute;sent&eacute;e par deux guillemets simples.
3 Pour v&eacute;rifier que les &eacute;tats changent correctement dans l’application lorsque vous cliquez sur le bouton, s&eacute;lectionnez
le bouton Ex&eacute;cuter de la barre d’outils de Flash Builder.
Vous pouvez d&eacute;finir une transition afin que le changement d’&eacute;tat soit visuellement plus fluide. Pour plus
d’informations, voir &laquo; Cr&eacute;ation d’une transition &raquo; &agrave; la page 232.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 230
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Cr&eacute;ation de groupes d’&eacute;tats d’affichage
Flex prend en charge les groupes d’&eacute;tats d’affichage. L’attribut stateGroups de la balise &lt;States&gt; vous permet de
regrouper un ou plusieurs &eacute;tats. Par exemple, si plusieurs composants apparaissent dans le m&ecirc;me jeu d’&eacute;tats
d’affichage, vous pouvez cr&eacute;er un groupe d’&eacute;tats d’affichage les contenant tous. L’attribution &agrave; la propri&eacute;t&eacute;
currentState de l’un des &eacute;tats d’affichage du groupe conduira ensuite &agrave; l’affichage des composants. Pour plus
d’informations, illustr&eacute;es d’exemples, voir Defining view state groups.
Le mode Cr&eacute;ation de l’&eacute;diteur MXML ne permet pas de modifier les groupes d’&eacute;tats. Basculez en mode Source pour
cr&eacute;er et modifier des groupes d’&eacute;tats. Le mode Source facilite la cr&eacute;ation et l’&eacute;dition de groupes d’&eacute;tats par des
indicateurs de code et par la liste d&eacute;roulante Afficher &eacute;tat.
Si vous cr&eacute;ez un groupe d’&eacute;tats d’affichage, utilisez la vue Cr&eacute;ation avec prudence. La suppression d’un &eacute;tat dans la vue
Cr&eacute;ation peut conduire par inadvertance au maintien d’une r&eacute;f&eacute;rence &agrave; un composant supprim&eacute; dans un groupe
d’&eacute;tats.
Suppression d’un &eacute;tat d’affichage
Vous pouvez supprimer les &eacute;tats d’affichage d’une application dans la vue Cr&eacute;ation de l’&eacute;diteur MXML. Les groupes
d’&eacute;tats cr&eacute;&eacute;s devront toutefois &ecirc;tre supprim&eacute;s dans la vue Source. Vous &eacute;vitez ainsi de laisser par inadvertance une
r&eacute;f&eacute;rence &agrave; un composant dans un &eacute;tat supprim&eacute;.
1 Dans la vue Cr&eacute;ation de l’&eacute;diteur MXML, s&eacute;lectionnez l’&eacute;tat d’affichage que vous voulez supprimer de la vue Etats
(Fen&ecirc;tre &gt; Etats).
2 Cliquez sur le bouton Supprimer l’&eacute;tat dans la barre d’outils de la vue Etats.
Utilisation de plusieurs &eacute;tats dans une application
Si l’application comporte plusieurs &eacute;tats, le mode Cr&eacute;ation de l’&eacute;diteur MXML vous permet de changer de vue pour
chaque &eacute;tat, en affichant uniquement les composants d&eacute;finis pour un &eacute;tat sp&eacute;cifique. Vous pouvez sp&eacute;cifier l’&eacute;tat dans
lequel chaque composant est visible.
Modification du composant d’un &eacute;tat sp&eacute;cifique
1 Dans la vue Cr&eacute;ation de l’&eacute;diteur de source, utilisez la vue Etats pour ajouter un ou plusieurs &eacute;tats suppl&eacute;mentaires
&agrave; une application.
2 Utilisez le menu d&eacute;roulant Etats pour basculer la vue sur l’&eacute;tat s&eacute;lectionn&eacute;.
3 Ajoutez, d&eacute;placez, supprimez ou modifiez les composants de l’&eacute;tat.
Les modifications que vous appliquez &agrave; un &eacute;tat donn&eacute; n’apparaissent pas dans les autres &eacute;tats, sauf si vous sp&eacute;cifiez
que le composant appara&icirc;t dans plusieurs &eacute;tats.
Sp&eacute;cification de l’affichage d’un composant dans plusieurs &eacute;tats
1 Dans la vue Cr&eacute;ation de l’&eacute;diteur de source, utilisez la vue Etats pour ajouter un ou plusieurs &eacute;tats suppl&eacute;mentaires
&agrave; une application.
2 S&eacute;lectionnez chaque composant d’un &eacute;tat.
3 Dans la vue Propri&eacute;t&eacute;s, s&eacute;lectionnez les &eacute;tats dans lesquels le composant appara&icirc;t.
Vous pouvez indiquer que le composant doit appara&icirc;tre dans tous les &eacute;tats ou vous pouvez s&eacute;lectionner un ou
plusieurs &eacute;tats dans lesquels le composant doit appara&icirc;tre.
Un composant, pour lequel un &eacute;tat particulier a &eacute;t&eacute; d&eacute;fini, ne s’affichera pas dans l’&eacute;diteur lorsqu’un &eacute;tat autre que
celui qui lui a &eacute;t&eacute; attribu&eacute; est s&eacute;lectionn&eacute;.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 231
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Soyez prudent lorsque vous modifiez des applications contenant plusieurs &eacute;tats. Les composants peuvent donner
l’impression de dispara&icirc;tre lorsque vous passez &agrave; un &eacute;tat qui ne contient pas un composant pourtant visible dans un
autre &eacute;tat.
Cr&eacute;ation et &eacute;dition d’&eacute;tats d’affichage dans le code source
Le mode Source de l’&eacute;diteur MXML comporte plusieurs fonctions pour la modification du code source des &eacute;tats
d’affichage.
Pour toute application d&eacute;clarant des &eacute;tats d’affichage, l’&eacute;diteur MXML comporte la liste d&eacute;roulante Afficher &eacute;tat.
Lorsque vous s&eacute;lectionnez un &eacute;tat d’affichage dans la liste Afficher &eacute;tat, la mise en &eacute;vidence dans l’&eacute;diteur des
composants qui ne figurent pas dans cet &eacute;tat est att&eacute;nu&eacute;e.
Les propri&eacute;t&eacute;s includeIn et excludeFrom des composants MXML sp&eacute;cifient l’&eacute;tat d’affichage ou le groupe d’&eacute;tats
dans lequel un composant s’affiche. Les indicateurs de code de l’&eacute;diteur MXML facilitent la s&eacute;lection d’un &eacute;tat
d’affichage ou d’un groupe d’&eacute;tats pour ces propri&eacute;t&eacute;s.
Vous pouvez &eacute;galement utiliser la notation &agrave; points pour les attributs de composants. Elle vous permet de sp&eacute;cifier
l’&eacute;tat d’affichage dans lequel l’attribut est appliqu&eacute;. Pour afficher par exemple un composant Button dans deux &eacute;tats
d’affichage et obtenir la modification de l’&eacute;tiquette en fonction de l’&eacute;tat, associez l’op&eacute;rateur point &agrave; la propri&eacute;t&eacute; label.
Les indicateurs de code de l’&eacute;diteur MXML facilitent la s&eacute;lection de l’&eacute;tat d’affichage. Par exemple :
&lt;s:Button label.State1=&quot;Button in State 1&quot; label.State2=&quot;Same Button in State 2&quot;&gt;
Exemple illustrant l’utilisation des &eacute;tats d’affichage dans le code source
1 Cr&eacute;ez une application contenant plus d’un &eacute;tat d’affichage.
En mode Source de l’&eacute;diteur MXML, ajoutez le code suivant apr&egrave;s la balise &lt;s:Application&gt;.
&lt;s:states&gt;
&lt;s:State name=&quot;State1&quot; /&gt;
&lt;s:State name=&quot;State2&quot; /&gt;
&lt;s:State name=&quot;State3&quot; /&gt;
&lt;/s:states&gt;
Notez l’affichage de la liste d&eacute;roulante Afficher &eacute;tat, une fois que des &eacute;tats ont &eacute;t&eacute; d&eacute;finis dans l’application.
2 En mode Source, ajoutez les composants Button suivants :
&lt;s:Button includeIn=&quot;State1&quot; label=&quot;Show State 2&quot;
click=&quot;currentState='State2'&quot; /&gt;
&lt;s:Button includeIn=&quot;State2&quot; label=&quot;Show State 3&quot;
click=&quot;currentState='State3'&quot; /&gt;
&lt;s:Button includeIn=&quot;State3&quot; label=&quot;Show State 1&quot;
click=&quot;currentState='State1'&quot; /&gt;
&lt;s:Button
label.State1=&quot;All States: State 1 Label&quot;
label.State2=&quot;All States: State 2 Label&quot;
label.State3=&quot;All States: State 3 Label&quot;
x=&quot;0&quot; y=&quot;30&quot;/&gt;
Par d&eacute;faut, l’&eacute;diteur affiche le code de tous les &eacute;tats.
Remarque : les gestionnaires d’&eacute;v&eacute;nement click des trois premiers boutons font d&eacute;filer les &eacute;tats d’affichage.
3 Restez en mode Source et s&eacute;lectionnez diff&eacute;rents &eacute;tats d’affichage dans la liste Afficher &eacute;tat.
L’&eacute;diteur affiche en gris clair le code des composants qui ne sont pas visibles dans l’&eacute;tat s&eacute;lectionn&eacute;.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 232
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
L’int&eacute;gralit&eacute; du code peut &ecirc;tre modifi&eacute;e. L’att&eacute;nuation de la mise en &eacute;vidence des composants n’apparaissant pas
dans l’&eacute;tat d’affichage s&eacute;lectionn&eacute; facilite toutefois la gestion du code de chaque &eacute;tat d’affichage.
4 Basculez en mode Cr&eacute;ation de l’&eacute;diteur MXML.
S&eacute;lectionnez diff&eacute;rents &eacute;tats d’affichage dans la liste d&eacute;roulante Etat ou dans la vue Etats. L’&eacute;diteur affiche les
composants en fonction des propri&eacute;t&eacute;s d&eacute;finies pour l’&eacute;tat d’affichage s&eacute;lectionn&eacute;.
5 Ex&eacute;cutez l’application. Cliquez sur le bouton sup&eacute;rieur pour faire d&eacute;filer les &eacute;tats d’affichage.
Pour plus d’informations sur la cr&eacute;ation et la modification des &eacute;tats dans le code source, voir Create and apply view
states.
Cr&eacute;ation d’une transition
Lorsque vous modifiez les &eacute;tats d’affichage d’une application, les composants semblent sauter d’un &eacute;tat d’affichage &agrave;
un autre. Vous pouvez adoucir cet effet en ajoutant des transitions. Une transition consiste en un ou plusieurs effets
regroup&eacute;s pour &ecirc;tre lanc&eacute;s lorsqu’un &eacute;tat d’affichage est modifi&eacute;. Par exemple, vous pouvez d&eacute;finir une transition
utilisant un effet Resize de redimensionnement afin de r&eacute;duire progressivement un composant dans l’&eacute;tat d’affichage
d’origine et un effet Fade de fondu pour afficher progressivement un composant dans le nouvel &eacute;tat d’affichage.
1 Assurez-vous de cr&eacute;er au moins un &eacute;tat d’affichage en plus de l’&eacute;tat de base.
2 Dans la vue Source de l’&eacute;diteur MXML, d&eacute;finissez un objet Transition en ajoutant une balise &lt;s:transitions&gt;,
puis une balise enfant &lt;s:Transition&gt;, comme l’illustre l’exemple suivant :
&lt;s:transitions&gt;
&lt;mx:Transition id=&quot;myTransition&quot;&gt;
&lt;/mx:Transition&gt;
&lt;/s:transitions&gt;
Pour d&eacute;finir plusieurs transitions, ins&eacute;rez d’autres balises enfant &lt;s:Transition&gt; dans la balise
&lt;s:transitions&gt;.
3 Dans la balise &lt;s:Transition&gt;, d&eacute;finissez la modification de l’&eacute;tat d’affichage qui d&eacute;clenche la transition en
d&eacute;finissant les propri&eacute;t&eacute;s fromState et toState, comme l’illustre l’exemple suivant (en gras) :
&lt;s:transitions&gt;
&lt;mx:Transition id=&quot;myTransition&quot; fromState=&quot;*&quot; toState=&quot;checkout&quot;&gt;
&lt;/mx:Transition&gt;
&lt;/s:transitions&gt;
Dans l’exemple, vous sp&eacute;cifiez que vous souhaitez appliquer la transition lorsque l’application change d’un &eacute;tat
d’affichage (fromState=&quot;*&quot;) &agrave; l’&eacute;tat d’affichage intitul&eacute; checkout (toState=&quot;checkout&quot;). La valeur &quot;*&quot; est un
caract&egrave;re g&eacute;n&eacute;rique repr&eacute;sentant n’importe quel &eacute;tat d’affichage.
4 Dans la balise &lt;mx:Transition&gt;, indiquez si vous souhaitez que les effets s’ex&eacute;cutent de fa&ccedil;on parall&egrave;le ou
s&eacute;quentielle en ajoutant une balise enfant &lt;mx:Parallel&gt; ou &lt;mx:Sequence&gt;, comme l’illustre l’exemple suivant
(en gras) :
&lt;mx:Transition id=&quot;myTransition&quot; fromState=&quot;*&quot; toState=&quot;checkout&quot;&gt;
&lt;mx:Parallel&gt;
&lt;/mx:Parallel&gt;
&lt;/mx:Transition&gt;
Si vous souhaitez appliquer simultan&eacute;ment les effets, utilisez la balise &lt;mx:Parallel&gt;. Si vous souhaitez les
appliquer les uns apr&egrave;s les autres, utilisez la balise &lt;mx:Sequence&gt;.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 233
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
5 Dans la balise &lt;mx:Parallel&gt; ou &lt;mx:Sequence&gt;, sp&eacute;cifiez le ou les composants cible de la transition en
d&eacute;finissant la propri&eacute;t&eacute; target (pour un composant cible) ou targets (pour plusieurs composants cible) selon
l’ID du ou des composants cible, comme l’illustre l’exemple suivant :
&lt;mx:Parallel targets=&quot;{[myVGroup1,myVGroup2,myVGroup3]}&quot;&gt;
&lt;/mx:Parallel&gt;
Dans cet exemple, trois conteneurs VGroup sont cibl&eacute;s. La propri&eacute;t&eacute; targets s&eacute;lectionne un tableau de plusieurs ID.
6 Dans la balise &lt;mx:Parallel&gt; ou &lt;mx:Sequence&gt;, sp&eacute;cifiez les effets &agrave; appliquer lors d’un changement d’&eacute;tat
d’affichage en ajoutant des balises enfant d’effet, comme l’illustre l’exemple suivant (en gras) :
&lt;mx:Parallel targets=&quot;{[myVBox1,myVBox2,myVBox3]}&quot;&gt;
&lt;mx:Move duration=&quot;400&quot;/&gt;
&lt;mx:Resize duration=&quot;400&quot;/&gt;
&lt;/mx:Parallel&gt;
Pour conna&icirc;tre la liste des effets possibles et savoir comment d&eacute;finir leurs propri&eacute;t&eacute;s, voir Introduction to effects.
7 Pour tester la transition, cliquez sur le bouton Ex&eacute;cuter de la barre d’outils de Flash Builder, puis changez d’&eacute;tat
apr&egrave;s le lancement de l’application.
Liaison des contr&ocirc;les &agrave; des donn&eacute;es
Pour acc&eacute;der &agrave; un service de donn&eacute;es, Flash Builder fournit des outils permettant de lier les donn&eacute;es &agrave; des contr&ocirc;les
de donn&eacute;es, par exemple DataGrid. Il cr&eacute;e les colonnes d’un contr&ocirc;le DataGrid en fonction des donn&eacute;es retourn&eacute;es
par un service. Vous devrez g&eacute;n&eacute;ralement configurer les colonnes ainsi g&eacute;n&eacute;r&eacute;es. Flash Builder comporte un &eacute;diteur
pour la configuration des colonnes des composants DataGrid et AdvancedDataGrid.
Pour plus d’informations sur la liaison des donn&eacute;es aux contr&ocirc;les de donn&eacute;es, voir Liaison d’op&eacute;rations de service &agrave;
des contr&ocirc;les.
Configuration des composants DataGrid et Advanced DataGrid
Passez en mode Cr&eacute;ation de l’&eacute;diteur MXML pour configurer les colonnes DataGrid. La proc&eacute;dure suivante illustre la
configuration des colonnes d’un composant DataGrid acc&eacute;dant &agrave; un service de donn&eacute;es. La configuration des colonnes
d’un composant AdvancedDataGrid est analogue.
Configuration des colonnes d’un composant DataGrid
1 En mode Cr&eacute;ation de l’&eacute;diteur MXML, ajoutez un contr&ocirc;le DataGrid (ou AdvancedDataGrid). Liez-le aux donn&eacute;es
renvoy&eacute;es par un service de donn&eacute;es.
Pour plus d’informations, voir Liaison d’op&eacute;rations de service &agrave; des contr&ocirc;les.
2 S&eacute;lectionnez le contr&ocirc;le DataGrid, puis cliquez sur le bouton Configurer les colonnes de la vue Propri&eacute;t&eacute;s.
Vous pouvez &eacute;galement s&eacute;lectionner cette option dans le menu contextuel du contr&ocirc;le.
3 Dans la bo&icirc;te de dialogue Configurer les colonnes, utilisez les boutons Ajouter, Supprimer, Haut et Bas pour
ajouter, supprimer ou r&eacute;organiser les colonnes.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 234
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
4 La Vue standard de cette bo&icirc;te de dialogue permet de modifier les principales propri&eacute;t&eacute;s d’une colonne
s&eacute;lectionn&eacute;e.
• Liaison de donn&eacute;es
S&eacute;lectionnez le champ de donn&eacute;es qui vous souhaitez afficher dans la colonne. La liste d&eacute;roulante Liaison au
champ r&eacute;pertorie tous les champs disponibles &agrave; partir des donn&eacute;es renvoy&eacute;es. Si le contr&ocirc;le DataGrid est
modifiable, vous pouvez d&eacute;terminer si les donn&eacute;es de cette colonne peuvent &ecirc;tre modifi&eacute;es.
Si les donn&eacute;es &agrave; afficher ne proviennent pas d’un service de donn&eacute;es, Liaison au champ se pr&eacute;sente sous la forme
d’une zone de texte permettant de repr&eacute;senter les colonnes d&eacute;finies dans la source de donn&eacute;es. Vous pouvez par
exemple saisir le nom des colonnes d&eacute;finies dans une XMLList. Si le nom sp&eacute;cifi&eacute; ne correspond &agrave; aucune source
de donn&eacute;es d&eacute;finie, la valeur est ignor&eacute;e et la colonne demeure vide.
Les colonnes ajout&eacute;es par programme &agrave; un contr&ocirc;le DataGrid ne peuvent pas &ecirc;tre configur&eacute;es &agrave; l’aide des
fonctions de liaison de donn&eacute;es.
• Propri&eacute;t&eacute;s g&eacute;n&eacute;rales
Sp&eacute;cifiez l’en-t&ecirc;te et la largeur de la colonne. D&eacute;finissez &eacute;galement si la colonne peut ou non &ecirc;tre
redimensionn&eacute;e ou tri&eacute;e.
La largeur doit &ecirc;tre exprim&eacute;e en pixels. La valeur par d&eacute;faut est 100 pixels. Si la valeur de la propri&eacute;t&eacute;
horizontalScrollPolicy du contr&ocirc;le DataGrid est false, toutes les colonnes visibles sont affich&eacute;es. Pour
garantir l’affichage de toutes les colonnes visibles, DataGrid ne respecte pas toujours la valeur sp&eacute;cifi&eacute;e pour la
largeur.
• Propri&eacute;t&eacute;s de texte
D&eacute;finissez le style de mise en forme du texte de la colonne.
5 La Vue avanc&eacute;e permet d’afficher et de modifier les param&egrave;tres de toutes les propri&eacute;t&eacute;s d’une colonne s&eacute;lectionn&eacute;e.
Ajout de composants de repr&eacute;sentation graphique
Flash Builder vous permet d’ajouter des composants de repr&eacute;sentation graphique pour l’affichage des donn&eacute;es dans
l’interface utilisateur. Ces composants Flex vous permettent de cr&eacute;er des types de graphiques tr&egrave;s courants et d’en
d&eacute;terminer enti&egrave;rement l’aspect. Pour un r&eacute;capitulatif des graphiques disponibles, voir Chart types.
Cette section d&eacute;crit l’ajout de composants de repr&eacute;sentation graphique &agrave; l’interface utilisateur. Pour plus
d’informations sur la d&eacute;finition de donn&eacute;es de graphique, la mise en forme d’&eacute;l&eacute;ments de graphique et la manipulation
d’autres aspects des graphiques, voir Introduction to Charts.
Ajout d’un composant de repr&eacute;sentation graphique
1 En mode Cr&eacute;ation de l’&eacute;diteur MXML, faites glisser un composant de repr&eacute;sentation graphique de la vue
Composants vers la zone de cr&eacute;ation.
2 Saisissez un ID pour le graphique.
3 Pour afficher plusieurs s&eacute;ries de donn&eacute;es dans le graphique, cliquez sur le bouton Ajouter et saisissez le nom de la
nouvelle s&eacute;rie dans la bo&icirc;te de dialogue qui s’affiche.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 235
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
Par exemple, le contr&ocirc;le ColumnChart contient deux s&eacute;ries de donn&eacute;es. La barre sur la gauche repr&eacute;sente le
b&eacute;n&eacute;fice brut sur six mois, et la suivante, le b&eacute;n&eacute;fice net pour la m&ecirc;me p&eacute;riode.
Supprimez une s&eacute;rie de donn&eacute;es en la s&eacute;lectionnant dans la liste et en cliquant sur le bouton Supprimer.
4 (Facultatif) S&eacute;lectionnez l’option Inclure une l&eacute;gende.
Cette option vous permet d’ajouter un contr&ocirc;le Legend au graphique. Ce contr&ocirc;le affiche l’&eacute;tiquette de chaque s&eacute;rie
de donn&eacute;es dans le graphique et une l&eacute;gende affichant l’&eacute;l&eacute;ment de repr&eacute;sentation graphique de la s&eacute;rie.
5 Cliquez sur OK pour ins&eacute;rer le graphique.
Ajout d’interactivit&eacute; &agrave; l’aide d’effets
Un effet est la modification visible ou audible du composant cible se produisant sur une p&eacute;riode exprim&eacute;e en
millisecondes. Le fondu, le redimensionnement ou le d&eacute;placement d’un composant constituent des exemples d’effets.
Les effets sont d&eacute;clench&eacute;s en r&eacute;ponse &agrave; un &eacute;v&eacute;nement, lui-m&ecirc;me souvent d&eacute;clench&eacute; par l’action d’un utilisateur, par
exemple le fait de cliquer sur un bouton. Les effets peuvent toutefois &ecirc;tre programm&eacute;s ou d&eacute;clench&eacute;s en r&eacute;ponse &agrave; des
&eacute;v&eacute;nements qui ne sont pas d&eacute;clench&eacute;s par l’utilisateur.
Vous pouvez par exemple cr&eacute;er un effet faisant rebondir l&eacute;g&egrave;rement un composant TextInput auquel l’utilisateur
acc&egrave;de par tabulation. Vous pouvez &eacute;galement appliquer un effet de fondu en sortie &agrave; un composant Label sur lequel
l’utilisateur fait glisser le curseur de la souris.
Dans Flash Builder, les effets peuvent &ecirc;tre d&eacute;finis en tant que propri&eacute;t&eacute;s des composants MXML. Acc&eacute;dez &agrave; la vue
Source de l’&eacute;diteur MXML pour impl&eacute;menter l’effet.
L’impl&eacute;mentation des effets varie suivant qu’il s’agit de composants Spark ou MX. Pour plus d’informations sur la
cr&eacute;ation d’effets en code MXML et ActionScript, voir Introduction to effects.
Cr&eacute;ation d’un effet pour un composant
Vous d&eacute;finissez les effets g&eacute;n&eacute;ralement en mode Source de l’&eacute;diteur MXML. Ils sont souvent invoqu&eacute;s &agrave; partir du
gestionnaire d’&eacute;v&eacute;nement d’un composant. Vous pouvez par exemple utiliser le gestionnaire d’&eacute;v&eacute;nement click pour
qu’un composant Button invoque un effet. Voir Applying effects.
Dans Flash Builder cependant, vous pouvez d&eacute;finir un effet pour une propri&eacute;t&eacute; d’un composant MXML.
1 Acc&eacute;dez au mode Cr&eacute;ation de l’&eacute;diteur MXML, puis cliquez sur un composant dans la zone de cr&eacute;ation.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 236
Cr&eacute;ation d’une interface utilisateur avec Flash Builder
2 D&eacute;finissez la propri&eacute;t&eacute; d’effet pour les composants Spark :
a Dans la vue Propri&eacute;t&eacute;s, s&eacute;lectionnez l’ic&ocirc;ne Vue par cat&eacute;gories.
b Dans la cat&eacute;gorie Effets, s&eacute;lectionnez une propri&eacute;t&eacute; et sp&eacute;cifiez un effet.
Vous pouvez par exemple sp&eacute;cifier l’effet Fade pour la propri&eacute;t&eacute; rollOverEffect d’un composant Button. Pour
obtenir une liste des effets disponibles, voir Available effects.
3 Enregistrez le fichier et ex&eacute;cutez-le pour visionner l’effet.
Derni&egrave;re mise &agrave; jour le 29/4/2010
Chapitre 10 : Utilisation de donn&eacute;es dans
Flash Builder
Dans Adobe&reg; Flash&reg; Builder™, vous interagissez avec des donn&eacute;es et des contr&ocirc;les g&eacute;r&eacute;s par des donn&eacute;es directement
dans les codes ActionScript et MXML. Vous pouvez travailler avec des donn&eacute;es, g&eacute;n&eacute;rer automatiquement des
applications de bases de donn&eacute;es et utiliser un code proxy pour les services Web, ainsi que g&eacute;n&eacute;rer et utiliser le code
fonctionnant avec Flex Ajax Bridge. Vous pouvez &eacute;galement g&eacute;rer les probl&egrave;mes de s&eacute;curit&eacute; d’acc&egrave;s aux donn&eacute;es
d’Adobe Flash Player et utiliser Flash Builder avec un service proxy.
A propos de l’utilisation des donn&eacute;es dans Flash Builder
Dans Flash Builder, les donn&eacute;es sont manipul&eacute;es en modifiant directement les codes des applications ActionScript et
MXML.
Conteneurs et contr&ocirc;les g&eacute;r&eacute;s par les donn&eacute;es
Flex fournit des composants de type conteneur et de type contr&ocirc;le &agrave; partir desquels vous pouvez cr&eacute;er les interfaces
utilisateur de vos applications Flex. Certains composants pr&eacute;sentent des donn&eacute;es que les utilisateurs peuvent
s&eacute;lectionner et avec lesquelles ils peuvent interagir lors de l’utilisation de l’application. Voici quelques exemples
d’utilisation des contr&ocirc;les g&eacute;r&eacute;s par les donn&eacute;es :
• Dans un formulaire pour la saisie d’une adresse, vous pouvez donner aux utilisateurs la possibilit&eacute; de s&eacute;lectionner
leur pays de r&eacute;sidence (par exemple) en utilisant les contr&ocirc;les ComboBox ou List.
• Dans une application de panier d’achats, vous pouvez utiliser un composant Spark List pour pr&eacute;senter les donn&eacute;es
des produits comportant des images. Pour le composant List, la pr&eacute;sentation peut prendre les valeurs suivantes :
VerticalLayout, HorizontalLayout ou TileLayout.
• Vous pouvez fournir des options standard de navigation en utilisant des conteneurs tels que les contr&ocirc;les TabBar
et ButtonBar.
Pour tous les contr&ocirc;les g&eacute;r&eacute;s par des donn&eacute;es, l’entr&eacute;e de donn&eacute;es est effectu&eacute;e par un fournisseur de donn&eacute;es.
Pour plus d’informations sur l’utilisation de contr&ocirc;les g&eacute;r&eacute;s par des donn&eacute;es, voir Spark list-based controls.
Fournisseurs de donn&eacute;es et collections
Un objet collection contient un objet de donn&eacute;es, par exemple Array ou XMList, et fournit un ensemble de m&eacute;thodes
permettant de consulter, trier, filtrer et modifier les &eacute;l&eacute;ments de donn&eacute;es de cet objet. Plusieurs contr&ocirc;les Adobe Flex,
d&eacute;sign&eacute;s par l’expression contr&ocirc;les de fournisseurs de donn&eacute;es, ont une propri&eacute;t&eacute; dataProvider renseign&eacute;e par une
collection.
Les exemples suivants illustrent comment un fournisseur de donn&eacute;es est d&eacute;fini (en tant qu’ArrayCollection
ActionScript) et utilis&eacute; par un contr&ocirc;le :
237
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 238
Utilisation de donn&eacute;es dans Flash Builder
&lt;!-- Simple example to demonstrate the Spark ComboBox control --&gt;
&lt;s:Application xmlns:fx=&quot;http://ns.adobe.com/mxml/2009&quot;
xmlns:s=&quot;library://ns.adobe.com/flex/spark&quot;
xmlns:mx=&quot;library://ns.adobe.com/flex/halo&quot;&gt;
&lt;fx:Script&gt;
&lt;![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
public var complexDP:ArrayCollection = new ArrayCollection(
[
{ingredient:&quot;Salmon&quot;, category:&quot;Meat&quot;},
{ingredient:&quot;Potato&quot;, category:&quot;Starch&quot;},
{ingredient:&quot;Cucumber&quot;, category:&quot;Vegetable&quot;},
{ingredient:&quot;Steak&quot;, category:&quot;Meat&quot;},
{ingredient:&quot;Rice&quot;, category:&quot;Starch&quot;},
{ingredient:&quot;Cumin&quot;, category:&quot;Spice&quot;}
]
);
&lt;!-- Function to handel custom input strings --&gt;
private function myLabelToItemFunction(input:String):*
{
&lt;!-- Returns object that matches items in dataProvider --&gt;
return {ingredient:input, category:&quot;mystery&quot;};
}
]]&gt;
&lt;/fx:Script&gt;
&lt;s:Panel title=&quot;Spark ComboBox Example&quot; width=&quot;75%&quot; height=&quot;75%&quot;&gt;
&lt;s:layout&gt;
&lt;s:VerticalLayout paddingTop=&quot;10&quot; paddingLeft=&quot;10&quot;/&gt;
&lt;/s:layout&gt;
&lt;!-- Label that displayed current property values --&gt;
&lt;s:Label text=&quot;Index : {cb.selectedIndex}
Item : {cb.selectedItem.ingredient}
Type : {cb.selectedItem.category}&quot;/&gt;
&lt;!-- ComboBox with custom labelToItem function --&gt;
&lt;s:ComboBox
id=&quot;cb&quot;
dataProvider=&quot;{complexDP}&quot;
width=&quot;150&quot;
labelToItemFunction=&quot;{myLabelToItemFunction}&quot;
selectedIndex=&quot;0&quot;
labelField=&quot;ingredient&quot;/&gt;
&lt;/s:Panel&gt;
&lt;/s:Application&gt;
Pour plus d’informations sur les fournisseurs de donn&eacute;es et les collections, voir Data providers and collections.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 239
Utilisation de donn&eacute;es dans Flash Builder
Acc&egrave;s aux donn&eacute;es distantes
Flex contient des composants d’acc&egrave;s aux donn&eacute;es bas&eacute;s sur une architecture orient&eacute;e services (Service-oriented
architecture, SOA). Ces composants utilisent des appels de proc&eacute;dure distants pour interagir avec des environnements
de serveur (PHP, Adobe ColdFusion&reg; et Microsoft ASP.NET, par exemple), afin de fournir des donn&eacute;es aux
applications et d’envoyer des donn&eacute;es aux sources de donn&eacute;es principales.
Selon le type d’interface dont vous disposez sur une application c&ocirc;t&eacute; serveur donn&eacute;e, vous pouvez vous connecter &agrave;
une application Flex &agrave; l’aide de l’une des m&eacute;thodes suivantes :
• HTTP GET ou POST avec le composant HTTPService
• 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&eacute;velopper des applications acc&eacute;dant aux donn&eacute;es c&ocirc;t&eacute; serveur,
utilisez un fichier cross-domain.xml ou un proxy si vous acc&eacute;dez aux donn&eacute;es &agrave; partir d’un domaine diff&eacute;rent du
domaine &agrave; partir duquel l’application a &eacute;t&eacute; charg&eacute;e. Voir &laquo; Gestion de la s&eacute;curit&eacute; de Flash Player &raquo; &agrave; la page 245.
Flash Builder permet &eacute;galement la cr&eacute;ation d’applications utilisant Adobe LiveCycle&reg; Data Services ES, un produit
distinct offrant des fonctionnalit&eacute;s de service de donn&eacute;es avanc&eacute;es. LiveCycle Data Services ES propose des
applications de service d’appel de proc&eacute;dure distante (RPC), ainsi qu’une configuration de s&eacute;curit&eacute; avanc&eacute;e. Il offre
&eacute;galement les services de donn&eacute;es suivants :
Service de gestion de donn&eacute;es Ce service permet de cr&eacute;er des applications utilisant des donn&eacute;es distribu&eacute;es ainsi que
de g&eacute;rer d’importantes collections de donn&eacute;es et de relations de donn&eacute;es imbriqu&eacute;es, telles que les relations un-&agrave;-un
ou un-&agrave;-plusieurs.
Service de message Ce service permet de cr&eacute;er des applications pouvant envoyer des messages &agrave; d’autres applications
et recevoir des messages d’autres applications, dont les applications Flex et JMS (Java Message Service).
Flash Builder fournit des assistants et des outils permettant de se connecter aux services de donn&eacute;es et de lier des
op&eacute;rations de services de donn&eacute;es &agrave; des composants d’application. Voir Cr&eacute;ation d’applications centr&eacute;es sur les
donn&eacute;es avec Flash Builder.
Liaison de donn&eacute;es
Comme vous avez pu le constater dans l’exemple de code fourni dans &laquo; Fournisseurs de donn&eacute;es et collections &raquo; &agrave; la
page 237, la valeur de la propri&eacute;t&eacute; dataProvider du contr&ocirc;le ComboBox est &quot;{complexDP}&quot;. Il s’agit d’un exemple
de liaison de donn&eacute;es.
La liaison de donn&eacute;es copie la valeur d’un objet (la source) dans un autre objet (la destination). Une fois qu’un objet
est li&eacute; &agrave; un autre objet, les modifications apport&eacute;es &agrave; la source sont automatiquement r&eacute;percut&eacute;es dans la destination.
L’exemple suivant lie la propri&eacute;t&eacute; de texte d’un contr&ocirc;le TextInput (la source) &agrave; la propri&eacute;t&eacute; de texte d’un contr&ocirc;le
Label (la destination), de sorte &agrave; ce que le texte saisi dans le contr&ocirc;le TextInput s’affiche dans le contr&ocirc;le Label :
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 240
Utilisation de donn&eacute;es dans Flash Builder
&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
&lt;s:Application xmlns:fx=&quot;http://ns.adobe.com/mxml/2009&quot;
xmlns:s=&quot;library://ns.adobe.com/flex/spark&quot;
xmlns:mx=&quot;library://ns.adobe.com/flex/mx&quot; minWidth=&quot;955&quot; minHeight=&quot;600&quot;&gt;
&lt;fx:Declarations&gt;
&lt;!-- Place non-visual elements (e.g., services, value objects) here --&gt;
&lt;/fx:Declarations&gt;
&lt;s:TextInput id=&quot;LNameInput&quot; x=&quot;10&quot; y=&quot;10&quot;/&gt;
&lt;s:Label text=&quot;{LNameInput.text}&quot; x=&quot;10&quot; y=&quot;50&quot;/&gt;
&lt;/s:Application&gt;
Pour lier des donn&eacute;es d’un objet &agrave; un autre, vous pouvez faire appel &agrave; la syntaxe d’accolades ({ }) (comme l’illustre
l’exemple) ou &agrave; la balise &lt;fx:Binding&gt;. Pour plus d’informations, voir Using data binding with data models et Data
binding dans Utilisation d’Adobe Flex 4.
Mod&egrave;les de donn&eacute;es
Un mod&egrave;le de donn&eacute;es est un objet que vous pouvez utiliser afin de stocker de mani&egrave;re temporaire des donn&eacute;es dans
la m&eacute;moire pour faciliter leur manipulation. Vous pouvez d&eacute;finir un mod&egrave;le de donn&eacute;es dans ActionScript et dans
MXML en utilisant une balise telle que &lt;fx:Model&gt; ou en utilisant tout objet contenant des propri&eacute;t&eacute;s. Par exemple,
le mod&egrave;le de donn&eacute;es suivant affiche des informations telles que le nom d’une personne, son &acirc;ge et son num&eacute;ro de
t&eacute;l&eacute;phone :
&lt;fx:Declarations&gt;
&lt;fx:Model id=&quot;reg&quot;&gt;
&lt;registration&gt;
&lt;name&gt;{nme.text}&lt;/name&gt;
&lt;email&gt;{email.text}&lt;/email&gt;
&lt;phone&gt;{phone.text}&lt;/phone&gt;
&lt;zip&gt;{zip.text}&lt;/zip&gt;
&lt;ssn&gt;{ssn.text}&lt;/ssn&gt;
&lt;/registration&gt;
&lt;/fx:Model&gt;
&lt;/fx:Declarations&gt;
Les champs d’un mod&egrave;le de donn&eacute;es peuvent contenir des donn&eacute;es statiques (comme l’illustre l’exemple). Vous
pouvez &eacute;galement avoir recours aux liaisons de donn&eacute;es pour transmettre des donn&eacute;es au mod&egrave;le de donn&eacute;es ou en
provenance de ce dernier.
Vous pouvez en outre d&eacute;finir le mod&egrave;le de donn&eacute;es dans un fichier XML. Vous r&eacute;f&eacute;rencez alors le fichier XML par le
biais du syst&egrave;me de fichiers ou d’une URL &agrave; l’aide de la propri&eacute;t&eacute; source de la balise &lt;fx:Model&gt;, comme l’illustre
l’exemple suivant :
&lt;fx:Model source=&quot;content.xml&quot; id=&quot;Contacts&quot;/&gt;
&lt;fx:Model source=&quot;http://www.somesite.com/companyinfo.xml&quot; id=&quot;myCompany&quot;/&gt;
Pour plus d’informations sur les mod&egrave;les de donn&eacute;es, voir Storing Data.
Validation de donn&eacute;es
La validation de donn&eacute;es v&eacute;rifie que les donn&eacute;es saisies par l’utilisateur dans l’application sont valides. Vous pouvez
par exemple utiliser un validateur de donn&eacute;es de code postal pour v&eacute;rifier que le code postal indiqu&eacute; par l’utilisateur
est valide.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 241
Utilisation de donn&eacute;es dans Flash Builder
Flex propose des validateurs pr&eacute;d&eacute;finis pour les types de donn&eacute;es suivants : carte de cr&eacute;dit, devise, date, adresse
&eacute;lectronique, num&eacute;ro, num&eacute;ro de t&eacute;l&eacute;phone, expression r&eacute;guli&egrave;re, s&eacute;curit&eacute; sociale, cha&icirc;ne et code postal.
Les validateurs de donn&eacute;es sont des composants Flex non visuels, ce qui signifie qu’ils ne sont pas accessibles &agrave; partir
de la vue Composants. Vous devez donc les ins&eacute;rer dans le code, comme l’illustre l’exemple MXML suivant :
&lt;!-- Define the ZipCodeValidator. --&gt;
&lt;mx:ZipCodeValidator id=&quot;zcV&quot; source=&quot;{zipcodeInput}&quot; property=&quot;text&quot;/&gt;
&lt;!-- Define the TextInput control for entering the zip code. --&gt;
&lt;s:TextInput id=&quot;zipcodeInput&quot;/&gt;
Dans cet exemple MXML, le validateur est d&eacute;fini avec la balise MXML appropri&eacute;e et est li&eacute; &agrave; la propri&eacute;t&eacute; ID d’un
contr&ocirc;le TextInput. Au moment de l’ex&eacute;cution, lorsque l’utilisateur saisit le num&eacute;ro de t&eacute;l&eacute;phone dans le contr&ocirc;le
TextInput, le num&eacute;ro est imm&eacute;diatement valid&eacute;.
Vous pouvez bien s&ucirc;r utiliser les validateurs de donn&eacute;es dans ActionScript en d&eacute;finissant une variable en tant
qu’occurrence d’une classe de validateur, puis en cr&eacute;ant une fonction pour la lier au contr&ocirc;le de saisie.
Les validateurs de donn&eacute;es sont souvent utilis&eacute;s avec les mod&egrave;les de donn&eacute;es. Pour plus d’informations, voir
Validating Data.
Mise en forme des donn&eacute;es
La mise en forme correcte de certains types de donn&eacute;es dans l’application est garantie par l’utilisation de formateurs
de donn&eacute;es. Flex fournit des formateurs de donn&eacute;es pr&eacute;d&eacute;finis pour les types de donn&eacute;es suivants : devise, date,
num&eacute;ro, t&eacute;l&eacute;phone et code postal.
Les formateurs de donn&eacute;es sont li&eacute;s aux contr&ocirc;les de saisie. Ils mettent correctement en forme les donn&eacute;es saisies par
l’utilisateur. Par exemple, un utilisateur peut saisir une date au format suivant :
120105
Un formateur, li&eacute; au contr&ocirc;le de saisie de texte, stocke et affiche la date au format suivant :
12/01/05
A l’instar des validateurs de donn&eacute;es, les formateurs de donn&eacute;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.
G&eacute;n&eacute;ration automatique du code Flex Ajax Bridge
La fonction Cr&eacute;er un composant Ajax Bridge permet de g&eacute;n&eacute;rer un code JavaScript et un fichier d’enveloppe HTML
facilitant l’utilisation d’une application Flex de JavaScript dans une page HTML. Elle peut &ecirc;tre utilis&eacute;e conjointement
avec la biblioth&egrave;que Flex Ajax Bridge JavaScript qui permet d’exposer une application Flex au script dans le navigateur
Web. Le code JavaScript g&eacute;n&eacute;r&eacute; est tr&egrave;s l&eacute;ger puisqu’il est destin&eacute; &agrave; exposer la fonctionnalit&eacute; d&eacute;j&agrave; fournie par Flex Ajax
Bridge. Pour plus d’informations sur Flex Ajax Bridge, voir Flex Ajax Bridge.
La fonction Cr&eacute;er un composant Ajax Bridge g&eacute;n&egrave;re un code proxy JavaScript sp&eacute;cifique aux API d’application Flex
que vous voulez appeler &agrave; partir de JavaScript. Vous pouvez g&eacute;n&eacute;rer du code pour toute classe ActionScript ou
application MXML dans un projet Flash Builder.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 242
Utilisation de donn&eacute;es dans Flash Builder
Pour les fichiers d’application MXML, vous pouvez g&eacute;n&eacute;rer un code pour tous les &eacute;l&eacute;ments suivants ou une partie
d’entre eux dans le code MXML :
• Liste des &eacute;l&eacute;ments h&eacute;rit&eacute;s pouvant s’&eacute;tendre de fa&ccedil;on non r&eacute;cursive
• Propri&eacute;t&eacute;s publiques, incluant les balises avec les propri&eacute;t&eacute;s id
• Constantes publiques
• Fonctions publiques incluant les classes d&eacute;finies dans la ligne
Pour les classes ActionScript, vous pouvez g&eacute;n&eacute;rer un code pour tous les &eacute;l&eacute;ments suivants ou une partie d’entre eux :
• Liste des &eacute;l&eacute;ments h&eacute;rit&eacute;s
• Propri&eacute;t&eacute;s publiques (pour chaque propri&eacute;t&eacute;, affichage d’une m&eacute;thode get et set)
• Constantes publiques
• M&eacute;thodes publiques
Dans un r&eacute;pertoire que vous sp&eacute;cifiez, la fonction Cr&eacute;er un composant Ajax Bridge g&eacute;n&egrave;re des fichiers *.js et *.html
correspondant aux applications MXML et aux classes ActionScript s&eacute;lectionn&eacute;es pour la g&eacute;n&eacute;ration. Elle place une
copie de la biblioth&egrave;que Flex Ajax Bridge (fabridge.js) dans un sous-r&eacute;pertoire du r&eacute;pertoire de g&eacute;n&eacute;ration de code.
Cette fonction g&eacute;n&egrave;re &eacute;galement des fichiers d’aide MXML dans le r&eacute;pertoire src du projet ; ces fichiers sont utilis&eacute;s
pour finaliser la g&eacute;n&eacute;ration du code JavaScript.
G&eacute;n&eacute;ration de code Ajax Bridge
1 Cliquez avec le bouton droit sur un projet dans l’Explorateur de packages Flex et s&eacute;lectionnez Cr&eacute;er un composant
Ajax Bridge.
2 Dans la bo&icirc;te de dialogue Cr&eacute;ation d’un composant Ajax Bridge, s&eacute;lectionnez les applications MXML et les classes
ActionScript pour lesquelles vous souhaitez g&eacute;n&eacute;rer un code JavaScript. Vous pouvez s&eacute;lectionner la case &agrave; cocher
de niveau sup&eacute;rieur pour inclure l’int&eacute;gralit&eacute; du projet ou vous pouvez s&eacute;lectionner des membres sp&eacute;cifiques.
3 Sp&eacute;cifiez le r&eacute;pertoire dans lequel g&eacute;n&eacute;rer les classes de proxy.
4 Cliquez sur OK pour g&eacute;n&eacute;rer le code. L’exemple suivant illustre un fichier .js g&eacute;n&eacute;r&eacute; pour une application affichant
des images :
*
* You should keep your JavaScript code inside this file as light as possible,
* and keep the body of your Ajax application in separate *.js files.
*
* Do make a backup of your changes before regenerating this file. (Ajax Bridge
* display a warning message.)
*
* For help in using this file, refer to the built-in documentation in the Ajax Bridge
application.
*
*/
/**
* Class &quot;DisplayShelfList&quot;
* Fully qualified class name: &quot;DisplayShelfList&quot;
*/
function DisplayShelfList(obj) {
if (arguments.length &gt; 0) {
this.obj = arguments[0];
} else {
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 243
Utilisation de donn&eacute;es dans Flash Builder
this.obj = FABridge[&quot;b_DisplayShelfList&quot;].
create(&quot;DisplayShelfList&quot;);
}
}
// CLASS BODY
// Selected class properties and methods
DisplayShelfList.prototype = {
// Fields form class &quot;DisplayShelfList&quot; (translated to getters/setters):
// Methods form class &quot;DisplayShelfList&quot;:
getAngle : function() {
return this.obj.getAngle();
},
setAngle : function(argNumber) {
this.obj.setAngle(argNumber);
},
setCurrentPosition : function(argNumber) {
this.obj.setCurrentPosition(argNumber);
},
setSelectedIndex : function(argNumber) {
this.obj.setSelectedIndex(argNumber);
},
setPercentHeight : function(argNumber) {
this.obj.setPercentHeight(argNumber);
},
setPercentWidth : function(argNumber) {
this.obj.setPercentWidth(argNumber);
},
DisplayShelfList : function() {
return this.obj.DisplayShelfList();
},
setFirst : function(argNumber) {
this.obj.setFirst(argNumber);
},
setFormat : function(argString) {
this.obj.setFormat(argString);
},
setLast : function(argNumber) {
this.obj.setLast(argNumber);
}
}
/**
* Listen for the instantiation of the Flex application over the bridge.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 244
Utilisation de donn&eacute;es dans Flash Builder
*/
FABridge.addInitializationCallback(&quot;b_DisplayShelfList&quot;, DisplayShelfListReady);
/**
* Hook here all of the code that must run as soon as the DisplayShelfList class
* finishes its instantiation over the bridge.
*
* For basic tasks, such as running a Flex method on the click of a JavaScript
* button, chances are that both Ajax and Flex have loaded before the
* user actually clicks the button.
*
* However, using DisplayShelfListReady() is the safest way, because it lets
* Ajax know that involved Flex classes are available for use.
*/
function DisplayShelfListReady() {
// Initialize the root object. This represents the actual
// DisplayShelfListHelper.mxml Flex application.
b_DisplayShelfList_root = FABridge[&quot;b_DisplayShelfList&quot;].root();
//
//
//
//
//
YOUR CODE HERE
var DisplayShelfListObj = new DisplayShelfList();
Example:
var myVar = DisplayShelfListObj.getAngle ();
b_DisplayShelfList_root.addChild(DisplayShelfListObj);
}
5 Modifiez les fichiers .js g&eacute;n&eacute;r&eacute;s. Dans la fonction xxxReady() des fichiers .js g&eacute;n&eacute;r&eacute;s, ajoutez le code &agrave; ex&eacute;cuter d&egrave;s
que la classe correspondante termine son instanciation sur Ajax Bridge. Selon l’application, le code par d&eacute;faut peut
&ecirc;tre g&eacute;n&eacute;r&eacute; dans cette m&eacute;thode. Le code en gras de l’exemple suivant illustre le code d’initialisation personnalis&eacute;
pour l’exemple d’application d’image.
...
function DisplayShelfListReady() {
// Initialize the root object. This represents the actual
// DisplayShelfListHelper.mxml Flex application.
b_DisplayShelfList_root = FABridge[&quot;b_DisplayShelfList&quot;].root();
// Create a new object.
DisplayShelfListObj = new DisplayShelfList();
// Make it as big as the application.
DisplayShelfListObj.setPercentWidth(100);
DisplayShelfListObj.setPercentHeight(100);
//Set specific attributes.
DisplayShelfListObj.setFirst(1);
DisplayShelfListObj.setLast(49);
DisplayShelfListObj.setFormat(&quot;./photos400/photo%02d.jpg&quot;);
//Add the object to the DisplayList hierarchy.
b_DisplayShelfList_root.addChild(DisplayShelfListObj.obj);
}
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 245
Utilisation de donn&eacute;es dans Flash Builder
6 Modifiez les fichiers .html g&eacute;n&eacute;r&eacute;s. Dans la partie des pages HTML contenant le texte d’indication d’emplacement
de la description, remplacez le texte par le code HTML &agrave; utiliser pour acc&eacute;der &agrave; l’application Flex &agrave; partir de la page
HTML. Par exemple, ce code ajoute des boutons pour contr&ocirc;ler l’exemple d’application d’image :
&lt;h2&gt;Test controls&lt;/h2&gt;
&lt;ul&gt;
&lt;li&gt;&lt;input type=&quot;button&quot; onclick=&quot;DisplayShelfListObj.setCurrentPosition(0)&quot;
value=&quot;Go to first item&quot;/&gt;
&lt;/li&gt;
&lt;li&gt;&lt;input type=&quot;button&quot; onclick=&quot;DisplayShelfListObj.setCurrentPosition(3)&quot;
value=&quot;Go to fourth item&quot;/&gt;
&lt;/li&gt;
&lt;li&gt;&lt;input type=&quot;button&quot; onclick=&quot;DisplayShelfListObj.setSelectedIndex(0)&quot;
value=&quot;Go to first item (with animation)&quot;/&gt;
&lt;/li&gt;
&lt;li&gt;&lt;input type=&quot;button&quot; onclick=&quot;DisplayShelfListObj.setSelectedIndex(3)&quot;
value=&quot;Go to fourth item (with animation)&quot;/&gt;
&lt;/li&gt;
&lt;li&gt;&lt;input type=&quot;button&quot; onclick=&quot;alert(DisplayShelfListObj.getAngle())&quot;
value=&quot;Get photo angle&quot;/&gt;
&lt;/li&gt;
&lt;li&gt;&lt;input type=&quot;button&quot; onclick=&quot;DisplayShelfListObj.setAngle(15);&quot;
value=&quot;Set photo angle to 15&amp;deg;&quot;/&gt;
&lt;/li&gt;
&lt;/ul&gt;
7 Ouvrez la page HTML dans un navigateur Web pour ex&eacute;cuter l’application.
Gestion de la s&eacute;curit&eacute; de Flash Player
Flash Player n’autorise pas une application &agrave; recevoir des donn&eacute;es d’un domaine autre que celui &agrave; partir duquel il a &eacute;t&eacute;
charg&eacute;, &agrave; moins d’une autorisation explicite donn&eacute;e. Si vous chargez le fichier SWF d’application depuis
http://mydomain.com, il ne peut pas charger de donn&eacute;es depuis http://yourdomain.com. Ce sandbox de s&eacute;curit&eacute;
emp&ecirc;che une utilisation malveillante des fonctions de Flash Player (JaveScript utilise un mod&egrave;le de s&eacute;curit&eacute; similaire
pour emp&ecirc;cher toute utilisation malveillante de JavaScript).
Pour acc&eacute;der aux donn&eacute;es &agrave; partir d’une application Flex, vous avez trois possibilit&eacute;s :
• Ajoutez un fichier de r&eacute;gulation interdomaines &agrave; la racine du serveur h&eacute;bergeant le service de donn&eacute;es. Voir
&laquo; Utilisation des fichiers de r&eacute;gulation interdomaines &raquo; &agrave; la page 245.
• Placez le fichier SWF d’application sur le m&ecirc;me serveur que celui h&eacute;bergeant le service de donn&eacute;es.
• Sur le serveur contenant le fichier SWF d’application, cr&eacute;ez un proxy qui appelle un service de donn&eacute;es h&eacute;berg&eacute; sur
un autre serveur. Voir &laquo; Configuration de Flash Builder pour l’acc&egrave;s par proxy aux donn&eacute;es distantes &raquo; &agrave; la
page 246.
Utilisation des fichiers de r&eacute;gulation interdomaines
Un fichier de r&eacute;gulation interdomaines est un simple fichier XML qui accorde &agrave; Flash Player l’autorisation d’acc&eacute;der
aux donn&eacute;es &agrave; partir d’un domaine autre que le domaine sur lequel r&eacute;side l’application. Sans ce fichier de r&eacute;gulation,
l’utilisateur est invit&eacute; &agrave; fournir une autorisation d’acc&egrave;s via une bo&icirc;te de dialogue. Cette situation est &agrave; &eacute;viter.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 246
Utilisation de donn&eacute;es dans Flash Builder
Le fichier de r&eacute;gulation interdomaines (intitul&eacute; crossdomain.xml) est plac&eacute; &agrave; la racine du serveur (ou des serveurs)
contenant les donn&eacute;es auxquelles vous souhaitez acc&eacute;der. L’exemple suivant illustre un fichier de r&eacute;gulation
interdomaines :
&lt;?xml version=&quot;1.0&quot;?&gt;
&lt;!DOCTYPE cross-domain-policy SYSTEM &quot;http://www.adobe.com/xml/dtds/cross-domain-policy.dtd&quot;&gt;
&lt;cross-domain-policy&gt;
&lt;allow-access-from domain=&quot;www.yourdomain.com&quot; /&gt;
&lt;/cross-domain-policy&gt;
Pour plus d’informations sur la configuration des fichiers de r&eacute;gulation interdomaines, voir les notes techniques
suivantes : http://www.adobe.com/go/tn_14213.
Configuration d’un proxy pour acc&eacute;der aux donn&eacute;es distantes
Pour g&eacute;rer la s&eacute;curit&eacute; de Flash Player, au lieu d’utiliser un fichier de r&eacute;gulation interdomaines, vous pouvez &eacute;galement
utiliser un proxy. LiveCycle Data Services ES fournit un syst&egrave;me de gestion proxy complet pour les applications Flex.
Vous pouvez &eacute;galement cr&eacute;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&ecirc;tes de l’application vers le service distant et r&eacute;pond du service distant vers l’application
(Flash Player).
Pendant le d&eacute;veloppement des applications, le proxy est souvent h&eacute;berg&eacute; sur l’ordinateur local. Pour ce faire, vous
devez ex&eacute;cuter un serveur Web et un langage de script sur votre ordinateur de d&eacute;veloppement local.
Pour plus d’informations sur la cr&eacute;ation de votre propre proxy, voir les notes techniques suivantes :
http://www.adobe.com/go/tn_16520.
Configuration de Flash Builder pour l’acc&egrave;s par proxy aux donn&eacute;es distantes
Une fois que vous avez configur&eacute; un proxy pour acc&eacute;der aux donn&eacute;es d’un service distant, vous placez les fichiers
d’application dans le m&ecirc;me domaine que le proxy. Dans Flash Builder, vous pouvez modifier les param&egrave;tres de version
du projet et la configuration de lancement pour g&eacute;rer l’utilisation d’un proxy.
Si vous utilisez Flash Builder pour compiler vos applications et que le serveur proxy est &eacute;galement configur&eacute; sur votre
ordinateur de d&eacute;veloppement local, vous pouvez modifier les param&egrave;tres de version de projet de sorte &agrave; copier
automatiquement les fichiers d’application compil&eacute;s &agrave; l’emplacement appropri&eacute; sur votre serveur Web.
Modification du chemin de la version du projet
1 Dans l’Explorateur de packages Flex, s&eacute;lectionnez un projet.
2 Cliquez avec le bouton droit de la souris et s&eacute;lectionnez Propri&eacute;t&eacute;s. La bo&icirc;te de dialogue des propri&eacute;t&eacute;s du projet
appara&icirc;t.
3 S&eacute;lectionnez la page des propri&eacute;t&eacute;s Chemin de g&eacute;n&eacute;ration Flex.
4 Modifiez le dossier de sortie existant en saisissant un nouveau chemin ou en naviguant jusqu’au dossier appropri&eacute;
du serveur Web (C:\inetpub\wwwroot\myApp\, par exemple).
5 Cliquez sur OK.
Pour ex&eacute;cuter et d&eacute;boguer l’application &agrave; partir du serveur Web, modifiez la configuration de lancement du projet.
Remarque : si le serveur proxy n’est pas votre ordinateur local, copiez le contenu du r&eacute;pertoire bin sur le serveur avant
l’ex&eacute;cution ou le d&eacute;bogage du programme.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 247
Utilisation de donn&eacute;es dans Flash Builder
Modification de la configuration de lancement
1 Le fichier d’application principale du projet &eacute;tant ouvert dans Flash Builder, cliquez avec le bouton droit dans
l’&eacute;diteur et s&eacute;lectionnez Ex&eacute;cuter en tant que &gt; Ex&eacute;cuter les configurations. La bo&icirc;te de dialogue Cr&eacute;ation, gestion
et ex&eacute;cution des configurations s’affiche.
2 Dans la liste des configurations, s&eacute;lectionnez la configuration de lancement du projet.
3 (Facultatif) Dans l’onglet Principal, d&eacute;s&eacute;lectionnez l’option Utiliser la valeur par d&eacute;faut pour modifier l’URL ou le
chemin &agrave; lancer.
4 Dans la zone de texte D&eacute;boguer, saisissez l’URL ou le chemin de la version de d&eacute;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&eacute;cuter, saisissez l’URL ou le chemin du fichier d’application principale.
7 Cliquez sur Appliquer, puis sur Fermer.
Derni&egrave;re mise &agrave; jour le 29/4/2010
Chapitre 11 : Personnalisation de Flash
Builder
Adobe &reg; Flash&reg; Builder™ est un plug-in pour la plateforme de d&eacute;veloppement Eclipse. Outre les pr&eacute;f&eacute;rences g&eacute;n&eacute;rales
que vous avez sp&eacute;cifi&eacute;es pour Eclipse, sp&eacute;cifiez les pr&eacute;f&eacute;rences de Flash Builder. Les param&egrave;tres de certaines fonctions
devront &ecirc;tre d&eacute;finis &agrave; la fois dans les nœuds Eclipse et Flash Builder de la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences. Par exemple,
lorsque vous d&eacute;finissez vos pr&eacute;f&eacute;rences pour le d&eacute;bogueur Flash Builder, vous devez sp&eacute;cifier un comportement
personnalis&eacute; aussi bien sous Ex&eacute;cution/D&eacute;bogage d’Eclipse que sous Flash Builder &gt; D&eacute;boguer.
L’acc&egrave;s &agrave; la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences varie en fonction de la plateforme et de la version de Flash Builder (autonome
ou plug-in) utilis&eacute;es.
D&eacute;finition des pr&eacute;f&eacute;rences de Flash Builder
1 Ouvrez la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences :
• (Windows) S&eacute;lectionnez Fen&ecirc;tre &gt; Pr&eacute;f&eacute;rences.
• (Macintosh, autonome) S&eacute;lectionnez Eclipse &gt; Pr&eacute;f&eacute;rences.
• (Macintosh, plug-in) S&eacute;lectionnez Eclipse &gt; Pr&eacute;f&eacute;rences.
2 D&eacute;veloppez le nœud Flash Builder pour afficher et sp&eacute;cifier les pr&eacute;f&eacute;rences de l’utilisateur.
Pr&eacute;f&eacute;rences Adobe
D&eacute;finissez les pr&eacute;f&eacute;rences pour les modules plug-in d’Adobe.
Configuration RDS
La configuration Remote Development Server (RDS) s’applique aux utilisateurs d’Adobe LiveCycle&reg; Data Services ou
d’Adobe BlazeDS. RDS donne acc&egrave;s aux destinations LiveCycle Data Services et BlazeDS.
La configuration RDS par d&eacute;faut est le point de d&eacute;part pour l’&eacute;tablissement d’une connexion aux services de donn&eacute;es.
Modifiez la configuration par d&eacute;faut afin de permettre l’acc&egrave;s &agrave; votre serveur ou base de donn&eacute;es.
Pour plus d’informations sur la configuration RDS, voir la documentation d’Adobe LiveCycle Data Services.
Important : la configuration RDS comporte des implications s&eacute;curitaires. Pour plus d’informations sur les implications
s&eacute;curitaires du serveur d’applications, voir la documentation sur LiveCycle Data Services.
248
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 249
Personnalisation de Flash Builder
Pr&eacute;f&eacute;rences de Flash Builder
Flash Builder
Avertissement avant la mise &agrave; niveau d’anciens projets Flash Builder
Flash Builder met &agrave; jour les projets qui ont &eacute;t&eacute; cr&eacute;&eacute;s dans l’une de ses versions ant&eacute;rieures. La mise &agrave; jour englobe la
mise en conformit&eacute; des fichiers et de la structure du projet avec la structure actuelle des projets Flash Builder. Un projet
converti ne pourra plus &ecirc;tre ouvert avec une version ant&eacute;rieure de Flash Builder.
Par d&eacute;faut, Flash Builder vous avertit avant de proc&eacute;der &agrave; la conversion. D&eacute;sactivez cette option pour que les
conversions s’effectuent sans avertissement.
Donn&eacute;es/Services
Les pr&eacute;f&eacute;rences disponibles pour Donn&eacute;es/Services sont d&eacute;crites ci-dessous. Elles s’appliquent &agrave; tous les projets se
trouvant dans votre environnement de d&eacute;veloppement Flash Builder.
Vous pouvez les remplacer pour chaque projet individuellement. S&eacute;lectionnez Projet &gt; Propri&eacute;t&eacute;s &gt; Donn&eacute;es/Services
pour remplacer les pr&eacute;f&eacute;rences qui y sont sp&eacute;cifi&eacute;es.
G&eacute;n&eacute;rateur de code
Flash Builder fournit un utilitaire de g&eacute;n&eacute;ration de code par d&eacute;faut pour g&eacute;n&eacute;rer l’acc&egrave;s aux services de donn&eacute;es. Faites
appel aux fonctions d’extensibilit&eacute; DCD pour cr&eacute;er vos propres utilitaires de g&eacute;n&eacute;ration de code et les ajouter &agrave; Flash
Builder en tant que plug-in.
Toute extension de g&eacute;n&eacute;ration de code ajout&eacute;e &agrave; Flash Builder en tant que plug-in est r&eacute;pertori&eacute;e dans la liste
d&eacute;roulante G&eacute;n&eacute;rateur de code.
Activer l’utilisation de l’occurrence de service simple (singleton) lors de la g&eacute;n&eacute;ration de code pour le gestionnaire
de services
Par d&eacute;faut, cette option n’est pas activ&eacute;e. Au cours de la g&eacute;n&eacute;ration de code, chaque application client d’un projet cr&eacute;e
sa propre occurrence d’un service de donn&eacute;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&eacute;lectionnez l’utilitaire de g&eacute;n&eacute;ration de code par d&eacute;faut de Flash
Builder.
D&eacute;bogage
Les options de d&eacute;bogage d&eacute;crites ci-dessous sont activ&eacute;es par d&eacute;faut. Pour les autres options affectant une session de
d&eacute;bogage, voir :
• Pr&eacute;f&eacute;rences &gt; G&eacute;n&eacute;ral &gt; Navigateur Web
• Pr&eacute;f&eacute;rences &gt; Ex&eacute;cution/D&eacute;bogage
M’avertir en cas de tentative d’ouverture de plusieurs sessions de d&eacute;bogage
Certaines combinaisons de navigateurs et plateformes n’autorisent pas l’ex&eacute;cution en parall&egrave;le de plusieurs sessions de
d&eacute;bogage. Le d&eacute;marrage d’une seconde session de d&eacute;bogage entra&icirc;ne la fermeture ou la d&eacute;connexion de la premi&egrave;re
session.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 250
Personnalisation de Flash Builder
Ne d&eacute;sactivez pas cette option si vous souhaitez que Flash Builder vous avertisse de la tentative de d&eacute;marrage d’une
seconde session de d&eacute;bogage.
Signaler les erreurs de s&eacute;curit&eacute; apr&egrave;s le lancement
Dans certains cas, le navigateur Web &eacute;met une erreur de s&eacute;curit&eacute; lorsqu’il ne peut pas lire le fichier de confiance de
s&eacute;curit&eacute; de Flash Player. Le red&eacute;marrage du navigateur Web suffit g&eacute;n&eacute;ralement &agrave; r&eacute;soudre ce probl&egrave;me.
Ne d&eacute;sactivez pas cette option si vous souhaitez que Flash Builder vous avertisse de ce type d’erreur de s&eacute;curit&eacute;.
Voir la note technique pour l’avertissement de s&eacute;curit&eacute; de Flash Player.
Appeler automatiquement les fonctions getter
Au cours des &eacute;tapes d’une session de d&eacute;bogage, les variables repr&eacute;sentant les fonctions d’accesseur (getter) sont
automatiquement &eacute;valu&eacute;es. Ce comportement est g&eacute;n&eacute;ralement utile au cours d’une session de d&eacute;bogage.
D&eacute;sactivez cette option si vous ne souhaitez pas &eacute;valuer automatiquement les variables repr&eacute;sentant des fonctions
d’accesseur lors des &eacute;tapes d’une session de d&eacute;bogage.
Editeurs Flash Builder
Accolades
Flash Builder comporte des options pour la mise en retrait, l’insertion et la mise en &eacute;vidence d’accolades repr&eacute;sentant
des blocs de code.
Assistant de contenu
L’&eacute;diteur de source MXML ou ActionScript de Flash Builder fournit des indicateurs de code qui vous aident &agrave;
compl&eacute;ter vos expressions de code. Il facilite par exemple la s&eacute;lection des classes recommand&eacute;es, des propri&eacute;t&eacute;s et des
&eacute;v&eacute;nements disponibles.
• Activer l’activation automatique
D&eacute;sactivez l’option Activer l’activation automatique si vous ne souhaitez pas que les indicateurs de code soient
automatiquement affich&eacute;s en cours de frappe. Si cette option est d&eacute;sactiv&eacute;e, vous pouvez acc&eacute;der aux indicateurs
de code en appuyant sur les touches Ctrl+Espace.
• Activer automatiquement apr&egrave;s
Sp&eacute;cifiez le d&eacute;lai en millisecondes devant s’&eacute;couler entre le moment auquel vous commencez &agrave; saisir du code et le
moment auquel les indicateurs de code doivent s’afficher. Par d&eacute;faut, ce d&eacute;lai est de 100 millisecondes.
Voir aussi
&laquo; Aide au codage dans Flash Builder &raquo; &agrave; la page 105
Pr&eacute;f&eacute;rences g&eacute;n&eacute;rales de l’&eacute;diteur pour Flash Builder
Par d&eacute;faut, Flash Builder r&eacute;duit le code et met automatiquement les lignes en retrait en cours de saisie ou de collage de
texte dans l’&eacute;diteur de source. Vous pouvez d&eacute;sactiver les pr&eacute;f&eacute;rences par d&eacute;faut de ces fonctions.
Pr&eacute;f&eacute;rences g&eacute;n&eacute;rales de l’&eacute;diteur pour Eclipse
Pour d&eacute;finir d’autres pr&eacute;f&eacute;rences g&eacute;n&eacute;rales de l’&eacute;diteur, s&eacute;lectionnez Pr&eacute;f&eacute;rences &gt; G&eacute;n&eacute;ral &gt; Editeurs.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 251
Personnalisation de Flash Builder
Code ActionScript
Lorsque vous &eacute;ditez des fichiers ActionScript dans l’&eacute;diteur de source, Flash Builder fournit des fonctions par d&eacute;faut
pour le renvoi &agrave; la ligne et l’organisation du code. Par d&eacute;faut, Flash Builder place toutes les instructions d’importation
en t&ecirc;te du fichier ActionScript et supprime toutes celles qui ne sont pas r&eacute;f&eacute;renc&eacute;es dans le corps du code.
Par d&eacute;faut, la documentation de r&eacute;f&eacute;rence ActionScript disponible s’affiche simultan&eacute;ment aux indicateurs de code ou
en survolant un &eacute;l&eacute;ment de langage avec le curseur de la souris.
Chacune de ces fonctions par d&eacute;faut peut &ecirc;tre d&eacute;sactiv&eacute;e.
Voir aussi
&laquo; Aide au codage dans Flash Builder &raquo; &agrave; la page 105
Mode Cr&eacute;ation
Flash Builder comporte les pr&eacute;f&eacute;rences suivantes pour le mode Cr&eacute;ation de l’&eacute;diteur de source.
• Activer automatiquement les vues li&eacute;es &agrave; la cr&eacute;ation
Lors du passage en mode Cr&eacute;ation de l’&eacute;diteur de source, Flash Builder ouvre automatiquement les vues associ&eacute;es,
telles que Propri&eacute;t&eacute;s, Etats, Composants et Aspects.
D&eacute;sactivez cette pr&eacute;f&eacute;rence pour personnaliser le choix des vues qui s’ouvriront en mode Cr&eacute;ation.
• Activer l’alignement
En mode Cr&eacute;ation, Flash Builder comporte une grille invisible qui aligne automatiquement les composants ajout&eacute;s
ou d&eacute;plac&eacute;s.
D&eacute;sactivez cette pr&eacute;f&eacute;rence pour avoir une meilleure ma&icirc;trise du positionnement des composants.
• G&eacute;n&eacute;rer un rendu des habillages &agrave; l’ouverture d’un fichier
Le mode Cr&eacute;ation repr&eacute;sente les composants dot&eacute;s d’un habillage plac&eacute;s dans la zone de cr&eacute;ation.
Pour d&eacute;sactiver le rendu des habillages des composants en mode Cr&eacute;ation, d&eacute;s&eacute;lectionnez cette pr&eacute;f&eacute;rence.
• R&eacute;duire les expressions de liaison de donn&eacute;es
En mode Cr&eacute;ation, les expressions de liaison des donn&eacute;es ne refl&egrave;tent g&eacute;n&eacute;ralement pas pr&eacute;cis&eacute;ment la forme ou la
taille des donn&eacute;es auxquelles elles sont li&eacute;es.
Activez cette pr&eacute;f&eacute;rence pour autoriser le mode Cr&eacute;ation de l’&eacute;diteur &agrave; rendre les composants li&eacute;s &agrave; des expressions
de liaison de donn&eacute;es avec une plus grande pr&eacute;cision.
• Toujours mettre &agrave; jour les r&eacute;f&eacute;rences lors de la modification des ID dans la vue Propri&eacute;t&eacute;s
La modification d’un identifiant de composant dans la vue Propri&eacute;t&eacute;s peut avoir une incidence sur le code de
l’espace de travail qui fait r&eacute;f&eacute;rence &agrave; cet identifiant.
Activez cette pr&eacute;f&eacute;rence pour que Flash Builder mette automatiquement &agrave; jour toutes les r&eacute;f&eacute;rences aux ID de
composant lorsque vous modifiez un ID de composant dans la vue Propri&eacute;t&eacute;s.
Code MXML
Lorsque vous &eacute;ditez des fichiers MXML dans l’&eacute;diteur de source, Flash Builder fournit des fonctions par d&eacute;faut de
suggestion de code. Chacune de ces fonctions peut &ecirc;tre d&eacute;sactiv&eacute;e.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 252
Personnalisation de Flash Builder
Flash Builder d&eacute;finit &eacute;galement un comportement par d&eacute;faut pour l’assistant de contenu lors de l’&eacute;dition de fichiers
MXML. Lorsqu’il est disponible, l’assistant de contenu affiche des indicateurs sur les &eacute;l&eacute;ments de langage pouvant &ecirc;tre
ins&eacute;r&eacute;s dans le code. Pour parcourir les &eacute;l&eacute;ments affich&eacute;s dans la fen&ecirc;tre de l’assistant de contenu, appuyez sur les
touches Ctrl+Espace.
Utilisez la page Avanc&eacute;es des pr&eacute;f&eacute;rences MXML pour d&eacute;sactiver l’affichage d’un type d’&eacute;l&eacute;ment de langage dans le
cycle de l’assistant de contenu.
Voir aussi
&laquo; Aide au codage dans Flash Builder &raquo; &agrave; la page 105
&laquo; Utilisation de l’assistant de contenu &raquo; &agrave; la page 108
Coloration de la syntaxe
La coloration de la syntaxe et la mise en &eacute;vidence de texte dans les fichiers ActionScript, CSS et MXML sont d&eacute;finies
par d&eacute;faut. Ces param&egrave;tres par d&eacute;faut peuvent &ecirc;tre remplac&eacute;s. D&eacute;veloppez le nœud du langage et s&eacute;lectionnez une
fonction de langage pour remplacer la fonction par d&eacute;faut.
Les pr&eacute;f&eacute;rences g&eacute;n&eacute;rales de l’&eacute;diteur pour Eclipse sont &eacute;galement disponibles. Voir :
• Pr&eacute;f&eacute;rences &gt; G&eacute;n&eacute;ral &gt; Editeurs de texte
• Pr&eacute;f&eacute;rences &gt; G&eacute;n&eacute;ral &gt; Couleurs et polices
Mod&egrave;les de fichiers
Les mod&egrave;les de fichiers interviennent lors de la cr&eacute;ation de nouveaux fichiers MXML, ActionScript et CSS et peuvent
&ecirc;tre personnalis&eacute;s. Vous pouvez &eacute;galement importer et exporter des fichiers de mod&egrave;les.
Dans la zone Types de fichier, s&eacute;lectionnez le mod&egrave;le d’un type de fichier. Cliquez sur Editer pour le modifier.
D&eacute;sactivez l’option Mise en retrait automatique des nouveaux fichiers si vous ne souhaitez pas faire appel aux
pr&eacute;f&eacute;rences de mise en retrait de Flash Builder lors de la cr&eacute;ation de fichiers.
Vous pouvez modifier les pr&eacute;f&eacute;rences de mise en retrait de Flash Builder. Voir :
Pr&eacute;f&eacute;rences &gt; Flash Builder &gt; Mise en retrait
Voir aussi
&laquo; Personnalisation des mod&egrave;les de fichier &raquo; &agrave; la page 127
&laquo; Mise en retrait &raquo; &agrave; la page 253
FlexUnit
Lorsque vous ex&eacute;cutez un test FlexUnit, Flash Builder est lanc&eacute; par d&eacute;faut en mode de d&eacute;bogage.
Cette pr&eacute;f&eacute;rence vous permet de modifier le mode de lancement de Flash Builder pour les tests FlexUnit. Les modes
de lancement par d&eacute;faut de Flash Builder sont les suivants :
• Mode Ex&eacute;cuter
Par d&eacute;faut, ce mode lance la perspective Flash.
• Mode D&eacute;boguer
Par d&eacute;faut, ce mode lance la perspective D&eacute;bogage Flash.
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 253
Personnalisation de Flash Builder
• Mode Profiler
Par d&eacute;faut, ce mode lance la perspective Profil Flash.
Les pr&eacute;f&eacute;rences Eclipse pour le lancement et les perspectives d&eacute;finissent les modes de lancement. Voir :
• Pr&eacute;f&eacute;rences &gt; Ex&eacute;cution/D&eacute;bogage &gt; Lancement
• Pr&eacute;f&eacute;rences &gt; Ex&eacute;cution/D&eacute;bogage &gt; Perspectives
Voir aussi
&laquo; Environnement de test FlexUnit &raquo; &agrave; la page 150
&laquo; A propos des perspectives de Flash Builder &raquo; &agrave; la page 7
Mise en retrait
Par d&eacute;faut, la mise en retrait du code s’effectue par tabulations. Ce param&egrave;tre peut &ecirc;tre modifi&eacute; en faveur de l’utilisation
d’espaces. La taille de la tabulation et de la mise en retrait par d&eacute;faut &eacute;quivaut &agrave; quatre espaces.
S&eacute;lectionnez ActionScript ou MXML sous Mise en retrait dans la bo&icirc;te de dialogue Pr&eacute;f&eacute;rences afin d’afficher les
param&egrave;tres correspondants. Vous pouvez &eacute;galement personnaliser les m&eacute;thodes heuristiques de mise en retrait.
SDK Flex install&eacute;s
Flash Builder installe les SDK Flex 4.1 et 3.5. Il utilise en outre le SDK Flex 4.1 pour les projets pour lesquels aucun
SDK n’a &eacute;t&eacute; sp&eacute;cifi&eacute;.
Vous pouvez ajouter et supprimer des SDK ainsi que modifier le SDK utilis&eacute; par d&eacute;faut pour les projets n’en sp&eacute;cifiant
aucun. Flash Builder vous demande de choisir le SDK que vous souhaitez utiliser &agrave; l’importation de projets cr&eacute;&eacute;s avec
l’une de ses versions ant&eacute;rieures. Vous pouvez d&eacute;sactiver l’affichage de cette invite &agrave; l’importation de projets.
Les types de SDK disponibles sont les suivants :
SDK Adobe Flex gratuit Versions publi&eacute;es de produits Adobe officiels. Ces SDK contiennent diff&eacute;rents composants
source ouverts et ferm&eacute;s.
SDK Flex Open Source Ce type est destin&eacute; aux utilisateurs souhaitant un package ne contenant que du code &laquo; open
source &raquo;.
Modules compl&eacute;mentaires Adobe pour SDK Flex &laquo; open source &raquo; Ce package contient tous les &eacute;l&eacute;ments qui se trouvent
dans le SDK Flex Adobe et non dans le SDK Flex &laquo; open source &raquo;. Le t&eacute;l&eacute;chargement de ce fichier vous permet d’aligner
le SDK Flex &laquo; open source &raquo; sur le SDK Flex Adobe.
Ajout d’un SDK Flex
1 T&eacute;l&eacute;chargez un SDK Flex vers un emplacement temporaire de votre syst&egrave;me :
V&eacute;rifiez les pages de t&eacute;l&eacute;chargement pour obtenir des informations sur les diff&eacute;rents types de version, les conditions
requises et les licences.
• Download Flex 4 SDKs.
• Download Flex 3 SDKs.
Remarque : si vous souhaitez utiliser une version stable et test&eacute;e, t&eacute;l&eacute;chargez une version d’&eacute;tape. Cette version a &eacute;t&eacute;
d&eacute;clar&eacute;e comme &eacute;tant une version majeure par l’&eacute;quipe de d&eacute;veloppement. Elle comporte une version sign&eacute;e des RSL
de la structure Flex (requis pour utiliser la mise en cache RSL).
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 254
Personnalisation de Flash Builder
2 Les SDK Flex t&eacute;l&eacute;charg&eacute;s sont au format ZIP. D&eacute;zippez ce fichier dans un nouveau dossier de votre syst&egrave;me.
Pour plus de clart&eacute;, vous pouvez attribuer au dossier de niveau sup&eacute;rieur le num&eacute;ro de version du SDK.
Les SDK sont g&eacute;n&eacute;ralement plac&eacute;s dans le r&eacute;pertoire d’installation de Flash Builder &agrave; l’emplacement suivant :
&lt;Flash Builder Install Directory&gt;/sdks/
3 Dans les pr&eacute;f&eacute;rences de Flash Builder, s&eacute;lectionnez Flash Builder &gt; SDK install&eacute;s.
4 Cliquez sur Ajouter, puis recherchez le SDK Flex d&eacute;zipp&eacute;. Cliquez sur Appliquer.
5 Pour chaque projet utilisant le SDK Flex, acc&eacute;dez &agrave; cette bo&icirc;te de dialogue et s&eacute;lectionnez le SDK qui sera utilis&eacute; par
d&eacute;faut. Cliquez sur OK.
Moniteur de r&eacute;seau
La page de pr&eacute;f&eacute;rences Moniteur de r&eacute;seau r&eacute;pertorie les ports sur lesquels le Moniteur de r&eacute;seau intercepte des
&eacute;v&eacute;nements et &eacute;coute les requ&ecirc;tes HTTP.
Par d&eacute;faut, le Moniteur de r&eacute;seau supprime au d&eacute;marrage toutes les entr&eacute;es. Cette pr&eacute;f&eacute;rence peut &ecirc;tre d&eacute;sactiv&eacute;e.
Vous pouvez &eacute;galement activer les pr&eacute;f&eacute;rences suivantes :
• Suspendre la surveillance au d&eacute;marrage
• Ignorer les v&eacute;rifications de s&eacute;curit&eacute; SSL
L’activation de cette pr&eacute;f&eacute;rence est utile pour surveiller le trafic r&eacute;seau &agrave; partir d’un serveur autosign&eacute;.
Profileur
Par d&eacute;faut, le profilage de la m&eacute;moire et le profilage des performances sont tous les deux activ&eacute;s.
• Profilage de la m&eacute;moire
Le profilage de la m&eacute;moire permet de d&eacute;terminer la quantit&eacute; de m&eacute;moire utilis&eacute;e par un objet ou un type d’objet
dans l’application. Faites appel au profilage de la m&eacute;moire pour diminuer la taille des objets, r&eacute;duire le nombre
d’objets cr&eacute;&eacute;s ou permettre le nettoyage des objets dans la m&eacute;moire en supprimant les r&eacute;f&eacute;rences &agrave; ces objets.
La quantit&eacute; de m&eacute;moire utilis&eacute;e par le profilage de la m&eacute;moire est bien sup&eacute;rieure &agrave; celle utilis&eacute;e par le profilage des
performances et peut donc ralentir votre application.
• Profilage des performances
Le profilage des performances recherche les m&eacute;thodes de l’application dont l’ex&eacute;cution est lente et qui sont
susceptibles de pouvoir &ecirc;tre am&eacute;lior&eacute;es ou optimis&eacute;es.
Vous pouvez d&eacute;finir les pr&eacute;f&eacute;rences suivantes pour le profileur :
• Connexions
Sp&eacute;cifiez le num&eacute;ro de port que Flash Builder &eacute;coute lors du profilage d’une application. Le num&eacute;ro de port par
d&eacute;faut est 9999. Ce port ne peut pas &ecirc;tre d&eacute;fini sur 7935, ce dernier &eacute;tant utilis&eacute; par le d&eacute;bogueur Flash.
• Filtres d’exclusion
D&eacute;finit les packages par d&eacute;faut qui sont exclus des vues du profileur.
• Filtres d’inclusion
D&eacute;finit les packages par d&eacute;faut qui sont inclus dans les vues du profileur. Tous les autres packages sont exclus.
• R&eacute;f&eacute;rences d’objet
Derni&egrave;re mise &agrave; jour le 29/4/2010
UTILISATION DE FLASH BUILDER 4 255
Personnalisation de Flash Builder
Sp&eacute;cifie le nombre de chemins de r&eacute;f&eacute;rences arri&egrave;re &agrave; des occurrences d’un objet &agrave; afficher. Les chemins de
r&eacute;f&eacute;rences arri&egrave;re permettent de d&eacute;terminer si un chemin poss&egrave;de une r&eacute;f&eacute;rence arri&egrave;re &agrave; la r&eacute;cup&eacute;ration de place
(racine de la RP). Une occurrence dont la lib&eacute;ration &eacute;tait attendue mais qui poss&egrave;de des r&eacute;f&eacute;rences &agrave; la racine de la
RP indique une perte de m&eacute;moire.
Par d&eacute;faut, le profileur affiche dix chemins de r&eacute;f&eacute;rences arri&egrave;re. Vous pouvez augmenter cette valeur ou activer
l’option d’affichage de tous les chemins de r&eacute;f&eacute;rences arri&egrave;re.
• Lecteur/Navigateur
Vous pouvez sp&eacute;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&eacute;bogage de Flash Player pour profiler une
application.
Lors du profilage d’applications externes, Flash Builder utilise par d&eacute;faut les lecteurs Flash Player suivants :
• URL vers un fichier SWF
Flash Builder lance le fichier SWF de l’application en utilisant le navigateur par d&eacute;faut du syst&egrave;me.
• Emplacement du fichier SWF sur le syst&egrave;me de fichiers
Flash Builder ouvre l’application avec la version par d&eacute;faut du d&eacute;bogueur du lecteur Flash Player autonome.
Voir aussi
&laquo; Utilisation du profileur &raquo; &agrave; la page 162
&laquo; A propos des vues du profileur &raquo; &agrave; la page 168
Extension de Flash Builder
L’API d’extensibilit&eacute; de Flash Builder vous permet d’&eacute;tendre Flash Builder de mani&egrave;re &agrave; prendre en charge les
composants personnalis&eacute;s. Elle permet notamment d’&eacute;tendre les vues Cr&eacute;ation et Propri&eacute;t&eacute;s afin de garantir une prise
en charge correcte des composants personnalis&eacute;s.
Vous pouvez &eacute;galement &eacute;tendre la prise en charge par Flash Builder des services disponibles &agrave; partir de l’assistant des
services.
Pour plus d’informations, voir Flash Builder 4 Extensibility API Reference.
Adobe FLASH BUILDER 4 Manuel du propriétaire

Manuels associés

Adobe

Flash Builder 4.6

Adobe

Flash Builder 4.6

Adobe

FLASH BUILDER 4.5

Adobe

Flash Builder 4.7

Adobe

FLEX 4

Adobe

LiveCycle ES3

TRIMBLE

Business Center

Adobe

Flex 4.6

Adobe

ActionScript 3.0

Adobe

FLASH CATALYST CS5.5

Adobe

FLASH CATALYST CS5

Adobe

Flash
