Adobe Animate CC Manuel utilisateur

Aide d’Adobe Animate CC
Février 2016
Table des matières
Nouveautés
Liste des nouvelles fonctionnalités
Plates-formes
1
2
16
Utilisez le convertisseur de type de document pour convertir des projets
Animate CC en d’autres formats de document.
17
Publication de contenu Flash sur plusieurs plates-formes
19
Prise en charge des plates-formes personnalisées
21
Création et publication de documents HTML5 Canvas dans Animate CC
24
Création et publication d’un document WebGL
41
Assemblage d’applications AIR pour iOS
48
Publication d’applications AIR pour Android
54
Publication pour Adobe AIR for Desktop
60
Paramètres de publication d’ActionScript
69
Pratiques recommandées – Organisation du code ActionScript dans une
application
77
Utilisation d’ActionScript avec Animate CC
79
Pratiques recommandées – Recommandations sur l’accessibilité
87
Accessibilité dans l’espace de travail Animate
92
Rédaction et gestion des scripts
96
Activation de la prise en charge des plates-formes personnalisées
110
Activation de la prise en charge des plates-formes personnalisées
116
Référence des API de prise en charge des plates-formes personnalisées
122
Création de contenu accessible
123
Activation de la prise en charge des plates-formes personnalisées
137
Utilisation du module externe de prise en charge des plates-formes
personnalisées
142
Débogage du code ActionScript 3.0
145
Espace de travail et workflow
150
Utilisation des bibliothèques Creative Cloud et d’Adobe Animate CC
151
Utilisation du panneau Scène et Outils pour Animate
157
Flux de travail et espace de travail Animate
165
Utilisation de polices web Typekit dans les documents HTML5 Canvas
175
Scénarios et ActionScript
180
Utilisation de plusieurs scénarios
184
Définition des préférences
185
Utilisation des panneaux de création Animate CC
191
Création de calques de scénario avec Animate CC
197
Création d’une feuille Sprite
205
Déplacement et copie d’objets
207
Synchronisation des préférences d’Animate avec Creative Cloud
210
Utilisation du panneau Adobe Color
215
Modèles
217
Recherche et remplacement de contenu dans Animate
219
Commandes Annuler et Rétablir, et panneau Historique
224
Raccourcis clavier
227
Utilisation du scénario dans Animate
230
Création d’extensions HTML
234
Animation et interactivité
237
Utilisation de l’animation de l’outil de segment dans Animate CC
238
Guide d’animation
250
Utilisation d’une animation interpolée classique dans Animate CC
254
Animation d’interpolations de mouvement
265
Modification des interpolations de mouvement avec l’Éditeur de mouvement
287
Interpolation de forme
296
Utilisation des images et des images-clés dans Animate CC
302
Animation image par image dans Animate CC
306
Utilisez le convertisseur de type de document pour convertir des projets
Animate CC en d’autres formats de document.
311
Pratiques recommandées – Publicité avec Animate CC
313
Principes de base de l’animation dans Animate CC
316
Ajout d’interactivité à l’aide de fragments de code dans Animate CC
322
Création et publication de documents HTML5 Canvas dans Animate CC
325
Pinceaux personnalisés
342
Création de boutons avec Animate CC
346
Utilisation de plusieurs scénarios
350
Utilisation de séquences dans Animate
351
Création et publication d’un document WebGL
353
Utilisation de calques de masque dans Adobe Animate CC
360
Multimédia et vidéo
363
Exportation de fichiers SVG
364
Utilisation du son dans Adobe Animate
367
Création de fichiers vidéo en vue de les utiliser dans Animate CC
376
Ajout d’une vidéo dans un document Animate
383
Utilisation des points de repère vidéo
391
Transformation et combinaison d’objets graphiques dans Animate CC
393
Utilisation et création d’occurrences de symboles dans Animate CC
399
Dessin et création d’objets avec Animate CC
406
Couleur
413
Vérification orthographique
Traits, remplissages et dégradés avec Animate CC
421
Dessin de traits et de formes avec Adobe Animate
429
Disposition d’objets
445
Automatisation des tâches à l’aide du menu Commandes
448
Application de motifs avec l’outil Pinceau pulvérisateur
450
Application de modes de fusion
452
Graphiques 3D
455
Exportation de sons
463
Utilisation de bibliothèques dans Animate CC
467
Incorporation de polices pour assurer la cohérence de l’apparence du texte
473
Préférences de dessin
476
Mise à l’échelle et mise en cache des symboles
478
Filtres graphiques
482
Partage des ressources de bibliothèque dans les fichiers
492
Remodelage des lignes et des formes
497
Utilisation du panneau Adobe Color
501
Utilisation de fichiers Fireworks
503
Utilisation d’Animate CC avec Adobe Scout
507
Utilisation du texte TLF (Text Layout Framework)
509
Utilisation de fichiers AI d’Illustrator dans Animate CC
525
Utilisation de fichiers InDesign dans Animate
540
Utilisation de symboles dans Animate CC
541
Exportation et publication
547
Exportation de fichiers d’Animate CC
548
Exportation de fichiers SVG
551
Exportation d’images et de vidéos avec Animate CC
554
Publication de documents AS3
560
Création d’une feuille Sprite
566
Exportation de sons
568
Exportation de fichiers vidéo QuickTime
572
Contrôle de la lecture vidéo externe à l’aide d’ActionScript
573
Pratiques recommandées – Conseils pour la création de contenu pour
appareils mobiles
579
Pratiques recommandées – Conventions des vidéos
587
Pratiques recommandées – Recommandations sur la création d’applications
SWF
589
Pratiques recommandées – Structuration des fichiers FLA
595
Pratiques recommandées d’optimisation des fichiers FLA pour Animate CC
598
Pratiques recommandées – Conventions des comportements
609
Paramètres de publication d’ActionScript
612
Définition des paramètres de publication pour Animate
620
Utilisation d’Adobe Premiere Pro et d’After Effects
642
Utilisation d’Animate et de FlashBuilder
645
Exportation de fichiers de projection
649
Exportation de vidéos avec Animate CC
651
Modèles de publication HTML
654
Nouveautés
1
Liste des nouvelles fonctionnalités
Adobe Animate CC 2015.2 (juin 2016)
Adobe® Flash Professional® CC se nomme désormais Adobe® Animate® CC.
Adobe Animate CC met à votre disposition un environnement de création basé
sur un scénario pour créer des animations vectorielles, des publicités, du
contenu multimédia, des expériences immersives, des applications, des jeux et
bien plus encore. L’application offre une prise en charge native pour plusieurs
sorties, telles que HTML5 Canvas et WebGL. Elle peut, en outre, être étendue
en vue de prendre en charge des formats personnalisés tels que SnapSVG.
Animate offre une telle souplesse au niveau des formats de sortie que vous
avez la garantie de pouvoir visualiser votre contenu sur n’importe quel support,
sans avoir à utiliser de modules externes.
Animate offre également des outils de dessin et d’illustration haut de gamme,
ainsi qu’une étroite intégration avec Adobe CreativeSync. Puisque Animate CC
fait partie d’Adobe Creative Cloud, vous avez accès aux dernières mises à jour
et aux prochaines versions dès qu’elles sont disponibles. Découvrez-en plus sur
Creative Cloud.
Lisez plus avant pour obtenir une présentation rapide des nouvelles fonctions de la dernière mise à jour
d’Animate CC, ainsi que des liens vers d’autres ressources qui fournissent plus d’informations.
Nouveautés et améliorations
Adobe Animate CC 2015.2 | Juin 2016
Pinceaux Motif
Sélecteur d’image
Transparence du calque
Options de publication web optimisées
Fusion du code JSON/JS
Code JavaScript incorporé au code HTML
Prise en charge d’un arrière-plan de travail transparent
Sortie HTML5 Canvas compatible avec HiDPI
Mise à l’échelle réactive
OAM transparents et réactifs
Accrochage des bitmap au moment de la création
Fichier de préchargement dans le document HTML5 Canvas
Améliorations du modèle de publication HTML5 Canvas
Prise en charge JSAPI pour importer et exporter des modèles HTML pour les
documents Canvas
Publication d’éléments Canvas dans le dossier racine
Centrer la scène
Autres améliorations
Pelure d’oignon colorée définie par l’utilisateur
Verrouillage du script
Options d’importation PSD avancées
Options d’importation AI avancées
Performances optimisées sur la plate-forme Windows
2
Amélioration des interactions de l’outil Pinceau
Intégration de la dernière version de Flash Player et d’AIR SDK
Haut de la page
Adobe Animate CC 2015.2 | Juin 2016
La version 2015.2 comprenait de très intéressantes nouvelles fonctions, notamment :
Pinceaux Motif
Autres améliorations
Transparence du calque
Pelure d’oignon colorée définie par
l’utilisateur
Options de publication web optimisées
Verrouillage du script
Sélecteur d’image
Fusion du code JSON/JS
Options d’importation PSD avancées
Code JavaScript incorporé au code HTML
Options d’importation AI avancées
Prise en charge d’un arrière-plan de travail
transparent
Performances optimisées sur la plate-forme
Windows
Sortie HTML5 Canvas compatible avec
HiDPI
Amélioration des interactions de l’outil
Pinceau
Mise à l’échelle réactive
Intégration de la dernière version de
Flash Player et d’AIR SDK
OAM transparents et réactifs
Accrochage des bitmap au moment de la
création
Fichier de préchargement
Améliorations du modèle de publication
HTML5 Canvas
Prise en charge JSAPI pour importer et
exporter des modèles HTML pour les
documents Canvas
Publication d’éléments Canvas dans le
dossier racine
Centrer la scène
Haut de la page
Pinceaux Motif
Nouveautés dans Animate CC 2015.2 | Juin 2016
Découvrez comment utiliser les pinceaux Motif pour tracer un motif vectoriel le long du tracé et l’étirer sur
toute sa longueur. Utilisez la bibliothèque globale intégrée dans Animate pour utiliser les pinceaux artistiques
et de motif. Outre les présélections de pinceau, vous pouvez importer de nouveaux pinceaux de motif dans
votre document Animate à l’aide des bibliothèques CC.
3
Pinceaux Motif
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Pinceaux Motif.
Haut de la page
Sélecteur d’image
Nouveautés dans Animate CC 2015.2 | Juin 2016
Utilisez le sélecteur d’image pour prévisualiser et choisir la première image d’un symbole graphique. Dans les
versions précédentes, vous ne pouviez pas prévisualiser les images sans modifier le symbole. Cette fonction
améliore l’environnement d’utilisateur qui travaille sur des animations du type Synchronisation des lèvres.
4
Sélecteur d’image
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Sélecteur d’image.
Haut de la page
Transparence du calque
Nouveautés dans Animate CC 2015.2 | Juin 2016
Animate permet de définir la visibilité du calque sur transparent. Pour ce faire, cliquez en appuyant sur la
touche Maj sur la colonne œil dans le scénario afin de définir la visibilité sur transparent.
Transparence du calque
Pour en savoir plus, voir Transparence du calque.
Haut de la page
Options de publication web optimisées
Fusion du code JSON/JS
5
Nouveautés dans Animate CC 2015.2 | Juin 2016
Animate incorpore le fichier JSON au code JS. Lorsque vous créez une feuille Sprite durant la publication du
plan de travail, aucun fichier JSON externe n’est créé : il est par défaut incorporé au code JS.
Ainsi, vous pouvez prévisualiser les fichiers publiés localement sans les héberger sur un serveur (comme
précédemment).
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Fusion du code JSON/JS.
Code JavaScript incorporé au code HTML
Nouveautés dans Animate CC 2015.2 | Juin 2016
Animate permet d’inclure le fichier JS dans le fichier HTML durant la publication du plan de travail.
Code JavaScript incorporé au code HTML
Pour en savoir plus sur cette nouvelle fonction, voir Code JavaScript incorporé au code HTML.
Prise en charge d’un arrière-plan de travail transparent
Nouveautés dans Animate CC 2015.2 | Juin 2016
Vous souhaitez créer un plan de travail transparent lors de la publication afin d’afficher le contenu HTML
sous-jacent ? Vous pouvez maintenant définir l’arrière-plan du plan de travail sur Transparent. Pour ce faire,
utilisez l’option Alpha % pour définir le niveau de transparence et l’option de nuancier Aucune couleur pour
que le plan de travail soit entièrement transparent.
6
Transparence du plan de travail
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Prise en charge d’un arrière-plan de travail
transparent.
Sortie HTML5 Canvas compatible avec HiDPI
Nouveautés dans Animate CC 2015.2 | Juin 2016
La sortie générée par Animate est maintenant compatible avec le format HiDPI et offre un résultat plus net
sur les écrans haute résolution.
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Sortie HTML5 Canvas compatible avec HiDPI.
Mise à l’échelle réactive
Nouveautés dans Animate CC 2015.2 | Juin 2016
Vous souhaitez créer une animation réactive ? Découvrez comment Animate redimensionne la sortie publiée
en fonction de différents facteurs de forme pour fournir une sortie réactive, plus nette et plus précise
compatible avec le format HiDPI.
7
Mise à l’échelle réactive
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Mise à l’échelle réactive.
OAM transparents et réactifs
Vous pouvez maintenant générer des OAM transparents et réactifs dans Animate et les incorporer
directement dans Muse, Captivate et Dreamweaver.
Pour en savoir plus, voir Publication OAM.
Accrochage des bitmap au moment de la création
Nouveautés dans Animate CC 2015.2 | Juin 2016
Découvrez comment accrocher des images bitmap aux pixels les plus proches au moment de leur création
afin qu’ils apparaissent plus nets sur le plan de travail.Dans les versions précédentes, les images bitmap
étaient floues sur le plan de travail et n’offraient pas à l’utilisateur des conditions d’utilisation optimales. À
compter de cette version, lors de la publication d’un document HTML Canvas, Animate garantit que les
images bitmap sont accrochées aux pixels les plus proches de sorte qu’ils apparaissent plus nets sur le plan
de travail.
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Accrochage des bitmap au moment de la
création.
Fichier de préchargement dans le document HTML5 Canvas
8
Nouveautés dans Animate CC 2015.2 | Juin 2016
Le fichier de préchargement est un GIF animé qui s’affiche pendant le chargement des scripts et des
éléments requis pour le rendu d’une animation. Une fois les actifs chargés, le fichier de préchargement est
masqué et l’animation réelle est affichée.
GIF animé
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Fichier de préchargement dans HTML5 Canvas.
Améliorations du modèle de publication HTML5 Canvas
Nouveautés dans Animate CC 2015.2 | Juin 2016
Découvrez de quelle façon Animate a modularisé le modèle HTML5 canvas afin d’optimiser les
personnalisations et de mieux maîtriser les sorties publiées.
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Améliorations du modèle de publication HTML5.
Prise en charge JSAPI pour importer et exporter des modèles HTML pour les
documents Canvas
Nouveautés dans Animate CC 2015.2 | Juin 2016
Utilisez les nouvelles commandes JSAPI qui prennent en charge l’importation et l’exportation des modèles
HTML pour les documents Canvas.
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Prise en charge de JSAPI.
Publication d’éléments Canvas dans le dossier racine
Nouveautés dans Animate CC 2015.2 | Juin 2016
Utilisez cette fonctionnalité pour publier des éléments du plan de travail dans le dossier racine plutôt que
dans les sous-dossiers.
9
Éléments publiés du plan de travail
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Publication d’éléments Canvas dans le dossier
racine.
Centrer la scène
Nouveautés dans Animate CC 2015.2 | Juin 2016
Améliorez votre environnement en utilisant les différentes options d’alignement pour afficher le plan de travail
au centre de la fenêtre du navigateur. Sélectionnez les options pour centrer la scène sur le plan horizontal,
vertical ou les deux.
10
Centrer la scène
Pour en savoir plus sur cette nouvelle fonctionnalité, voir Centrage de la scène.
Haut de la page
Autres améliorations
Pelure d’oignon colorée définie par l’utilisateur
Améliorations dans Adobe Animate CC 2015.2 | Juin 2016
Utilisez le codage couleur de la pelure d’oignon pour différencier les images passées, présentes et futures. La
transparence des images en pelure d’oignon décroît progressivement à mesure que l’on s’éloigne de l’image
active.
Pour en savoir plus sur cette fonctionnalité améliorée, voir Pelure d’oignon colorée définie par l’utilisateur.
11
Personnalisation des options de pelure d’oignon
Verrouillage du script
Améliorations dans Adobe Animate CC 2015.2 | Juin 2016
À l’aide de la fonction Verrouiller le script, épinglez les onglets aux scripts individuels dans le volet
ActionScript et déplacez-les en conséquence. Cette fonction s’avère utile si vous n’avez pas centralisé le
code du fichier FLA ou si vous utilisez plusieurs scripts. Vous pouvez épingler un script pour conserver
l’emplacement du code ouvert dans le panneau Actions et permuter entre les scripts ouverts.
Verrouiller le script
Pour en savoir plus sur cette fonctionnalité améliorée, voir Verrouillage du script.
Options d’importation PSD avancées
Améliorations dans Adobe Animate CC 2015.2 | Juin 2016
Animate peut importer des images fixes dans de nombreux formats. Cependant, vous utilisez généralement
le format natif Photoshop PSD lorsque vous importez des images fixes de Photoshop dans Animate. Lors de
l’importation d’un fichier PSD, Animate préserve nombre des attributs qui ont été appliqués dans Photoshop
et fournit des options pour conserver une version fidèle de l’image.
12
Options d’importation PSD avancées
Pour en savoir plus sur cette fonctionnalité améliorée, voir Options d’importation PSD avancées.
Options d’importation AI avancées
Améliorations dans Adobe Animate CC 2015.2 | Juin 2016
Animate permet d’importer des fichiers AI Adobe® Illustrator® en préservant la plupart des capacités de
modification et la fidélité visuelle de votre illustration. L’importateur AI amélioré vous garantit également un
degré de contrôle accru pour déterminer comment sont importés vos fichiers Illustrator dans Animate et
notamment comment importer des objets spécifiques dans un fichier AI.
13
Options d’importation AI avancées
Pour en savoir plus sur cette fonctionnalité améliorée, voir Options d’importation AI avancées.
Performances optimisées sur la plate-forme Windows
Améliorations dans Adobe Animate CC 2015.2 | Juin 2016
Profitez des améliorations des performances pour chacun de vos processus quotidiens : lecture du scénario,
modulation du scénario, dessin, panoramique et zoom et transformations et observez vos animations prendre
vie.
Amélioration des interactions de l’outil Pinceau
Améliorations dans Adobe Animate CC 2015.2 | Juin 2016
Animate améliore les performances et l’environnement lors de l’utilisation de l’outil Pinceau. Les améliorations
de performances du pinceau s’appliquent aux opérations de transformation des traits de pinceau, tels qu’une
mise à l’échelle/conversion/rotation, en plus du zoom/panoramique de la scène.
Intégration de la dernière version de Flash Player et d’AIR SDK
Améliorations dans Adobe Animate CC 2015.2 | Juin 2016
14
Animate prend en charge la dernière version de Flash Player (version 21) et intègre la version 21.0 du SDK
AIR.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
15
Plates-formes
16
Utilisez le convertisseur de type de document pour convertir des
projets Animate CC en d’autres formats de document.
Conversion d’un document Animate dans un autre format de document
Conversion d’un document Animate à l’aide du convertisseur de type de document
Haut de la page
Conversion d’un document Animate dans un autre format de
document
Grâce au convertisseur universel de type de document, vous pouvez convertir des projets FLA existants (de
tout type) en n’importe quel autre type de document tel que HTML5 Canvas, ActionScript/AIR, WebGL ou un
type de document personnalisé. Lors de la conversion dans un format donné, vous pouvez profiter des
fonctions de création d’Animate pour ce type de document.
Conversion d’un document Animate à l’aide du convertisseur de type de
document
Pour convertir un document Animate dans un autre type de document, procédez comme suit :
1. Ouvrez le document à convertir et cliquez sur Commandes > Convertir en d’autres
formats de document. La boîte de dialogue Convertisseur de type de document s’affiche.
2. Dans la liste déroulante Convertir le document en, sélectionnez le type de document
dans lequel convertir le document.
3. Cliquez sur Parcourir pour sélectionner le dossier où enregistrer le fichier converti et
cliquez ensuite sur OK
Boîte de dialogue Convertisseur de type de document
Remarque : Si vous convertissez un document de plusieurs séquences en document de type
HTML5 Canvas, toutes les scènes sont enregistrées comme des fichiers distincts car le type de document
HTML5 Canvas ne prend pas en charge plusieurs séquences. Pour utiliser plusieurs séquences dans un
même document, placez chacune d’elles dans des symboles distincts.
Vous pouvez convertir vos projets Animate existants en un autre format ou réutiliser des éléments d’un
projet simplement en effectuant un copier-coller des calques et des symboles de la bibliothèque.
17
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
18
Adobe Animate CC
Publication de contenu Flash sur plusieurs plates-formes
Flash Professional CC permet de créer des animations pour la quasi-totalité des terminaux, navigateurs et plates-formes. Créez et publiez du
contenu en mode natif dans différents formats à l'aide d'une interface et d'outils que vous connaissez bien. (Regarder, 14 min)
Publication de contenu Flash sur plusieurs plates-formes
14 min
Show all tutorials Masquer tous les didacticiels
Adobe Flash Professional a été rebaptisé Animate CC. Toutes les fonctionnalités présentées ici sont désormais disponibles dans Animate.
Publication au format HTML5 Canvas
Flash Professional CC propose un environnement familier pour créer et publier des documents HTML5 Canvas de A à Z. Utilisez des standards web
ouverts pour cibler tous les navigateurs actuels, même ceux des terminaux mobiles. Pour en savoir plus, suivez le tutoriel Création et publication
d'un document HTML5 Canvas.
Importation de ressources (1:08) ; Ajout de ressources par copier-coller de calques (1:36) ; Ajout d'actions (2:08) ; Paramètres de publication
(3:06)
Publication au format WebGL
WebGL est un standard web ouvert qui profite de l'accélération GPU pour exécuter parfaitement votre contenu sur les postes de travail et les
terminaux mobiles. Découvrez comment publier directement en WebGL depuis Flash Professional CC. Pour en savoir plus, suivez le tutoriel
Exportation de contenu Flash Professional au format WebGL.
Conversion au format WebGL (1:07) ; Ajout de commandes (2:34) ; Paramètres de publication (3:10) ; Test de l'animation (3:42)
Publication sur des plates-formes personnalisées
Flash Professional CC permet désormais de cibler un nombre illimité de plates-formes grâce au nouveau kit SDK de prise en charge des platesformes personnalisées. Découvrez l'extension GAF Publisher qui permet de publier des ressources vers Unity3D, Cocos2D et Starling. Pour en
savoir plus, visionnez la vidéo Publication vers de nouvelles plates-formes au moyen du kit SDK de prise en charge des plates-formes
personnalisées.
Ressources de formation sur la prise en charge des plates-formes personnalisées (0:56) ; Téléchargement d'extensions (1:19) ; Installation de
l'extension GAF (1:43) ; Création d'un document GAF (2:34) ; Ajout de ressources par copier-coller de calques (3:15) ; Paramètres de publication
(4:01) ; Prévisualisation de l'animation (4:51)
Complément d'information sur ce sujet
19
Création et publication d'un document HTML5 Canvas
Exportation de contenu au format WebGL
Publication vers de nouvelles plates-formes au moyen du kit SDK de prise en charge des plates-formes personnalisées
Joseph Labrecque
Joseph est ingénieur en chef en logiciels interactifs à la University of Denver. Il est spécialisé dans la création de solutions expressives pour les
postes de travail, le web et les terminaux mobiles. Il est aussi propriétaire de Fractured Vision Media, LLC, société de production multimédia, de
conseil technique et de distribution de divers travaux de création. Consultez son site web, The Memoryspiral.
Choisir une autre régionFrance (Modifier)
Choisissez votre région
La langue et/ou le contenu du site Adobe.com varient en fonction de la région sélectionnée.
Americas Brasil Canada - English Canada - Français Latinoamérica México United States Europe, Middle East and Africa Africa English België Belgique Belgium - English Česká republika Cyprus - English Danmark Deutschland Eastern Europe English Eesti España France Greece - English Hrvatska Ireland Israel - English Italia Latvija Lietuva Luxembourg - Deutsch Luxembourg English Luxembourg - Français Magyarország Malta - English Middle East and North Africa - English Moyen-Orient et Afrique du Nord Français Nederland Norge Österreich Polska Portugal România Schweiz Slovenija Slovensko Srbija Suisse Suomi Sverige Svizzera Türkiye
United Kingdom България Россия Україна ‫ עברית‬- ‫ישראל‬
Asia - Pacific Australia Hong Kong S.A.R. of China India - English New
Zealand Southeast Asia (Includes Indonesia, Malaysia, Philippines, Singapore, Thailand, and Vietnam) - English 中国 中國香港特別行政
區 台灣 日本 한국 Commonwealth of Independent States Includes Armenia, Azerbaijan, Belarus, Georgia, Kazakhstan, Kyrgyzstan,
Moldova, Tajikistan, Turkmenistan, Ukraine, Uzbekistan
Produits Téléchargements Support et formation Société
Copyright © 2015 Adobe Systems Software Ireland Ltd. All rights reserved.
Politique de confidentialité Conditions d'utilisation Cookies ChoixdePub
20
Prise en charge des plates-formes personnalisées
Animate prend en charge la création de graphiques et animations enrichis à l’aide de types de documents tels
qu’ActionScript, HTML5 et WebGL. La fonction de prise en charge des plates-formes personnalisées permet
d’étendre la puissance d’Animate CC afin de prendre en charge les plates-formes qui ne sont pas natives à
Animate.
La prise en charge des plates-formes personnalisées peut être ajoutée à Animate en installant un module
externe au moyen d’un ensemble d’API faisant partie du kit de développement de prise en charge des platesformes personnalisées. Les développeurs peuvent créer des modules externes de prise en charge des
plates-formes personnalisées pour Animate en utilisant ces interfaces et en faisant référence à l’exemple de
code. En installant un module externe de prise en charge des plates-formes pour un nouveau type de
document, les utilisateurs peuvent créer leurs illustrations au moyen du riche ensemble de fonctions
d’Animate et le publier dans le format de sortie de la plate-forme personnalisée.
Haut de la page
Flux de travail
La fonction de prise en charge des plates-formes personnalisées comprend deux parties : une pour le
développeur qui crée des modules externes de prise en charge des plates-formes personnalisées et l'autre
pour l'utilisateur qui installe et utilise le module externe.
Développeur
Si vous êtes développeur et que vous créez des modules complémentaires pour Animate, vous pouvez
procéder comme suit pour développer et distribuer vos modules externes :
21
Remarque : Pour en savoir plus sur le développement de modules externes (plug-ins) de prise en charge
des plates-formes personnalisées au moyen du kit de développement, voir Activation de la prise en charge
des plates-formes personnalisées.
Pour consulter une documentation détaillée sur les API du kit de développement, voir Référence des API de
prise en charge des plates-formes personnalisées.
Utilisateur
Si vous êtes un utilisateur d’Animate, vous pouvez acquérir un module externe de plates-formes
personnalisées en utilisant l’une des méthodes suivantes :
Téléchargez le module externe de prise en charge des plates-formes personnalisées pour
une plate-forme de votre choix à partir de la page Modules complémentaires Adobe. La
page Modules complémentaires Adobe vous permet d'acquérir un module externe et de
l'installer à l'aide de l'application Adobe Creative Cloud.
Obtenez un fichier .zxp auprès d'un développeur de modules externes et installez-le au
moyen de l'application Adobe Extension Manager.
Le processus suivant illustre l'installation d'un module externe de prise en charge des plates-formes
personnalisées et la création de votre document de plate-forme personnalisée.
Documentation connexe
Activation de la prise en charge des plates-formes personnalisées
Référence des API de prise en charge des plates-formes personnalisées
Utilisation de modules externes de prise en charge des plates-formes personnalisées
22
Mots-clés : prise en charge des plates-formes personnalisées, Flash Professional, cc 2014, extension de la
prise en charge aux plates-formes personnalisées, utilisation de flash pour les formats de document non
natifs, nouveaux formats dans flash
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
23
Création et publication de documents HTML5 Canvas dans
Animate CC
Qu’est-ce que HTML5 Canvas ?
Le nouveau type de document HTML5 Canvas
Animate et l’API Canvas
Création d’un document HTML5 Canvas
Rendre le document HTML5 Canvas interactif
Utilisation des fragments de code JavaScript
Références à la documentation CreateJS
Publication d’animations au format HTML5
Paramètres simples
Paramètres avancés
Variables des modèles HTML
Prise en charge JSAPI pour importer et exporter des modèles HTML pour les
documents Canvas
Code JavaScript incorporé au code HTML
Fusion des données JSON dans JS
Optimisation des sorties HTML5 Canvas
Définition d’un arrière-plan de travail transparent
Exportation des bitmaps comme une feuille Sprite
Utilisation du texte dans le document HTML5 Canvas
Texte statique
Texte dynamique
Présentation de la sortie HTML5 Canvas
Migration de contenu existant vers HTML5 Canvas
Modifications appliquées au contenu après la migration
Conversion d’autres types de documents en HTML5 Canvas
Haut de la page
Qu’est-ce que HTML5 Canvas ?
Canvas est un nouvel élément dans HTML5, qui fournit des API grâce auxquelles vous pouvez générer et
restituer de façon dynamique des graphiques, des diagrammes, des images et des animations. L’API Canvas
pour HTML5 perfectionne la plateforme HTML5 en fournissant des fonctions de dessin bidimensionnelles.
Ces fonctions sont prises en charge par la plupart des systèmes d’exploitation et navigateurs actuels.
Grosso modo, Canvas est un moteur de rendu de bitmaps ; les dessins sont définitifs et ne peuvent pas être
redimensionnés. En outre, les objets dessinés sur Canvas ne font pas partie du DOM de la page web.
Dans une page web, vous pouvez ajouter des éléments Canvas à l’aide de la balise <Canvas>. Vous pouvez
les rendre interactifs en utilisant du code JavaScript. Pour plus d’informations, suivez ce lien.
Haut de la page
Le nouveau type de document HTML5 Canvas
24
Animate CC vous permet de créer un document HTML5 Canvas qui contient des illustrations, des
graphiques, des animations, etc. enrichis. Un nouveau type de document (HTML5 Canvas) ajouté à Animate
assure une prise en charge native pour créer un contenu HTML5 riche et interactif. En d’autres termes, vous
pouvez utiliser le scénario, l’espace de travail et les outils traditionnels d’Animate pour créer du contenu, puis
produire ensuite une sortie HTML5. Quelques clics suffisent pour créer un document HTML5 Canvas et
générer une sortie entièrement fonctionnelle. À cette fin, les options de document et de publication dans
Animate sont prédéfinies afin de générer une sortie HTML5.
Animate CC est intégré à CreateJS, ce qui permet de produire un contenu interactif enrichi sur les
technologies web ouvertes par l’intermédiaire de HTML5. Animate CC génère du code HTML et JavaScript
pour le contenu (bitmaps, vecteurs, formes, sons, interpolations, etc.) créé sur la scène. La sortie peut être
exécutée sur tous les périphériques ou navigateurs compatibles avec HTML5 Canvas.
Animate et l’API Canvas
Animate utilise l’API Canvas pour publier du contenu au format HTML5. Il traduit en contreparties Canvas les
objets créés dans la scène et ce, de manière transparente. Il permet de publier du contenu complexe en
HTML5 grâce au mappage 1:1 des fonctions Animate avec les API dans Canvas.
Haut de la page
Création d’un document HTML5 Canvas
Pour créer un document HTML5 Canvas, procédez comme suit :
1. Dans l’écran de bienvenue d’Animate CC, cliquez sur l’option HTML5 Canvas. Dans le
fichier FLA qui s’ouvre, les paramètres de publication ont été modifiés pour générer la
sortie HTML5.
2. Vous pouvez aussi sélectionner Fichier > Nouveau pour ouvrir la boîte de dialogue
Nouveau document. Cliquez sur l’option HTML5 Canvas.
Vous pouvez maintenant commencer à créer du contenu HTML5 à l’aide des outils disponibles dans Animate.
Lorsque vous commencez à travailler avec le document HTML5 Canvas, certains outils et fonctions ne sont
pas pris en charge et sont désactivés. En effet, Animate prend en charge les fonctions qui sont elles-mêmes
prises en charge par l’élément Canvas dans HTML5. Par exemple, les transformations 3D, les lignes en
pointillés et les effets de biseau ne sont pas pris en charge.
Haut de la page
Rendre le document HTML5 Canvas interactif
Animate CC publie le contenu HTML5 en utilisant les bibliothèques CreateJS.La suite de bibliothèques et
d’outils modulaires CreateJS permet de produire un contenu interactif riche sur les technologies web ouvertes
au moyen de HTML5. Elle se compose des éléments suivants : EaselJS, TweenJS, SoundJS et PreloadJS.
CreateJS convertit en HTML5 le contenu créé sur scène à l’aide de ces différentes bibliothèques, pour
générer des fichiers de sortie HTML et JavaScript. Vous pouvez également améliorer le contenu en
manipulant ce fichier JavaScript.
Toutefois, Animate CC permet de rendre interactifs des objets sur scène créés dans l’application pour
HTML5 Canvas. Ainsi, vous pouvez ajouter du code JavaScript aux objets individuels sur scène directement
dans Animate et les prévisualiser au moment de la création. Animate assure alors une prise en charge native
du code JavaScript à l’aide des fonctions utiles de l’éditeur de code, afin de rendre plus efficaces les
processus des programmeurs.
Vous pouvez sélectionner des images et des images clés individuelles dans le scénario pour rendre votre
contenu interactif. Vous pouvez rendre un document HTML5 Canvas interactif à l’aide de JavaScript. Pour en
savoir plus sur la rédaction du code JavaScript, cliquez ici.
Il est possible d’écrire le code JavaScript directement dans le panneau Actions, qui prend en charge les
fonctions suivantes lors de l’écriture de code JavaScript :
25
Indicateurs de code Permet d’insérer et de modifier rapidement le code JavaScript, sans erreur. À mesure
que vous tapez des caractères dans le panneau Actions, une liste de suggestions s’affiche et vous aide à
compléter votre saisie.
En outre, Animate prend en charge certaines fonctions inhérentes au panneau Actions lorsque vous utilisez
HTML5 Canvas. Ces fonctions permettent d’améliorer l’efficacité du processus en rendant des objets sur la
scène interactifs. Il s’agit des fonctions suivantes :
Mise en évidence de la syntaxe Affiche le code dans différentes polices ou couleurs en fonction de la
syntaxe. Cette fonction permet de rédiger le code d’une manière structurée, vous aidant ainsi à différencier
visuellement le code correct et les erreurs de syntaxe.
Coloration du code Affiche le code dans différentes couleurs en fonction de la syntaxe. Vous pouvez ainsi
distinguer visuellement les différentes parties d’une syntaxe.
Parenthèse Ajoute automatiquement les crochets/parenthèses fermants et ouvrants lors de la rédaction de
code JavaScript.
(A) Mise en évidence de la syntaxe (B) Coloration du code (C) Parenthèses
Vous pouvez rendre des formes ou des objets sur la scène interactifs à l’aide de JavaScript. Vous pouvez
aussi ajouter du code JavaScript à des images et images clés individuelles.
1. Sélectionnez l’image à laquelle vous souhaitez ajouter du code JavaScript.
2. Pour ouvrir le panneau Actions, sélectionnez Fenêtre >Actions.
Utilisation des fragments de code JavaScript
Vous pouvez ajouter de l’interactivité en utilisant les fragments de code JavaScript disponibles dans Animate
CC. Pour accéder aux fragments de code et les utiliser, sélectionnez Fenêtre > Fragments de code. Pour
plus d’informations sur l’ajout de fragments de code JavaScript, reportez-vous à cet article.
Références à la documentation CreateJS
Bibliothèque
CreateJS
EaselJS
Exemples de code su
Documentation de l’API
http://createjs.com/Docs/EaselJS/modules/EaselJS.html
26
https://github.com/createj
TweenJS
http://createjs.com/Docs/TweenJS/modules/TweenJS.html
https://github.com/createj
SoundJS
http://createjs.com/Docs/SoundJS/modules/SoundJS.html
https://github.com/createj
PreloadJS
http://createjs.com/Docs/PreloadJS/modules/PreloadJS.html https://github.com/createj
EaselJS
TweenJS
SoundJS
PreloadJS
Haut de la page
Publication d’animations au format HTML5
Pour publier du contenu sur scène vers HTML5, procédez comme suit :
1. Sélectionnez Fichier > Paramètres de publication.
2. Dans la boîte de dialogue Paramètres de publication, spécifiez les paramètres suivants :
Paramètres simples
Sortie Répertoire de publication du fichier FLA. Il s’agit, par défaut, du même répertoire que celui du fichier
FLA, mais vous pouvez le changer en cliquant sur le bouton de navigation « ... ».
Scénario en boucle Lorsque cette option est activée, le scénario est exécuté en boucle ; dans le cas
contraire, il s’arrête une fois la lecture achevée.
Inclure les calques masqués Si cette option est désactivée, les calques masqués ne sont pas inclus dans
la sortie.
Centrer la scène Permet aux utilisateurs de spécifier si la scène doit être centrée horizontalement,
verticalement ou les deux. La scène ou le plan de travail HTML s’affiche au centre de la fenêtre du
navigateur par défaut.
Rendre réactif Permet aux utilisateurs de spécifier si l’animation doit réagir par rapport à la largeur, à la
27
hauteur ou les deux et redimensionne la sortie publiée en fonction de différents facteurs de forme. Il en
résulte une sortie HiDPI réactive, plus nette et plus précise.
La sortie s’étend également pour couvrir la zone entière de l’écran sans bordures, mais conserve les
proportions d’origine, bien qu’une partie du plan de travail puisse ne pas être visible.
Avec les options Largeur, Hauteur ou Les deux, le contenu entier est mis à l’échelle
selon la taille du plan de travail et est visible même sur un petit écran (appareils mobiles
ou tablettes, par exemple). Si la taille de l’écran est supérieure à la taille de la scène de
création, le plan de travail s’affiche à sa taille d’origine.
Ajuster à la zone visible Permet aux utilisateurs de spécifier si l’animation doit être adaptée pour afficher la
sortie en mode plein écran ou être adaptée à la taille de l’écran. Cette option est désactivée par défaut.
Ajuster à la vue : affiche la sortie en mode plein écran en utilisant tout l’espace à l’écran et en conservant
les proportions.
Étirer pour ajuster : étire la sortie pour qu’elle s’affiche sans bordures.
Inclure le pré-chargeur : Permet aux utilisateurs de spécifier s’ils souhaitent utiliser le fichier de
préchargement par défaut ou un fichier de préchargement de leur choix de la bibliothèque de documents.
Le fichier de préchargement est un indicateur visuel sous forme d’un fichier GIF animé qui s’affiche pendant
le chargement des scripts et des actifs requis pour le rendu d’une animation. Une fois les actifs chargés, le
fichier de préchargement est masqué et l’animation réelle est affichée.
Par défaut, l’option de préchargement n’est pas sélectionnée.
L’option Par défaut permet d’utiliser la méthode de préchargement par défaut ;
l’option Parcourir permet de choisir le fichier GIF de préchargement. Le fichier GIF de
préchargement est copié dans le dossier d’images configuré dans le volet Exporter des
éléments d’image.
Utilisez l’option Aperçu pour prévisualiser le fichier GIF sélectionné.
Paramètres de publication
Utilisez les options d’activation/désactivation pour choisir de publier au niveau de la racine ou du sousdossier. Ce bouton est Activé par défaut. Si vous sélectionnez Désactivé, le champ du dossier est désactivé
et les éléments sont exportés dans le même dossier que le fichier de sortie.
28
Publication d’éléments Canvas dans le dossier racine
Exporter des éléments d’image Dossier dans lequel sont placés les éléments d’images et à partir duquel
ils sont référencés.
Regrouper dans des feuilles Sprite : sélectionnez cette option pour regrouper tous les éléments d’image
dans une feuille Sprite. Pour plus d’options de feuilles Sprite, voir Exportation de bitmaps comme une feuille
Sprite.
Exporter les éléments sonores Dossier dans lequel sont placés les éléments sonores du document et à
partir duquel ils sont référencés.
Exporter les éléments CreateJS Dossier dans lequel sont placées les bibliothèques CreateJS et à partir
duquel elles sont référencées.
Remarque : Le paramètre par défaut continue à publier des fichiers répartis dans des sous-dossiers
logiques.
Paramètres avancés
Options d’exportation des actifs URL relatives pour exporter des images et des sons et prendre en charge
les bibliothèques JavaScript CreateJS. Si vous ne cochez pas la case de droite, ces actifs ne sont pas
exportés depuis le fichier FLA, mais le chemin spécifié est tout de même utilisé pour assembler leurs URL.
Cette option facilite la publication depuis un fichier FLA comportant de nombreux actifs multimédias et évite le
remplacement des bibliothèques JavaScript modifiées.
Grâce à l’option Exporter tous les bitmaps comme des feuilles Sprite, vous pouvez rassembler dans une
feuille Sprite tous les bitmaps du document du plan de travail, et réduire ainsi le nombre de requêtes de
serveur et améliorer les performances. Vous pouvez définir la taille maximale de la feuille Sprite en spécifiant
les valeurs de hauteur et de largeur.
29
Modèle pour la publication HTML :
Utiliser la valeur par défaut : publiez votre sortie HTML5 en utilisant le modèle par défaut.
Importer nouveau : importez un nouveau modèle pour votre document HTML5.
Exporter : exportez votre document HTML5 comme un modèle.
Bibliothèques hébergées : Si cette option est activée, les copies des bibliothèques hébergées sur le CDN
CreateJS à l’adresse code.createjs.com sont utilisées. Cette option permet de mettre en cache les
bibliothèques en vue de les partager sur divers sites.
Inclure les calques masqués : Si cette option est désactivée, les calques masqués ne sont pas inclus dans
la sortie.
30
Compacter les formes : Si cette option est activée, les instructions vectorielles sont produites sous forme
compactée. Désactivez cette option pour exporter des instructions lisibles et détaillées (option utile à des fins
didactiques).
Limites des images multiples : Si vous activez cette option, les symboles du scénario incluent une
propriété frameBounds contenant un tableau de rectangles qui correspond aux limites de chaque image dans
le scénario. Les limites des images multiples augmentent considérablement la durée de publication.
Remplacer le fichier HTML à la publication et Inclure le code JavaScript dans le fichier HTML : Si
l’option Inclure le code JavaScript dans le fichier HTML est sélectionnée, la case Remplacer le fichier HTML
à la publication est cochée et activée.Si vous décochez la case Remplacer le fichier HTML à la publication,
l’option Inclure le code JavaScript dans le fichier HTML est décochée et désactivée.
3. Cliquez sur Publier pour publier le contenu à l’emplacement spécifié.
Remarque : une animation conçue à l’aide de scénarios imbriqués, avec une seule image, ne peut pas être
lue en boucle.
Haut de la page
Variables des modèles HTML
Quand vous importez un nouveau modèle HTML personnalisé, pendant la publication, les variables par
défaut sont remplacées par les fragments de code personnalisés en fonction des composants de votre fichier
FLA.
Le tableau suivant répertorie les variables de modèle actuellement reconnues et remplacées par Animate :
Attribut/paramètre
Variable du modèle
Titre du document HTML
$TITLE
Espace réservé permettant d’inclure des scripts
CreateJS
$CREATEJS_LIBRARY_SCRIPTS
Espace réservé permettant d’inclure les scripts
générés (notamment des scripts de police web)
$ANIMATE_CC_SCRIPTS
Balise HTML pour lancer un script côté client
$SCRIPT_START
Espace réservé au code pour créer le chargeur
(CreateJS LoadQueue)
$CREATE_LOADER
Espace réservé au code pour charger les éléments
présents dans le manifeste
$LOAD_MANIFEST
Espace réservé au code définissant la méthode de
chargement des fichiers
$HANDLE_FILE_LOAD_START
Espace réservé au code pour gérer l’événement de
chargement du fichier
$HANDLE_FILE_LOAD_BODY
Espace réservé au code concluant la méthode de
chargement des fichiers
$HANDLE_FILE_LOAD_END
Espace réservé au code définissant la gestion de la
méthode Terminer ; fonction appelée une fois les
éléments chargés
$HANDLE_COMPLETE_START
Espace réservé au code pour créer la scène
$CREATE_STAGE
Espace réservé au code pour l’enregistrement de
l’événement Tick, après lequel commence l’animation
$START_ANIMATION
31
Espace réservé au code pour prendre en charge la
mise à l’échelle réactive et les affichages hidpi
$RESP_HIDPI
Espace réservé au code concluant la gestion de la
méthode Terminer
$HANDLE_COMPLETE_END
Espace réservé pour une fonction qui gère le contenu
avec
du son
$PLAYSOUND
Espace réservé pour styler la section afin de prendre
en charge le centrage sur le plan de travail
$CENTER_STYLE
Espace réservé à la propriété de style d’affichage du
plan de travail pour la prise en charge du fichier de
préchargement
$CANVAS_DISP
Espace réservé au code pour afficher le fichier de
préchargement
$PRELOADER_DIV
Balise HTML pour la fin du script côté client
$SCRIPT_END
Identifiant d’élément de plan de travail
$CANVAS_ID
Largeur de l’élément de la scène ou du plan de travail
$WT
Hauteur de l’élément de la scène ou du plan de
travail
$HT
Couleur d’arrière-plan de l’élément de la scène ou du
plan de travail
$BG
Version d’Animate CC utilisée pour générer
du contenu
$VERSION
Les jetons suivants issus des versions précédentes sont obsolètes dans la présente version :
Attribut/paramètre
Variable du modèle
Espace réservé pour inclure les scripts (CreateJS et JavaScript
généré)
$CREATEJS_SCRIPTS
Espace réservé au code permettant d’initialiser les bibliothèques
CreateJS, de charger le média, de créer et mettre à jour la
scène
$CJS_INIT*
Remarque : Ces jetons sont modularisés et remplacés par d’autres jetons.
Haut de la page
Prise en charge JSAPI pour importer et exporter des modèles
HTML pour les documents Canvas
Les commandes JSAPI suivantes prennent en charge l’importation et l’exportation de modèles HTML pour les
documents Canvas :
Exporte le modèle de publication HTML5 Canvas pour un document donné, à
32
l’emplacement spécifié :
bool document::exportCanvasPublishTemplate(pathURI)
Exemple :
var pathURI ="file:///C|/Users/username/desktop/CanvasTemplate.html”
var exportFlag =fl.getDocumentDOM().exportCanvasPublishTemplate(pathURI);
if(!exportFlag)
fl.trace(“Template could not be exported”);
Importe et définit le modèle de publication HTML5 Canvas pour un document donné, à
partir de l’emplacement pathURI spécifié :
bool document::importCanvasPublishTemplate(pathURI)
Exemple :
var pathURI= “file:///C|/Users/username/desktop/CanvasTemplate.html”;
var exportFlag =fl.getDocumentDOM().importCanvasPublishTemplate(pathURI);
if(!exportFlag)
fl.trace(“Template could not be imported”);
Haut de la page
Code JavaScript incorporé au code HTML
Animate permet d’inclure le fichier JS dans le fichier HTML durant la publication du plan de travail.
1. Dans le menu Paramètres de publication, passez à l’onglet Avancé et sélectionnez
Inclure le code JavaScript dans le fichier HTML.
2. Dans la boîte de dialogue Inclure le code JavaScript dans le fichier HTML à la
publication, cliquez sur OK pour republier le contenu écrasant le code HTML.
3. Ceci désactive la case à cocher Remplacer le fichier HTML à la publication ; pendant
un événement de publication, le code HTML est généré mais pas écrasé.
4. Sous Arrêter d’inclure le code JavaScript dans le fichier HTML, cliquez sur OK pour
exclure le code JavaScript et republier le fichier HTML.
5. Si l’option Remplacer le fichier HTML à la publication n’est pas sélectionnée, l’option
Inclure le code JavaScript dans le fichier HTML est automatiquement désactivée.
Remarque : Si vous ne souhaitez pas que le code HTML soit remplacé, les options ​Remplacer le fichier
HTML à la publication et Inclure le code JavaScript dans le fichier HTML ne peuvent pas coexister.
33
Fusion de JS avec HTML
Haut de la page
Fusion des données JSON dans JS
D’après les commentaires des utilisateurs et du fait que les fichiers JSON ne sont en soi pas sécurisés, nous
avons fusionné les données appropriées avec le fichier JS ; ainsi, aucun fichier JSON distinct n’est créé.
Haut de la page
Optimisation des sorties HTML5 Canvas
Animate optimise la taille et les performances des sorties HTML5 Canvas comme suit :
Exportation de bitmaps comme une feuille Sprite à l’aide des options de l’onglet Feuille
Sprite dans les Paramètres de publication.
En excluant les calques masqués (en désélectionnant l’option Inclure les calques
invisibles) de la sortie publiée.
En excluant tous les éléments inutilisés tels que les sons et les bitmaps, ainsi que tous
les éléments des images inutilisées (par défaut).
En spécifiant de ne pas exporter les éléments du fichier FLA en désélectionnant les
options d’exportation des actifs pour les images et les sons, en prenant en charge les
bibliothèques JavaScript CreateJS et en utilisant les URL relatives pour l’exportation.
Sortie HTML5 Canvas compatible avec HiDPI : Animate met à l’échelle la sortie en
fonction de la résolution de l’appareil sur lequel est affiché le contenu. Cette compatibilité
permet de générer une sortie plus nette lors de l’utilisation du zoom et corrige également
les problèmes de pixellisation des documents Canvas lorsque vous affichez la sortie
34
HTML5 Canvas sur un ordinateur haute résolution.
Définition d’un arrière-plan de travail transparent
Vous pouvez personnaliser le plan de travail en différentes couleurs et également modifier sa transparence
d’affichage. Lorsque vous créez un plan de travail transparent, vous pouvez afficher le contenu HTML sousjacent durant la publication.
Remarque : Ce paramètre rend l’arrière-plan transparent pendant la publication OAM.
1. Choisissez le plan de travail à modifier.
2. Dans le volet Propriétés, sélectionnez Scène.
3. Dans la scène, définissez les valeurs de pourcentage pour Alpha.
Prise en charge du nuancier « Aucune couleur »
Vous pouvez également utiliser l’option Aucune couleur du nuancier pour rendre l’arrière-plan de travail
transparent :
1. Sélectionnez Modification > Document > Couleur de la scène ou dans l’Inspecteur
des propriétés, sélectionnez Paramètres avancés.
2. Dans le nuancier Couleur de la scène, sélectionnez Aucune couleur.
Transparence du plan de travail
35
Transparence du plan de travail : paramètres avancés
Exportation des bitmaps comme une feuille Sprite
L’exportation sous forme de feuille Sprite d’un certain nombre de bitmaps que vous avez utilisés dans votre
document HTML5 Canvas réduit le nombre de requêtes de serveur et la taille de la sortie, et améliore les
performances. Vous pouvez exporter la feuille Sprite au format PNG (par défaut), JPEG ou les deux.
1. Dans l’onglet Feuille Sprite, activez la case à cocher Regrouper les éléments d’image
dans des feuilles Sprite.
2. Sélectionnez le Format PNG, JPEG ou Les deux.
3. Si vous avez sélectionné PNG ou Les deux, spécifiez les options suivantes sous
Paramètres PNG :
Qualité : définissez la qualité de la feuille Sprite : 8 bits (par défaut), 24 bits ou
32 bits.
Taille max. : spécifiez la hauteur et la largeur maximales de la feuille Sprite, en
pixels.
Arrière-plan : cliquez et définissez la couleur d’arrière-plan de la feuille Sprite.
4. Si vous avez sélectionné JPEG ou Les deux, spécifiez les options suivantes sous
Paramètres JPEG :
Qualité : définissez la qualité de la feuille Sprite.
Taille max. : spécifiez la hauteur et la largeur maximales de la feuille Sprite, en
pixels.
Arrière-plan : cliquez et définissez la couleur d’arrière-plan de la feuille Sprite.
36
Haut de la page
Utilisation du texte dans le document HTML5 Canvas
Le plan de travail HTML prend en charge le texte statique et dynamique.
Texte statique
Le texte statique offre plus de latitude : tous les éléments sont convertis en contours au moment de la
publication, ce qui fournit à l’utilisateur un excellent environnement tel écrit, tel écran. Le texte est publié sous
forme de contours vectoriels, vous pouvez donc les modifier au moment de l’exécution.
Remarque : Un recours trop intensif au texte statique peut gonfler la taille du fichier.
37
Texte dynamique
Le texte dynamique permet de modifier le texte au moment de l’exécution et n’augmente pas de manière
significative la taille du fichier. Il prend en charge moins d’options que le texte statique. En revanche, il prend
en charge les polices web par l’intermédiaire de Typekit.
Si vous employez du texte dynamique avec des polices indisponibles sur les ordinateurs de l’utilisateur final,
la sortie utilise la police par défaut pour l’affichage et biaise ainsi l’expérience utilisateur. Ces problèmes sont
résolus avec les polices web.
Ajout de polices web Typekit au document HTML5 Canvas
Animate CC offre des polices web Typekit pour le texte dynamique des documents HTML5 Canvas. Typekit
fournit un accès direct à des milliers de polices de qualité supérieure mises au point par nos meilleures
fonderies partenaires. Accédez aux polices Typekit et utilisez-les simplement dans votre sortie HTML5 pour
les navigateurs et les terminaux mobiles modernes, en utilisant votre abonnement à Creative Cloud.
Pour en savoir plus sur l’utilisation des polices Typekit dans Animate CC, voir Utilisation de polices web
Typekit dans les documents HTML5 Canvas.
Animate 2015.2 améliore l’environnement visuel du texte dynamique dans un document Canvas, de sorte que
la scène et les aspects publiés sont synchronisés.
Remarque : Les polices web de Typekit ne sont pas disponibles pour le texte statique.
Vidéo : Améliorations du texte dans Animate CC
De Train Simple (www.trainsimple.com)
Haut de la page
Présentation de la sortie HTML5 Canvas
La sortie HTML5 publiée contient les fichiers suivants :
Fichier HTML Contient des définitions pour tous les objets, formes et illustrations de l’élément Canvas. Il
invoque également l’espace de noms CreateJS pour convertir Animate en HTML5 et le fichier JavaScript
correspondant qui contient des éléments interactifs.
Fichier JavaScript Contient des définitions dédiées ainsi que le code pour tous les éléments interactifs de
l’animation. Le code pour tous les types d’interpolation est également défini dans le fichier JavaScript.
Ces fichiers sont copiés au même emplacement que celui du fichier FLA par défaut. Vous pouvez modifier
cet emplacement en spécifiant le chemin d’accès de la sortie dans la boîte de dialogue Paramètres de
publication (Fichier > Paramètres de publication).
Haut de la page
Migration de contenu existant vers HTML5 Canvas
Vous pouvez faire migrer le contenu existant dans Animate pour générer une sortie HTML5. À cette fin,
Animate vous permet de faire migrer le contenu en copiant ou en important manuellement des calques, des
symboles et d’autres éléments de bibliothèque individuels. Vous pouvez aussi exécuter la commande
Convertir AS3 en document HTML5 Canvas pour exporter automatiquement le contenu ActionScript existant
vers un nouveau document HTML5 Canvas. Pour plus d’informations, suivez ce lien.
Lorsque vous utilisez le type de document HTML5 dans Animate CC, certaines fonctions ne sont pas prises
38
en charge. Cela est dû au fait que ces fonctions dans Animate n’ont pas de fonctions correspondantes dans
l’API Canvas. Elles ne peuvent donc pas être utilisées dans le document de type HTML5 Canvas. Cela peut
se produire au cours de la migration de contenu, lorsque vous essayez d’effectuer les opérations suivantes :
Copier du contenu (calques ou symboles de la bibliothèque) d’un document Animate de type classique (par
exemple ActionScript 3.0, AIR for Android, AIR for Desktop, etc.) dans un document HTML5. Dans ce cas, le
type de contenu non pris en charge est supprimé ou converti en valeurs par défaut prises en charge.
Par exemple, le fait de copier une animation 3D supprime toutes les transformations 3D appliquées aux
objets sur la scène.
Importer un fichier PSD ou AI qui contient le contenu non pris en charge. Dans ce cas, le contenu est
supprimé ou converti en valeurs par défaut prises en charge.
Par exemple, si vous importez un fichier PSD sur lequel est appliqué l’effet Biseau dégradé, Animate
supprime l’effet.
Utiliser plusieurs types de documents (par exemple, ActionScript 3.0 et HTML5 Canvas) simultanément et
permuter entre les documents avec un outil ou une option sélectionné non pris en charge. Dans ce cas,
Animate CC indique visuellement que la fonction n’est pas prise en charge.
Par exemple, vous avez créé une ligne pointillée dans un document ActionScript 3.0 et êtes passé en mode
HTML5 Canvas alors que l’outil Ligne était toujours sélectionné. Observez le pointeur et l’inspecteur des
propriétés : des icônes s’y affichent pour indiquer que la ligne pointillée n’est pas prise en charge dans
HTML5 Canvas.
Scripts Les composants ActionScript sont supprimés et les marques de commentaire du code sont
supprimées. Par ailleurs, si le bloc de commentaires contient du code JavaScript (pour Toolkit for CreateJS
avec Animate CC 13.0), vérifiez que vous avez supprimé manuellement les marques de commentaire du
code.
Si, par exemple, vous avez copié des calques qui contiennent des boutons, ils sont supprimés.
Modifications appliquées au contenu après la migration
Voici une liste des types de modifications appliquées lorsque vous migrez le contenu existant vers un
document HTML5 Canvas.
Le contenu est supprimé Les types de contenu non pris en charge dans HTML5 Canvas sont supprimés.
Par exemple :
les transformations 3D sont supprimées ;
les marques de commentaire du code ActionScript sont supprimées ;
les vidéos sont supprimées.
Le contenu est modifié en une valeur par défaut prise en charge Le type de contenu ou la fonction est
pris en charge, mais une propriété de la fonction ne l’est pas. Par exemple :
L’incrustation BlendMode n’est pas prise en charge ; elle est modifiée en Normal.
La ligne pointillée n’est pas prise en charge ; elle est modifiée en Continu.
Pour obtenir la liste complète des fonctions qui ne sont pas prises en charge et de leurs valeurs de
substitution pendant la migration, consultez cet article.
Haut de la page
Conversion d’autres types de documents en HTML5 Canvas
Grâce au convertisseur universel de type de document, vous pouvez convertir des projets FLA existants (de
39
tout type) en n’importe quel autre type de document tel que HTML5 Canvas, ActionScript/AIR, WebGL ou un
type de document personnalisé. Lors de la conversion dans un format donné, vous pouvez profiter des
fonctions de création d’Animate pour ce type de document.
Pour en savoir plus, voir Conversion en d’autres formats de document.
Conversion d’un document ActionScript 3 en document HTML5 Canvas à l’aide d’un
script JSFL
Animate CC fournit un script JSFL qui permet de convertir un document AS3 en document HTML5 Canvas.
Une fois exécuté, le script JSFL effectue les opérations suivantes :
Il crée un document HTML5 Canvas.
Il copie tous les calques, symboles et éléments de bibliothèque dans le nouveau
document HTML5 Canvas.
Il applique les valeurs par défaut aux fonctions, sous-fonctions ou propriétés de fonction
non prises en charge.
Il crée des fichiers FLA distincts pour chaque scène, car le document HTML5 Canvas ne
prend pas en charge les scènes multiples.
Pour convertir un document AS3 en document HTML5 Canvas, procédez comme suit :
1. Ouvrez le document ActionScript 3 dans Animate CC.
2. Sélectionnez Commandes > Convertir AS3 en document HTML5 Canvas.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
40
Création et publication d’un document WebGL
Remarque : WebGL est pris en charge uniquement en tant qu’aperçu. Cette mise à jour d’Animate prend en
charge des animations de base avec du son et des scripts, ainsi qu’un jeu de fonctions d’interactivité.
D’autres fonctions seront disponibles dans les futures versions d’Animate pour les documents de type
WebGL. Pour obtenir la liste complète des fonctions Animate prises en charge pour WebGL, consultez cet
article de la base de connaissances.
Qu’est-ce que WebGL ?
Type de document WebGL
Création d’un document WebGL
Aperçu du contenu WebGL sur les navigateurs
Publication de contenu au format WebGL
Présentation de la sortie WebGL
Ajout d’audio à votre document WebGL
Migration de contenu existant vers un document WebGL
Amélioration des performances de rendu grâce à la mise en cache sous forme de
bitmap
Haut de la page
Qu’est-ce que WebGL ?
WebGL est une norme Web ouverte qui permet d’effectuer le rendu des graphiques sur n’importe quel
navigateur compatible, sans avoir recours à d’autres modules complémentaires. Il est entièrement intégré à
toutes les normes Web du navigateur, ce qui permet d’utiliser le traitement des images et les effets accélérés
par GPU dans la zone de travail de la page Web. Les éléments WebGL peuvent être incorporés à d’autres
éléments HTML et combinés à d’autres parties de la page.
La plupart des navigateurs actuels prennent en charge le format WebGL. Toutefois, cliquez ici pour en savoir
plus sur les versions exactes prises en charge.
Dans certains navigateurs, WebGL n’est pas pris en charge par défaut. Pour activer WebGL dans votre
navigateur, consultez cet article.
Remarque : veillez à activer WebGL dans votre navigateur, car il est désactivé par défaut dans certains
navigateurs.
Haut de la page
Type de document WebGL
Animate CC permet de créer et de publier un contenu interactif enrichi au format WebGL (Web Graphics
Library). WebGL est complètement intégré aux navigateurs. Animate peut donc utiliser le traitement des
images et le rendu accélérés par GPU dans la zone de travail de la page Web.
Dans Animate CC, un nouveau type de document a été ajouté pour WebGL. Vous pouvez ainsi créer du
contenu et le publier rapidement pour une sortie WebGL. Créez un contenu enrichi à l’aide des puissants
outils d’Animate, puis restituez la sortie WebGL dans n’importe quel navigateur compatible. En d’autres
termes, vous pouvez utiliser le scénario, l’espace de travail et les outils de dessin traditionnels d’Animate
pour créer du contenu, puis produire ensuite du contenu WebGL. WebGL est pris en charge par la plupart
des navigateurs courants. Par conséquent, Animate peut restituer le contenu sur la plupart des plates-formes
Web.
41
Haut de la page
Création d’un document WebGL
Dans Animate CC, le document WebGL permet de créer et de publier rapidement le contenu pour le format
WebGL. Pour créer un document WebGL :
1. Lancez Animate CC.
2. Dans l’écran de bienvenue, cliquez sur l’option WebGL (Aperçu). Vous pouvez aussi
sélectionner Fichier > Nouveau pour ouvrir la boîte de dialogue Nouveau document.
Cliquez sur l’option WebGL (Aperçu).
Haut de la page
Aperçu du contenu WebGL sur les navigateurs
Vous pouvez utiliser la fonction Tester l’animation d’Animate pour prévisualiser ou tester votre contenu. Pour
afficher un aperçu, procédez comme suit :
1. Dans Animate CC, appuyez sur Ctrl + Entrée sous Windows ou Commande + Entrée sur
Mac. Le navigateur par défaut s’ouvre avec le contenu WebGL.
Un serveur Web est requis pour qu’Animate CC exécute le contenu WebGL. Animate CC comporte un
serveur Web intégré configuré pour exécuter le contenu WebGL sur le port 8090. Si un serveur utilise déjà ce
port, Animate le détecte automatiquement et résout le conflit.
Haut de la page
Publication de contenu au format WebGL
Animate vous permet de créer et de publier le contenu WebGL en mode natif directement dans l’application.
Pour publier le document WebGL, procédez comme suit :
1. Sélectionnez Fichier > Paramètres de publication pour ouvrir la boîte de dialogue
correspondante. Vous pouvez aussi sélectionner Fichier > Publier si vous avez déjà
spécifié les paramètres de publication pour WebGL.
2. Dans la boîte de dialogue Paramètres de publication, spécifiez les valeurs pour :
Fichier de sortie Donnez un nom significatif à la sortie. En outre, recherchez ou entrez l’emplacement où
vous souhaitez publier la sortie WebGL.
Remplacer HTML Permet d’indiquer si l’enveloppe HTML doit ou non être remplacée lors de la publication
de votre projet WebGL. Vous pouvez désélectionner cette option si vous avez apporté des modifications
externes au fichier HTML publié et souhaitez les conserver lors de la mise à jour de toute modification
apportée à l’animation ou à des éléments de Flash Pro.
Inclure les calques masqués Inclut tous les calques masqués dans la sortie WebGL. Si vous désactivez
cette option, les calques (y compris ceux imbriqués dans les clips) signalés comme masqués ne sont pas
exportés dans le document WebGL résultant. Vous pouvez ainsi facilement tester différentes versions de
documents WebGL en rendant des calques invisibles.
Scénario en boucle Répète le contenu lorsqu’il atteint la dernière image. Désactivez cette option pour
arrêter la lecture du contenu après la dernière image.
42
3. Cliquez sur Publier pour publier le contenu WebGL à l’emplacement spécifié.
Remarque : la fréquence maximale pouvant être définie pour le contenu WebGL exécuté sur des
navigateurs est de 60 i/s.
Haut de la page
Présentation de la sortie WebGL
La sortie WebGL publiée contient les fichiers suivants :
Fichier d’enveloppe HTML Comprend le moment de l’exécution, appelle les actifs et initialise le rendu
WebGL. Par défaut, le fichier est nommé <FLA_nom>.html. Vous pouvez entrer un autre nom pour le fichier
HTML dans la boîte de dialogue Paramètres de publication (Fichier > Paramètres de publication).
Le fichier HTML est placé dans le même répertoire que celui du fichier FLA par défaut. Vous pouvez préciser
un autre emplacement dans la boîte de dialogue Paramètres de publication.
Fichier JavaScript (WebGL à l’exécution) Restitue le contenu publié sur WebGL. Est publié dans le
dossier libs/ du document WebGL. Le fichier est nommé comme suit : flwebgl-<version>.min.js
L’enveloppe HTML utilise ce fichier JS pour restituer le contenu WebGL.
Atlas de textures Stocke toutes les valeurs de couleur (des formes), y compris les instances bitmap sur la
scène.
Haut de la page
Ajout d’audio à votre document WebGL
Vous pouvez importer et intégrer des données audio dans votre document WebGL, contrôler la lecture en
utilisant les paramètres de synchronisation (événement, démarrer et arrêter), et lire les données audio de la
chronologie à l’exécution. Actuellement, WebGL ne prend en charge que les formats .wav et .mp3.
Pour plus d’informations sur l’utilisation du contenu audio, voir Utilisation des sons dans Animate.
Haut de la page
Migration de contenu existant vers un document WebGL
Vous pouvez faire migrer le contenu existant dans Animate vers un document WebGL, en le copiant ou en
l’important manuellement. En outre, lorsque vous utilisez plusieurs documents dans Animate, vous pouvez
copier le contenu dans les documents sous la forme de calques ou d’actifs dans la bibliothèque. Même si la
plupart des fonctions d’Animate sont prises en charge, certains types de contenu sont modifiés en fonction
du format WebGL.
Animate s’accompagne de puissantes fonctions permettant de produire un contenu visuellement enrichi.
Cependant, certaines de ces fonctions étant natives dans Animate, elles ne seront pas prises en charge dans
un document WebGL. Animate a été conçu pour modifier un tel contenu dans un format pris en charge et
indique visuellement quand un outil ou une fonction n’est pas pris en charge.
43
Copier du contenu (calques ou symboles de la bibliothèque) d’un document Animate de type classique (par
exemple ActionScript 3.0, AIR for Android, AIR for Desktop, etc.) dans un document WebGL. Dans ce cas, le
type de contenu non pris en charge est supprimé ou converti en valeurs par défaut prises en charge.
Par exemple, le fait de copier une animation 3D supprime toutes les transformations 3D appliquées aux
objets sur la scène.
Importer un fichier PSD ou AI qui contient le contenu non pris en charge. Dans ce cas, le contenu est
supprimé ou converti en valeurs par défaut prises en charge.
Par exemple, si vous importez un fichier PSD sur lequel sont appliqués des effets de flou, Animate supprime
l’effet.
Utiliser plusieurs types de documents (par exemple, ActionScript 3.0 et WebGL) simultanément et permuter
entre les documents avec un outil ou une option sélectionné non pris en charge. Dans ce cas, Animate CC
indique visuellement que la fonction n’est pas prise en charge.
Par exemple, vous avez créé une ligne pointillée dans un document ActionScript 3.0 et êtes passé en mode
WebGL alors que l’outil Ligne était toujours sélectionné. Observez le pointeur et l’inspecteur des propriétés :
ils indiquent visuellement que la ligne pointillée n’est pas prise en charge dans WebGL.
Scripts Vous pouvez écrire du code JavaScript dans le panneau Actions, qui sera exécuté une fois que le
lecteur affiche l’image. La variable « this » dans le contexte des scripts d’image fait référence à l’occurrence
de MovieClip auquel elle appartient. Par ailleurs, les scripts d’image peuvent accéder aux fonctions et
variables JavaScript déclarées dans le fichier HTML conteneur. Lorsque vous copiez une image ou un calque
à partir d’un document ActionScript et que vous le collez dans un document WebGL, les scripts seront
commentés, le cas échéant.
Modifications appliquées au contenu après la migration
Voici une liste des types de modifications appliquées lorsque vous migrez le contenu existant vers un
document WebGL.
Le contenu est supprimé Les types de contenu non pris en charge dans HTML5 Canvas sont supprimés.
Par exemple :
Filtres ne sont pas pris en charge. L’effet sera supprimé et la forme adoptera un fond uni.
44
L’effet de filtre Flou est supprimé et remplacé par un fond uni.
Le contenu est modifié en une valeur par défaut prise en charge Le type de contenu ou la fonction est
pris en charge, mais une propriété de la fonction ne l’est pas. Par exemple :
Dégradé radial est modifié pour adopter un fond uni avec la couleur principale.
Le dégradé radial est modifié pour adopter un fond uni avec la couleur principale.
45
Pour obtenir la liste complète des fonctions qui ne sont pas prises en charge et de leurs valeurs de
substitution pendant la migration, consultez cet article.
Haut de la page
Amélioration des performances de rendu grâce à la mise en cache
sous forme de bitmap
La mise en cache des images bitmap à l’exécution permet d’optimiser les performances du rendu en
spécifiant qu’un clip statique (une image d’arrière-plan, par exemple) ou un symbole de bouton doit être mis
en cache sous forme de bitmap lors de l’exécution. Par défaut, les éléments vectoriels sont redessinés dans
chaque image. La mise en cache d’un clip ou d’un symbole de bouton en tant que bitmap empêche le
navigateur d’avoir à redessiner continuellement l’élément, car l’image est un bitmap et sa position ne change
pas. Ceci améliore considérablement les performances de rendu du contenu WebGL.
Lorsque vous créez une animation dont l’arrière-plan est complexe, par exemple, regroupez tous les
éléments de l’arrière-plan dans un clip. Sélectionnez ensuite Mettre en cache en tant que bitmap pour le clip
dans l’inspecteur des propriétés. A la lecture, l’arrière-plan est rendu sous forme d’un bitmap stocké à la
profondeur d’écran actuelle. Le navigateur dessine rapidement, une seule fois, le bitmap sur la scène, d’où
une lecture plus rapide et fluide.
La mise en cache d’un clip sous forme de bitmap permet de figer ce clip en place automatiquement. En cas
de modification d’une zone, les données vectorielles mettent à jour le cache de bitmaps. Le nombre de
retraçages que le navigateur doit effectuer en est donc réduit, ce qui permet des performances de rendu plus
fluides et plus rapides.
Pour activer la propriété Cache en tant que bitmap pour un symbole de clip, sélectionnez l’instance de clip
et sélectionnez Cache en tant que bitmap dans le menu déroulant Inspecteur de propriétés (Fenêtre >
Propriétés).
Considérations liées à l’utilisation de Cache en tant que bitmap
46
Lors de l’utilisation de la propriété Cache en tant que bitmap sur du contenu WebGL, tenez compte des
points suivants :
La taille maximale du symbole de clip est limitée à 2 048 x 2 048. Notez que les limites
actuelles de l’instance de clip qui peuvent être masquées sont inférieures à
2 048 x 2 048, WebGL réservant certains pixels.
S’il existe plusieurs instances du même clip, Animate génère le cache avec la taille de la
première instance rencontrée. Toutefois, le cache n’est pas généré à nouveau et la
propriété Cache en tant que bitmap n’est pas ignorée, même si la transformation du clip
change dans une large mesure. Par conséquent, si le symbole de clip augmente
considérablement au cours de l’animation, il se peut que cette dernière semble pixellisée.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
47
Assemblage d’applications AIR pour iOS
Prise en charge d’AIR 17.0 et de Flash Player 17.0
Déploiement d’applications AIR directement sur des périphériques iOS
Test et débogage d’applications AIR avec le simulateur natif iOS
Publication d’applications AIR pour les périphériques prenant en charge l’affichage
Retina haute résolution
Test et débogage via le mode d’interpréteur
Test et débogage sur iOS via USB
Connectivité de plusieurs périphériques via USB
Ajout des icônes xxhdpi (144x144)
Résolution des problèmes
Animate CC prend en charge la publication d’applications AIR pour iOS. Les applications AIR for iOS peuvent
s'exécuter sur l'iPhone et l'iPad d'Apple. Lorsque vous publiez du contenu pour iOS, Animate convertit vos
fichiers FLA en applications iPhone natives.
Pour plus d’informations sur la configuration matérielle et logicielle des applications de bureau et des
applications mobiles AIR, voir Adobe AIR / Caractéristiques techniques.
Pour obtenir des instructions détaillées sur la mise en package d’applications pour iPhone, voir Création
d’applications Adobe AIR à l’aide de Packager for iPhone.
Remarque : Animate vous permet d’ajouter le chemin d’accès au kit SDK iOS uniquement lorsque
l’application AIR inclut un fichier ANE. Cliquez sur Fichier > Paramètres d’ActionScript > Chemin de
bibliothèque pour inclure un fichier ANE.
Haut de la page
Prise en charge d’AIR 17.0 et de Flash Player 17.0
AIR 17.0 pour iOS permet de générer des fichiers binaires 64 bits ainsi que des fichiers binaires 32 bits par
défaut de vos applications conformément à la norme d’Apple pour les applications iOS. Dans la mise à jour
d’AIR 17.0 pour iOS, l’option Activer la création de package plus rapide sous l’onglet Déploiement de la boîte
de dialogue Paramètres AIR pour iOS est activée par défaut.
Haut de la page
Déploiement d’applications AIR directement sur des périphériques
iOS
Une importante modification apportée au processus de déploiement de l’application AIR permet de déployer
des applications AIR directement sur des périphériques iOS. Auparavant, pour déployer des applications sur
des périphériques iOS, il était nécessaire d’invoquer des applications AIR depuis iTunes.
En revanche, avec Animate, vous pouvez déployer des applications AIR directement sur iOS sans passer par
iTunes. Cette fonction réduit la durée de publication d’une application AIR for iOS et améliore de façon
significative la productivité et les performances.
Remarque : Il est nécessaire d’installer iTunes sur l’ordinateur qui est équipé d’Animate
Pour activer le déploiement direct sur un périphérique iOS, procédez comme suit :
1. Vérifiez qu’iTunes est installé sur l’ordinateur disposant d’Animate.
48
2. Dans le panneau Propriétés d’Animate, cliquez sur le bouton
en regard de la liste
déroulante Cible pour afficher la boîte de dialogue Paramètres AIR for iOS.
3. Cliquez sur l’onglet Déploiement, puis sélectionnez l’option Installer l’application sur le
périphérique iOS raccordé.
4. Cliquez sur Publier.
Haut de la page
Test et débogage d’applications AIR avec le simulateur natif iOS
Il est possible d’intégrer Animate à Apple Xcode afin que le simulateur iOS natif puisse tester et déboguer les
applications AIR créées pour iOS. Le simulateur iOS est très utile lorsque vous n’avez pas accès aux
périphériques (iPhone ou iPad). Grâce au simulateur iOS natif, vous pouvez également tester et déboguer
des applications AIR sur plusieurs périphériques (iPhone et iPad). Il n’est toutefois possible d’intégrer le
simulateur iOS à Flash CS6 que si ce dernier est exécuté sur des systèmes Macintosh.
Pour utiliser le simulateur iOS, Animate vous demande de télécharger et d’installer Xcode. Pour plus
d’informations, voir Installation de Xcode pour la prise en charge du simulateur iOS.
Remarque : Téléchargez et installez la dernière version d’AIR à utiliser avec le
simulateur iOS.
À compter de la version 16 du SDK (mise à jour CC 2014.2), Animate CC installe et
démarre l’application iOS sur le simulateur iOS.
Installation de Xcode pour la prise en charge du simulateur iOS
1. Téléchargez et installez Xcode depuis http://developer.apple.com ou depuis l’App Store.
2. Lancez Animate.
3. Créez ou ouvrez un document AIR for iOS existant.
4. Dans le panneau Propriétés, définissez le lecteur sur la dernière version d’AIR.
en regard de la liste déroulante Cible pour afficher la boîte de
5. Cliquez sur le bouton
dialogue Paramètres AIR for iOS.
49
6. Dans l’onglet Général, indiquez manuellement le chemin d’accès complet au kit SDK du
simulateur iOS ou recherchez son emplacement. Par exemple :
Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimula
7. Dans l’onglet Déploiement, indiquez le certificat et le mot de passe. Vous pouvez, si
vous le souhaitez, indiquer le profil de configuration de l’application AIR.
8. Cliquez sur OK lorsque vous avez terminé.
Vous pouvez désormais utiliser le simulateur iOS pour tester et déboguer votre application. Pour plus
d’informations, voir Test d’applications AIR à l’aide du simulateur iOS natif et Débogage d’applications AIR à
l’aide du simulateur iOS natif.
Test d’applications AIR à l’aide du simulateur iOS natif
Assurez-vous d’avoir installé Xcode et d’avoir défini le chemin vers le kit SDK de l’iPhone avant de tester
votre application AIR.
1. Dans Animate, cliquez sur Contrôle > Tester l’animation > Dans le simulateur iOS pour
ouvrir le simulateur iOS. Si vous n’avez pas indiqué le chemin vers le kit SDK du
simulateur iOS dans la boîte de dialogue Paramètres AIR for iOS, une erreur est
renvoyée.
2. Recherchez votre application dans le simulateur iOS et cliquez dessus pour la démarrer.
Débogage d’applications AIR à l’aide du simulateur iOS natif
Assurez-vous d’avoir installé Xcode et d’avoir défini le chemin vers le kit SDK de l’iPhone avant de déboguer
votre application AIR.
1. Dans Animate, cliquez sur Déboguer > Déboguer l’animation > Dans le simulateur iOS
50
pour ouvrir le simulateur iOS. Si vous n’avez pas indiqué le chemin vers le kit SDK du
simulateur iOS dans la boîte de dialogue Paramètres AIR for iOS, une erreur est
renvoyée.
2. Dans Animate, cliquez sur Déboguer > Commencer la session de débogage à distance >
ActionScript 3.0.
3. Recherchez votre application dans le simulateur iOS et cliquez dessus pour la démarrer.
Haut de la page
Publication d’applications AIR pour les périphériques prenant en
charge l’affichage Retina haute résolution
Animate vous permet de créer de riches applications AIR pour iOS prenant en charge l’affichage Retina
haute résolution. Vous pouvez sélectionner l’affichage Retina haute résolution lorsque vous publiez des
applications AIR.
1. Dans Animate, créez ou ouvrez un document AIR for iOS existant.
en regard de la liste déroulante
2. Dans le panneau Propriétés, cliquez sur le bouton
Cible pour afficher la boîte de dialogue Paramètres AIR for iOS.
3. Dans l’onglet Général, réglez la résolution sur Haute.
4. Cliquez sur Publier.
Haut de la page
Test et débogage via le mode d’interpréteur
Le mode d’interpréteur permet de déboguer ou de tester rapidement vos applications AIR développées pour
iOS. Lorsque vous sélectionnez le mode d’interpréteur, les applications AIR sont installées sans être
converties en code ARM.
Pour activer le mode d’interpréteur, procédez comme suit :
en regard de la liste déroulante
1. Dans le panneau Propriétés, cliquez sur le bouton
Cible pour afficher la boîte de dialogue Paramètres AIR for iOS.
2. Cliquez sur l’onglet Déploiement, puis sélectionnez Test du périphérique en mode
51
d’interpréteur ou Débogage du périphérique en mode d’interpréteur pour l’option Type de
déploiement iOS.
3. Cliquez sur OK lorsque vous avez terminé.
Remarque : vous pouvez mettre en package et charger plusieurs fichiers SWF contenant du code d’octet
ActionScript à l’aide du mode d’interpréteur et du mode AOT (Ahead of Time - à l’avance). Pour plus
d’informations, consultez ce blog.
Remarque : le mode d’interpréteur doit être utilisé uniquement à des fins de test ou de débogage. Il est
impossible de télécharger les fichiers d’installation AIR générés à l’aide du mode d’interpréteur sur l’App
Store.
Haut de la page
Test et débogage sur iOS via USB
Vous pouvez tester et déboguer des applications sur des périphériques iOS connectés via USB. Cette
fonction vient s’ajouter à la fonctionnalité de test et de débogage à distance via Wi-Fi disponible dans
Animate CC. Lorsque vous raccordez des périphériques via USB, le test et le débogage sont néanmoins
simplifiés et accélérés, car le nombre d’étapes manuelles est réduit.
Pour activer le test ou le débogage via USB, procédez comme suit :
(Pour le débogage) Choisissez Déboguer > Déboguer l’animation > Sur le périphérique
via USB.
(Pour le test) Choisissez Contrôle >Tester l’animation > Sur le périphérique via USB.
Haut de la page
Connectivité de plusieurs périphériques via USB
Animate prend en charge le test d’applications sur plusieurs périphériques simultanément. Vous pouvez vous
connecter à plusieurs périphériques via USB en vue de les tester.
Vous pouvez utiliser cette fonction pour effectuer le test par déploiement simultané sur plusieurs
périphériques dont les tailles d’écran, les versions des systèmes d’exploitation et les configurations
matérielles diffèrent. Cela vous permet d’analyser les performances de votre application sur plusieurs
périphériques à la fois.
en regard de la liste déroulante
1. Dans le panneau Propriétés, cliquez sur le bouton
Cible pour afficher la boîte de dialogue Paramètres AIR for iOS.
2. Une liste de tous les périphériques raccordés s’affiche dans l’onglet Déploiement.
Sélectionnez les périphériques sur lesquels vous souhaitez publier l’application.
3. Cliquez sur Publier.
Haut de la page
Ajout des icônes xxhdpi (144x144)
Vous pouvez ajouter manuellement des icônes xxhdpi pour une application AIR en utilisant le fichier appdescriptor.xml. Animate CC vous permet d’ajouter des icônes xhdpi (96x96) à l’aide de la boîte de dialogue
Gérer le kit SDK AIR. Toutefois, si vous souhaitez ajouter des icônes de plus haute résolution, vous pouvez
les ajouter manuellement dans le fichier app-descriptor.xml pour l’application AIR en utilisant la balise
suivante :
<icon><image144x144>{emplacement du png}/[nom_icône144x144].png</image144x144></icon>
Pour plus d’informations sur le fichier app-descriptor.xml, consultez cet article de l’aide.
Haut de la page
52
Résolution des problèmes
La publication d’une application AIR for iOS échoue si le nom de fichier spécifié pour le
fichier FLA ou SWF contient des caractères à deux octets.
Lors de la publication d’une application AIR for iOS, Animate se bloque si le périphérique
est débranché.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
53
Publication d’applications AIR pour Android
Création d’un fichier Adobe AIR for Android
Aperçu ou publication d’une application AIR for Android
Création d’une application AIR for Android
Paramètres de langue
Animate CC permet de publier du contenu pour Adobe® AIR™ pour Android.
Cet article décrit la configuration des paramètres de publication d’AIR for Android dans Animate. Pour obtenir
des informations complètes sur le développement d’applications Adobe AIR™, voir Création d’applications
Adobe AIR.
Pour plus d’informations sur la configuration matérielle et logicielle des applications de bureau et des
applications mobiles AIR, voir Adobe AIR / Caractéristiques techniques.
Pour obtenir la documentation complète du développeur AIR, voir la documentation Adobe AIR.
Vidéos et tutoriels
Les tutoriels vidéo suivants expliquent comment créer des applications AIR™ for Android dans Animate :
Vidéo : AIR for Android - Part 1: Set up your development environment
(GotoAndLearn.com, 18:49, disponible en anglais uniquement)
Vidéo : AIR for Android - Part 2: Access the camera on an Android device
(GotoAndLearn.com, 13:35, disponible en anglais uniquement)
Vidéo : AIR for Android GPU Acceleration (GotoAndLearn.com, 15:55, disponible en
anglais uniquement)
Blog/vidéo : One Application, Five Screens (Christian Cantrell, blogs Adobe, disponible en
anglais uniquement)
Article : Developing a Mobile Application with Animate (John Hattan, gamedev.net,
disponible en anglais uniquement)
Remarque : (AIR 3.7 uniquement) Mise en package d’applications avec un moteur d’exécution uniquement
captif (Android)
Avec AIR 3.7, la mise en package d’applications AIR for Android intègre le moteur d’exécution AIR, quelle
que soit la cible. Cela permettrait d’améliorer l’expérience utilisateur, car il ne serait pas nécessaire de
télécharger le moteur d’exécution AIR séparément. Cela augmenterait en revanche la taille de l’application
d’environ 9 Mo.
Animate affiche des avertissements si une application AIR for Android a été mise en package à l’aide de
l’option Moteur d’exécution partagé.
Haut de la page
Création d’un fichier Adobe AIR for Android
Vous pouvez créer des documents Adobe AIR for Android dans Animate à l’aide de la commande Fichier >
Nouveau. Vous pouvez par ailleurs créer un fichier FLA ActionScript® 3.0 et le convertir en fichier AIR for
Android via la boîte de dialogue Paramètres de publication.
54
Pour créer un fichier Adobe AIR for Android, effectuez l’une des opérations suivantes :
Choisissez AIR for Android dans l’écran de bienvenue ou la boîte de dialogue Nouveau
document (Fichier > Nouveau).
Ouvrez un fichier FLA existant et convertissez-le en fichier AIR for Android. Sélectionnez
AIR for Android dans le menu déroulant Cible de la boîte de la dialogue Paramètres de
publication (Fichier > Paramètres de publication).
Haut de la page
Aperçu ou publication d’une application AIR for Android
Vous pouvez obtenir un aperçu d’un fichier SWF Animate AIR for Android tel qu’il apparaît dans la fenêtre
de l’application AIR. Cet aperçu permet de visualiser les différents aspects de l’application sans avoir à
l’installer ni à créer de package.
1. Assurez-vous d’avoir sélectionné AIR for Android dans le menu déroulant Cible de la
boîte de dialogue Paramètres de publication.
2. Choisissez Contrôle > Tester l’animation > Tester ou appuyez sur Ctrl+Entrée.
Si vous n’avez pas encore défini les paramètres de l’application dans la boîte de dialogue Paramètres de
l’application et du programme d’installation, Animate génère un fichier descripteur d’application par défaut
(swfname-app.xml). Animate crée le fichier dans le dossier dans lequel le fichier SWF est écrit. Si vous avez
configuré l’application à l’aide de cette boîte de dialogue, le fichier descripteur de l’application reflète ces
paramètres.
Pour publier un fichier AIR for Android, effectuez l’une des opérations suivantes :
Cliquez sur le bouton Publier de la boîte de dialogue Paramètres de publication.
Cliquez sur le bouton Publier dans la boîte de dialogue Paramètres AIR for Android.
Choisissez Fichier > Publier.
Choisissez Fichier > Aperçu avant publication.
Lors de la publication d’un fichier AIR, Animate crée un fichier SWF et un fichier descripteur d’application
XML. Animate met ensuite en package les copies de ces deux fichiers, ainsi que tous les autres fichiers
ajoutés à votre application dans le fichier du programme d’installation d’AIR (swfname.apk).
Haut de la page
Création d’une application AIR for Android
Lorsque le développement de votre application est terminé, définissez les paramètres du descripteur de
l’application AIR for Android et des fichiers d’installation nécessaires à son déploiement. Animate crée le
fichier descripteur et les fichiers d’installation en même temps que le fichier SWF lorsque vous publiez un
fichier AIR for Android.
Les paramètres de ces fichiers sont définis dans la boîte de dialogue AIR for Android - Paramètres de
l’application et du programme d’installation. Après avoir créé un fichier AIR for Android, vous pouvez ouvrir
cette boîte de dialogue à partir de l'inspecteur des propriétés du document. Vous pouvez également y
accéder en cliquant sur le bouton Paramètres du menu Lecteur dans l’onglet Animate de la boîte de dialogue
Paramètres de publication.
Création d’un fichier d’application Adobe AIR
1. Dans Animate, ouvrez le fichier FLA ou l’ensemble des fichiers composant votre
application Adobe AIR.
55
2. Enregistrez le fichier FLA AIR for Android avant d’ouvrir la boîte de dialogue AIR Paramètres de l’application et du programme d’installation.
3. Choisissez Fichier > Paramètres d'AIR for Android.
4. Complétez la boîte de dialogue AIR for Android - Paramètres de l’application et du
programme d’installation, puis cliquez sur Publier.
Lorsque vous cliquez sur le bouton Publier, les fichiers suivants sont mis en package :
Le fichier SWF
Le fichier descripteur d'application
Les fichiers d'icône de l'application
Les fichiers répertoriés dans la zone de texte Fichiers inclus
Remarque : la publication d’une application AIR for Android échoue si le nom de fichier
spécifié pour le fichier FLA ou SWF contient des caractères à deux octets.
La boîte de dialogue Paramètres AIR for Android contient quatre onglets : Général, Déploiement, Icônes et
Autorisations.
Paramètres généraux
L’onglet Général de la boîte de dialogue AIR for Android - Paramètres de l’application et du programme
d’installation comprend les options suivantes :
Fichier de sortie Nom et emplacement du fichier AIR à créer lors de l’utilisation de la commande Publier.
L’extension du nom de fichier de sortie est APK.
Nom de l’application Nom utilisé par le programme d’installation de l’application AIR pour générer le nom
du fichier d’application et le dossier de l’application. Ce nom ne doit contenir que les caractères autorisés
pour les noms de fichier ou de dossier. Par défaut, il s’agit du nom du fichier SWF.
ID de l’application Identifie l’application par un ID unique. Vous pouvez modifier l’ID par défaut si vous le
souhaitez. N’incluez pas d’espaces ni de caractères spéciaux dans l’ID. Les seuls caractères valides sont 09, a-z, A-Z et (point), de 1 à 212 caractères de long. L’ID par défaut est
com.adobe.example.applicationName.
Version Facultatif. Spécifie le numéro de version de votre application. La valeur par défaut est 1.0.
Libellé de version Facultatif. Chaîne décrivant la version.
Format Les formats disponibles pour l'application sont les suivants : Portrait, Paysage et Automatique.
Lorsque vous sélectionnez le format Automatique et activez le paramètre Orientation auto, l'application
démarre sur le périphérique en fonction de son orientation actuelle.
Plein écran Ce paramètre permet d’indiquer que l’application sera exécutée en mode plein écran. Par
défaut, ce paramètre n'est pas activé.
Orientation auto Ce paramètre permet à l’application de commuter les modes Portrait et Paysage en
fonction de l’orientation actuelle du périphérique. Par défaut, ce paramètre n'est pas activé.
Mode de rendu Cette option permet de spécifier la méthode utilisée par le moteur d’exécution d’AIR pour
56
effectuer le rendu du contenu graphique. Les options disponibles sont les suivantes :
Automatique : détecte et utilise automatiquement la méthode de rendu la plus rapide
disponible sur le périphérique hôte.
CPU : utilise l’unité centrale.
GPU : utilise le GPU. Si le GPU n’est pas disponible, l’unité centrale est utilisée.
Direct : le rendu est effectué l’aide de Stage3D. Cette méthode de rendu est la plus
rapide.
Pour obtenir une liste des processeurs qui ne prennent pas en charge la méthode Direct, voir Stage3D
unsupported chipsets, drivers | Flash Player 11, AIR 3 (disponible en anglais uniquement).
Processeur : permet de sélectionner le type de processeur des périphériques pour lesquels vous publiez
l’application. Les types de processeur pris en charge sont ARM et Intel x86. La prise en charge des
processeurs x86 est disponible depuis la version Animate CC 2014.1.
Fichiers inclus Spécifie les fichiers et les dossiers supplémentaires à inclure dans le package de votre
application. Cliquez sur le bouton Plus (+) pour ajouter des fichiers et sur le bouton Dossier pour ajouter des
dossiers. Pour supprimer un fichier ou un dossier de la liste, sélectionnez-le, puis cliquez sur le bouton
Moins (-).
Par défaut, le fichier du descripteur d’application et le fichier SWF principal sont automatiquement ajoutés
dans la liste du package. La liste du package contient ces fichiers, même si vous n’avez pas encore publié le
fichier FLA Adobe AIR. La liste du package donne la liste des fichiers et des dossiers sous forme de structure
plate. Les fichiers des dossiers n’apparaissent pas dans la liste ; les chemins complets vers les fichiers sont
fournis, mais peuvent être tronqués si nécessaire.
Si vous avez ajouté des fichiers d’extensions natives AIR au chemin de bibliothèque ActionScript, ces fichiers
apparaissent également dans la liste.
Les fichiers d’icône ne sont pas inclus dans la liste. Lorsque Animate met les fichiers en package, il copie les
fichiers d’icône dans un dossier temporaire dont l’emplacement est relatif à celui du fichier SWF. Animate
supprime ce dossier une fois la mise en package terminée.
Paramètres de déploiement
L'onglet Déploiement de la boîte de dialogue Paramètres AIR for Android permet de spécifier les paramètres
57
suivants.
Certificat Certificat numérique pour l'application. Vous pouvez rechercher un certificat ou en créer un
nouveau. Pour plus d'informations sur la création d'un certificat numérique, voir Signature de votre
application. Notez que la période de validité des certificats des applications Android doit être d'au moins
25 ans.
Mot de passe Mot de passe du certificat numérique sélectionné.
Type de développement Spécifie le type de package à créer.
Le paramètre Libérer le périphérique permet de créer des packages pour Android Market
ou toute autre plate-forme de distribution, telle qu’un site Web.
Le paramètre Libérer l’émulateur permet de créer des packages pour le débogage dans le
simulateur de contenu mobile.
Le paramètre Déboguer permet de déboguer à distance l’application s’exécutant sur le
périphérique Android, mais aussi directement sur le périphérique (notamment de définir
des points d’arrêt dans Animate). Vous pouvez en outre choisir l’interface réseau et
l’adresse IP à utiliser lors des sessions de débogage.
Moteur d’exécution AIR Spécifie le comportement de l’application sur les périphériques sur lesquels le
moteur d’exécution AIR n’est pas encore installé.
Le paramètre Intégrer le moteur d’exécution AIR à l’application ajoute le moteur
d’exécution au package du programme d’installation de l’application de façon à ce
qu’aucun téléchargement supplémentaire ne soit nécessaire. Notez que ce paramètre
augmente considérablement la taille de votre package.
Si vous sélectionnez Obtenir le moteur d’exécution AIR à partir de…, le programme
d’installation télécharge le moteur d’exécution depuis le Google Playstore ou
Amazon Appstore.
Après la publication Ces paramètres permettent d'indiquer si vous souhaitez installer l'application sur le
périphérique Android actuellement raccordé ou lancer l'application après l'installation.
Paramètres des icônes
L’onglet Icônes de la boîte de dialogue AIR for Android - Paramètres de l’application et du programme
d’installation permet d’attribuer une icône à l’application. L’icône s’affiche après l’installation de l’application et
son exécution dans le moteur d’exécution d’AIR for Android. Vous pouvez spécifier différentes tailles d’icône,
en fonction des affichages dans lesquels elles apparaissent. Il n’est pas nécessaire que les icônes que vous
choisissez pour Android correspondent obligatoirement à ces valeurs.
Pour ce faire, cliquez sur une taille d’icône dans l’onglet Icônes, puis recherchez le fichier correspondant à
cette taille. Les fichiers doivent être au format PNG (Portable Network Graphics).
Si vous ne spécifiez pas d’image pour une taille particulière, Adobe AIR redimensionne l’une des images
fournies pour créer l’icône manquante.
Paramètres des autorisations
L'onglet Autorisations permet d'indiquer les services et les données auxquels peut accéder l'application sur le
périphérique.
Pour accorder une autorisation, cochez la case correspondante.
Pour afficher la description d'une autorisation, cliquez sur le nom de l'autorisation. La
description s'affiche sous la liste des autorisations.
58
Pour gérer manuellement les autorisations au lieu d'utiliser cette boîte de dialogue,
sélectionnez l'option « Gérer les autorisations et ajouter des éléments manuellement dans
le fichier descripteur d'application ».
Haut de la page
Paramètres de langue
Le volet Langues permet de sélectionner les langues auxquelles vous souhaitez associer votre application
dans l’App Store ou Android Market. En sélectionnant une langue, vous autorisez les utilisateurs du système
d’exploitation Android dans cette langue à télécharger votre application. Notez que ces paramètres de langue
n’ont aucun autre effet pour localiser l’interface utilisateur de votre application.
Si vous ne sélectionnez aucune langue, l’application est publiée avec toutes les langues prises en charge ;
cela vous évite ainsi d’avoir à sélectionner chaque langue une par une. Les langues répertoriées sont celles
prises en charge par Adobe AIR. Android peut prendre en charge d’autres langues.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
59
Publication pour Adobe AIR for Desktop
À propos d’Adobe AIR
Création d’un fichier Adobe AIR
Aperçu ou publication d’une application Adobe AIR
Création d’une application AIR et de ses fichiers d’installation
Signature de votre application
Ajout ou suppression d’une version du kit SDK AIR
Haut de la page
À propos d’Adobe AIR
Adobe® AIR™ est un environnement d’exécution multiplate-forme qui vous permet de tirer parti de vos
compétences en matière de développement Web (Adobe® Animate®, Adobe® Flex™,
Adobe® Flash Builder™ HTML, JavaScript®, Ajax) pour développer et déployer des applications Internet
riches (RIA) sur le bureau. AIR vous permet de travailler dans des environnements familiers, de tirer parti des
outils et des méthodes que vous trouvez les plus pratiques et, en prenant en charge Animate, Flex, HTML,
JavaScript et Ajax, d’obtenir l’environnement le mieux adapté à vos besoins.
Les utilisateurs interagissent avec les applications AIR de la même façon qu’avec les applications de bureau
natives. Le moteur d’exécution est installé une seule fois sur l’ordinateur de l’utilisateur. Il est alors possible
d’installer et d’exécuter les applications AIR à l’instar de toute autre application de bureau. Quel que soit le
système d’exploitation utilisé, le moteur d’exécution propose une plate-forme et une structure uniformes de
déploiement d’applications. La cohérence des fonctionnalités et interactions rend ainsi superflus les tests
dans plusieurs navigateurs. Au lieu de développer pour un système d’exploitation spécifique, vous ciblez le
moteur d’exécution.
AIR transforme incroyablement la création des applications, leur déploiement et leur utilisation. Il garantit un
contrôle créatif accru et permet la migration de vos applications Flash, Flex, HTML et Ajax dans le poste de
travail, sans s’appuyer sur les technologies de développement pour poste de travail traditionnelles.
Pour plus d’informations sur la configuration matérielle et logicielle des applications de bureau et des
applications mobiles AIR, voir Adobe AIR / Caractéristiques techniques.
Pour obtenir des informations complètes sur le développement d’applications Adobe AIR™, voir Création
d’applications Adobe AIR.
Haut de la page
Création d’un fichier Adobe AIR
Vous pouvez créer des documents Animate Adobe AIR via l’écran de bienvenue d’Animate ou la commande
Fichier > Nouveau, ou créer un fichier Animate ActionScript® 3.0 et le convertir en fichier Adobe AIR via la
boîte de dialogue Paramètres de publication.
Pour créer un fichier Adobe AIR, effectuez l’une des opérations suivantes :
Démarrez Animate. L’écran de bienvenue apparaît. Si Animate est déjà actif, fermez les
documents ouverts pour revenir à l’écran de bienvenue. Dans l'écran de bienvenue,
sélectionnez Adobe AIR 2 (CS5) ou AIR (CS5.5).
Remarque : Si vous avez désactivé l’écran de bienvenue d’Animate, vous pouvez
l’afficher de nouveau en sélectionnant Édition > Préférences et en choisissant Écran de
bienvenue dans le menu déroulant Au démarrage, dans la catégorie Général.
60
Choisissez Fichier > Nouveau et sélectionnez Adobe AIR 2 (CS5) ou AIR (CS5.5), puis
cliquez sur OK.
Ouvrez un fichier Animate existant et convertissez-le en fichier AIR en sélectionnant
Adobe AIR dans le menu Lecteur de l’onglet Animate de la boîte de dialogue Paramètres
de publication (Fichier > Paramètres de publication).
Remarque : (Flash CS5 uniquement) si vous enregistrez un fichier Flash CS5 AIR au format Flash CS4,
définissez manuellement la version du lecteur sur AIR 1.5 dans la boîte de dialogue Paramètres de
publication lors de l’ouverture du fichier dans Flash CS.4. Flash CS4 ne prend en charge que la publication
vers AIR 1.5.
Haut de la page
Aperçu ou publication d’une application Adobe AIR
Vous pouvez obtenir un aperçu d’un fichier SWF AIR tel qu’il apparaît dans l’application AIR. Cet aperçu
permet de visualiser les différents aspects de l’application sans avoir à l’installer ni à créer de package.
1. Assurez-vous d’avoir défini le paramètre Cible de l’onglet Animate de la boîte de
dialogue Paramètres de publication sur Adobe AIR.
2. Choisissez Contrôle > Tester l’animation > Tester ou appuyez sur Ctrl+Entrée.
Si vous n’avez pas défini les paramètres de l’application dans la boîte de dialogue AIR – Paramètres de
l’application et du programme d’installation, Animate génère un fichier descripteur d’application par défaut
(nomswf-app.xml) dans le dossier contenant le fichier SWF. Si vous avez configuré l’application à l’aide de
cette boîte de dialogue, le fichier descripteur de l’application reflète ces paramètres.
Pour publier un fichier AIR, effectuez l’une des opérations suivantes :
Cliquez sur le bouton Publier de la boîte de dialogue Paramètres de publication.
Cliquez sur le bouton Publier dans la boîte de dialogue Paramètres de l’application AIR et
du programme d’installation.
Choisissez Fichier > Publier.
Choisissez Fichier > Aperçu avant publication.
Lorsque vous publiez un fichier AIR, Animate crée un fichier SWF et un fichier descripteur de l’application
XML, et met en package des copies de ces fichiers, avec tous les autres fichiers ajoutés dans votre
application, dans un fichier d’installation AIR (nomswf.air).
Remarque : (Windows uniquement) la publication d’applications AIR échoue si le nom de fichier contient
des caractères dans une autre langue que l’anglais.
Haut de la page
Création d’une application AIR et de ses fichiers d’installation
Lorsque le développement de votre application est terminé, définissez les paramètres du descripteur de
l’application AIR et des fichiers d’installation nécessaires à son déploiement. Animate crée le fichier
descripteur et les fichiers d’installation en même temps que le fichier SWF lorsque vous publiez un fichier
AIR.
Les paramètres de ces fichiers sont définis dans la boîte de dialogue Paramètres de l’application AIR et du
programme d’installation. Après avoir créé un fichier AIR, vous pouvez ouvrir cette boîte de dialogue depuis
l’inspecteur des propriétés du document ou à partir du bouton Paramètres du menu Lecteur de l’onglet
Animate de la boîte de dialogue Paramètres de publication.
Création de l’application Adobe AIR et de ses fichiers d’installation
61
1. Dans Animate, ouvrez le fichier FLA ou l’ensemble des fichiers composant votre
application Adobe AIR.
2. Enregistrez le fichier FLA Adobe AIR avant d’ouvrir la boîte de dialogue Paramètres AIR.
3. Choisissez Fichier > Paramètres d’AIR 2.
4. Complétez la boîte de dialogue Paramètres AIR, puis cliquez sur Publier.
Lorsque vous cliquez sur le bouton Publier, les fichiers suivants sont mis en package : le
fichier SWF, le fichier descripteur de l’application, les fichiers des icônes de l’application
et les fichiers énumérés dans le champ de texte Fichiers inclus. Si vous n’avez pas
encore créé de certificat numérique, Animate affiche la boîte de dialogue Signature
numérique lorsque vous cliquez sur le bouton Publier.
La boîte de dialogue Paramètres de l’application AIR et du programme d’installation est composée de quatre
onglets : Général, Signature, Icônes et Avancé. Pour plus d’informations sur ces paramètres, voir les sections
suivantes.
Paramètres généraux
L’onglet Général de la boîte de dialogue Paramètres AIR de l’application et du programme d’installation
comprend les options suivantes :
Fichier de sortie Nom et emplacement du fichier .air à créer lors de l’utilisation de la commande Publier.
Au format Type de package à créer.
Package AIR : crée un fichier d’installation AIR standard qui tient compte du fait que le
moteur d’exécution d’AIR peut être téléchargé séparément lors de l’installation ou est déjà
installé sur le périphérique cible.
Programme d’installation de Mac : crée un fichier d’installation Macintosh complet.
Application avec moteur d’exécution intégré : crée un fichier d’installation AIR contenant
le moteur d’exécution d’AIR de façon à ce qu’aucun téléchargement supplémentaire ne
soit nécessaire.
Windows Installer Sélectionnez cette option pour compiler un fichier d’installation natif et propre à la plateforme Windows (.exe) plutôt qu’un fichier d’installation propre à la plate-forme AIR (.air).
Nom Nom du fichier principal de l’application. Par défaut, nom du fichier FLA.
Version Facultatif. Spécifie le numéro de version de votre application. La valeur par défaut est 1.0.
ID de l’application Identifie l’application par un ID unique. Vous pouvez modifier l’ID par défaut si vous le
souhaitez. N’incluez pas d’espaces ni de caractères spéciaux dans l’ID. Les seuls caractères valides sont 09, a-z, A-Z, . (point) et - (tiret), de 1 à 212 caractères de long. L’ID par défaut est
com.adobe.example.applicationName.
Description Facultatif. Permet d’entrer une description de l’application à afficher dans la fenêtre du
programme d’installation lorsque l’utilisateur installe l’application. Par défaut, ce champ reste vide.
Copyright Facultatif. Permet d’entrer une mention sur le copyright. Par défaut, ce champ reste vide.
Style de fenêtre Spécifie le style de fenêtre (ou d’chrome) à utiliser pour l’interface utilisateur lorsque
l’utilisateur exécute l’application sur son ordinateur. Vous pouvez spécifier Chrome système (valeur par
défaut), qui se rapporte au style visuel des fenêtres standard utilisé par le système d’exploitation. Vous
62
pouvez également spécifier Chrome personnalisé (opaque) ou Chrome personnalisé (transparent). Pour
afficher votre application sans chrome personnalisé, sélectionnez Aucun. Chrome système entoure
l’application avec le contrôle de fenêtre standard du système d’exploitation. Chrome personnalisé (opaque)
supprime le chrome standard du système et vous permet de créer votre propre chrome pour l’application. (Le
chrome personnalisé se définit directement dans le fichier FLA.) Chrome personnalisé (transparent)
correspond à Chrome personnalisé (opaque), mais ajoute de la transparence aux bords de la page. Cette
fonctionnalité permet d’obtenir des fenêtres d’application qui n’ont pas nécessairement la forme d’un carré ou
d’un rectangle.
Mode de rendu Cette option permet de spécifier la méthode utilisée par le moteur d’exécution d’AIR pour
effectuer le rendu du contenu graphique. Les options disponibles sont les suivantes :
Automatique : détecte et utilise automatiquement la méthode de rendu la plus rapide
disponible sur le périphérique hôte.
CPU : utilise l’unité centrale.
Direct : le rendu est effectué l’aide de Stage3D. Cette méthode de rendu est la plus
rapide.
Pour obtenir une liste des processeurs qui ne prennent pas en charge la méthode Direct, voir Stage3D
unsupported chipsets, drivers | Flash Player 11, AIR 3 (disponible en anglais uniquement).
Profils Profils à inclure lors de la création du fichier AIR. Pour limiter votre application AIR à un profil
spécifique, désactivez les profils inutiles. Pour plus d’informations sur les profils AIR, voir Profils d’application
dans le manuel Création d’applications Adobe AIR.
Fichiers inclus Spécifie les fichiers et les dossiers supplémentaires à inclure dans le package de votre
application. Cliquez sur le bouton Plus (+) pour ajouter des fichiers et sur le bouton Dossier pour ajouter des
dossiers. Pour supprimer un fichier ou un dossier de la liste, sélectionnez-le, puis cliquez sur le bouton
Moins (-).
Par défaut, le fichier du descripteur d’application et le fichier SWF principal sont automatiquement ajoutés
dans la liste du package. La liste du package contient ces fichiers, même si vous n’avez pas encore publié le
fichier FLA Adobe AIR. La liste du package donne la liste des fichiers et des dossiers sous forme de structure
plate. Les fichiers des dossiers n’apparaissent pas dans la liste et les noms de chemin complet des fichiers
sont fournis, mais peuvent être tronqués si nécessaire.
Si vous avez ajouté des fichiers d’extensions natives AIR au chemin de bibliothèque ActionScript, ces fichiers
apparaissent également dans la liste.
Les fichiers d’icône ne sont pas inclus dans la liste. Lorsque Animate met les fichiers en package, il copie les
fichiers d’icône dans un dossier temporaire dont l’emplacement est relatif à celui du fichier SWF. Animate
supprime ce dossier une fois la mise en package terminée.
Paramètres de signature
L’onglet Signature de la boîte de dialogue Paramètres de l’application AIR et du programme d’installation
permet de spécifier un certificat de signature de code pour votre application.
Pour plus d’informations sur les signatures numériques, voir Signature de votre application et Signature
numérique d’un fichier AIR.
Paramètres des icônes
L’onglet Icônes de la boîte de dialogue Paramètres de l’application AIR et du programme d’installation permet
d’attribuer une icône à l’application. L’icône s’affiche après l’installation de l’application et son exécution dans
le moteur d’exécution d’Adobe AIR. Vous pouvez spécifier quatre tailles différentes d’icône (128, 48, 32 et 16
pixels) en fonction des différents affichages de cette dernière. Par exemple, l’icône peut apparaître dans le
navigateur de fichiers dans les vues miniatures, détails et mosaïque. Elle peut également apparaître sous
forme d’icône de bureau et dans le titre de la fenêtre de l’application AIR, ainsi qu’à d’autres endroits.
Si aucun fichier d’icône n’est spécifié, l’icône exemple de l’application AIR est définie par défaut (Flash CS5
uniquement).
63
Pour ce faire, cliquez sur une taille d’icône dans la partie supérieure de l’onglet Icônes, puis recherchez le
fichier correspondant à cette taille. Les fichiers doivent être au format PNG (Portable Network Graphics).
Si vous spécifiez une image, sa taille doit correspondre à celle que vous avez définie (128x128, 48x48,
32x32 ou 16x16). Si vous ne spécifiez pas d’image pour une taille particulière, Adobe AIR redimensionne
l’une des images fournies pour créer l’icône manquante.
Paramètres avancés
L’onglet Avancé permet de spécifier des paramètres supplémentaires pour le fichier descripteur de
l’application.
Vous pouvez spécifier tous types de fichiers associés gérés par votre application AIR. Par exemple, si vous
souhaitez que votre application devienne l’application principale de traitement des fichiers HTML, vous devez
le spécifier dans le champ de texte Types de fichier associés.
Vous pouvez également spécifier des paramètres pour les aspects suivants de l’application :
Taille et position de la fenêtre initiale
Dossier dans lequel l’application est installée
Dossier du menu Programmes devant accueillir l’application
La boîte de dialogue présente les options suivantes :
Types de fichier associés Permet de spécifier les types de fichier associés que l’application AIR doit
traiter. Cliquez sur le bouton Plus (+) pour ajouter un nouveau type de fichier dans le champ de texte. Si vous
cliquez sur le bouton Plus, la boîte de dialogue Paramètres du type de fichier apparaît. Un clic sur le bouton
Moins (-) permet de supprimer un élément sélectionné dans le champ de texte. Un clic sur le bouton Crayon
permet d’afficher la boîte de dialogue Paramètres du type de fichier et de modifier un élément sélectionné
dans le champ de texte. Par défaut, les boutons Moins (-) et Crayon sont grisés. La sélection d’un élément
dans le champ de texte active ces boutons et permet de supprimer ou modifier cet élément. La valeur par
défaut du champ de texte est Aucune.
Paramètres initiaux de la fenêtre Permet de spécifier les paramètres de taille et de positionnement de la
fenêtre initiale de l’application.
Largeur : spécifie la largeur initiale de la fenêtre, en pixels. Cette valeur est vide par
défaut.
Hauteur : spécifie la hauteur initiale de la fenêtre, en pixels. Cette valeur est vide par
défaut.
X : spécifie la position horizontale de la fenêtre, en pixels. Cette valeur est vide par
défaut.
Y : spécifie la position verticale de la fenêtre, en pixels. Cette valeur est vide par défaut.
Largeur maximale et Hauteur maximale : spécifie la taille maximale de la fenêtre, en
pixels. Ces valeurs sont vides par défaut.
Largeur minimale et Hauteur minimale : spécifie la taille minimale de la fenêtre, en pixels.
Ces valeurs sont vides par défaut.
Agrandissement possible : permet de spécifier si l’utilisateur peut agrandir la fenêtre.
Cette option est sélectionnée par défaut.
Réduction possible : permet de spécifier si l’utilisateur peut réduire la fenêtre. Cette
option est sélectionnée par défaut.
Redimensionnable : permet de spécifier si l’utilisateur peut changer la taille de la fenêtre.
Si cette option n’est pas sélectionnée, les options Largeur maximale, Hauteur maximale,
Largeur minimale et Hauteur minimale ne sont pas disponibles. Cette option est
sélectionnée par défaut.
Visible : permet de spécifier si la fenêtre d’application est visible dès le début. Cette
option est sélectionnée par défaut.
64
Autres paramètres Permet de spécifier les informations supplémentaires suivantes concernant l’installation :
Dossier d’installation : spécifie le dossier dans lequel l’application sera installée.
Dossier du menu Programmes (Windows uniquement) : spécifie le nom du dossier du
menu de programmes de l’application.
Utiliser l’interface utilisateur personnalisée pour les mises à jour : précise ce qui se produit
lorsqu’un utilisateur ouvre le programme d’installation AIR d’une application déjà installée.
Par défaut, AIR affiche une boîte de dialogue qui permet à l’utilisateur de mettre à jour la
version installée avec la version du fichier AIR. Si vous préférez ne pas offrir cette
possibilité à l’utilisateur et laisser l’application contrôler ses mises à jour, activez cette
option. L’activation de cette option remplace le comportement par défaut et permet à
l’application de contrôler ses propres mises à jour.
Paramètres de langue
Le volet Langues permet de sélectionner les langues auxquelles vous souhaitez associer votre application
dans l’App Store ou Android Market. En sélectionnant une langue, vous autorisez les utilisateurs des
systèmes d’exploitation de cette langue à télécharger votre application. Notez que ces paramètres de langue
n’ont aucun autre effet pour localiser l’interface utilisateur de votre application.
Si vous ne sélectionnez aucune langue, l’application est publiée avec toutes les langues prises en charge ;
cela vous évite ainsi d’avoir à sélectionner chaque langue une par une. Les langues répertoriées sont celles
prises en charge par Adobe AIR. Android peut prendre en charge d’autres langues.
Paramètres du type de fichier
Animate affiche la boîte de dialogue Paramètres du type de fichier si vous cliquez sur le bouton Plus (+) ou
sur le bouton Crayon dans la section Types de fichiers associés de l’onglet Avancé pour ajouter ou modifier
les types de fichier associés à l’application AIR.
Les seuls champs obligatoires de cette boîte de dialogue sont les champs Nom et Extension. Si vous cliquez
sur OK alors que l’un de ces champs est vide, Animate affiche un message d’erreur.
Vous pouvez spécifier les paramètres suivants pour un type de fichier associé :
Nom Nom du type de fichier (par exemple, HTML, Fichier texte ou Exemple).
Extension Extension du nom de fichier (par exemple, html, txt ou xmpl) comportant jusqu’à 39 caractères
alphanumériques de base (A-Z, a-z, 0-9) et ne commençant pas par un point.
Description Facultatif. Description du type de fichier (par exemple, Fichier vidéo Adobe).
Type de contenu Facultatif. Spécifie le type MIME pour le fichier.
Paramètres de l’icône de type de fichier Facultatif. Permet de spécifier l’icône associée au type de fichier.
Vous pouvez spécifier quatre tailles différentes d’icône (128x128, 48x48, 32x32 et 16x16 pixels) en fonction
des différents affichages de cette dernière. Par exemple, l’icône peut apparaître dans le navigateur de fichiers
dans les vues miniatures, détails et mosaïque.
Si vous spécifiez une image, elle doit être de la taille indiquée. Si vous ne spécifiez pas de fichier pour une
taille particulière, AIR utilise l’image de la taille la plus proche et la redimensionne en fonction de l’occurrence
donnée.
Pour spécifier une icône, cliquez sur le dossier correspondant à la taille de l’icône et sélectionnez le fichier
d’icône à utiliser ou entrez son chemin et on nom dans le champ de texte accolé à l’invite. Le fichier de
l’icône doit être au format PNG.
Après la création d’un nouveau type de fichier, celui-ci s’affiche dans la zone de liste Type de fichier de la
boîte de dialogue Paramètres avancés.
65
Échec de création des fichiers de l’application et du programme
d’installation
La création des fichiers de l’application et du programme d’installation échoue dans les cas suivants :
La chaîne de l’identifiant de l’application est de longueur incorrecte ou contient des
caractères non valides. Cette chaîne doit comprendre entre 0 et 212 caractères et peut
inclure les caractères suivants : 0-9, a-z, A-Z, . (point), - (tiret).
Les fichiers spécifiés dans la liste Fichiers inclus n’existent pas.
Les tailles des fichiers d’icône personnalisés sont incorrectes.
Le dossier de destination AIR ne dispose pas de droits d’accès en écriture.
Vous n’avez pas signé l’application ou n’avez pas spécifié qu’il s’agit d’une application
Adobe AIRI qui sera signée ultérieurement.
Haut de la page
Signature de votre application
Toutes les applications Adobe AIR doivent être signées avant d’être installées sur un autre système. Animate
offre toutefois la possibilité de créer des fichiers de programme d’installation Adobe AIR non signés, de sorte
que l’application puisse être signée ultérieurement. Ces fichiers de programme d’installation Adobe AIR non
signés sont appelés package AIRI (AIR Intermediate). Cette capacité se révèle particulièrement utile lorsque
le certificat est enregistré sur un autre ordinateur ou lorsque la signature et le développement de l’application
sont traités séparément.
Signature d’une application Adobe AIR avec un certificat numérique acquis auprès d’une autorité de
certification racine
1. Choisissez Fichier > Paramètres d'Adobe AIR 2, puis cliquez sur l’onglet Signature.
Cet onglet comporte deux boutons radio qui permettent de signer l’application Adobe AIR
avec un certificat numérique ou de préparer un package AIRI. Si vous signez votre
application AIR, vous pouvez utiliser un certificat numérique octroyé par une autorité de
certification racine ou créer un certificat auto-signé. Il est très simple de créer un
certificat auto-signé, mais celui-ci est moins fiable qu’un certificat octroyé par une
autorité de certification racine.
2. Sélectionnez un fichier de certificat dans le menu déroulant ou cliquez sur le bouton
Parcourir pour en localiser un.
3. Sélectionnez le certificat.
4. Entrez un mot de passe.
5. Cliquez sur OK.
Pour plus d’informations sur la signature de votre application AIR, voir Signature numérique d’un fichier AIR.
Création d’un certificat numérique auto-signé
1. Cliquez sur le bouton Créer. La boîte de dialogue Créer un certificat numérique autosigné apparaît.
2. Renseignez les entrées Nom de l’éditeur, Unité d’organisation, Nom de l’organisation,
Pays, Mot de passe et Confirmer le mot de passe. Pour Pays, vous pouvez choisir dans
le menu ou entrer un code de pays à 2 lettres qui n’apparaît pas dans le menu. Pour
obtenir la liste des codes de pays valides, voir http://www.iso.org/iso/country_codes.
66
3. Spécifiez le type du certificat.
L’option Type fait référence au niveau de sécurité du certificat : 1024-RSA utilise une clé
1 024 bits (moins sécurisée) et 2048-RSA une clé 2 048 bits (plus sécurisée). Par défaut,
la résolution est de 2048-RSA.
4. Enregistrez les informations dans un fichier de certificat en renseignant l’entrée
Enregistrer sous ou en cliquant sur le bouton Parcourir pour localiser un dossier.
5. Cliquez sur OK.
6. Dans la boîte de dialogue Signature numérique, entrez le mot de passe défini à la
seconde étape de cette procédure, puis cliquez sur OK.
Pour qu’Animate retienne le mot de passe utilisé dans cette session, cliquez sur Mémoriser le mot de passe
pour cette session.
Si l’option Horodatage est désactivée lorsque vous cliquez sur OK, une boîte de dialogue vous avertit que
l’application ne pourra pas s’installer après l’expiration du certificat numérique. Si vous cliquez sur Oui en
réponse à l’avertissement, l’horodatage est désactivé. Si vous cliquez sur Non, l’option Horodatage est
automatiquement sélectionnée et l’horodatage est activé.
Pour plus d’informations sur la création d’un certificat numérique auto-signé, voir Signature numérique d’un
fichier AIR.
Vous pouvez également créer une application AIRI (AIR Intermediate) sans signature numérique. L’utilisateur
ne pourra cependant pas installer l’application dans son ordinateur tant que vous n’aurez pas ajouté la
signature numérique.
Préparation d’un package AIR intermédiaire (AIRI) à signer ultérieurement
Dans l’onglet Signature, sélectionnez Préparer un fichier AIR intermédiaire (AIRI) qui sera
signé ultérieurement, puis cliquez sur OK.
L’état de la signature numérique change pour signaler que vous avez choisi de préparer
un package AIRI qui sera signé ultérieurement, et le bouton Définir se transforme en
bouton Modifier.
Si vous décidez de signer l’application ultérieurement, vous devrez utiliser l’outil de ligne de commande AIR
Developer (ADT) inclus avec Animate et avec le kit SDK AIR. Pour plus d’informations, voir Création
d’applications Adobe AIR.
Haut de la page
Ajout ou suppression d’une version du kit SDK AIR
Vous pouvez ajouter de nouvelles versions du kit SDK AIR à Animate et les personnaliser. Une fois ajoutée,
la nouvelle version du kit SDK apparaît dans la liste Cible de la boîte de dialogue Paramètres de publication.
Pour ajouter une nouvelle version du kit SDK :
1. Téléchargez le dossier du nouveau kit SDK AIR.
2. Dans Animate, sélectionnez Aide > Gérer le kit SDK AIR.
3. Dans la boîte de dialogue Gérer le kit SDK AIR, cliquez sur le bouton plus (« + ») et
recherchez le dossier du nouveau kit SDK AIR. Cliquez sur OK.
4. Cliquez sur OK dans la boîte de dialogue Gérer le kit SDK AIR.
Le nouveau kit SDK apparaît dans la liste Cible de la boîte de dialogue Paramètres de publication. La version
du kit SDK la plus ancienne prise en charge doit être ultérieure à la version incluse avec Animate.
Pour supprimer une version du kit SDK :
1. Dans Animate, sélectionnez Aide > Gérer le kit SDK AIR.
2. Dans la boîte de dialogue Gérer le kit SDK AIR, sélectionnez le kit SDK que vous
souhaitez supprimer.
3. Cliquez sur le bouton moins (« - »). Cliquez sur OK.
67
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
68
Paramètres de publication d’ActionScript
Modification des paramètres de publication d’ActionScript
Fichiers de classe et de configuration
Déclaration d’une classe de document ActionScript 3.0
Définition de l’emplacement des fichiers ActionScript
Compilation conditionnelle du code ActionScript
Personnalisation des menus contextuels dans les documents (CS5.5)
Dossiers de configuration installés avec Flash (CS5.5)
Haut de la page
Modification des paramètres de publication d’ActionScript
Lorsque vous créez un document FLA, Animate CC (anciennement Flash Professional CC) vous demande la
version d’ActionScript que vous souhaitez utiliser. Vous pouvez changer ce paramètre si vous décidez plus
tard d’écrire vos scripts dans une autre version.
Remarque : ActionScript 3.0 n'est pas compatible avec ActionScript 2.0. Le compilateur d’ActionScript 2.0
peut compiler tout le code ActionScript 1.0, à l’exception de la syntaxe Barre oblique (/), utilisée pour indiquer
le chemin des clips (par exemple, parentClip/testMC:varName= "hello world"). Pour contourner ce
problème, réécrivez votre code en utilisant la notation à point (.), ou sélectionnez le compilateur
d’ActionScript 1.0.
1. Choisissez Fichier > Paramètres de publication.
2. Sélectionnez la version d’ActionScript dans le menu Script.
Haut de la page
Fichiers de classe et de configuration
Lorsque vous installez Animate, plusieurs fichiers et dossiers de configuration liés à ActionScript sont copiés
dans votre système. Si vous modifiez ces fichiers pour personnaliser l’environnement de création,
sauvegardez les fichiers d’origine.
Dossier des classes ActionScript Ce dossier contient toutes les classes ActionScript 2.0 intégrées (fichiers
AS). Les chemins d’accès habituels de ce dossier sont les suivants :
Windows 7 et 8 : Disque dur\Program Files\Adobe\Adobe Animate
CC\Common\Configuration\ActionScript 3.0\Configuration\Classes
Macintosh : Disque dur/Users/utilisateur/Library/Application Support/Adobe/Animate
CC/langue/Configuration/Classes
Le dossier Classes est organisé en classes pour Flash Player 10 et en classes pour
Flash Player 11. Pour plus d’informations sur l’organisation de ce répertoire, voir le fichier
Lisez-moi du dossier Classes.
Dossier de la classe Include Ce dossier contient tous les fichiers d’inclusion globaux d’ActionScript. Les
emplacements sont les suivants :
Windows 7 et 8 : Disque dur\Program Files\Adobe\Adobe Animate
CC\Common\Configuration\ActionScript 3.0\libs\
69
Macintosh : Disque dur/Users/utilisateur/Library/Application Support/Adobe/Animate
CC/langue/Configuration/Include
Fichier de configuration ActionsPanel.xml Fichier destiné à la configuration des conseils de code
d’ActionScript. Des fichiers distincts fournissent la configuration de chaque version d’ActionScript, de Flash
Lite et de JavaScript. Les emplacements sont les suivants :
Windows 7 et 8 : Disque dur\Program Files\Adobe\Adobe Animate
CC\Common\Configuration\ActionScript 3.0\libs\
Macintosh : Disque dur/Users/utilisateur/Library/Application Support/Adobe/Animate
CC/langue/Configuration/ActionsPanel
Fichier de configuration AsColorSyntax.xml Fichier destiné à la mise en évidence de la syntaxe et aux
couleurs de code ActionScript. Les emplacements sont les suivants :
Windows 7 et 8 : Disque dur\Program Files\Adobe\Adobe Animate
CC\Common\Configuration\ActionScript 3.0\libs\
Macintosh : Disque dur/Users/utilisateur/Library/Application Support/Adobe/Animate
CC/langue/Configuration/ActionsPanel
Haut de la page
Déclaration d’une classe de document ActionScript 3.0
Lorsque vous utilisez ActionScript 3.0, un fichier SWF peut disposer d’une classe de niveau supérieur qui lui
est associée. Cette classe est appelée classe du document. Lorsque le fichier SWF est chargé par Flash
Player, une occurrence de cette classe est créée en tant qu’objet de niveau supérieur de ce fichier. Vous
pouvez choisir n’importe quelle occurrence de classe personnalisée pour cet objet de fichier SWF.
Par exemple, un fichier SWF qui met en place un composant de calendrier peut associer son niveau
supérieur à une classe Calendar pourvue de méthodes et de propriétés qui conviennent à un composant de
calendrier. Lorsque le fichier SWF est chargé, Flash Player crée une occurrence de cette classe Calendar.
1. Désactivez tous les objets sur la scène et dans le scénario en cliquant sur une zone
vierge de la scène. Vous obtenez ainsi l’affichage des propriétés du document dans
l’inspecteur des propriétés.
2. Saisissez le nom du fichier ActionScript pour la classe dans la zone de texte Classe du
document dans l’inspecteur des propriétés. N’incluez pas l’extension .as.
Remarque : vous pouvez également saisir les informations sur la classe du document à l’aide de la boîte de
dialogue Paramètres de publication.
Remarque : Vous pouvez par ailleurs saisir le nom de la classe dans un fichier SWC, lié au chemin de la
bibliothèque, que vous souhaitez définir en tant que classe de document.
Haut de la page
Définition de l’emplacement des fichiers ActionScript
Pour utiliser une classe ActionScript que vous avez définie, Animate doit pouvoir localiser les fichiers
ActionScript externes contenant la définition de la classe. La liste des dossiers dans lesquels Animate
recherche les définitions de classe est appelée chemin de classe pour ActionScript 2.0 et chemin source
pour ActionScript 3.0. Les chemins de classe et les chemins source existent au niveau de l’application
(global) et au niveau du document. Pour plus d’informations sur les chemins de classe, voir Classes dans
Formation à ActionScript 2.0 dans Adobe Animate ou la rubrique Packages dans Formation à
ActionScript 3.0.
Vous pouvez définir les emplacements ActionScript suivants dans Animate :
ActionScript 2.0
Niveau de l’application (disponible pour tous les fichiers AS2 FLA) :
70
Chemin de classe (défini dans les préférences d’ActionScript)
Niveau du document (disponible uniquement pour le fichier FLA qui spécifie ce
chemin) :
Chemin de classe (défini dans les Paramètres de publication)
ActionScript 3.0
Niveau de l’application (disponible pour tous les fichiers AS3 FLA) :
Chemin source (défini dans les préférences d’ActionScript)
Chemin de bibliothèque (défini dans les préférences d’ActionScript)
Chemin de bibliothèque externe (défini dans les préférences d’ActionScript)
Niveau du document (disponible uniquement pour le fichier FLA qui spécifie ces
chemins) :
Chemin source (défini dans les Paramètres de publication)
Chemin de bibliothèque (défini dans les Paramètres de publication)
Classe du document (définie dans l’inspecteur des propriétés du document)
Le chemin de bibliothèque spécifie l’emplacement du code ActionScript précompilé qui réside dans les
fichiers SWC que vous avez créés. Le fichier FLA qui spécifie ce chemin charge chaque fichier SWC au
niveau supérieur de ce chemin et toutes les autres ressources de code spécifiées dans les fichiers SWC euxmêmes. Si vous utilisez le chemin de bibliothèque, assurez-vous qu’aucun code compilé dans les fichiers
SWC ne soit dupliqué dans les fichiers AS non compilés dans le chemin source. En effet, le code redondant
ralentit la compilation de votre fichier SWF.
Animate peut effectuer une recherche dans plusieurs chemins. Les ressources détectées dans l’un des
chemins spécifiés seront utilisées. Lorsque vous ajoutez ou modifiez un chemin, vous pouvez ajouter des
chemins de répertoire absolus (par exemple C:\mes_classes) et des chemins de répertoire relatifs (par
exemple, ../mes_classes ou ".").
Définition du chemin de classe pour ActionScript 2.0
Remarque : ActionScript 2.0 est abandonné avec Animate CC. Pour plus d'informations, lisez cet article
Pour définir le chemin de classe au niveau du document :
1. Choisissez Fichier > Paramètres de publication, puis cliquez sur Flash.
2. Vérifiez qu’ActionScript 2.0 est sélectionné dans le menu contextuel Version
d’ActionScript, et cliquez sur Paramètres.
3. Spécifiez l’image où la définition de classe doit résider dans le champ de texte Exporter
l’image pour les classes.
4. Pour ajouter des chemins dans la liste des chemins de classes, procédez de l’une des
manières suivantes :
Pour ajouter un dossier au chemin de classe, cliquez sur le bouton Rechercher le
chemin , recherchez le dossier que vous souhaitez ajouter, puis cliquez sur OK.
Vous pouvez également cliquer sur le bouton Ajouter un nouveau chemin pour
ajouter une ligne à la liste Chemin de classe. Double-cliquez sur la nouvelle ligne,
tapez un chemin relatif ou absolu, puis cliquez sur OK.
Pour modifier un dossier de chemin de classe existant, sélectionnez le chemin dans
la liste Chemin de classe, cliquez sur le bouton Rechercher le chemin et recherchez
le dossier que vous souhaitez ajouter, puis cliquez sur OK. Vous pouvez également
double-cliquer sur le chemin dans la liste Chemin de classe, taper le chemin désiré
et cliquer sur OK.
71
Pour supprimer un dossier du chemin de classe, sélectionnez le chemin dans la liste
Chemin de classe, puis cliquez sur le bouton Supprimer du chemin sélectionné .
Pour définir le chemin de classe au niveau de l’application :
1. Choisissez Modifier > Préférences (Windows) ou Flash > Préférences (Macintosh), puis
cliquez sur la catégorie ActionScript.
2. Cliquer sur le bouton Paramètres d’ActionScript 2.0 et ajouter le(s) chemin(s) de classe
dans la liste des chemins de classe.
Définition du chemin source pour ActionScript 3.0
Pour définir le chemin source au niveau du document :
1. Sélectionnez Fichier > Paramètres de publication, puis cliquez sur Animate.
2. Vérifiez qu’ActionScript 3.0 est sélectionné dans le menu contextuel Version
d’ActionScript, puis cliquez sur Paramètres. Vous devez disposer de Flash Player 9 ou
d’une version ultérieure pour pouvoir utiliser ActionScript 3.0.
3. Spécifiez l’image dans laquelle la définition de classe doit résider dans le champ de texte
Exporter les classes dans l’image.
4. Spécifiez les paramètres d’erreur. Vous pouvez sélectionner le Mode strict et le Mode
avertissements. Le Mode strict signale les avertissements du compilateur comme des
erreurs, ce qui signifie que la compilation échouera tant que ces types d’erreurs
persisteront. Le Mode avertissements signale des avertissements supplémentaires qui
aident à détecter les incompatibilités lors du passage d’ActionScript 2.0 à
ActionScript 3.0.
5. (facultatif) Vous pouvez sélectionner Scène pour déclarer des occurrences de scène
automatiquement.
6. Spécifiez ActionScript 3.0 ou ECMAScript comme dialecte à utiliser. ActionScript 3.0 est
recommandé.
7. Pour ajouter le chemin dans la liste des chemins source, effectuez les opérations
suivantes :
Pour ajouter un dossier au chemin source, cliquez sur l’onglet Chemin source, puis
sur le bouton Rechercher le chemin , localisez le dossier que vous souhaitez
ajouter, puis cliquez sur OK.
Pour ajouter une ligne à la liste Chemin source, cliquez sur le bouton Ajouter un
nouveau chemin . Double-cliquez sur la nouvelle ligne, tapez un chemin relatif ou
absolu, puis cliquez sur OK.
Pour modifier un dossier de chemin source existant, sélectionnez le chemin dans la
liste Chemin source, cliquez sur le bouton Rechercher le chemin et recherchez le
dossier que vous souhaitez ajouter, puis cliquez sur OK. Vous pouvez également
double-cliquer sur le chemin dans la liste Chemin source, taper le chemin désiré et
cliquer sur OK.
Pour supprimer un dossier du chemin source, sélectionnez le chemin dans la liste
Chemin source, puis cliquez sur le bouton Supprimer du chemin .
Pour définir le chemin source au niveau de l’application :
1. Sélectionnez Édition > Préférences (Windows) ou Animate > Préférences (Macintosh),
puis cliquez sur la catégorie ActionScript.
2. Cliquez sur le bouton Paramètres d’ActionScript 3.0 et ajoutez le(s) chemin(s) source
dans la liste des chemins source.
72
Définition du chemin de bibliothèque pour les fichiers ActionScript 3.0
Pour définir le chemin de bibliothèque au niveau du document, la procédure est la même que pour un chemin
source :
1. Choisissez Fichier > Paramètres de publication.
2. Assurez-vous qu’ActionScript 3.0 est spécifié dans le menu Script, puis cliquez sur le
bouton Paramètres d'ActionScript.
3. Dans la boîte de dialogue Paramètres avancés d’ActionScript 3.0, cliquez sur l’onglet
Chemin de la bibliothèque.
4. Ajoutez le chemin de bibliothèque dans la liste des chemins de bibliothèque. Vous
pouvez ajouter des dossiers ou des fichiers SWC individuels dans la liste des chemins.
5. Pour définir la propriété Type de lien, cliquez deux fois sur Type de lien dans
l’arborescence de la propriété du chemin. Les options de la propriété Type de lien sont
les suivantes :
Fusionné dans le code : les ressources de code détectées dans le chemin sont
fusionnées dans le fichier SWF publié.
Externe : les ressources de code détectées dans le chemin ne sont pas ajoutées au
fichier SWF publié, mais le compileur vérifie qu’elles se trouvent aux emplacements
que vous avez spécifiés.
Bibliothèque partagée à l’exécution (RSL) : Flash Player télécharge les ressources à
l’exécution.
Pour définir le chemin de bibliothèque au niveau de l’application :
1. Sélectionnez Édition > Préférences (Windows) ou Animate > Préférences (Macintosh),
puis cliquez sur la catégorie ActionScript.
2. Cliquez sur le bouton Paramètres d’ActionScript 3.0 et ajoutez le(s) chemin(s) dans la
liste des chemins de bibliothèque.
Haut de la page
Compilation conditionnelle du code ActionScript
Vous pouvez utiliser la compilation conditionnelle dans ActionScript 3.0 de la même façon que dans C++ et
dans d’autres langages de programmation. Par exemple, vous pouvez utiliser la compilation conditionnelle
pour activer ou désactiver des blocs de code dans un projet, par exemple du code qui implémente une
certaine fonctionnalité ou du code utilisé pour le débogage.
Les constantes de configuration que vous définissez dans les paramètres de publication vous permettent de
spécifier si certaines lignes de code ActionScript sont compilées ou non. Chaque constante prend la forme
suivante :
CONFIG::EXEMPLE_CONSTANTE
Dans cette forme, CONFIG correspond à l’espace de noms de configuration et EXEMPLE_CONSTANTE à la
constante que vous définirez sur true ou false dans les paramètres de publication. Lorsque la valeur de la
constante est true, la ligne de code qui suit la constante dans le code ActionScript est compilée. Lorsque la
valeur est false, la ligne de code qui suit la constante n’est pas compilée.
Par exemple, deux lignes de code de la fonction suivante sont compilées uniquement si la valeur de la
constante qui les précède est définie sur true dans les paramètres de publication :
public function CondCompTest() {
CONFIG::COMPILE_FOR_AIR {
trace("This line of code will be compiled when COMPILE_FOR_AIR=true.");
73
}
CONFIG::COMPILE_FOR_BROWSERS {
trace("This line of code will be compiled when COMPILE_FOR BROWSERS=true.");
}
}
Pour définir une constante de configuration dans la boîte de dialogue Paramètres de publication :
1. Choisissez Fichier > Paramètres de publication.
2. Assurez-vous que le menu Script est défini sur ActionScript 3.0, puis cliquez sur le
bouton Paramètres d'ActionScript en regard du menu.
3. Dans la boîte de dialogue Paramètres avancés d’ActionScript 3.0, cliquez sur l’onglet
Configurer les constantes.
4. Pour ajouter une constante, cliquez sur le bouton Ajouter.
5. Entrez le nom de la constante à ajouter. L’espace de noms de configuration par défaut
est CONFIG et le nom par défaut de la constante est CONFIG_CONST.
Remarque : l’espace de noms de configuration CONFIG est déclaré automatiquement
par le compilateur Animate. Pour ajouter vos propres espaces de noms de configuration,
saisissez-les avec le nom de la constante dans les paramètres de publication et ajoutezles dans votre code ActionScript avec la syntaxe suivante :
config namespace MY_CONFIG;
6. Entrez la valeur désirée pour la constante, true ou false. Vous modifiez cette valeur pour
activer ou désactiver la compilation de lignes de code spécifiques.
Haut de la page
Personnalisation des menus contextuels dans les documents
(CS5.5)
Vous pouvez personnaliser le menu contextuel habituel et celui d’édition de texte qui apparaissent dans les
fichiers SWF de Flash Player, versions 7 et ultérieures.
Le menu contextuel habituel s’affiche lorsque l’utilisateur clique avec le bouton droit de la
souris (Windows) ou clique en appuyant sur la touche Contrôle (Macintosh) sur un fichier
SWF dans Flash Player, dans n’importe quelle zone à l’exception des champs de texte
modifiables. Vous pouvez ajouter des éléments personnalisés au menu et masquer ses
éléments par défaut, à l’exception des options Paramètres et Débogueur.
Le menu contextuel d’édition de texte s’affiche lorsque l’utilisateur clique avec le bouton
droit de la souris (Windows) ou clique en appuyant sur la touche Contrôle (Macintosh) sur
un champ de texte modifiable d’un fichier SWF dans Flash Player. Vous pouvez ajouter
des éléments personnalisés à ce menu, mais vous ne pouvez pas masquer ses éléments
par défaut.
Remarque : Flash Player affiche également un menu contextuel d’erreur lorsque l’utilisateur clique avec le
bouton droit de la souris (Windows) ou clique avec la touche Contrôle enfoncée (Macintosh) dans Flash
Player, alors qu’aucun fichier SWF n’est chargé. Ce menu n’est pas personnalisable.
Pour personnaliser les menus contextuels de Flash Player 7, utilisez les objets contextMenu et
contextMenuItem d’ActionScript 2.0. Pour plus d’informations sur l’utilisation de ces objets, voir
ContextMenu dans le Guide de référence du langage ActionScript 2.0.
Tenez compte des conditions suivantes lors de la création d’éléments de menu contextuel personnalisés pour
Flash Player :
Les éléments personnalisés sont ajoutés au menu contextuel dans l’ordre de leur
74
création. Une fois les éléments créés, leur disposition dans le menu ne peut plus être
modifiée.
Vous pouvez définir la visibilité et l’activation des éléments personnalisés.
Les éléments de menu contextuel personnalisés sont automatiquement convertis au
format Unicode UTF8.
Haut de la page
Dossiers de configuration installés avec Flash (CS5.5)
Flash place plusieurs dossiers de configuration sur votre système lorsque vous installez l’application. Les
dossiers de configuration organisent les fichiers associés à l’application selon des niveaux appropriés d’accès
utilisateur. Vous pourriez vouloir visualiser les contenus de ces dossiers lorsque vous travaillez avec
ActionScript® ou avec des composants. Les dossiers de configuration de Flash sont les suivants :
Dossier de configuration de niveau application
Comme il se trouve au niveau de l’application, les utilisateurs non Administrateurs ne disposent pas de droits
d’accès en écriture pour ce répertoire. Les chemins d’accès habituels de ce dossier sont les suivants :
Sous Microsoft Windows XP ou Microsoft Windows Vista, naviguez jusqu’à lecteur
d’amorçage\Program Files\Adobe\Adobe Flash CS3\langue\Configuration\.
Sur Macintosh, accédez à disque dur/Applications/Adobe Flash CS3/Configuration/.
Dossier First Run
Ce frère du dossier de configuration de niveau application facilite le partage des fichiers de configuration
parmi les utilisateurs d’un même ordinateur. Les dossiers et les fichiers figurant dans le dossier First Run sont
automatiquement copiés par Flash dans le dossier de configuration au niveau des utilisateurs. Tout nouveau
fichier placé dans le dossier First Run est copié dans le dossier de configuration au niveau des utilisateurs
lorsque vous démarrez l’application.
Les chemins d’accès types à ce dossier sont les suivants :
Dans Microsoft Windows XP ou Microsoft Windows Vista, naviguez jusqu’à lecteur
d’amorçage\Program Files\Adobe\Adobe Flash CS3\langue\First Run\.
Sur Macintosh, accédez à disque dur/Applications/Adobe Flash CS3/First Run/.
Dossier de configuration de niveau utilisateur
Situé dans la zone de profil de l’utilisateur, ce dossier est toujours modifiable par l’utilisateur en cours Les
chemins d’accès habituels de ce dossier sont les suivants :
Sous Windows XP ou Vista, naviguez jusqu’à disque d’amorçage\Documents and
Settings\nom d’utilisateur\Local Settings\Application Data\Adobe\Flash
CS3\langue\Configuration.
Sur Macintosh, accédez à disque dur/Users/nom d’utilisateur/Library/Application
Support/Adobe/Flash CS3/langue/Configuration/.
Dossier de configuration au niveau All Users
Ce dossier fait partie intégrante des installations du système d’exploitation standard Windows et Macintosh et
75
il est partagé par tous les utilisateurs d’un ordinateur donné. Le système d’exploitation met à la disposition de
tous les utilisateurs de l’ordinateur tous les fichiers de ce dossier. Les chemins d’accès habituels de ce
dossier sont les suivants :
Sous Windows XP ou Vista, naviguez jusqu’à disque d’amorçage\Documents and
Settings\All Users\Application Data\Adobe\Flash CS3\langue\Configuration\.
Sur Macintosh, accédez à disque dur/Users/Shared/Application Support/Adobe/Flash
CS3/langue/Configuration/.
Dossier de configuration Restricted Users
Pour les utilisateurs qui disposent de privilèges limités sur un poste de travail, le plus souvent dans un
environnement réseau, seuls les administrateurs système ont l’autorisation d’accéder à des postes de travail.
Tous les autres utilisateurs reçoivent un accès restreint. Ceci signifie généralement qu’ils ne peuvent pas
écrire dans les dossiers de fichiers au niveau de l’application (comme le dossier Program Files de Windows
ou le dossier Applications de Mac OS X).
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
76
Pratiques recommandées – Organisation du code ActionScript
dans une application
Maintien de la cohésion des actions
Association de code à des objets
Haut de la page
Maintien de la cohésion des actions
Autant que possible, placez votre code ActionScript® dans un seul emplacement. Lorsque vous placez votre
code au même endroit, cela vous permet de modifier vos projets plus efficacement car il devient inutile
d’entreprendre des recherches dans des endroits différents pour déboguer ou modifier votre code
ActionScript. Si vous placez du code dans un fichier FLA, mettez le code ActionScript sur l’Image 1 ou
l’Image 2 dans un calque appelé actions sur le calque le plus haut du scénario. Sinon, vous pouvez placer
l’intégralité de votre code dans des fichiers ActionScript. Certaines applications Animate ne placent pas
toujours l’ensemble du code à un endroit unique (notamment lorsque vous utilisez des applications basées
sur ActionScript 2.0 qui font appel à des écrans ou des comportements).
Vous pouvez en général mettre l’intégralité de votre code dans un endroit unique (sur une image ou dans
des fichiers ActionScript), ce qui présente les avantages suivants :
Il est facile de trouver le code dans un fichier source potentiellement complexe.
Il est facile de déboguer le code.
Haut de la page
Association de code à des objets
Évitez d’associer du code ActionScript à des objets dans un fichier FLA, même dans des fichiers SWF
simples. Il est possible d’associer uniquement ActionScript 1.0 et 2.0 à des objets, pas ActionScript 3.0.
Associer du code à un objet signifie que vous sélectionnez un clip, un composant ou une occurrence bouton,
que vous ouvrez le panneau Actions et ajoutez le code ActionScript à l’aide des fonctions du gestionnaire
on() ou onClipEvent().
Évitez d’associer du code ActionScript à des objets pour les raisons suivantes :
Le code est difficile à repérer et les fichiers FLA sont difficiles à modifier.
Le code est difficile à déboguer.
Le code ActionScript rédigé sur le scénario ou dans des classes est plus facile à
développer et plus élégant.
Cela encourage un style de codage médiocre.
Des personnes en cours de formation à ActionScript peuvent trouver déroutant le
contraste entre deux styles de codage. Cela oblige les étudiants et les lecteurs à acquérir
deux styles de codage différents, une syntaxe supplémentaire et un style de codage
médiocre et limité.
Vous devriez éviter d’associer ActionScript 2.0 à un bouton appelé myButton_btn qui
ressemble à ce qui suit :
77
on (release) { //do something }
Cependant, si vous placez du code ActionScript 2.0 dans le même but sur le scénario (ce
qui est recommandé), il aura l’allure suivante :
myButton_btn.onRelease = function() { //do something };
Remarque : Des pratiques différentes s’appliquent lorsque vous travaillez sur des
comportements, ce qui implique, dans certains cas, d’associer du code à des objets.
Adobe recommande également :
Conventions des comportements
Utilisation du modèle de conception MVC
Organisation des fichiers et stockage du code
Comparaison du code de scénario avec le code d’objet
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
78
Utilisation d’ActionScript avec Animate CC
Prise en main d’ActionScript
Panneau Actions
Présentation de la fenêtre Script
Boîte à outils du panneau Actions et de la fenêtre de script
Accès à l’aide contextuelle dans le panneau Actions
Définition de vos préférences ActionScript
Haut de la page
Prise en main d’ActionScript
Le langage de script ActionScript® vous permet d’ajouter à votre application des interactivités complexes, des
contrôles de lecture et l’affichage de données. Vous pouvez ajouter des instructions ActionScript dans
l’environnement de création à l’aide du panneau Actions, de la fenêtre Script ou d’un éditeur externe.
ActionScript suit ses propres règles de syntaxe, ses mots-clés réservés et vous permet d’utiliser des
variables pour stocker et recouvrer des informations. ActionScript comprend une bibliothèque volumineuse de
classes intégrées qui vous permettent de créer des objets pour exécuter des tâches nombreuses très
pratiques. Pour plus d’informations sur ActionScript, voir les titres suivants :
Formation à ActionScript 3.0 à l’adresse www.adobe.com/go/learn_flcs5_learnas3_fr
Formation à ActionScript 2.0 dans Adobe Animate à l’adresse
www.adobe.com/go/learn_cs5_learningas2_fr
Il n’est pas nécessaire de connaître toutes les utilisations possibles de chaque élément ActionScript pour
commencer à rédiger des scripts ; si vous avez un objectif précis, vous pouvez commencer par des actions
simples.
ActionScript et JavaScript sont tous les deux basés sur la norme ECMA-262, norme internationale pour le
langage de programmation ECMAscript. C’est pourquoi les développeurs expérimentés en JavaScript se
familiariseront très rapidement avec ActionScript. Pour plus d’informations sur ECMAScript, reportez-vous au
site ecma-international.org.
Introduction à ActionScript 3.0
Découvrez les principes de base
d’ActionScript 3.0 en créant vos propres
applications Animate. En seulement neuf
leçons, vous apprendrez à utiliser AS3 en
vue d’interagir avec des utilisateurs Internet
du monde entier.... En savoir plus
http://goo.gl/2w4c0
Quelle version d’ActionScript devez-vous utiliser ?
79
par Slekx
Pour satisfaire les besoins de plusieurs catégories de développeurs et les caractéristiques des matériels de
lecture, Animate comprend plusieurs versions d’ActionScript. ActionScript 3.0 et 2.0 ne sont pas
mutuellement compatibles.
La version ActionScript 3.0 s’exécute très rapidement. Elle exige plus d’expérience en
matière de programmation orientée objets que les autres versions d’ActionScript. La
version ActionScript 3.0 est entièrement compatible avec les spécifications ECMAScript.
Cette version offre un meilleur traitement du langage XML, un modèle d’événement
amélioré et une architecture perfectionnée pour utiliser les éléments à l’écran. Les fichiers
FLA utilisés par ActionScript 3.0 ne peuvent pas inclure des versions antérieures
d’ActionScript.
(Abandonné dans Animate CC uniquement) L’apprentissage d’ActionScript 2.0 est plus
facile que celui d’ActionScript 3.0. Bien que Flash Player exécute plus lentement le code
ActionScript 2.0 compilé que le code ActionScript 3.0 compilé, ActionScript 2.0 demeure
utile pour différents types de projets qui ne nécessitent pas de calculs intensifs ; un
contenu plus orienté conception, par exemple. ActionScript 2.0 est aussi basé sur les
spécifications ECMAscript, mais n’est pas entièrement compatible avec cette norme.
(Abandonné dans Animate CC) ActionScript 1.0 est la version la plus simple. Elle est
toujours utilisée par certaines versions de Flash Lite Player. ActionScript 1.0 et 2.0
peuvent cohabiter dans le même fichier FLA.
(Abandonné dans Animate CC) Flash Lite 2.x ActionScript est un sous-ensemble
d’ActionScript 2.0 qui est pris en charge par Flash Lite 2.x s’exécutant sur les
périphériques et téléphones mobiles.
(Abandonné dans Animate CC) Flash Lite 1.x ActionScript est un sous-ensemble
d’ActionScript 1.0 qui est pris en charge par Flash Lite 1.x s’exécutant sur les
périphériques et téléphones mobiles.
Utilisation de la documentation d’ActionScript
Comme il existe plusieurs versions d’ActionScript (2.0 et 3.0) et de nombreuses façons de l’intégrer dans vos
fichiers FLA, l’apprentissage de ce langage peut prendre différentes formes.
Ce chapitre décrit l’interface utilisateur graphique permettant d’utiliser ActionScript. Cette interface comprend
les panneaux Actions, Comportements, Sortie et Erreurs de compilateur, la fenêtre de script et le mode
Assistant de script. Ces rubriques concernent toutes les versions d’ActionScript.
D’autres documents Adobe consacrés à ActionScript vous aideront à bien comprendre les différentes
versions d’ActionScript.
Méthodes de travail avec ActionScript
Il existe plusieurs manières de travailler avec ActionScript.
(Abandonné dans Animate CC) Le mode Assistant de script permet d’ajouter du code
ActionScript à votre fichier FLA sans écrire ce code vous-même. Vous sélectionnez des
actions et le logiciel vous présente une interface utilisateur pour saisir des paramètres
correspondant à chacune d’entre elles. Vous devez connaître les fonctions à utiliser pour
accomplir des tâches spécifiques, mais vous n’avez pas besoin d’apprendre la syntaxe.
De nombreux concepteurs et non-programmeurs utilisent ce mode.
(Abandonné dans Animate CC) Les comportements permettent également d’ajouter du
code à votre fichier sans l’écrire vous-même. Les comportements sont en réalité des
scripts préécrits pour exécuter des tâches courantes. Vous pouvez ajouter un
comportement, puis le configurer facilement dans le panneau Comportements. Les
comportements ne sont disponibles qu’à partir de la version ActionScript 2.0.
L’écriture de votre propre code ActionScript vous offre plus de souplesse et de contrôle
sur votre document. Pour ce faire, cependant, vous devez maîtriser le langage et les
conventions d’ActionScript.
80
Les composants sont des clips prédéfinis qui vous permettent de mettre en place
rapidement des fonctionnalités complexes. Un composant peut être une simple
commande d’interface utilisateur, tel qu’une case à cocher ou un élément de commande
plus complexe, tel qu’un panneau de défilement. Vous pouvez personnaliser l’apparence
et le fonctionnement d’un composant. Vous pouvez également télécharger des
composants développés par d’autres programmeurs. Vous devez rédiger vous-même du
code ActionScript pour la plupart des composants afin de déclencher ou contrôler un
composant. Pour plus d’informations, voir Utilisation de composants ActionScript 3.0.
Écriture de code ActionScript
Lorsque vous écrivez du code ActionScript dans un environnement de création, vous utilisez le panneau
Actions ou la fenêtre de script. Le panneau Actions et la fenêtre de script contiennent un éditeur de code très
complet qui comprend conseils et coloration du code, mise en forme du code, mise en évidence de la
syntaxe, débogage, numérotation des lignes, retour à la ligne automatique et prise en charge d’Unicode.
Utilisez le panneau Actions pour écrire les scripts qui font partie de votre document
Animate (scripts intégrés au fichier FLA). Le panneau Actions fournit des fonctionnalités
telles que la boîte à outils Actions, qui permet d’accéder rapidement aux principaux
éléments du langage ActionScript dans lequel vous indiquez directement les éléments
dont vos scripts ont besoin.
Utilisez la fenêtre de script pour écrire des scripts externes (scripts ou classes stockés
dans des fichiers externes). (Vous pouvez également utiliser un éditeur de texte pour
créer un fichier AS externe.) La fenêtre Script comprend des fonctionnalités d’aide à
l’écriture de code, telles que la coloration et les conseils, la vérification de la syntaxe et la
mise en forme automatique.
Autre contenu communautaire recommandé
Prise en main d’ActionScript 3.0 (CS3) (3:25)
Optimisation d’animations et de fichiers Flash (7:24) (CS3)
Création d’une classe de document à l’aide d’ActionScript 3.0 (CS3) (2:38)
Création d’un workflow efficace entre la création et le développement (CS3) (3:41)
Utilisation des composants (CS3) (1:47)
Liste des chaînes ActionScript sur YouTube.com
Les articles et tutoriels suivants contiennent des informations détaillées complémentaires sur l’utilisation
d’ActionScript :
Introduction to ActionScript 3.0 (Slekx.com, disponible en anglais uniquement)
Tableau de migration d’ActionScript 3 (Adobe.com)
Haut de la page
Panneau Actions
Vous recherchez un guide de référence de langage ?
Pour trouver le guide de référence d’un élément de langage ActionScript spécifique, procédez de l’une des
façons suivantes :
81
Ouvrez le Guide de référence du langage ActionScript 3.0 et recherchez l’élément de
langage.
(Abandonné dans Animate CC) Ouvrez le Guide de référence du langage ActionScript 2.0
et recherchez l’élément de langage.
Saisissez l’élément de langage dans le panneau Actions, sélectionnez-le, puis appuyez
sur F1. (Vous devez immédiatement appuyer sur F1 ; dans le cas contraire, c’est cette
rubrique qui apparaît.)
Remarque : pour ouvrir l’Aide dans une fenêtre de navigateur plutôt que dans l’application d’Aide de la
communauté, consultez l’article suivant : http://kb2.adobe.com/community/publishing/916/cpsid_91609.html.
Formation à ActionScript
Pour plus de détails sur l'écriture du code ActionScript, consultez les ressources suivantes :
Formation à ActionScript 3.0
Guide de référence du langage et des composants ActionScript 3.0
Formation à ActionScript 2.0 dans Adobe Animate
Guide de référence du langage ActionScript 2.0
Remarque : ActionScript 3.0 et 2.0 ne sont pas mutuellement compatibles. Vous devez choisir une version
et l'utiliser de façon constante dans le fichier FLA que vous créez.
Présentation du panneau Actions
Pour créer des scripts intégrés dans un fichier FLA, saisissez ActionScript directement dans le panneau
Actions (Fenêtre > Actions ou appuyez sur F9).
Panneau Actions
Le panneau Actions comporte deux volets :
Fenêtre de script Permet d’écrire du code ActionScript, qui est associé à l’image actuellement sélectionnée.
Navigateur de script Ce navigateur répertorie les scripts de votre document Animate et permet d’y accéder
rapidement. Cliquez sur un élément dans ce navigateur pour afficher le script dans le volet Script.
Le panneau Actions permet d’accéder aux fonctionnalités d’aide à la programmation qui simplifient et
rationalisent l’écriture du code dans ActionScript.
Exécuter le script : exécute le script.
Verrouiller le script : épingle le script aux onglets verrouillés de scripts individuels dans
le volet Script et les déplace en conséquence. Cette fonction est utile si vous n’avez pas
centralisé l’organisation du code du fichier FLA ou si vous utilisez plusieurs scripts. Vous
pouvez verrouiller un script pour conserver l’emplacement ouvert du code dans le
82
panneau Actions et permuter entre les différents scripts ouverts. Cette fonction s’avère
particulièrement pratique lors de la phase de débogage.
Insérer le chemin ou le nom de l’occurrence : permet de définir un chemin cible
absolu ou relatif pour une action du script.
Rechercher : recherche et remplace du texte dans votre script.
Formater le code : permet de formater le code.
Fragments de code : ouvre le panneau Fragments de code, qui affiche des exemples de
fragments de code.
Aide : affiche des informations de référence concernant l’élément ActionScript qui est
sélectionné dans la fenêtre Script. Par exemple, si vous cliquez sur une instruction import,
puis sur Aide, la rubrique d’aide relative à import s’affiche dans le panneau Aide.
(Abandonné dans Animate CC) Impression de code ActionScript
1. Dans le menu contextuel du panneau Actions, sélectionnez Imprimer.
2. Sélectionnez Options, puis cliquez sur Imprimer.
Comme la copie imprimée ne comprendra aucune information sur son fichier de
provenance, ajoutez des informations, telles que le nom du fichier FLA, dans une
comment du script.
Haut de la page
Présentation de la fenêtre Script
La fenêtre de script vous permet de créer des fichiers de script externes que vous importerez dans votre
application. Ces scripts peuvent être des fichiers JavaScript Animate ou ActionScript.
Fenêtre Script
Si plusieurs de vos fichiers externes sont ouverts, leurs noms apparaissent sur les onglets en haut de la
83
fenêtre de script.
Vous pouvez utiliser les fonctions suivantes dans la fenêtre de script : épingler le script, rechercher et
remplacer, coloration de la syntaxe, formatage du code, conseils de code, commentaires de code, réduction
de code, options de débogage (fichiers ActionScript uniquement) et retour à la ligne. La fenêtre de script
permet également d’afficher les numéros de ligne et les caractères masqués.
Création d’un fichier externe dans la fenêtre de script
1. Choisissez Fichier > Nouveau.
2. Sélectionnez le type de fichier externe à créer (fichier ActionScript ou Flash JavaScript).
Modification d’un fichier existant dans la fenêtre de script
Pour ouvrir un script existant, choisissez Fichier > Ouvrir, puis ouvrez un fichier
ActionScript (AS) existant.
Pour modifier un script déjà ouvert, cliquez sur l’onglet de document portant le nom du
script.
Haut de la page
Boîte à outils du panneau Actions et de la fenêtre de script
Le panneau Actions permet d’accéder aux fonctionnalités d’aide à la programmation qui simplifient et
rationalisent l’écriture du code dans ActionScript.
Rechercher
Recherche et remplace du texte dans votre script.
Insérer un chemin cible
(Panneau Actions uniquement) Vous aide à définir un chemin de cible absolu ou relatif pour une action du
script.
Aide
Affiche des informations de référence concernant l’élément ActionScript qui est sélectionné dans la fenêtre
Script. Par exemple, si vous cliquez sur une instruction import, puis sur Aide, la rubrique d’aide relative à
import s’affiche dans le panneau Aide.
Fragments de code
Ouvre le panneau Fragments de code, qui affiche des exemples de fragments de code.
Haut de la page
Accès à l’aide contextuelle dans le panneau Actions
1. Pour sélectionner un élément de référence, effectuez l’une des opérations suivantes :
Sélectionnez un terme ActionScript dans la fenêtre de la boîte à outils du panneau
Actions (dans sa partie gauche).
Sélectionnez un élément ActionScript dans la fenêtre Script du panneau Actions.
Placez le point d’insertion avant un terme ActionScript dans la fenêtre Script du
panneau Actions.
2. Pour ouvrir la page de référence de l’élément sélectionné dans le panneau Aide,
effectuez l’une des opérations suivantes :
Appuyez sur la touche F1.
84
Cliquez avec le bouton droit de la souris sur l’élément et sélectionnez Afficher l’aide.
Cliquez sur Aide
au-dessus de la fenêtre Script.
Haut de la page
Définition de vos préférences ActionScript
Que vous travailliez dans le panneau Actions ou dans la fenêtre de script, vous ne pouvez définir et modifier
qu’un seul jeu de préférences.
1. Sélectionnez Édition > Préférences (Windows) ou Animate > Préférences (Macintosh),
puis cliquez sur Éditeur de code dans la liste des catégories.
2. Définissez n’importe laquelle des préférences suivantes :
Indentation automatique Lorsque l’indentation automatique est activée, le texte saisi
après une parenthèse ouvrante ( ou une accolade ouvrante { est automatiquement mis
en retrait conformément à la valeur de taille des tabulations définie.
Taille des tabulations Spécifie le nombre de caractères de chaque ligne avant sa mise
en retrait.
Conseils de code Active l’affichage des conseils de code dans la fenêtre de script.
Délai Précise le délai (en secondes) devant s’écouler avant l’affichage des conseils de
code. Notez que cette option n’est plus disponible dans Animate CC.
Police Spécifie la police à utiliser pour votre script.
Ouvrir/Importer Spécifie le codage des caractères utilisé pour l’ouverture et
l’importation de fichiers ActionScript.
Enregistrer/Exporter Spécifie le codage des caractères utilisé pour l’enregistrement et
l’exportation de fichiers ActionScript.
Recharger les fichiers modifiés Spécifie ce qui se produit lors de la modification, le
déplacement et la suppression d’un fichier de script. Sélectionnez Toujours, Jamais ou
Invite.
Toujours Aucun avertissement n’est affiché et le fichier est rechargé
automatiquement.
Jamais Aucun avertissement n’est affiché et le fichier conserve son état actuel.
Invite (par défaut) Un avertissement est affiché et vous pouvez décider si le
fichier est à recharger ou non.
Lorsque vous élaborez des applications faisant appel à des scripts externes,
cette préférence évite d’écraser un script qui a été modifié par un membre de
l’équipe depuis votre dernière ouverture de l’application. Elle évite également de
publier l’application avec des versions de script antérieures. L’avertissement
vous permet de fermer automatiquement un script pour rouvrir sa version la plus
récente, modifiée.
Couleurs de la syntaxe Spécifie la couleur à appliquer au code dans vos scripts.
85
Paramètres d’ActionScript 3.0 Ces boutons permettent d’ouvrir les boîtes de dialogue
Paramètres d’ActionScript, dans lesquelles vous pouvez définir un chemin source, un
chemin de bibliothèque ou un chemin de bibliothèque externe pour ActionScript 3.0.
Adobe recommande également :
Symboles et ActionScript
Scénarios et ActionScript
Sons et ActionScript
Contrôle de la lecture vidéo externe à l’aide d’ActionScript
Texte multilingue et code ActionScript
Création d’accessibilité avec ActionScript
Organisation du code ActionScript dans une application
Débogage du code ActionScript 3.0
Verrouillage des scripts dans le panneau Actions
Écriture et gestion des scripts
Écriture et gestion des scripts
Débogage du code ActionScript 3.0
Importation et exportation de scripts
Formatage du code
Utilisation des conseils de code
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
86
Pratiques recommandées – Recommandations sur l’accessibilité
À propos des recommandations sur l’accessibilité
Création de sites accessibles
Exposition de la structure d’un fichier SWF et navigation
Contrôle des descriptions et de la répétition
Utilisation de la couleur
Mise en ordre, tabulation et clavier
Traitement du son, de la vidéo et de l’animation
Accessibilité et extension d’Animate
Test des fichiers et modifications
Haut de la page
À propos des recommandations sur l’accessibilité
Les logiciels de lecture d’écran sont complexes et vous pouvez aisément vous heurter à des résultats
imprévus dans des fichiers FLA conçus avec de tels logiciels. Il s’agit de programmes utilisés par les
malvoyants pour lire des sites Web vocalement. Le texte est lu à haute voix à l’aide de programmes
spécialement conçus à cet effet. Un logiciel de lecture d’écran ne peut qu’interpréter un contenu textuel.
Cependant, lorsque vous fournissez toute autre description pour l’ensemble du fichier SWF, les clips, les
images ou tout autre contenu graphique seront également prononcés. Vous devez écrire des descriptions
pour les images et les animations importantes pour que le logiciel de lecture d’écran soit également en
mesure d’interpréter ces ressources dans votre fichier SWF. C’est le fichier SWF équivalent au texte alt dans
une page Web HTML.
Remarque : Les applications Animate doivent être visualisées à l’aide de Microsoft Internet Explorer sous
Windows, car la prise en charge de Microsoft Active Accessibility (MSAA) est limitée à ce navigateur.
Flash Player utilise Microsoft Active Accessibility (MSAA) pour présenter le contenu Animate aux logiciels de
lecture d’écran. MSAA est une technologie qui repose sur Windows et qui fournit une plate-forme normalisée
pour l’échange d’informations entre technologies d’aide, telles que logiciels de lecture d’écran et autres
applications. Des événements (tels qu’une modification dans l’application) et des objets sont rendus visibles à
l’écran à l’aide de MSAA.
Remarque : Flash Player 7 (et versions ultérieures) ne fonctionnent pas avec toutes les technologies d’aide.
Le logiciel tiers doit être en mesure de traiter les informations fournies par MSAA.
Haut de la page
Création de sites accessibles
Pour qu’un site Web soit accessible, il est nécessaire de faire intervenir plusieurs critères :
Présenter des informations aux logiciels de lecture d’écran
et rendre les textes et les images compréhensibles Certains visiteurs pourraient éprouver des difficultés
à lire de petits caractères ou de distinguer de petits graphiques. Donnez la possibilité aux utilisateurs
d’effectuer des zooms avant sur ces éléments à l’aide de graphiques vectoriels dimensionnables dans les
fichiers SWF.
87
Fournir une narration vocale Pensez à fournir une narration vocale pour les visiteurs sans logiciel de
lecture d’écran ou pour le cas où ces logiciels ne fonctionneraient pas, par exemple avec un contenu vidéo.
Fournir des légendes pour les narrations vocales Certains visiteurs pourraient ne pas être en mesure
d’entendre une narration vocale pour votre site ou sur une vidéo. Pensez à fournir des légendes à ces
visiteurs.
Vous ne devez pas dépendre de la couleur pour la transmission de vos informations De nombreux
visiteurs pourraient être daltoniens. Si vous comptez sur la couleur pour communiquer des informations
(telles que : Cliquer sur le bouton vert pour aller à la page 1, cliquer sur le bouton rouge pour aller à la
page 2), fournissez des équivalents vocaux ou texte.
Historiquement, de nombreuses présentations en ligne (telles que les vidéos) fournissent des moyens
différents pour permettre aux visiteurs malvoyants d’accéder au contenu, par exemple, la description textuelle
d’une vidéo. Cependant, Animate fournit des informations textuelles directement au logiciel de lecture
d’écran. Bien que ceci signifie le plus souvent que vous devez changer vos paramètres ou votre code
ActionScript dans un fichier FLA, vous ne devez pas créer une version distincte.
Certaines parties de votre fichier SWF peuvent être présentées aux logiciels de lecture d’écran. Des
éléments de texte (tels que les champs de texte, les textes statique et dynamique), des boutons, des clips,
des composants et le fichier SWF entier peuvent être interprétés par des logiciels de lecture d’écran
compatibles avec MSA.
Vous pouvez trouver des recommandations sur l’accessibilité des informations pour les personnes souffrant
de handicaps dans la Section 508 de la législation des États-Unis. Cette section aborde spécifiquement la
nécessité pour les sites Web d’être accessibles de différentes manières. Certains sites Web, y compris tous
les sites fédéraux, doivent suivre ces recommandations. Si un fichier SWF ne communique pas la totalité des
informations au logiciel de lecture d’écran, il n’est plus compatible avec la Section 508. Pour plus
d’informations, voir le site Web de la Section 508.
De nombreux États ont édicté des marches à suivre pour créer des sites Web accessibles ou bien suivent les
recommandations établies par d’autres organisations. Pour plus d’informations sur l’accessibilité et les
normes sur le Web, voir le site Web World Wide Web Consortium (W3C) Web Accessibility Initiative. Ces
normes et recommandations décrivent les éléments à respecter quand vous créez des sites Web accessibles
avec du code HTML. Une partie de ces informations s’applique à Animate.
Haut de la page
Exposition de la structure d’un fichier SWF et navigation
Les logiciels de lecture d’écran peuvent éprouver des difficultés à interpréter l’agencement de la page et la
navigation dans cette page en raison de la complexité créée par la nature visuelle de certains fichiers SWF.
Vous devez fournir une description globale du fichier SWF pour communiquer les informations concernant sa
structure et expliquer de quelle façon naviguer à travers la structure du site. Vous pouvez fournir cette
description en cliquant sur la scène et en saisissant une description dans le panneau Accessibilité. Vous
pouvez également créer une zone distincte du site pour fournir une description ou une vue d’ensemble.
Remarque : si vous saisissez une description pour le fichier SWF principal, cette description est lue à
chaque mise à jour du fichier SWF. Vous pouvez éviter cette redondance par la création d’une page
d’informations distincte.
Vous pouvez informer l’utilisateur des modifications survenues dans les éléments de navigation dans le fichier
SWF. Si un bouton supplémentaire est introduit ou si le libellé du bouton est modifié, cette modification est
prononcée par le logiciel de lecture d’écran. Flash Player 7 (et les versions ultérieures) prennent en charge la
mise à jour de ces propriétés à l’aide du code ActionScript. Vous pouvez mettre à jour les informations
d’accessibilité dans vos applications si le contenu est modifié à l’exécution.
Haut de la page
Contrôle des descriptions et de la répétition
Concepteurs et développeurs peuvent affecter des descriptions aux animations, aux images et aux
graphiques dans un fichier SWF. Vous devez attribuer des noms aux graphiques pour que le logiciel de
88
lecture d’écran puisse les interpréter. Si un graphique ou une animation ne communique pas d’informations
vitales au fichier SWF, (peut-être qu’il est décoratif ou répétitif), ou si encore vous avez souligné l’élément
dans la description globale du fichier SWF, vous ne devez pas fournir de description distincte pour cet
élément. Les descriptions inutiles peuvent s’avérer déroutantes pour les utilisateurs qui utilisent des logiciels
de lecture d’écran.
Remarque : si vous scindez le texte ou si vous le remplacez par des images dans vos fichiers SWF, vous
devez fournir soit un nom, soit une description pour ces éléments.
Si vous disposez de plusieurs clips imbriqués dans un but unique ou pour communiquer une idée spécifique,
assurez-vous de procéder comme suit :
Groupez tous les éléments dans votre fichier SWF.
Fournissez une description pour le clip parent.
Rendez inaccessibles tous les clips enfant.
Vous devez suivre ces recommandations scrupuleusement, sinon le logiciel de lecture
d’écran tente de décrire tous les clips imbriqués non pertinents, ce qui a pour effet de
dérouter l’utilisateur et pourrait le conduire à quitter votre site Web. Vous devez prendre
cette décision toutes les fois que vous avez plus d’un objet (plusieurs clips, par exemple)
dans un fichier SWF. Si une seule description suffit à transmettre un message global,
vous devez fournir une description pour l’un de ces objets et rendre tous les autres
inaccessibles au logiciel de lecture d’écran.
Des fichiers SWF et des applications en boucle obligent les logiciels de lecture d’écran à
actualiser constamment parce que le logiciel de lecture d’écran détecte un nouveau
contenu sur la page. Comme le logiciel pense que le contenu est mis à jour, il revient au
haut de la page Web et relit le contenu. Vous devez rendre inaccessibles aux logiciels de
lecture d’écran tous les objets en boucle ou actualisés qui n’ont pas besoin d’être relus.
Remarque : Vous ne devez pas introduire de description dans le champ Description du
panneau Accessibilité pour des occurrences (telles que du texte) que le logiciel de lecture
d’écran prononce.
Haut de la page
Utilisation de la couleur
Vous devez prendre des décisions à propos de l’utilisation de couleurs dans un fichier accessible. Vous ne
devez pas compter sur la seule couleur pour communiquer des informations particulières ou des directives
aux utilisateurs. Un utilisateur daltonien ne peut pas exploiter une page si on lui demande de cliquer sur la
zone bleue pour ouvrir une nouvelle page ou sur la zone rouge pour écouter de la musique. Vous devez
proposer des équivalents texte sur la page ou dans une autre version pour rendre votre site accessible. Vous
devez vérifier également qu’il existe un contraste significatif entre les couleurs au premier plan et celles en
arrière-plan pour améliorer la lisibilité. Si vous placez du texte d’un gris léger sur un fond blanc, les
utilisateurs auront des difficultés à le lire. De la même façon, un texte avec de petits caractères s’avère
difficile à lire pour de nombreux visiteurs. Un texte redimensionnable, avec de grands caractères ou avec un
contraste accentué convient à la plupart des utilisateurs, même ceux qui ne sont pas handicapés.
Haut de la page
Mise en ordre, tabulation et clavier
Séquence de lecture et tabulation sont des considérations importantes pour rendre les sites Web Animate
accessibles. Lorsque vous développez une interface, l’ordre dans lequel elle apparaît à l’écran peut ne pas
correspondre à celui dans lequel le logiciel de lecture d’écran décrit chaque occurrence. Vous pouvez
contrôler et tester la séquence de lecture, de même que contrôler la tabulation dans le fichier SWF.
Contrôle de la séquence de lecture
89
La séquence de lecture par défaut n’est pas prévisible et ne correspond pas toujours au placement de vos
ressources ni au découpage visuel de la page. Vous pouvez aider à créer une séquence de lecture logique
sans utiliser du code ActionScript si le découpage de la page est simple. Cependant, vous avez davantage
de contrôle sur la séquence de lecture si vous utilisez du code ActionScript et testez cette séquence dans
vos fichiers SWF.
Remarque : vous ne devez pas manquer la moindre occurrence dans votre mise en séquence dans le
fichier SWF, faute de quoi la séquence de lecture revient à celle par défaut (qui est imprévisible).
Contrôle de la tabulation et du contenu
Les visiteurs qui comptent sur les logiciels de lecture d’écran pour décrire le contenu d’un site utilisent le plus
souvent la tabulation et le clavier pour naviguer dans le système d’exploitation et les pages Web, puisque la
souris ne convient pas lorsque l’écran ne peut être vu. Utilisez la commande tabIndex et tabEnabled
avec le clip, le bouton, le champ de texte ou des occurrences de composants pour proposer des contrôles
par tabulation intelligents dans les fichiers SWF accessibles. Outre la tabulation, vous pouvez utiliser toutes
les actions liées aux touches du clavier pour naviguer dans le fichier SWF, mais vous devez communiquer
ces informations à l’aide du panneau Accessibilité. Utilisez la classe Key dans le code ActionScript pour
ajouter des scripts pour les touches au fichier SWF. Sélectionnez l’objet pour lequel vous voulez utiliser le
script touche et ajoutez la clé de raccourci dans le champ Raccourci dans le panneau Accessibilité. Ajoutez
des raccourcis clavier aux boutons essentiels et fréquemment utilisés de votre fichier SWF.
Remarque : Dans ActionScript 3.0, tabIndex et tabEnabled sont des propriétés de la classe
InteractiveObject. Dans ActionScript 2.0, ils ne nécessitent pas une référence de classe.
Remarque : veillez à éviter les boutons invisibles dans les fichiers SWF accessibles car les logiciels de
lecture d’écran ne les reconnaissent pas. (Les boutons invisibles sont ceux pour lesquels vous définissez
seulement une zone de pertinence, la région cliquable, pour le bouton.)
Nombreux sont les fichiers SWF qui débitent une succession rapide d’informations et les logiciels de lecture
d’écran ne sont le plus souvent pas en mesure de suivre le rythme le plus souvent. Fournissez donc des
contrôles au fichier SWF qui permettent à l’utilisateur de naviguer dans le fichier à son propre rythme et de
faire une pause le cas échéant, à l’aide de boutons.
Haut de la page
Traitement du son, de la vidéo et de l’animation
Quand vous fournissez des narrations vocales ou des vidéos sonorisées, fournissez des légendes pour les
malentendants. Vous pouvez utiliser des champs de texte dans Animate, importer des vidéos qui contiennent
des légendes ou même utiliser un fichier de légendes XML. Vous pouvez utiliser des repères vidéo pour
spécifier à quel moment un champ de texte devrait mettre à jour les informations sous forme de texte lors de
l’exécution.
Pour plus d’informations sur l’utilisation de Hi-Caption SE et du composant Hi-Caption Viewer, reportez-à la
page Adobe Add-ons. Parmi d’autres contrôles avancés, cette extension tierce vous permet de créer des
légendes que vous pouvez sauvegarder dans un fichier XML et charger dans un fichier SWF lors de
l’exécution. Autrement, vous pouvez utiliser des repères et un champ de texte pour afficher des informations
sous forme de légendes.
Haut de la page
Accessibilité et extension d’Animate
Avec la couche d’extensibilité d’Animate, les développeurs peuvent créer des extensions qui permettent une
création avancée. Ceci permet à des entreprises tierces de développer des extensions qui impliquent
l’accessibilité. Vous disposez de plusieurs options pour valider vos fichiers SWF ou pour ajouter des
légendes.
Par exemple, un outil de validation peut analyser votre fichier SWF pour déceler des descriptions
manquantes. Il contrôle si une description a été ajoutée à un groupe d’occurrences ou si un texte dispose
d’une étiquette pour l’occurrence et vous prévient des anomalies. Cet outil analyse aussi la séquence de
90
lecture dans votre fichier SWF et repère toutes les occurrences qui doivent être spécifiées. Vous pouvez
spécifier une séquence de lecture à l’aide d’une boîte de dialogue après l’analyse du fichier SWF.
Pour plus d’informations sur les extensions tierces disponibles actuellement, reportez-à la page Adobe Addons.
Haut de la page
Test des fichiers et modifications
Testez tout fichier SWF appelé à être utilisé avec des logiciels de lecture d’écran. Testez vos fichiers SWF à
chaque nouvelle version de Flash Player, y compris lorsqu’il ne s’agit que de mises à jour mineures. Vous
pouvez utiliser les scénarios suivants :
Utilisez les logiciels de lecture d’écran Window-Eyes et JAWS pour Windows, qui traitent
les fichiers SWF différemment, de sorte que vous pourriez obtenir des résultats différents.
Dans un navigateur sans logiciel de lecture d’écran, naviguez dans votre site sans utiliser
la souris.
Désactivez votre écran et utilisez uniquement le logiciel de lecture d’écran pour naviguer
dans votre site Web.
Si vous utilisez une narration vocale, testez votre site sans haut-parleurs.
Avec plusieurs utilisateurs représentatifs des visiteurs cibles de votre site Web.
Remarque : vous n’avez pas besoin de tester plusieurs navigateurs car la technologie utilisée pour
présenter les fichiers SWF aux logiciels de lecture d’écran (MSAA) ne prend en charge qu’Internet Explorer
sous Windows.
Lors de l’écoute de votre fichier SWF à l’aide d’un logiciel de lecture d’écran, vérifiez les points suivants :
La séquence de lecture est-elle correcte ?
Disposez-vous de descriptions pour les raccourcis dans votre fichier SWF ?
Disposez-vous de descriptions complètes et appropriées pour les éléments dans
l’interface ?
Disposez-vous de descriptions adéquates pour la navigation dans la structure du site ?
Le contenu du fichier SWF est-il lu quand il est mis à jour ou actualisé ?
Si vous modifiez le contexte d’un élément quelconque sur la scène (par exemple, un
bouton qui passe de Lecture à Pause), le logiciel de lecture d’écran vous fait-il part de
cette modification ?
Il n’existe pas d’outil officiel pour la validation de fichiers SWF, contrairement à la
validation du code HTML. Cependant, quelques outils tiers existent pour vous aider à
valider le fichier. Pour plus d’informations sur les extensions tierces disponibles
actuellement, reportez-à la page Adobe Add-ons.
Adobe recommande également :
Création d’accessibilité avec ActionScript
Utilisation d’Animate pour saisir des informations d’accessibilité pour les logiciels de lecture d’écran
Accessibilité pour les utilisateurs malentendants
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
91
Accessibilité dans l’espace de travail Animate
À propos de la prise en charge de l’accessibilité
Sélection de commandes dans un panneau à l'aide de raccourcis clavier
Navigation dans les commandes d'une boîte de dialogue à l’aide de raccourcis clavier
Sélection de la scène ou d’objets de la scène à l’aide de raccourcis clavier
Navigation dans les contrôles d’arborescence à l’aide des raccourcis clavier
Utilisation des éléments de la bibliothèque à l’aide des raccourcis clavier
L’espace de travail d’Adobe Animate CC (anciennement Flash Professional CC) est accessible par le clavier
pour les utilisateurs qui éprouvent des difficultés à manipuler la souris.
Remarque : l’Aide complète actualisée est disponible sur Internet. L’application n’a pas détecté de
connexion Internet. Pour consulter la version complète de cette rubrique, cliquez sur le lien ci-dessous ou
effectuez une recherche dans l’aide d’Animate CC.
L’espace de travail d’Adobe Animate est accessible par le clavier pour les utilisateurs qui éprouvent des
difficultés à manipuler la souris.
Pour en savoir plus sur la navigation dans l’interface utilisateur sans souris, consultez la section consacrée à
l’accessibilité de l’espace de travail d’Animate dans l’Aide en ligne.
Haut de la page
À propos de la prise en charge de l’accessibilité
Les fonctions d’accessibilité dans l’environnement auteur proposent des raccourcis clavier destinés à la
navigation et à l’utilisation des contrôles d’interface comme les panneaux, l’inspecteur des propriétés, les
boîtes de dialogue, la scène et les objets de la scène. Vous pouvez ainsi vous servir de ces éléments de
l’interface sans avoir à utiliser votre souris.
Remarque : certaines fonctions d’accessibilité de contrôle de clavier et d’environnement auteur ne sont
disponibles que sous Windows.
Vous pouvez personnaliser les raccourcis clavier d’accessibilité de l’environnement auteur dans la section
Commandes d’accessibilité de l’espace de travail de la boîte de dialogue Raccourcis clavier.
Pour masquer tous les panneaux et l’inspecteur des propriétés, appuyez sur F4. Pour
afficher tous les panneaux et l’inspecteur des propriétés, appuyez à nouveau sur F4.
Haut de la page
Sélection de commandes dans un panneau à l'aide de raccourcis
clavier
Vous pouvez utiliser la touche de tabulation pour déplacer le focus dans les commandes du panneau
lorsqu’un panneau ou l’inspecteur des propriétés a le focus en cours. Utilisez la barre d’espace pour activer
un menu possédant actuellement le focus (appuyer sur la barre d’espace revient à cliquer sur un menu dans
le panneau). Animate ne prend pas en charge le déplacement d’un panneau à un autre à l’aide de la touche
de tabulation.
92
Lorsque vous utilisez un raccourci clavier pour les contrôles du panneau, un focus est appliqué à un contrôle.
Celui-ci est activé d’après les critères suivants :
Le panneau avec le focus en cours doit être développé pour sélectionner un contrôle
dans le panneau avec la touche de tabulation. Si le panneau est réduit, la touche Tab n’a
aucun effet.
Appuyez sur la barre d'espace pour afficher les éléments du menu Panneau lorsque le
menu Panneau dispose du focus.
Déplacez le focus vers le contrôle du panneau uniquement si celui-ci est actif. Si un
contrôle est grisé (inactif), vous ne pouvez pas lui appliquer de focus.
Déplacement du focus parmi les éléments du menu Panneau d’un panneau
1. Pour afficher les éléments du menu Panneau lorsque le focus est actuellement sur le
menu Panneau, appuyez sur la barre d’espace.
2. Appuyez sur la flèche vers le bas pour vous déplacer dans les éléments du menu
Panneau.
3. Pour activer l’élément du menu Panneau sélectionné actuellement, appuyez sur la
touche Entrée (Windows) ou Retour (Macintosh).
Déplacement du focus vers les contrôles d’un panneau
1. Appuyez sur la touche de tabulation lorsque le focus est appliqué au menu Panneau.
Appuyez à plusieurs reprises sur la touche de tabulation afin de déplacer le focus vers
les contrôles du panneau.
2. Pour activer le menu actuellement sélectionné dans un panneau, appuyez sur la touche
Entrée ou Retour.
3. Pour modifier une valeur numérique d'un texte réactif, tapez le numéro et appuyez sur la
touche Entrée ou Retour.
Haut de la page
Navigation dans les commandes d'une boîte de dialogue à l’aide de
raccourcis clavier
Appuyez sur la touche de tabulation pour passer d’un contrôle à l’autre dans la boîte de
dialogue.
Pour parcourir les contrôles d’une section d’une boîte de dialogue, appuyez sur les
flèches vers le haut et vers le bas.
Pour activer le bouton (ce qui est équivalent à un clic sur le bouton), lorsque le focus est
appliqué à un bouton de contrôle de la boîte de dialogue, appuyez sur Entrée.
Pour appliquer les paramètres courants et fermer la boîte de dialogue (ce qui est
équivalent à cliquer sur OK), lorsque le focus n’est pas appliqué à un bouton de contrôle
de la boîte de dialogue, appuyez sur Entrée.
Appuyez sur Échap pour fermer la boîte de dialogue sans appliquer les changements
(cette action revient à cliquer sur Annuler).
Lorsque le focus est appliqué au bouton Aide, appuyez sur Entrée ou sur la barre
d’espace pour afficher le contenu de l’aide pour cette boîte de dialogue (cette action
revient à cliquer sur Aide).
Haut de la page
93
Sélection de la scène ou d’objets de la scène à l’aide de raccourcis
clavier
Utiliser un raccourci clavier pour sélectionner la scène revient à cliquer sur la scène.
Une fois que la scène est sélectionnée, vous pouvez utiliser la touche de tabulation pour passer
simultanément d’un objet à l’autre sur tous les calques. Vous pouvez sélectionner des occurrences (symboles
graphiques, boutons, clips vidéo, bitmaps, vidéos ou sons), des groupes ou des zones de texte. Vous ne
pouvez pas sélectionner de formes (ex. : des rectangles) à moins qu’elles soient des occurrences de
symboles. Vous ne pouvez pas sélectionner plus d’un objet à la fois avec un raccourci clavier.
Pour sélectionner des objets sur la scène, utilisez les techniques suivantes :
Appuyez sur Tab pour sélectionner un objet sur la scène, la scène étant sélectionnée.
Appuyez sur Maj+Tab pour sélectionner l’objet précédent lorsqu’un objet est actuellement
sélectionné.
Appuyez sur Tab pour sélectionner le premier objet créé dans l’image active du calque
actif. Lorsque le dernier objet du calque principal est sélectionné, appuyez sur Tab pour
passer au calque inférieur et y sélectionner le premier objet, et ainsi de suite.
Lorsque le dernier objet du dernier calque est sélectionné, appuyez sur la touche de
tabulation pour passer à l’image suivante et sélectionner le premier objet sur le calque
principal.
Les objets masqués ou verrouillés ne peuvent pas être sélectionnés avec la touche Tab.
Remarque : si vous saisissez du texte dans une zone de texte, vous ne pouvez pas sélectionner d’objet à
l’aide du focus clavier. Vous devez tout d'abord appuyer sur la touche Échap, puis sélectionner un objet.
Haut de la page
Navigation dans les contrôles d’arborescence à l’aide des
raccourcis clavier
Pour parcourir les structures arborescentes, l’affichage hiérarchique des structures de fichiers dans certains
panneaux d’Animate, utilisez les raccourcis clavier.
Pour développer un dossier réduit, sélectionnez-le et appuyez sur la flèche vers la droite.
Pour réduire un dossier développé, sélectionnez-le et appuyez sur la flèche vers la
gauche.
Pour aller au dossier parent d’un dossier développé, appuyez sur la flèche vers la
gauche.
Pour aller au dossier enfant d’un dossier développé, appuyez sur la flèche vers la droite.
Haut de la page
Utilisation des éléments de la bibliothèque à l’aide des raccourcis
clavier
1. Pour copier ou coller un élément sélectionné, appuyez sur les touches Ctrl+X (Windows)
ou Commande+X (Macintosh) pour le couper, ou Ctrl+C (Windows) ou Commande+C
(Macintosh) pour le copier.
2. Pour coller un élément coupé ou copié, cliquez sur la scène ou dans une autre
bibliothèque pour définir le point d’insertion. Appuyez ensuite sur Ctrl+V (Windows) ou
Commande+V (Macintosh) pour le coller au centre de la scène. Appuyez sur Ctrl+Maj+V
(Windows) ou Commande+Maj+V (Macintosh) pour le coller à son emplacement
d’origine.
94
Pour couper, copier et coller des éléments, utilisez les techniques suivantes :
Vous pouvez couper ou copier un ou plusieurs éléments.
Vous pouvez couper ou copier un élément de la bibliothèque et le coller dans la
scène ou dans une autre bibliothèque. Vous pouvez également coller un dossier
dans une autre bibliothèque.
Vous ne pouvez pas coller de forme dans la bibliothèque à partir de la scène.
Vous ne pouvez pas coller d’élément de la bibliothèque dans une bibliothèque
commune car ces dernières ne peuvent être modifiées. Cependant, vous pouvez
créer une bibliothèque commune.
Lorsque vous collez un élément d’une bibliothèque dans la scène, cet élément est
centré.
Si vous collez un dossier, chaque élément du dossier est inclus.
Pour coller un élément d’une bibliothèque dans un dossier de la bibliothèque de
destination, cliquez sur le dossier avant de le coller.
Vous pouvez coller un élément d’une bibliothèque vers un emplacement différent de
la même bibliothèque d’origine.
Si vous essayez de coller un élément d’une bibliothèque dans un emplacement
contenant un autre élément du même nom, vous pouvez choisir de le remplacer ou
non.
Adobe recommande également :
Raccourcis clavier d’Animate
Utilisation de bibliothèques communes
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
95
Écriture et gestion des scripts
Formatage du code
Mise en commentaire de parties du code
Utilisation de la coloration de la syntaxe
Utilisation de la liste des identifiants et des mots-clés à l’exécution
Utilisation des numéros de ligne et du retour à la ligne
Affichage des caractères masqués
Recherche de texte dans un script
(Abandonné dans Animate CC) Vérification de la syntaxe et de la ponctuation
(Abandonné dans Animate CC) Importation et exportation de scripts
(Abandonné dans Animate CC) Codage des scripts importés et exportés
Verrouillage des scripts dans le panneau Actions
Insertion de chemins cible
Utilisation des conseils de code
Haut de la page
Formatage du code
Votre code peut être formaté et mis en retrait automatiquement lors de la saisie. Si vous utilisez le mappage
de police dynamique, vous êtes assuré que les polices appropriées seront choisies pour le texte multilingue.
Définition des options de format automatique
1. Effectuez l’une des opérations suivantes :
Dans le menu du panneau
sélectionnez Préférences.
(dans le coin supérieur droit du panneau Actions),
Dans la fenêtre de script, sélectionnez Modifier > Préférences (Windows) ou
Animate > Préférences (Macintosh).
2. Dans la boîte de dialogue Préférences, sélectionnez Format automatique.
3. Faites votre choix parmi les options de format automatique proposées.
Après la définition des options de formatage automatique, vos paramètres s’appliquent
systématiquement au code que vous rédigez, mais pas au code déjà existant. Vous
devrez les appliquer manuellement à ce dernier.
Formatage du code selon les paramètres de Format automatique
Cliquez sur Format automatique
fenêtre de script.
dans la barre d’outils du panneau Actions ou de la
Dans le menu du panneau (dans le coin supérieur droit du panneau Actions),
sélectionnez Formatage automatique.
Appuyez sur Ctrl+Maj+F1 (Windows) ou sur Commande+Maj+F1 (Macintosh).
96
Dans la fenêtre de script, choisissez Outils > Format automatique.
Utilisation du mappage de police dynamique
Pour activer ou désactiver cette fonction, sélectionnez ou désélectionnez Utiliser le
mappage de police dynamique dans la boîte de dialogue Préférences.
Le mappage de police dynamique est désactivé par défaut, car il ralentit les
performances pendant la programmation. Si vous travaillez sur du texte en plusieurs
langues, activez le mappage dynamique de polices pour vous assurer que des polices
appropriées sont utilisées.
Utilisation de l’indentation automatique
Pour activer ou désactiver cette fonction, sélectionnez ou désélectionnez Indentation
automatique dans la boîte de dialogue Préférences.
Lorsque l’indentation automatique est activée, le texte saisi après une parenthèse
ouvrante ( ou une accolade ouvrante { est automatiquement mis en retrait conformément
à la valeur de taille des tabulations définie dans les préférences d’ActionScript.
Pour mettre une ligne en retrait dans vos scripts, sélectionnez-la, puis appuyez sur la
touche de tabulation. Pour supprimer l’indentation, sélectionnez la ligne concernée, puis
appuyez sur les touches Maj+Tab.
Haut de la page
Mise en commentaire de parties du code
Les commentaires sont les parties du code que le compilateur d’ActionScript ignore. Une ligne de
commentaire explique ce que fait votre code ou désactive temporairement le code que vous ne voulez pas
supprimer définitivement. Pour commenter une ligne de code, faites-la commencer par une double barre
oblique (//). Le compilateur ignorera tout le texte qui suit la double barre oblique. Vous pouvez également
transformer en commentaires de grands blocs de code en plaçant une barre oblique et un astérisque (/*) au
début du bloc et un astérisque et une barre oblique (*/) à sa fin.
Vous pouvez saisir ces marqueurs de commentaires manuellement ou utiliser des boutons situés en haut du
panneau Actions ou de la fenêtre de script pour les ajouter.
Mise en commentaire d’une ligne de code
1. Placez le point d’insertion au début de la ligne de code ou au niveau du caractère où doit
commencer le commentaire.
2. Cliquez avec le bouton droit de la souris et choisissez Commentaire. Vous pouvez
également utiliser les raccourcis clavier Ctrl + M (Windows) ou Commande + M, ou
cliquer sur Modifier > Commenter la sélection.
Une double barre oblique (//) est placée au niveau du point d’insertion.
Mise en commentaire de plusieurs lignes de code
1. Sélectionnez les lignes à transformer en commentaires. (La première et la dernière
peuvent n’être que des portions de ligne.)
2. Cliquez avec le bouton droit de la souris et choisissez Commentaire. Vous pouvez
également utiliser les raccourcis clavier Ctrl + M (Windows) ou Commande + M, ou
cliquer sur Modifier > Commenter la sélection.
97
Les caractères de bloc de commentaires sont placés au début (/*) et à la fin (*/) de la sélection.
Remarque : s’il existe des commentaires entre les lignes de texte sélectionnées, un commentaire de ligne
est appliqué sur toutes les lignes sélectionnées.
Suppression d’un commentaire
1. Placez le point d’insertion dans la ligne qui contient le commentaire ou sélectionnez le
bloc de code qui est commenté.
2. Cliquez avec le bouton droit de la souris et choisissez Supprimer le commentaire. Vous
pouvez également utiliser les raccourcis clavier Ctrl + Maj + M (Windows) ou Commande
+ Maj + M, ou cliquer sur Modifier > Commenter la sélection.
Haut de la page
Utilisation de la coloration de la syntaxe
Dans ActionScript, comme dans tout autre langage, la syntaxe est la manière dont les éléments de code sont
assemblés en ordre logique. Vos scripts ne fonctionneront pas si vous utilisez une syntaxe ActionScript
incorrecte.
Pour mettre en évidence les erreurs de syntaxe, définissez un code couleur pour des parties de vos scripts.
Par exemple, supposons que vous ayez défini vos préférences de coloration de la syntaxe de sorte que les
mots-clés apparaissent en bleu. Lorsque vous tapez var, le mot var apparaît en bleu. Toutefois, si vous
tapez vae par inadvertance, le mot vae restera en noir, ce qui indique que vous avez fait une faute de
frappe.
Effectuez l’une des opérations suivantes :
Sélectionnez Modifier > Préférences (Windows) ou Animate > Préférences (Macintosh),
puis cliquez sur Éditeur de code dans la liste des catégories et spécifiez les paramètres
de coloration de la syntaxe.
Lorsque le point d’insertion se trouve dans la fenêtre de script, appuyez sur Ctrl-U
(Windows) ou Commande-U (Macintosh).
Remarque : lorsque vous rédigez des scripts dans le panneau Actions, les commandes qui ne sont pas
prises en charge par la version du lecteur que vous ciblez apparaissent en jaune dans la boîte à outils
Actions. Par exemple, si la version Flash Player du fichier SWF est définie sur Flash 7, le code ActionScript
qui n’est pris en charge que par Flash Player 8 apparaît en jaune dans la boîte à outils Actions.
Haut de la page
Utilisation de la liste des identifiants et des mots-clés à l’exécution
Au démarrage d’Animate, les listes d’identifiants et de mots-clés sont lues depuis le fichier de ressources,
puis mises en cache. En plus de lire les listes par défaut de la ressource, l’application recherche également
les listes de mots-clés et d’identifiants supplémentaires dans le dossier Préférence. Vous pouvez ajouter
d’autres mots-clés et identifiants en ajoutant « .txt files » dans les dossiers suivants :
C:\Users\<nom
d’utilisateur>[AppData]\Roaming\Adobe\Animate\13.0[ActionscriptKeywords]\
C:\Users\<nom
d’utilisateur>[AppData]\Roaming\Adobe\Animate\13.0[ActionscriptIdentifiers]\
C:\Users\<nom
d’utilisateur>[AppData]\Roaming\Adobe\Animate\13.0[JavascriptKeywords]\
C:\Users\<nom
98
d’utilisateur>[AppData]\Roaming\Adobe\Animate\13.0[JavascriptIdentifiers]\
Haut de la page
Utilisation des numéros de ligne et du retour à la ligne
Lorsque vous éditez ou modifiez du code, les numéros de ligne facilitent le parcours et l’analyse du code. Le
retour à la ligne automatique évite d’avoir à parcourir de longues lignes de code (en particulier lorsque vous
travaillez dans l’environnement de création ou avec des résolutions d’écran restreintes).
Activation ou désactivation des numéros de ligne
Dans la fenêtre Script, choisissez Afficher > Numéros de ligne.
Appuyez sur Ctrl+Maj+L (Windows) ou sur Commande+Maj+L (Macintosh).
Mise en évidence d’une ligne
Dans la fenêtre de script, choisissez Modifier > Atteindre la ligne.
Activation ou désactivation du retour à la ligne automatique
Dans la fenêtre Script, choisissez Afficher > Retour à la ligne.
Appuyez sur Ctrl+Maj+W (Windows) ou sur Commande+Maj+W (Macintosh).
Haut de la page
Affichage des caractères masqués
Les caractères tels que les espaces, les tabulations et les sauts de ligne sont masqués dans le code
ActionScript. Il peut être nécessaire d’afficher ces caractères par exemple lorsque vous devez rechercher et
supprimer les espaces sur deux octets qui ne font pas partie de la valeur d’une chaîne, car ils provoquent
des erreurs à la compilation.
Appuyez sur Ctrl+Maj+8 (Windows) ou sur Commande+Maj+8 (Macintosh).
Les symboles suivants sont utilisés pour afficher les caractères masqués.
Caractère masqué
Symbole
Espace sur un octet
.
Espace sur deux octets
l
Tabulation
>>
Saut de ligne
99
Haut de la page
Recherche de texte dans un script
L’outil Rechercher permet de localiser et de remplacer des chaînes de texte dans vos scripts.
Remarque : pour faire porter la recherche sur l’ensemble des scripts d’un document Animate, utilisez
l’Explorateur d’animations.
Recherche d’un texte
1. Dans la barre d’outils du panneau Actions ou de la fenêtre de script, cliquez sur
ou appuyez sur Ctrl+F (Windows) ou Commande+F (Macintosh).
Rechercher
2. Saisissez la chaîne à rechercher.
3. Cliquez sur Rechercher le suivant.
Recherche et remplacement d’un texte dans un script
1. Dans la barre d’outils du panneau Actions ou de la fenêtre de script, cliquez sur
ou appuyez sur Ctrl+F (Windows) ou Commande+F (Macintosh).
Rechercher
2. Saisissez la chaîne à rechercher.
3. Dans le champ Remplacer, entrez la nouvelle chaîne.
4. Cliquez sur Rechercher le suivant.
5. Pour remplacer la chaîne, cliquez sur Remplacer. Pour remplacer toutes les occurrences
de la chaîne, cliquez sur Remplacer tout.
(Abandonné dans Animate CC) Répétition d’une recherche dans le panneau
Actions
Dans le menu du panneau
(dans le coin supérieur droit du panneau Actions),
sélectionnez Rechercher à nouveau.
(Abandonné dans Animate CC) Répétition d’une recherche dans la fenêtre
Script
Sélectionnez Modifier > Rechercher à nouveau.
Haut de la page
(Abandonné dans Animate CC) Vérification de la syntaxe et de la
ponctuation
Vous pouvez effectuer une vérification rapide de votre code ActionScript sans publier le fichier FLA.
La syntaxe est vérifiée dans le script en cours d’édition. Lorsque le script appelle des classes ActionScript,
ces dernières sont également vérifiées. D’autres scripts pouvant figurer dans le fichier FLA ne sont pas
vérifiés.
Dans le cas de fichiers ActionScript 2.0, l’option Vérifier la syntaxe exécute le code via le compilateur, en
générant les erreurs de syntaxe et de compilation.
Dans le cas de fichiers ActionScript 3.0, l’option Vérifier la syntaxe ne génère que les erreurs de syntaxe.
100
Pour générer des erreurs de compilation, par exemple des incompatibilités de type, des valeurs de renvoi
incorrectes et des fautes d’orthographe dans le nom de variables ou de méthodes, vous devez utiliser la
commande Contrôle > Tester.
Vérification de la syntaxe
Pour vérifier la syntaxe, effectuez l’une des opérations suivantes :
Cliquez sur Vérifier la syntaxe
dans le panneau Actions ou la fenêtre de script.
Cliquez dans la fenêtre de script, puis appuyez sur Ctrl+T (Windows) ou sur
Commande+T (Macintosh). Cliquez sur la fenêtre de script pour lui donner le focus. Si un
objet sur la scène dispose du focus, c’est le panneau Transformer qui s’ouvre.
Les erreurs de syntaxe apparaissent dans le panneau Erreurs de compilation.
Remarque : pour un fichier de classe ActionScript externe ouvert dans la fenêtre Script, le chemin de classe
global (AS2) ou le chemin source (AS3) affecte la vérification de la syntaxe. Des erreurs risquent de se
produire, même si le chemin de classe global ou le chemin source est défini correctement, car le compilateur
ignore que cette classe est en cours de compilation.
Vérification de l’équilibrage de la ponctuation
1. Cliquez entre les accolades {}, les crochets [] ou les parenthèses () de votre script.
2. Dans Windows, appuyez sur Ctrl+’ (apostrophe). Sous Macintosh, appuyez sur
Commande+’ (apostrophe). Le texte entre accolades, crochets ou parenthèses est mis
en surbrillance et vous pouvez alors vérifier que chaque ponctuation ouvrante possède
bien son équivalent fermant.
Haut de la page
(Abandonné dans Animate CC) Importation et exportation de scripts
Vous pouvez importer un script dans le panneau Actions ou dans la fenêtre de script. Vous pouvez
également exporter vos scripts du panneau Actions vers des fichiers ActionScript externes. L’exportation n’est
pas nécessaire lorsque vous utilisez la fenêtre de script car il suffit d’enregistrer le fichier AS.
Si le texte que contiennent vos scripts ne s’affiche pas comme prévu lorsque vous ouvrez ou importez un
fichier, modifiez la préférence de codage pour l’importation.
Importation d’un fichier AS externe
1. Dans la fenêtre de script, placez le point d’insertion à l’endroit où vous souhaitez
introduire la première ligne du script externe.
2. Effectuez l’une des opérations suivantes :
Dans le panneau Actions, choisissez Importer un script dans le menu du panneau ou
appuyez sur Ctrl+Maj+I (Windows) ou sur Commande+Maj+I (Macintosh).
Dans la fenêtre Script, choisissez Fichier > Importer un script ou appuyez sur
Ctrl+Maj+I (Windows) ou sur Commande+Maj+I (Macintosh).
Exportation d’un script à partir du panneau Actions
1. Sélectionnez le script à exporter. Dans le menu du panneau Actions, choisissez Exporter
101
un script ou appuyez sur Ctrl+Maj+X (Windows) ou sur Commande+Maj+X (Macintosh).
2. Enregistrez le fichier ActionScript (AS).
Définition des options de codage du texte
1. Sélectionnez Modifier > Préférences (Windows) ou Animate > Préférences (Macintosh),
puis sélectionnez ActionScript dans la liste des catégories.
2. Définissez les options suivantes :
Ouvrir/Importer Choisissez Codage UTF-8 pour ouvrir ou importer à l’aide du codage
Unicode, ou choisissez Codage par défaut pour ouvrir ou importer à l’aide du format de
codage de la langue actuellement utilisée par votre système.
Enregistrer/Exporter Choisissez Codage UTF-8 pour enregistrer ou exporter à l’aide du
codage Unicode, ou choisissez Codage par défaut pour enregistrer ou exporter à l’aide
du format de codage de la langue actuellement utilisée par votre système.
Activation ou désactivation d’un message d’avertissement du codage
d’exportation
1. Sélectionnez Modifier > Préférences (Windows) ou Animate > Préférences (Macintosh),
puis sélectionnez Avertissements dans la liste des catégories.
2. Activez ou désactivez l’option Avertir des conflits de codage pendant l’exportation de
fichiers .as.
Haut de la page
(Abandonné dans Animate CC) Codage des scripts importés et
exportés
Vous pouvez définir les préférences d’ActionScript afin de spécifier le type de codage à utiliser lors de
l’importation ou de l’exportation de fichiers ActionScript. Le codage UTF-8 est un format Unicode 8 bits, qui
vous permet d’inclure du texte en plusieurs langues dans votre fichier. Le codage par défaut, également
appelé page de code classique, est celui qui est pris en charge par la langue utilisée actuellement par votre
système.
Remarque : lorsque vous utilisez une application non anglophone sur un système en anglais, la commande
Tester l’animation échoue si l’une des parties du fichier SWF comporte des caractères qui ne peuvent pas
être restitués par le schéma de codage MBCS (Multibyte Character Sets). Par exemple, les chemins
japonais, qui fonctionnent dans les systèmes japonais, ne fonctionnent pas dans les systèmes anglais.
Assurez-vous toujours d’utiliser des noms de chemin de la même langue que votre système. Toutes les
zones de l’application utilisant le lecteur Tester l’animation sont soumises à cette restriction.
Haut de la page
Verrouillage des scripts dans le panneau Actions
À l’aide de la fonction Verrouiller le script, épinglez les onglets aux scripts individuels dans le volet Script et
déplacez-les en conséquence. Cette fonction s’avère utile si vous n’avez pas centralisé le code du fichier
FLA ou si vous utilisez plusieurs scripts.
Vous pouvez épingler un script pour conserver l’emplacement du code ouvert dans le panneau Actions et
permuter entre les divers scripts ouverts. Cette fonction s’avère particulièrement pratique lors de la phase de
débogage.
102
Vous pouvez également déverrouiller un script ou tous les scripts pour déverrouiller un script sélectionné ou
tous les scripts du panneau Actions.
Dans l’illustration suivante, le script associé à l’emplacement en cours du scénario se trouve sur l’image 1 du
calque Nettoyage. (L’onglet le plus à gauche suit toujours votre emplacement dans le scénario.) Le script est
également verrouillé, comme indiqué, comme l’onglet le plus à droite. Les deux scripts suivants sont
verrouillés :
Sur l’image 1
Sur l’image 15 du calque Intro
Utilisez les raccourcis clavier ou cliquez sur les onglets pour vous déplacer dans les scripts verrouillés. Cette
opération n’a aucune incidence sur votre position actuelle dans le scénario.Si un nouveau script est
sélectionné dans le navigateur ActionScript, le focus se déplace vers la première image, c’est-à-dire
l’image 1.
Si le contenu de la fenêtre de script ne change pas en fonction de l’emplacement sélectionné dans le
scénario, la fenêtre de script affiche probablement un script verrouillé. Cliquez sur l’onglet de l’image
active dans la partie supérieure gauche de la fenêtre de script pour afficher le script associé à votre
emplacement dans le scénario.
Un script verrouillé
Verrouillage d’un script
1. Cliquez dans le scénario afin que le script apparaisse dans l’onglet de l’image active
dans la partie supérieure gauche de la fenêtre de script dans le panneau Actions.
2. Effectuez l’une des opérations suivantes :
Cliquez sur l’icône en forme de punaise qui figure à droite de l’onglet.
Sélectionnez Affichage > Verrouiller le script pour verrouiller le script.
Déverrouiller tous les scripts
1. Sélectionnez le script verrouillé dans le panneau Actions.
2. Sélectionnez Affichage > Déverrouiller le script pour détacher le script sélectionné du
panneau Actions.
3. Sélectionnez Affichage > Déverrouiller tous les scripts pour détacher tous les scripts
du panneau Actions.
103
Options de déverrouillage
Raccourcis clavier pour les scripts verrouillés
Lorsque le point d’insertion est dans la fenêtre de script, utilisez les raccourcis clavier suivants pour travailler
avec des scripts verrouillés.
Action
Windows
Macintosh
Verrouiller le script
Ctrl + Maj + = (signe égal)
Commande+Maj+=
Déverrouiller le script
Ctrl+Maj+- (signe moins)
Commande+Maj+-
Haut de la page
Insertion de chemins cible
De nombreuses actions de script sont destinées à affecter les clips, les boutons et autres occurrences de
symbole. Dans votre code, vous pouvez faire référence à des occurrences de symbole dans un scénario en
insérant un chemin cible (l’adresse de l’occurrence que vous ciblez). Ce chemin cible peut être absolu ou
relatif. Un chemin absolu contient l’adresse complète de l’occurrence. Un chemin relatif ne contient que la
partie de l’adresse qui diffère de l’adresse du script lui-même dans le fichier FLA. Il ne fonctionnera plus si le
script est déplacé.
1. Dans le panneau Actions, cliquez sur une action dans votre script.
2. Cliquez sur Chemin cible
.
3. Entrez le chemin qui mène à l’occurrence cible ou sélectionnez la cible dans la liste.
4. Sélectionnez l’option de chemin relatif ou absolu.
Haut de la page
Utilisation des conseils de code
Lorsque vous travaillez dans le panneau Actions ou la fenêtre de script, le logiciel peut détecter l’action saisie
et afficher un conseil de code. Il existe deux types de conseils de code : une info-bulle qui présente la
syntaxe complète de l’action et un menu contextuel qui énumère les noms possibles pour les méthodes et les
104
propriétés (parfois appelé saisie automatique).
Les conseils de code sont activés par défaut. Des préférences vous permettent de désactiver les conseils de
code ou de déterminer la vitesse à laquelle ils apparaissent. Lorsque les conseils de code sont désactivés
dans les préférences, il est toujours possible d’afficher manuellement un conseil de code pour une
commande spécifique.
Remarque : si vous ne parvenez pas à afficher des conseils de code pour une variable ou un objet créé
dans ActionScript 2.0, bien que cette fonction soit activée dans les préférences d’ActionScript, assurez-vous
que vous avez nommé correctement la variable ou l’objet et que vous leur avez appliqué le typage strict.
Activation des conseils de code
Il existe plusieurs manières de déclencher les conseils de code.
Typage strict des objets
Lorsque vous utilisez ActionScript 2.0 et le typage strict pour une variable qui repose sur une classe intégrée
(telle que Button, Array, etc.), la fenêtre de script affiche les conseils de code pour cette variable. Par
exemple, supposons que vous tapiez les deux lignes de code suivantes :
var foo:Array = new Array();
foo.
Dès que vous entrez le point (.), Animate affiche la liste des méthodes et propriétés disponibles pour les
objets Array dans un menu contextuel, car votre variable est un tableau.
Suffixes et conseils de code
Si vous utilisez ActionScript 1.0 ou si vous souhaitez afficher des conseils de code pour des objets que vous
créez sans définir strictement leur type, ajoutez un suffixe au nom de chaque objet lors de sa création. Par
exemple, le suffixe qui déclenche les conseils de code pour la classe Camera est _cam. Supposons que vous
tapiez le code suivant : var my_array = new Array(); var my_cam = Camera.get();
Si vous saisissez ensuite my_cam suivi d’un point, les conseils de code de l’objet Camera apparaissent.
Pour les objets qui apparaissent sur la scène, entrez le suffixe dans le champ Nom de l’occurrence, dans
l’inspecteur des propriétés. Par exemple, pour afficher des conseils de code pour des objets MovieClip,
utilisez l’inspecteur des propriétés pour affecter des noms d’occurrences portant le suffixe _mc à tous les
objets MovieClip. Lorsque vous taperez le nom d’une occurrence suivi d’un point, des conseils de code
apparaîtront.
var my_array = new Array();
var my_cam = Camera.get();
Même si les suffixes ne sont pas indispensables au déclenchement des conseils de code lorsque vous
définissez strictement le type d’un objet, il est recommandé de les utiliser de façon uniforme pour rendre
vos scripts plus compréhensibles.
Le tableau suivant énumère les suffixes qui déclenchent les conseils de code dans ActionScript 2.0 :
Type d’objet
Suffixe de variable
Array
_array
Button
_btn
Camera
_cam
105
Color
_color
ContextMenu
_cm
ContextMenuItem
_cmi
Date
_date
Error
_err
LoadVars
_lv
LocalConnection
_lc
Microphone
_mic
MovieClip
_mc
MovieClipLoader
_mcl
PrintJob
_pj
NetConnection
_nc
NetStream
_ns
SharedObject
_so
Sound
_sound
String
_str
TextField
_txt
TextFormat
_fmt
Video
_video
XML
_xml
XMLNode
_xmlnode
XMLSocket
_xmlsocket
Commentaires et conseils de code
Vous pouvez également utiliser des commentaires ActionScript pour spécifier la classe d’un objet pour les
conseils de code. Dans l’exemple suivant, un commentaire indique à ActionScript que la classe de
l’occurrence theObject est Object, et ainsi de suite.
// Object theObject;// Array theArray;// MovieClip theMC;
Si vous saisissez plus tard theMC suivi d’un point, des conseils de code affichant la liste des méthodes et
des propriétés MovieClip apparaissent. Si vous tapez theArraysuivi d’un point, des conseils de code
affichant la liste des méthodes et des propriétés Array apparaissent, etc.
Toutefois, Adobe recommande d’employer le typage strict des données ou les suffixes, car ces techniques
permettent d’obtenir des conseils de code automatiquement et rendent votre code plus compréhensible.
106
Configuration des préférences pour obtenir des conseils de code
automatiquement
Dans le panneau Actions ou la fenêtre de script, sélectionnez Modifier > Préférences
(Windows) ou Animate > Préférences (Macintosh), cliquez sur Éditeur de code dans la
liste des catégories, puis activez ou désactivez les conseils de code.
(Abandonné dans Animate CC) Spécification d’un délai pour les conseils de
code
1. Dans le panneau Actions ou la fenêtre de script, sélectionnez Modifier > Préférences
(Windows) ou Animate > Préférences (Macintosh).
2. Cliquez sur ActionScript dans la liste des catégories.
3. Faites glisser le curseur pour définir le délai, en secondes.
Utilisation des conseils de code de type info-bulle
1. Faites apparaître le conseil de code en tapant une parenthèse ouverte ( après un
élément qui nécessite l’utilisation des parenthèses, tel qu’un nom de méthode, une
commande comme if ou .while, etc.).
L’ouverture des parenthèses déclenche les conseils de code.
2. Entrez une valeur pour le paramètre.
Pour entrer plusieurs paramètres, séparez leurs valeurs par des virgules. Pour les
fonctions ou les instructions telles que la boucle for, séparez les paramètres par des
points-virgules.
Des commandes étendues telles que gotoAndPlay() ou for (il s’agit de fonctions ou
de méthodes qui peuvent être invoquées avec différents jeux de paramètres) affichent un
indicateur qui vous permet de choisir le paramètre que vous souhaitez définir. Pour
sélectionner le paramètre, cliquez sur les petites flèches ou appuyez sur Ctrl+Flèche
gauche ou Ctrl+Flèche droite.
Conseil de code avec plusieurs jeux de paramètres
3. Pour annuler le conseil de code, effectuez l’une des opérations suivantes :
Tapez une parenthèse de fermeture ).
Cliquez à l’extérieur de l’instruction.
Appuyez sur la touche Échap.
Utilisation des conseils de code de type menu
107
1. Faites apparaître le conseil de code en tapant un point après le nom de la variable ou de
l’objet.
Conseils de code de type menu
2. Pour naviguer dans les conseils de code, utilisez les touches Flèche Haut ou Flèche
Bas.
3. Pour sélectionner un élément dans le menu, appuyez sur Entrée ou Tab, ou doublecliquez sur cet élément.
4. Pour annuler le conseil de code, effectuez l’une des opérations suivantes :
Sélectionnez l’un des éléments du menu.
Cliquez au-dessus ou au-dessous de la fenêtre de menu.
Si vous avez déjà tapé une parenthèse d’ouverture (, tapez-en une de fermeture ).
Appuyez sur la touche Échap.
Affichage manuel d’un conseil de code
1. Cliquez sur le code, à l’emplacement où vous souhaitez afficher des conseils, comme
dans les exemples suivants :
Après le point (.) qui suit une instruction ou une commande, à l’endroit où une
propriété ou une méthode doit être entrée.
Entre les parenthèses () dans un nom de méthode
2. Effectuez l’une des opérations suivantes :
Pour activer les conseils de code manuellement, sélectionnez Affichage > Afficher les
conseils de code.
Appuyez sur Ctrl+Barre d’espace (Windows) ou sur Commande+Barre d’espace
(Macintosh).
Conseils de code pour les classes personnalisées
Lorsque vous créez des classes ActionScript 3.0 personnalisées, Animate les analyse et détermine les
objets, les propriétés et les méthodes qu’elles contiennent. Animate est alors en mesure de fournir des
conseils de code lorsque vous écrivez du code qui fait référence à des classes personnalisées. Les conseils
de code dans les classes personnalisées sont automatiques pour toute classe que vous associez à un autre
code à l’aide de la commande importer.
Grâce aux conseils de code, les développeurs peuvent travailler plus vite, car ils n’ont pas à mémoriser
l’ensemble des objets, méthodes et propriétés que la classe utilise. Les concepteurs peuvent se servir des
classes qu’ils n’ont pas créées eux-mêmes, car il n’est pas nécessaire qu’ils sachent comment les utiliser.
Les conseils de code comprennent les éléments suivants :
Conseils de code pour les références de classes imbriquées
Lors de la création de références imbriquées, l’aide des conseils de code s’avère très
utile.
108
Conseils de code pour « this »
Lorsque vous écrivez « this » dans un fichier de classe, vous obtenez des conseils de
code pour cette même classe.
Conseils de code pour « new+<espace> »
Lorsque vous écrivez « new+<espace> », Animate affiche une liste des classes et
packages disponibles.
Conseils de code pour « import »
Lorsque vous écrivez « import + <espace> », Animate affiche une liste de tous les
packages intégrés et personnalisés.
Conseils de code pour les bibliothèques SWC
Lorsque vous ajoutez une bibliothèque SWC au chemin de bibliothèque ou au chemin de
bibliothèque externe, Animate active les conseils de code pour toutes les classes que
contient le fichier SWC.
Adobe recommande également :
Définition de vos préférences ActionScript
Utilisation de l’explorateur d’animations
Compilation et exportation de classes (ActionScript 2.0)
Débogage du code ActionScript 3.0
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
109
Activation de la prise en charge des plates-formes personnalisées
Cet article explique aux développeurs de modules externes (plug-ins) comment créer des modules externes
Animate afin de prendre en charge les plates-formes personnalisées à l’aide d’Animate CC 2015.1
(février 2016). Les précédentes versions du présent document sont :
Version 1.2 (2015)
Version 1.1 (2014.2)
Version 1.0 (2014)
Pour créer un module externe de prise en charge des plates-formes personnalisées, les développeurs
doivent télécharger le kit de développement de prise en charge des plates-formes personnalisées à partir de
l’emplacement suivant :
CustomPlatformSupportDevelopmentKit.zip
Kit de développement de prise en charge des plates-formes personnalisées
Téléchargez un exemple de module externe à partir de l’emplacement suivant et utilisez-le comme référence
pour la création d’un module externe de prise en charge des plates-formes personnalisées :
SampleCreateJSPlatform.zip
Exemple de module externe
Un module externe se compose des éléments suivants :
DocType ajoute un nouveau type de document pour la plate-forme personnalisée dans
Animate et contrôle les fonctions de création.
L’éditeur autorise la configuration des paramètres de publication et la publication du
document sur la plate-forme personnalisée.
Pour une présentation de la fonctionnalité de prise en charge des plates-formes personnalisées, voir Prise en
charge des plates-formes personnalisées.
Création d’un module externe de prise en charge des plates-formes personnalisées
Animate
Configuration logicielle requise
Documentation de référence des API pour les développeurs de modules
complémentaires
Création d’un module externe de prise en charge des plates-formes personnalisées
Groupement du module externe de prise en charge des plates-formes personnalisées
Distribution de votre module externe de prise en charge des plates-formes
personnalisées
Demandes de fonctions et rapport de bogues
Haut de la page
Création d’un module externe de prise en charge des plates-formes
personnalisées Animate
Vous pouvez développer un module externe de prise en charge des plates-formes personnalisées en utilisant
l’une des méthodes suivantes :
110
Création d’un module externe à l’aide des API du kit de développement de prise en
charge des plates-formes personnalisées.
Personnalisez les paramètres de l’exemple de module externe inclus dans le kit de
développement pour répondre à vos besoins.
Les modules externes de prise en charge des plates-formes personnalisées sont regroupés sous forme de
fichiers .zxp pouvant être installés avec Animate CC. Vous pouvez héberger le module externe sur la page
Modules complémentaires Adobe pour permettre aux utilisateurs de le télécharger et de l’installer au moyen
de l’application Creative Cloud. Vous pouvez aussi distribuer les modules externes au format .zxp pour
permettre leur installation au moyen de l’utilitaire Gérer les extensions.
Configuration logicielle requise
Un développeur doit disposer des logiciels suivants pour créer un module externe au moyen du kit de
développement de prise en charge de plates-formes personnalisées:
Microsoft Windows 7 ou Apple Mac OS 10.8 et versions ultérieures
Microsoft Visual Studio 2012 (Windows) ou XCode 4.5.2 (Mac)
Animate CC 2015
Eclipse IDE pour développeurs C/C++
Adobe Extension Builder 3.0
Utilitaire Gérer les extensions
Documentation de référence des API pour les développeurs de modules
complémentaires
Le kit de développement de prise en charge des plates-formes personnalisées contient les éléments
suivants :
FCM (Flash Component Model) : les fichiers d’en-tête figurant dans le kit de
développement définissent un cadre appelé FCM, qui est chargé de la gestion des
modules externes.
DocType : contient un ensemble d’interfaces qui vous permettent d’ajouter un nouveau
type de document à la page de démarrage d’Animate et d’activer ou de désactiver des
fonctionnalités pour le type de document personnalisé.
DOM (Document Object Model) : contient un ensemble d’interfaces qui vous permettent
d’accéder au contenu du document Animate sous forme de DOM.
Éditeur : contient un ensemble d’interfaces fournissant des crochets pour les processus
de publication.
Pour obtenir des informations complètes sur les API dans la prise en charge des plates-formes
personnalisées et des exemples d’utilisation pour créer votre module externe, voir Référence des API de
prise en charge des plates-formes personnalisées.
Création d’un module externe de prise en charge des plates-formes
personnalisées
Vous pouvez créer un module externe de prise en charge des plates-formes personnalisées comme suit :
1. Téléchargez le Kit de développement de prise en charge des plates-formes
personnalisées.
2. Extrayez le contenu du kit sur votre ordinateur.
3. Ouvrez un nouveau projet dans VisualStudio ou Xcode et incluez les fichiers d’en-tête
dans le kit de développement à vos projets de développement. Pour démarrer
111
rapidement la création de votre module externe de prise en charge des plates-formes
personnalisées, vous pouvez utiliser l’exemple suivant de module externe disponible
sous le répertoire SampleCreateJSPlatform comme code de base pour votre projet de
module externe.
Par exemple, les fichiers du module externe SampleCreateJS se trouvent dans
SampleCreateJSPlatform\Plugin\SampleCreateJS\project\
4. Apportez les modifications requises pour votre plateforme cible.
5. Compilez le code pour générer un module externe (.dll ou .plug-in).
Groupement du module externe de prise en charge des plates-formes
personnalisées
Vous pouvez générer un module distribuable à partir du module externe de prise en charge des plates-formes
personnalisées comme suit :
1. Ouvrez l’exemple de fichier Eclipse ou dans l’assistant Nouveau projet Eclipse, créez un
nouveau projet d’extension d’application. Donnez un nom au projet, puis cliquez sur
Suivant.
2. Dans le panneau Nouveau projet d’extension d’application Adobe, sélectionnez
Adobe Animate en tant qu’application cible et cliquez sur Suivant.
3. Convertissez les extensions des fichiers de module externe que vous avez créés de
.dll en .fcm sous Windows et de .plug-in en .fcm.plug-in sous Mac, et ajoutez les
fichiers de module externe au projet (ExtensionContent/plugins/lib/win pour
Windows et ExtensionContent/plugins/lib/mac pour Mac).
4. Configurez l’extension en modifiant le fichier manifest.xml. Pour ouvrir le fichier
manifeste, cliquez avec le bouton droit de la souris sur l’extension dans l’explorateur de
projets et sélectionnez Adobe Extension Builder 3 > Bundle Manifest Editor, puis
sélectionnez l’onglet manifeste dans Bundle Manifest Editor à l’emplacement
EclipseProject\.staged-extension\CSXS.
5. Pour modifier le fichier manifest.xml, cliquez avec le bouton droit de la souris à
l’intérieur de la fenêtre et sélectionnez Ouvrir avec > Éditeur XML. Les deux balises sur
lesquelles vous devez travailler sont les suivantes : ExtensionList et
DispatchInfoList :
Une balise ExtensionList type se présente comme suit :
<ExtensionList>
<Extension Id="PluginID" Version="1.0" />
<Extension Id="PublishSettingsID" Version-"1.0" />
</ExtensionList>
Cette balise contient la liste des extensions dans le package ZXP final dans lequel chaque extension
comporte une chaîne unique comme ID. Dans ce cas, le fichier .dll ou .plugin créé dans la section
précédente est inclus dans une extension. Ensuite, l’autre extension permet de configurer l’interface
utilisateur des paramètres de publication de l’éditeur. Dans l’exemple, la balise ExtensionList
portant l’ID d’extension PluginID contient le fichier .dll/.plugin et l’extension avec l’ID
PublishSettingsID configure l’interface utilisateur des paramètres de publication de l’éditeur.
6. La balise DispatchInfoList contient des informations détaillées sur chaque extension
mentionnée dans ExtensionList. Voici un exemple de DispatchInfoList :
<DispatchInfoList>
<Extension Id="PluginID">
<DispatchInfo >
112
<Resources>
<MainPath>./plugin/fcm.xml</MainPath>
</Resources>
<Lifecycle>
<AutoVisible>true</AutoVisible>
</Lifecycle>
<UI>
<Type>ModalDialog</Type>
<Menu>CreateJS</Menu>
<Geometry>
<Size>
<Height>200</Height>
<Width>200</Width>
</Size>
</Geometry>
</UI>
</DispatchInfo>
</Extension>
<Extension Id="PublishSettingsID">
<DispatchInfo >
<Resources>
<MainPath>./index.html</MainPath>
</Resources>
<Lifecycle>
<AutoVisible>true</AutoVisible>
</Lifecycle>
<UI>
<Type>ModalDialog</Type>
<Menu>Publish Settings</Menu>
<Geometry>
<Size>
<Height>170</Height>
<Width>486</Width>
</Size>
</Geometry>
</UI>
</DispatchInfo>
</Extension>
</DispatchInfoList>
7. Pour l’extension contenant le fichier .dll ou .plugin, vous pouvez ignorer toutes les balises
à l’exception de la balise MainPath. La balise MainPath contient le chemin d’accès au
fichier fcm.xml relatif au dossier ExtensionContent. Vous devez renommer le fichier .dll
en .fcm et le placer dans le dossier win près du fichier fcm.xml. De même, sur Mac,
renommez le fichier .plugin en .fcm.plugin et placez-le dans le dossier mac près du
fichier fcm.xml.
8. L’extension HTML permettant de configurer l’interface utilisateur des paramètres de
publication est une extension HTML pour Animate. Pour en savoir plus sur les extensions
HTML pour Animate, voir Création d’extensions HTML.
9. Vérifiez que la valeur inférieure de l’attribut de version dans la balise Host est 15.1, la
version (interne) minimale d’Animate CC avec prise en charge des plates-formes
personnalisées.
<ExecutionEnvironment>
<HostList>
<Host Name="FLPR" Version="15.1" />
</HostList>.
.
.
113
</ExecutionEnvironment>
10. Passez en mode Script Explorer (Explorateur de scripts), puis cliquez avec le bouton
droit sur votre projet et sélectionnez Exporter > Adobe Extension Builder 3 > Extension
d’application. L’assistant Exportation apparaît.
11. Vous devez détenir un certificat pour signer le package d’extension. Sélectionnez un
certificat existant ou cliquez sur Créer pour en créer un.
12. Cliquez sur Terminer pour compiler le projet. Eclipse génère un fichier de module externe
avec l’extension .zxp, que vous pouvez héberger sur le site Modules complémentaires
Adobe.
Haut de la page
Distribution de votre module externe de prise en charge des platesformes personnalisées
Vous pouvez distribuer le module externe de prise en charge des plates-formes personnalisées en
l’hébergeant sur la page Modules complémentaires Adobe et en le monétisant. Votre module externe passe
par un processus de révision et d’approbation d’Adobe avant d’être répertorié dans la page. Vous pouvez
héberger un module externe comme suit :
1. Connectez-vous à la page Modules complémentaires Adobe au moyen de votre ID
d’utilisateur et de votre mot de passe.
2. Dans le panneau de gauche, sous « Become a producer » (Devenir un producteur),
cliquez sur le lien Go to the producer portal (Accéder au portail du producteur).
3. Cliquez sur le bouton « Sign-up » (S’enregistrer) si vous n’êtes pas enregistré en tant
que producteur.
4. Pour des instructions détaillées sur la façon de s’enregistrer en tant que producteur et
d’héberger vos modules externes, voir Getting Started with the Producer Portal (Prise en
main du portail du producteur).
5. Effectuez les étapes suivantes du processus du portail du producteur telles que
documentées dans la page Getting Started (Prise en main) :
a. Compactez votre produit dans un seul fichier.
b. Entrez des informations relatives au produit et téléchargez le fichier.
c. Ajoutez des ressources marketing.
d. Prévisualisez votre produit.
e. Envoyez votre produit pour approbation.
6. Une fois approuvé, votre module externe est répertorié sous la catégorie des produits
Animate sur la page Add-ons.
Remarque :
Si, en tant qu’utilisateur, vous souhaitez installer un module externe, créer un document
de plate-forme personnalisée et le publier au moyen d’Animate, consultez la section
Utilisation du module externe de prise en charge des plates-formes personnalisées.
Pour des informations complètes sur la gestion des extensions Adobe, voir
Téléchargement et installation des extensions.
Haut de la page
Demandes de fonctions et rapport de bogues
Remplissez le formulaire suivant pour faire part de vos questions ou problèmes, signaler les bogues du
produit ou demander des fonctions à l’équipe produit d’Animate :
Demandes de fonctions Adobe et formulaire de signalement de bogues
114
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
115
Activation de la prise en charge des plates-formes personnalisées
Cet article explique aux développeurs de modules externes (plug-ins) comment créer des modules externes
Animate afin de prendre en charge les plates-formes personnalisées à l’aide d’Animate CC 2014.2. Si vous
utilisez Animate CC 2014.1 (mise à jour d’octobre 2014), consultez la version précédente de ce document.
Pour créer un module externe de prise en charge des plates-formes personnalisées, les développeurs
doivent télécharger le kit de développement de prise en charge des plates-formes personnalisées à partir de
l’emplacement suivant :
CustomPlatformSupportDevelopmentKit.zip
Kit de développement de prise en charge des plates-formes personnalisées
Téléchargez un exemple de module externe à partir de l’emplacement suivant et utilisez-le comme référence
pour la création d’un module externe de prise en charge des plates-formes personnalisées :
SampleCreateJSPlatform.zip
Exemple de module externe
Un module externe se compose des éléments suivants :
DocType ajoute un nouveau type de document pour la plate-forme personnalisée dans
Animate et contrôle les fonctions de création.
L’éditeur autorise la configuration des paramètres de publication et la publication du
document sur la plate-forme personnalisée.
Pour une présentation de la fonctionnalité de prise en charge des plates-formes personnalisées, voir Prise en
charge des plates-formes personnalisées.
Nouveauté d’Animate CC 2015 :
Possibilité d’interroger le type d’un symbole de la bibliothèque : en cas de symboles,
ILibraryItem::GetProperties() comporte une entrée supplémentaire avec la clé
kLibProp_SymbolType_DictKey. La valeur de la clé peut être
kLibProp_SymbolType_Button, kLibProp_SymbolType_MovieClip ou
kLibProp_SymbolType_Graphic.
Possibilité de faire la distinction entre le bouton et le clip : jusqu’à la version
précédente, les occurrences de bouton étaient traitées comme des clips par le modèle
DOM et le service IFrameCommandGenerator. À compter d’Animate CC 2015, une
interface a été ajoutée afin de prendre en charge les occurrences de bouton. Si
l’occurrence d’IMovieClip implémente également l’interface IButton, elle peut être traitée
comme une occurrence de bouton. Les quatre états d’un bouton (Haut, Dessus, Bas et
Cliqué) sont toujours mappés aux images 0, 1, 2 et 3, respectivement. Voir le fichier
IButton.h pour en savoir plus sur l’occurrence de bouton.
Nouvelle API permettant d’obtenir les limites des objets IClassicText : la fonction
AddClassicText dans l’interface ITimelineBuilder renvoie désormais un objet de
CLASSIC_TEXT_INFO_2 (au lieu de l’ancien CLASSIC_TEXT_INFO), avec un
nouveau champ « limites » représentant les limites de l’objet IClassicText.
L’exemple de module externe a été modifié afin de réemployer les bitmaps utilisés pour
les remplissages de forme.
Le serveur web Mongoose a été intégré à l’exemple de module externe.
Remarque : Le nouvel outil de segment IK d’Animate CC 2015 est désactivé dans les documents du type
Plate-forme personnalisée. Animate convertit le contenu de cinématique inverse (IK) en animation image par
116
image lorsque vous le collez dans un document de plate-forme personnalisée.
Mise à jour de février 2015 : prise en charge des « masques » dans le service
IFrameCommandGenerator. Cette version prend en charge les masques dans le service
IFrameCommandGenerator. La nouvelle interface ITimelineBuilder2 (héritée de l’interface
ITimelineBuilder existante) contient les fonctions que le module externe doit implémenter pour
configurer cette fonction. Voir la documentation sur les API de prise en charge des plates-formes
personnalisées pour découvrir la nouvelle interface ITimelineBuilder2.
Création d’un module externe de prise en charge des plates-formes personnalisées
Animate
Configuration logicielle requise
Documentation de référence des API pour les développeurs de modules
complémentaires
Création d’un module externe de prise en charge des plates-formes personnalisées
Groupement du module externe de prise en charge des plates-formes personnalisées
Distribution de votre module externe de prise en charge des plates-formes
personnalisées
Demandes de fonctions et rapport de bogues
Haut de la page
Création d’un module externe de prise en charge des plates-formes
personnalisées Animate
Vous pouvez développer un module externe de prise en charge des plates-formes personnalisées en utilisant
l’une des méthodes suivantes :
Création d’un module externe à l’aide des API du kit de développement de prise en
charge des plates-formes personnalisées.
Personnalisez les paramètres de l’exemple de module externe inclus dans le kit de
développement pour répondre à vos besoins.
Les modules externes de prise en charge des plates-formes personnalisées sont regroupés sous forme de
fichiers .zxp pouvant être installés avec Animate CC. Vous pouvez héberger le module externe sur la
page Modules complémentaires Adobe pour permettre aux utilisateurs de le télécharger et de l’installation au
moyen de l’application Creative Cloud. Vous pouvez aussi distribuer les modules externes au format .zxp
pour permettre leur installation au moyen d’Adobe Extensions Manager.
Configuration logicielle requise
Un développeur doit disposer des logiciels suivants pour créer un module externe au moyen du kit de
développement de prise en charge de plates-formes personnalisées:
Microsoft Windows 7 ou Apple Mac OS 10.8 et versions ultérieures
Microsoft Visual Studio 2012 (Windows) ou XCode 4.5.2 (Mac)
Animate CC 2014.1 et versions ultérieures
Eclipse IDE pour développeurs C/C++
Adobe Extension Builder 3.0
Adobe Extension Manager 7.2.1.6
Documentation de référence des API pour les développeurs de modules
complémentaires
117
Le kit de développement de prise en charge des plates-formes personnalisées contient les éléments
suivants :
FCM (Flash Component Model) : les fichiers d’en-tête figurant dans le kit de
développement définissent un cadre appelé FCM, qui est chargé de la gestion des
modules externes.
DocType : contient un ensemble d’interfaces qui vous permettent d’ajouter un nouveau
type de document à la page de démarrage d’Animate et d’activer ou de désactiver des
fonctionnalités pour le type de document personnalisé.
DOM (Document Object Model) : contient un ensemble d’interfaces qui vous permettent
d’accéder au contenu du document Animate sous forme de DOM.
Éditeur : contient un ensemble d’interfaces fournissant des crochets pour les processus
de publication.
Pour obtenir des informations complètes sur les API dans la prise en charge des plates-formes
personnalisées et des exemples d’utilisation pour créer votre module externe, voir Référence des API de
prise en charge des plates-formes personnalisées.
Création d’un module externe de prise en charge des plates-formes
personnalisées
Vous pouvez créer un module externe de prise en charge des plates-formes personnalisées comme suit :
1. Téléchargez le Kit de développement de prise en charge des plates-formes
personnalisées.
2. Extrayez le contenu du kit sur votre ordinateur.
3. Ouvrez un nouveau projet dans VisualStudio ou Xcode et incluez les fichiers d’en-tête
dans le kit de développement à vos projets de développement. Pour démarrer
rapidement la création de votre module externe de prise en charge des plates-formes
personnalisées, vous pouvez utiliser l’exemple suivant de module externe disponible
sous le répertoire SampleCreateJSPlatform comme code de base pour votre projet de
module externe.
Par exemple, les fichiers du module externe SampleCreateJS se trouvent dans
SampleCreateJSPlatform\Plugin\SampleCreateJS\project\
4. Apportez les modifications requises pour votre plateforme cible.
5. Compilez le code pour générer un module externe (.dll ou .plug-in).
Groupement du module externe de prise en charge des plates-formes
personnalisées
Vous pouvez générer un module distribuable à partir du module externe de prise en charge des plates-formes
personnalisées comme suit :
1. Ouvrez l’exemple de fichier Eclipse ou dans l’assistant Nouveau projet Eclipse, créez un
nouveau projet d’extension d’application. Donnez un nom au projet, puis cliquez sur
Suivant.
2. Dans le panneau Nouveau projet d’extension d’application Adobe, sélectionnez
Adobe Animate en tant qu’application cible et cliquez sur Suivant.
3. Convertissez les extensions des fichiers de module externe que vous avez créés de
.dll en .fcm sous Windows et de .plug-in en .fcm.plug-in sous Mac, et ajoutez les
fichiers de module externe au projet (ExtensionContent/plugins/lib/win pour
Windows et ExtensionContent/plugins/lib/mac pour Mac).
4. Configurez l’extension en modifiant le fichier manifest.xml. Pour ouvrir le fichier
manifeste, cliquez avec le bouton droit de la souris sur l’extension dans l’explorateur de
projets et sélectionnez Adobe Extension Builder 3 > Bundle Manifest Editor, puis
sélectionnez l’onglet manifeste dans Bundle Manifest Editor à l’emplacement
EclipseProject\.staged-extension\CSXS.
118
5. Pour modifier le fichier manifest.xml, cliquez avec le bouton droit de la souris à
l’intérieur de la fenêtre et sélectionnez Ouvrir avec > Éditeur XML. Les deux balises sur
lesquelles vous devez travailler sont les suivantes : ExtensionList et
DispatchInfoList :
Une balise ExtensionList type se présente comme suit :
<ExtensionList>
<Extension Id="PluginID" Version="1.0" />
<Extension Id="PublishSettingsID" Version-"1.0" />
</ExtensionList>
Cette balise contient la liste des extensions dans le package ZXP final dans lequel chaque extension
comporte une chaîne unique comme ID. Dans ce cas, le fichier .dll ou .plugin créé dans la section
précédente est inclus dans une extension. Ensuite, l’autre extension permet de configurer l’interface
utilisateur des paramètres de publication de l’éditeur. Dans l’exemple, la balise ExtensionList
portant l’ID d’extension PluginID contient le fichier .dll/.plugin et l’extension avec l’ID
PublishSettingsID configure l’interface utilisateur des paramètres de publication de l’éditeur.
6. La balise DispatchInfoList contient des informations détaillées sur chaque extension
mentionnée dans ExtensionList. Voici un exemple de DispatchInfoList :
<DispatchInfoList>
<Extension Id="PluginID">
<DispatchInfo >
<Resources>
<MainPath>./plugin/fcm.xml</MainPath>
</Resources>
<Lifecycle>
<AutoVisible>true</AutoVisible>
</Lifecycle>
<UI>
<Type>ModalDialog</Type>
<Menu>CreateJS</Menu>
<Geometry>
<Size>
<Height>200</Height>
<Width>200</Width>
</Size>
</Geometry>
</UI>
</DispatchInfo>
</Extension>
<Extension Id="PublishSettingsID">
<DispatchInfo >
<Resources>
<MainPath>./index.html</MainPath>
</Resources>
<Lifecycle>
<AutoVisible>true</AutoVisible>
</Lifecycle>
<UI>
<Type>ModalDialog</Type>
<Menu>Publish Settings</Menu>
<Geometry>
<Size>
<Height>170</Height>
<Width>486</Width>
119
</Size>
</Geometry>
</UI>
</DispatchInfo>
</Extension>
</DispatchInfoList>
7. Pour l’extension contenant le fichier .dll ou .plugin, vous pouvez ignorer toutes les balises
à l’exception de la balise MainPath. La balise MainPath contient le chemin d’accès au
fichier fcm.xml relatif au dossier ExtensionContent. Vous devez renommer le fichier .dll
en .fcm et le placer dans le dossier win près du fichier fcm.xml. De même, sur Mac,
renommez le fichier .plugin en .fcm.plugin et placez-le dans le dossier mac près du
fichier fcm.xml.
8. L’extension HTML permettant de configurer l’interface utilisateur des paramètres de
publication est une extension HTML pour Animate. Pour en savoir plus sur les extensions
HTML pour Animate, voir Création d’extensions HTML.
9. Vérifiez que la valeur inférieure de l’attribut de version dans la balise Host est 14.1, la
version (interne) minimale d’Animate CC avec prise en charge des plates-formes
personnalisées.
<ExecutionEnvironment>
<HostList>
<Host Name="FLPR" Version="15.0" />
</HostList>.
.
.
</ExecutionEnvironment>
10. Passez en mode Script Explorer (Explorateur de scripts), puis cliquez avec le bouton
droit sur votre projet et sélectionnez Exporter > Adobe Extension Builder 3 > Extension
d’application. L’assistant Exportation apparaît.
11. Vous devez détenir un certificat pour signer le package d’extension. Sélectionnez un
certificat existant ou cliquez sur Créer pour en créer un.
12. Cliquez sur Terminer pour compiler le projet. Eclipse génère un fichier de module externe
avec l’extension .zxp, que vous pouvez héberger sur le site Modules complémentaires
Adobe.
Haut de la page
Distribution de votre module externe de prise en charge des platesformes personnalisées
Vous pouvez distribuer le module externe de prise en charge des plates-formes personnalisées en
l’hébergeant sur la page Modules complémentaires Adobe et en le monétisant. Votre module externe passe
par un processus de révision et d’approbation d’Adobe avant d’être répertorié dans la page. Vous pouvez
héberger un module externe comme suit :
1. Connectez-vous à la page Modules complémentaires Adobe au moyen de votre ID
d’utilisateur et de votre mot de passe.
2. Dans le panneau de gauche, sous « Become a producer » (Devenir un producteur),
cliquez sur le lien Go to the producer portal (Accéder au portail du producteur).
3. Cliquez sur le bouton « Sign-up » (S’enregistrer) si vous n’êtes pas enregistré en tant
que producteur.
4. Pour des instructions détaillées sur la façon de s’enregistrer en tant que producteur et
d’héberger vos modules externes, voir Getting Started with the Producer Portal (Prise en
120
main du portail du producteur).
5. Effectuez les étapes suivantes du processus du portail du producteur telles que
documentées dans la page Getting Started (Prise en main) :
a. Compactez votre produit dans un seul fichier.
b. Entrez des informations relatives au produit et téléchargez le fichier.
c. Ajoutez des ressources marketing.
d. Prévisualisez votre produit.
e. Envoyez votre produit pour approbation.
6. Une fois approuvé, votre module externe est répertorié sous la catégorie des produits
Animate sur la page Add-ons.
Remarque :
Si, en tant qu’utilisateur, vous souhaitez installer un module externe, créer un document
de plate-forme personnalisée et le publier au moyen d’Animate, consultez la section
Utilisation du module externe de prise en charge des plates-formes personnalisées.
Pour des informations complètes sur la gestion des extensions Adobe, voir
Téléchargement et installation des extensions.
Haut de la page
Demandes de fonctions et rapport de bogues
Remplissez le formulaire suivant pour faire part de vos questions ou problèmes, signaler les bogues du
produit ou demander des fonctions à l’équipe produit d’Animate :
Demandes de fonctions Adobe et formulaire de signalement de bogues
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
121
Référence des API de prise en charge des plates-formes
personnalisées
Le kit de développement de prise en charge des plates-formes personnalisée inclut un ensemble de fichiers
d’en-tête, d’exemples de modules externes et de fichiers de projet que vous pouvez utiliser pour créer un
module externe pour Animate.
Animate offre une façon uniforme d’intégrer divers éditeurs et types de documents dans son environnement
de création. Les éditeurs et types de documents créés par des développeurs tiers peuvent être intégrés aux
processus « création de documents » et « publier/tester le film » d’Animate au moyen des interfaces C++
prédéfinies.
Les API ou les fichiers d’en-tête C++ figurant dans le kit de développement définissent les modèles DOM
(Document Object Model) et FCM (Flash Component Model), que vous pouvez utiliser pour créer un module
externe de prise en charge des plates-formes personnalisées.
Une documentation de référence détaillée sur les API est disponible à l’endroit suivant :
Référence des API de prise en charge des plates-formes personnalisées
Ressources
Présentation de la prise en charge des plates-formes personnalisées
Activation de la prise en charge des plates-formes personnalisées
Utilisation de modules externes de prise en charge des plates-formes personnalisées
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
122
Création de contenu accessible
À propos du contenu accessible
Utilisation d’Animate pour saisir des informations d’accessibilité pour les logiciels de
lecture d’écran
Spécification des options d’accessibilité avancées pour les logiciels de lecture d’écran
Création d’accessibilité avec ActionScript
Haut de la page
À propos du contenu accessible
Utilisation de l’accessibilité
Vous pouvez créer du contenu accessible par tous les utilisateurs, y compris par ceux atteints d’un handicap,
à l’aide des fonctions d’accessibilité fournies par Adobe Animate dans l’interface utilisateur de
l’environnement de création. Vous tirerez ainsi parti du code ActionScript® qui a été conçu pour mettre en
place l’accessibilité. À mesure que vous concevez des applications Animate, pensez à la façon dont les
utilisateurs vont interagir avec le contenu, et suivez les techniques de création et de développement
recommandées.
Normes d’accessibilité mondiales
De nombreux pays ont adopté des normes d’accessibilité basées sur celles développées par le World Wide
Web Consortium (W3C). Le W3C publie les Web Content Accessibility Guidelines (Directives d’accessibilité
aux contenus Web), un document qui hiérarchise les actions que les créateurs doivent mener pour rendre le
contenu Web accessible. Pour plus d’informations sur la Web Accessibility Initiative, voir le site Web W3C à
l’adresse www.w3.org/WAI.
Aux États-Unis, la loi qui gouverne l’accessibilité est connue sous le nom de Section 508, un amendement du
U.S. Rehabilitation Act (Loi sur la réadaptation des États-Unis).
Pour plus d’informations sur la Section 508, voir les sites web suivants :
Le site Web parrainé par le gouvernement américain à l’adresse www.section508.gov
Site Web Adobe sur l’accessibilité à l’adresse www.adobe.com/fr/accessibility/
Compréhension de la technologie des logiciels de lecture d’écran
Les logiciels de lecture d’écran sont des applications conçues pour que des utilisateurs malvoyants puissent
naviguer dans un site Web et en lire le contenu Web de manière audible. Pour permettre à un logiciel de
lecture d’écran de lire des objets non textuels dans votre application, tels que des illustrations vectorielles et
des animations, vous pouvez utiliser le panneau Accessibilité pour associer un nom et une description à
l’objet. Suivant les raccourcis clavier que vous définissez, vous pouvez autoriser les utilisateurs à parcourir
aisément votre document à l’aide du logiciel de lecture d’écran.
Pour exposer des objets graphiques, vous pouvez fournir une description à l’aide du panneau Accessibilité ou
123
de code ActionScript.
Vous ne pouvez pas contrôler le comportement d’un logiciel de lecture d’écran, mais seulement son contenu.
Vous pouvez baliser le contenu de vos applications Animate de façon à exposer le texte et garantir
l’activation des contrôles par les utilisateurs de logiciels de lecture d’écran. Ainsi, vous pouvez choisir les
objets à exposer aux logiciels de lecture d’écran dans l’application Animate, leur fournir des descriptions et
décider l’ordre dans lequel ils sont présentés aux logiciels de lecture d’écran. Toutefois, vous ne pouvez pas
forcer les logiciels de lecture d’écran à lire un texte spécifique à une heure donnée, ni contrôler la manière
dont ce contenu est lu. Il est donc important que vous testiez vos applications avec divers logiciels de lecture
d’écran pour vous assurer qu’ils fonctionnent comme vous le souhaitez.
Le son est le support le plus important pour la plupart des utilisateurs de logiciels de lecture d’écran.
Demandez-vous comment les sons contenus dans votre document vont interagir avec le texte prononcé par
les logiciels de lecture d’écran. Les utilisateurs de lecteur d’écran risquent de ne pas pouvoir entendre
clairement le contenu de votre application Animate si cette dernière contient des sons forts.
Conditions à remplir pour la plate-forme
Vous ne pouvez créer un contenu Animate conçu pour une utilisation avec les logiciels de lecture d’écran que
sur les plates-formes Windows. Les utilisateurs qui affichent votre contenu Animate doivent disposer de
Flash® Player version 6 (ou ultérieure) d’Adobe, ainsi que d’Internet Explorer sous Windows 98 (ou
ultérieure).
Animate et Microsoft Active Accessibility (Windows uniquement)
Flash Player est optimisé pour Microsoft Active Accessibility (MSAA), lequel offre un moyen très descriptif et
standardisé d’établir une communication entre les applications et les logiciels de lecture d’écran. MSAA n’est
disponible que sous les systèmes d’exploitation Windows. Pour plus d’informations sur Microsoft Accessibility
Technology, reportez-vous au site Web Microsoft Accessibility à l’adresse
www.microsoft.com/enable/default.aspx.
La version de Windows ActiveX (module externe d’Internet Explorer) de Flash Player 6 prend en charge la
technologie MSAA, ce qui n’est pas le cas du lecteur Netscape pour Windows et des lecteurs Windows
autonomes.
Remarque : MSAA n’est actuellement pas pris en charge dans les modes opaque sans fenêtre et
transparent sans fenêtre. Ces modes sont des options dans le panneau HTML des paramètres de
publication, disponibles avec la version Windows d’Internet Explorer 4.0 (ou version ultérieure), avec le
contrôle ActiveX Animate. Si votre contenu Animate doit être accessible par les logiciels de lecture d’écran,
évitez d’utiliser ces modes.
Flash Player met les informations sur les types suivants d’objets d’accessibilité à la disposition des logiciels
de lecture d’écran, à l’aide de MSAA.
Texte dynamique ou statique Le nom est la propriété principale d’un objet de texte. Pour être conforme
aux conventions MSAA, le nom est équivalent au contenu de la chaîne de texte. Un objet de texte peut
également être associé à une chaîne de description. Animate utilise le texte statique ou dynamique situé
immédiatement au-dessus ou à gauche d’un champ de saisie de texte comme étiquette de ce champ.
Remarque : Tout texte qui est une étiquette n’est pas transmis à un logiciel de lecture d’écran, mais le
contenu de ce texte est utilisé comme nom de l’objet dont il est l’étiquette. Les étiquettes ne sont jamais
affectées à des boutons ou des champs de texte dont les noms ont été fournis par l’auteur.
Champs de saisie de texte Ils possèdent une valeur, un nom facultatif, une chaîne descriptive et une
chaîne de raccourci clavier. Le nom d’un objet de saisie de texte peut provenir d’un objet de texte qui est
situé au-dessus de lui ou à sa gauche.
Boutons Ils possèdent un état (appuyé ou non appuyé), prennent en charge une action de programmation
par défaut qui provoque le relâchement momentané du bouton et peuvent avoir un nom, une chaîne de
description et une chaîne de raccourcis clavier. Animate utilise n’importe quel texte situé à l’intérieur d’un
124
bouton comme étiquette de ce bouton.
Remarque : Pour des raisons d’accessibilité, Flash Player considère comme boutons, et non comme clips,
les clips utilisés comme boutons à l’aide de gestionnaires d’événements de boutons tels que onPress.
Composants Ils fournissent une implémentation d’accessibilité spéciale.
Clips Ils sont présentés aux logiciels de lecture d’écran comme des objets graphiques lorsqu’ils ne
contiennent aucun autre objet accessible ou lorsque le panneau Accessibilité est utilisé pour fournir un nom
ou une description de clip. Lorsqu’un clip contient d’autres objets d’accessibilité, le clip lui-même est ignoré et
les objets qu’il contient sont disponibles pour les logiciels de lecture d’écran.
Remarque : Tous les objets Video d’Animate sont traités comme de simples clips.
Prise en charge de l’accessibilité de base dans Flash Player
Par défaut, les objets suivants sont définis comme étant accessibles dans tous les documents Animate et
sont inclus dans les informations que Flash Player fournit aux logiciels de lecture d’écran. Cette prise en
charge générique des documents qui n’utilisent pas les fonctions d’accessibilité inclut les aspects suivants :
Texte dynamique ou statique Le texte est transféré vers le programme de lecture d’écran en tant que nom,
sans contenir de description.
Champs de saisie de texte Le texte est transféré au logiciel de lecture d’écran. Aucun nom n’est transféré,
sauf lorsqu’une relation d’étiquettes est trouvée pour le texte de saisie, tel que le champ de texte statique
situé à proximité de celui du texte de saisie. Aucune chaîne de description ou de chaîne de raccourci clavier
n’est transférée.
Boutons L’état du bouton est transféré vers le logiciel de lecture d’écran. Aucun nom n’est transféré, sauf
lorsque des relations d’étiquettes sont trouvées, et aucune chaîne de description ou de raccourci clavier n’est
transférée.
Documents L’état du document est transféré vers le logiciel de lecture d’écran sans contenir de nom ni de
description.
Accessibilité pour les utilisateurs malentendants
Vous pouvez inclure des légendes pour le contenu audio nécessaire à la compréhension des informations.
L’enregistrement vidéo d’un discours, par exemple, nécessitera probablement des légendes pour
l’accessibilité, ce qui ne sera pas le cas d’un son rapide associé à un bouton.
Voici quelques-unes des méthodes pour ajouter des légendes à un document Animate :
Vous pouvez ajouter du texte sous forme de légendes en veillant à ce que les légendes
soient synchronisées avec le son sur le scénario.
Vous pouvez utiliser Hi-Caption Viewer, un composant disponible auprès de Hi Software
qui fonctionne en association avec Hi-Caption SE pour une utilisation avec Animate. Le
livre blanc intitulé « Captioning Macromedia Animate Movies with Hi-Caption SE »
explique comment utiliser conjointement Hi-Caption SE et Animate pour créer un
document comportant des légendes.
Accessibilité aux animations pour les malvoyants
Vous pouvez changer la propriété d’un objet accessible en cours de lecture d’un fichier SWF. Par exemple,
125
vous pouvez souhaiter mettre en évidence les modifications subies par une image-clé de l’animation.
Toutefois, les nouveaux objets sur les images sont traités différemment selon le logiciel de lecture d’écran
utilisé. Certains logiciels de lecture d’écran peuvent ne lire que le nouvel objet, d’autres peuvent relire tout le
document.
Pour réduire le risque qu’un logiciel de lecture d’écran n’émette du « bavardage » inutile, essayez d’éviter
d’animer le texte, les boutons et les champs de saisie de texte de votre document. Évitez également de créer
une boucle de votre contenu.
Si vous utilisez une fonction telle que la séparation du texte pour animer du texte, Flash Player ne pourra
plus déterminer le contenu textuel de ce texte. Les logiciels de lecture d’écran ne permettent d’accéder à des
objets véhiculant de l’information (tels que des icônes ou animations gestuelles) que si vous indiquez leur
nom et leur description dans votre document ou pour l’intégralité de l’application Animate. Vous pouvez
également ajouter du texte complémentaire dans votre document ou transférer le contenu important des
images au texte.
1. Sélectionnez l’objet dans lequel vous souhaitez modifier les propriétés d’accessibilité.
2. Sélectionnez Fenêtre > Autres panneaux > Accessibilité.
3. Changez les propriétés de l’objet.
Autrement, vous pouvez utiliser le code ActionScript pour mettre à jour les propriétés
d’accessibilité.
Test du contenu accessible
Lorsque vous testez vos applications Animate accessibles, suivez les recommandations ci-dessous :
Téléchargez plusieurs logiciels de lecture d’écran et testez votre application en
l’exécutant dans un navigateur en présence du logiciel de lecture d’écran activé. Assurezvous que le lecteur d’écran n’essaie pas de « parler » à des moments du document où
vous avez inséré de l’audio séparé. Plusieurs applications de lecture d’écran proposent
une version de démonstration du logiciel sous la forme d’un téléchargement gratuit.
Essayez le plus de lecteurs d’écran possibles afin de garantir la compatibilité pour tous
les logiciels de lecture d’écran.
Testez le contenu interactif et vérifiez que les utilisateurs peuvent se déplacer
efficacement dans votre contenu en utilisant le clavier uniquement. Tous les logiciels de
lecture d’écran ne fonctionnent pas de la même façon pour le traitement de la saisie au
clavier. En d’autres termes, il est possible que votre contenu Animate ne reçoive pas les
frappes de touche souhaitées. Veillez à tester tous les raccourcis clavier.
Haut de la page
Utilisation d’Animate pour saisir des informations d’accessibilité
pour les logiciels de lecture d’écran
Animate pour les logiciels de lecture d’écran et l’accessibilité
Les logiciels de lecture d’écran énoncent une description du contenu, lisent le texte et aident les utilisateurs à
parcourir les interfaces utilisateur des applications classiques telles que les menus, les barres d’outils, les
boîtes de dialogue et les champs de saisie de texte.
Par défaut, les objets suivants sont définis comme étant accessibles dans tous les documents Animate et
sont inclus dans les informations que Flash Player fournit aux logiciels de lecture d’écran :
Texte dynamique
Champs de saisie de texte
126
Boutons
Clips
Applications Animate complètes
Flash Player fournit automatiquement les noms des objets de texte statiques et
dynamiques, qui sont simplement le contenu du texte. Pour chacun des objets
accessibles présentés ci-dessus, vous pouvez définir des propriétés descriptives à lire
par les logiciels de lecture d’écran à haute voix. Vous pouvez également déterminer la
manière dont Flash Player décide des objets à présenter aux logiciels de lecture d’écran.
Ainsi, vous pouvez déterminer que certains objets accessibles ne seront pas du tout
présentés à ces logiciels.
Panneau Accessibilité d’Animate
Le panneau Accessibilité d’Animate (Fenêtre > Autres panneaux > Accessibilité) vous permet de fournir des
informations d’accessibilité aux logiciels de lecture d’écran et de définir des options d’accessibilité pour les
différents objets Animate ou pour des applications Flash Professional entières.
Remarque : une autre méthode consiste à saisir des informations d’accessibilité à l’aide du code
ActionScript.
Si vous sélectionnez un objet sur la scène, vous pouvez rendre cet objet accessible, puis spécifier des
options et un ordre d’index de tabulation pour l’objet. Pour les clips, vous pouvez spécifier si les informations
des objets enfants doivent être transmises au logiciel de lecture d’écran (cette option est sélectionnée par
défaut lorsque vous rendez un objet accessible).
Lorsqu’aucun objet n’est sélectionné sur la scène, le panneau Accessibilité permet d’attribuer les options
d’accessibilité d’une application Animate entière. Vous pouvez rendre l’intégralité de l’application accessible,
rendre les objets enfants accessibles, faire étiqueter automatiquement les objets par Animate et fournir des
noms spécifiques et des descriptions aux objets.
Tous les objets des documents Animate doivent posséder des noms d’occurrence afin que vous puissiez leur
appliquer des options d’accessibilité. Les noms d’occurrences des objets se créent dans l’inspecteur des
propriétés. Le nom d’occurrence sert à faire référence à l’objet dans le code ActionScript.
Les options suivantes sont disponibles dans le panneau Accessibilité :
Rendre l’objet accessible (Par défaut) Indique à Flash Player de transmettre les informations d’accessibilité
d’un objet à un logiciel de lecture d’écran. Lorsque l’option est désactivée, les informations d’accessibilité de
l’objet ne sont pas transmises aux logiciels de lecture d’écran. Il peut être utile de désactiver cette option
lorsque vous testez l’accessibilité du contenu car certains objets peuvent être étrangers ou décoratifs et le fait
de les rendre accessibles pourrait produire des résultats qui prêtent à confusion dans le logiciel de lecture
d’écran. Vous pouvez ensuite appliquer manuellement un nom à l’objet étiqueté et masquer le texte
d’étiquette en désactivant l’option Rendre l’objet accessible. Lorsque l’option Rendre l’objet accessible est
désactivée, tous les autres contrôles figurant sur le panneau Accessibilité sont désactivés.
Rendre les objets enfants accessibles (Clips seulement ; par défaut) Indique à Flash Player de
transmettre des informations objet enfant au logiciel de lecture d’écran. La désactivation de cette option pour
un clip fait apparaître celui-ci comme un simple clip dans l’arborescence des objets accessibles, même si le
clip contient du texte, des boutons et d’autres objets. Tous les objets inclus dans le clip sont ensuite
masqués dans l’arborescence des objets. Cette option est utile essentiellement pour masquer les objets
étrangers vis-à-vis des logiciels de lecture d’écran.
Remarque : Si un clip est utilisé comme bouton, c’est-à-dire si un gestionnaire de l’événement de bouton
onPress ou onRelease lui est affecté, l’option Rendre les objets enfant accessibles est ignorée, car les
boutons sont toujours traités comme de simples clips et leurs enfants ne sont jamais examinés, sauf dans le
cas des étiquettes.
Etiquetage automatique Indique à Animate d’étiqueter automatiquement les objets sur la scène avec le
texte qui leur est associé.
127
Nom Indique le nom de l’objet. Les logiciels de lecture d’écran identifient l’objet en prononçant ces noms.
Lorsque les objets accessibles n’ont pas de noms spécifiés, un logiciel de lecture d’écran peut lire un mot
générique, comme Bouton, ce qui peut prêter à confusion.
Remarque : Il ne faut pas confondre les noms d’objets spécifiés dans le panneau Accessibilité avec les noms
d’occurrences spécifiés dans l’inspecteur des propriétés. Attribuer un nom à un objet par le biais du panneau
Accessibilité ne lui attribue pas un nom d’occurrence.
Description Permet de saisir une description de l’objet pour le logiciel de lecture d’écran. Celui-ci lit cette
description.
Raccourci Sert à décrire les raccourcis clavier à l’utilisateur. Le texte saisi dans ce champ de texte est lu
par le logiciel de lecture d’écran. La saisie de texte de raccourci clavier à cet endroit ne crée pas de raccourci
clavier pour l’objet sélectionné. Vous devez fournir des gestionnaires de clavier ActionScript pour créer des
touches de raccourcis clavier.
Index de tabulation ( seulement) Crée un ordre de tabulation dans lequel l’accès aux objets se fait lorsque
l’utilisateur appuie sur la touche de tabulation. La fonction d’index de tabulation fonctionne pour la navigation
par clavier dans une page, mais pas pour l’ordre de lecture du logiciel de lecture d’écran.
Choix du nom des boutons, champs de texte et applications SWF
Vous pouvez utiliser le panneau Accessibilité comme suit pour attribuer des noms aux boutons et aux
champs de saisie de texte pour qu’ils soient correctement identifiés par le logiciel de lecture d’écran :
Utilisez la fonction d’étiquetage automatique pour affecter en tant qu’étiquette le texte
adjacent à l’objet ou compris dans l’objet .
Saisissez une étiquette spécifique dans le champ de nom du panneau Accessibilité.
Animate applique automatiquement en tant qu’étiquette de texte le nom que vous placez
au-dessus, dans ou près d’un bouton ou champ de texte. Les étiquettes des boutons
doivent apparaître dans la zone de délimitation du bouton. Pour le bouton de l’illustration
suivante, la plupart des logiciels de lecture d’écran lisent d’abord le mot button, puis
l’étiquette de texte Home. L’utilisateur peut appuyer sur Retour ou Entrée pour activer le
bouton.
Un formulaire peut inclure un champ de saisie de texte où les utilisateurs saisissent leurs
noms. Un champ de texte statique, avec le texte Nom, apparaît en regard du champ de
saisie de texte. Lorsque Flash Player découvre une organisation de ce type, il suppose
que l’objet de texte statique fait office d’étiquette pour le champ de saisie de texte.
Par exemple, lorsque la partie suivante d’un formulaire est rencontrée, un logiciel de
lecture d’écran lit « Saisissez votre nom ici ».
Dans le panneau Accessibilité, vous pouvez désactiver l’affectation automatique
d’étiquette si elle ne convient pas à votre document. Vous pouvez également désactiver
l’affectation automatique d’étiquette pour des objets précis contenus dans votre
document.
Affectation d’un nom à un objet
Vous pouvez désactiver l’étiquetage automatique pour une partie d’une application et fournir des noms pour
les objets dans le panneau Accessibilité. Si l’affectation automatique d’étiquette est activée, vous pouvez
également sélectionner des objets précis et attribuer des noms aux objets dans le champ de texte Nom dans
128
le panneau Accessibilité de façon à ce que le nom soit utilisé à la place de l’étiquette de texte de l’objet.
Lorsqu’un bouton ou un champ de saisie de texte ne comporte pas d’étiquette de texte ou lorsque l’étiquette
se trouve à un endroit que Flash Player ne peut pas détecter, vous pouvez spécifier un nom pour le bouton
ou le champ de texte. Vous pouvez également spécifier un nom si l’étiquette de texte se trouve près d’un
bouton ou d’un champ de texte alors que vous ne souhaitez pas que ce texte soit utilisé comme nom de cet
objet.
Par exemple, dans l’illustration suivante, le texte qui décrit le bouton apparaît en dehors et à droite du bouton.
Flash Player ne détecte pas le texte à cet endroit et le texte n’est pas lu par le logiciel de lecture d’écran.
Pour remédier à cette situation, ouvrez le panneau Accessibilité, sélectionnez le bouton et saisissez le nom et
la description. Pour éviter la répétition, rendez l’objet texte inaccessible.
Remarque : le nom d’accessibilité d’un objet n’a aucun rapport avec le nom d’occurrence ou de variable
ActionScript qui lui est affecté. Ces informations s’appliquent généralement à tous les objets. Pour plus
d’informations sur la manière dont ActionScript gère les noms d’occurrence et les noms de variables dans les
champs de texte, voir « À propos des noms d’occurrence et de variable de champ de texte » dans Formation
à ActionScript 2.0 dans Adobe Animate à l’adresse http://www.adobe.com/go/learn_cs5_learningas2_fr.
Spécification d’un nom et d’une description de bouton, d’un champ de texte ou d’une
application SWF
1. Effectuez l’une des opérations suivantes :
Pour définir le nom d’un bouton ou d’un champ de texte, sélectionnez l’objet souhaité
sur la scène.
Pour définir le nom d’une application Animate entière, désélectionnez tous les objets
de la scène.
2. Sélectionnez Fenêtre > Autres panneaux > Accessibilité.
3. Sélectionnez soit l’option Rendre l’objet accessible (pour des boutons ou des champs de
texte), soit l’option par défaut Rendre le clip accessible (pour des applications Animate
entières).
4. Saisissez le nom et la description d’un bouton, d’un champ de texte ou d’une application
Animate.
Définition de l’accessibilité d’un objet sélectionné dans une application SWF
1. Sélectionnez Fenêtre > Autres panneaux > Accessibilité.
2. Effectuez l’une des opérations suivantes :
Activez l’option Rendre l’objet accessible (la valeur par défaut) pour exposer l’objet
aux logiciels de lecture d’écran et pour activer les autres options du panneau.
Désactivez l’option Rendre l’objet accessible pour masquer l’objet aux logiciels de
lecture d’écran. Les autres options du panneau sont alors désactivées.
3. Saisissez un nom et une description pour l’objet sélectionné, selon les besoins :
Texte dynamique Pour fournir la description d’un texte statique, vous devez le convertir
en texte dynamique.
Champs de texte de saisie ou boutons Créez un raccourci clavier
129
Clips Activez l’option Rendre les objets enfants accessibles pour exposer les objets du
clip aux logiciels de lecture d’écran.
Remarque : Si votre application peut être décrite en une phrase simple qu’un logiciel de
lecture d’écran peut transmettre aisément, désactivez Rendre les enfants accessibles et
entrez une description appropriée.
Accessibilité d’une application SWF entière
Une fois qu’un document Animate est terminé et prêt à être publié ou exporté, rendez accessible l’intégralité
de l’application Animate.
1. Désélectionnez tous les éléments dans le document.
2. Sélectionnez Fenêtre > Autres panneaux > Accessibilité.
3. Activez l’option Rendre l’animation accessible (la valeur par défaut) pour exposer le
document aux logiciels de lecture d’écran.
4. Activez ou désactivez l’option Rendre les objets enfant accessibles pour exposer ou
omettre tous les objets accessibles dans le document vis-à-vis des logiciels de lecture
d’écran.
5. Si vous avez activé l’option Rendre l’animation accessible à l’étape 2, saisissez un nom
et une description concernant le document suivant les besoins.
6. Activez l’option Etiquetage auto (valeur par défaut) afin d’utiliser les objets de texte
comme des étiquettes automatiques pour les boutons ou les champs de saisie de texte
accessibles figurant dans le document. Désactivez cette option pour annuler l’affectation
automatique d’étiquettes et exposer les objets de texte aux logiciels de lecture d’écran en
tant qu’objets de texte.
Affichage et création d’un ordre de tabulation et d’un ordre de lecture
Deux aspects sont à considérer pour l’ordre d’index de tabulation : l’ordre de tabulation dans lequel un
utilisateur parcourt le contenu Web et l’ordre dans lequel les éléments sont lus par le logiciel de lecture
d’écran, appelé l’ordre de lecture.
Flash Player utilise un ordre d’index de tabulation de la gauche vers la droite et de haut en bas. Vous pouvez
créer l’ordre de tabulation et de lecture à l’aide de la propriété tabIndex dans le code ActionScript (dans
ActionScript, la propriété tabIndex est synonyme de l’ordre de lecture).
Remarque : Flash Player ne nécessite plus d’ajouter tous les objets d’un fichier FLA à une liste de valeurs
d’index de tabulation. En l’absence d’index de tabulation pour l’ensemble des objets, chaque objet sera lu
correctement avec un lecteur d’écran.
Ordre de tabulation Vous pouvez créer un ordre de tabulation qui détermine l’ordre dans lequel les objets
reçoivent le focus d’entrée quand les utilisateurs appuient sur la touche de tabulation. Vous pouvez utiliser
ActionScript pour indiquer l’ordre de tabulation ou, si vous disposez d’Adobe Animate, vous pouvez utiliser le
panneau Accessibilité. L’index de tabulation que vous affectez dans le panneau Accessibilité ne contrôle pas
nécessairement l’ordre de lecture.
Ordre de lecture L’ordre dans lequel un lecteur d’écran lit les informations concernant l’objet. Pour créer un
ordre de lecture, vous devez utiliser le code ActionScript pour attribuer un index de tabulation à chaque
occurrence. Vous devez créer un index de tabulation pour chaque objet accessible et pas uniquement pour
les objets pouvant recevoir le focus. Par exemple, bien que le texte dynamique ne soit pas accessible par
tabulation, il doit comporter des index de tabulation. Si vous ne créez pas un index de tabulation pour chaque
objet accessible dans une fenêtre donnée, Flash Player ignore tous les index de tabulation pour cette fenêtre
si un logiciel de lecture d’écran est présent et utilise l’ordre de tabulation par défaut à la place.
130
Création d’un index d’ordre de tabulation pour la navigation par clavier dans
le panneau Accessibilité
Vous pouvez créer un index d’ordre de tabulation dans le panneau Accessibilité pour la navigation par clavier
pour les objets suivants :
Texte dynamique
Saisie de texte
Boutons
Clips, y compris les clips compilés
Composants
Écrans
Remarque : Vous pouvez également utiliser le code ActionScript pour créer un index
d’ordre de tabulation de navigation de clavier.
Le focus de tabulation s’effectue dans un ordre numérique en commençant par le numéro
d’index le moins élevé. Une fois que le focus de tabulation atteint le niveau le plus élevé
de l’index de tabulation, il revient au numéro d’index le plus bas.
Lorsque vous déplacez des objets avec des index de tabulation définis par l’utilisateur
dans votre document ou vers un autre document, Animate conserve les attributs d’index.
Vous devez alors vérifier la présence de conflits d’index et les résoudre, comme dans le
cas de deux objets différents sur la scène portant le même numéro d’index de tabulation.
Remarque : Si plusieurs objets possèdent le même index de tabulation dans une image
donnée, Animate suit l’ordre dans lequel les objets étaient placés sur la scène.
1. Sélectionnez l’objet dans lequel vous souhaitez attribuer un ordre de tabulation.
2. Sélectionnez Fenêtre > Autres panneaux > Accessibilité.
3. Si vous fournissez un index pour l’objet sélectionné uniquement, saisissez un entier
positif (jusqu’à 65 535) dans le champ de texte de l’index de tabulation. Cet entier doit
refléter l’ordre dans lequel l’objet sélectionné doit recevoir le focus.
4. Pour afficher un ordre de tabulation, choisissez Affichage > Afficher l’ordre de tabulation.
Les numéros d’index de tabulation des objets individuels apparaissent dans le coin
supérieur gauche de l’objet.
Numéros d’index de tabulation
Remarque : les index de tabulation créés avec le code ActionScript n’apparaissent pas
sur la scène lorsque l’option Afficher l’ordre de tabulation est activée.
Haut de la page
Spécification des options d’accessibilité avancées pour les
logiciels de lecture d’écran
131
Désactivation de l’affectation automatique d’étiquette et spécification d’un
nom d’objet pour les lecteurs d’écran
1. Sur la scène, sélectionnez le bouton ou le champ de saisie de texte dont vous voulez
contrôler l’affectation d’étiquettes.
2. Sélectionnez Fenêtre > Autres panneaux > Accessibilité.
3. Activez Rendre l’objet accessible (paramètre par défaut).
4. Saisissez un nom pour l’objet. Le nom est lu en tant qu’étiquette du bouton ou du champ
de texte.
5. Pour désactiver l’accessibilité automatique (et masquer l’étiquette vis-à-vis des logiciels
de lecture d’écran), sélectionnez l’objet de texte sur la scène.
6. Si l’objet texte est un texte statique, convertissez-le en texte dynamique (dans
l’inspecteur des propriétés, choisissez Type de texte > Texte dynamique).
7. Désactivez Rendre l’objet accessible.
Masquage d’un objet vis-à-vis du logiciel de lecture d’écran
Vous pouvez masquer un objet sélectionné des logiciels de lecture d’écran et vous pouvez décider de
masquer les objets accessibles contenus dans un clip ou une application Animate, ou encore présenter
seulement le clip ou l’application Animate aux logiciels de lecture d’écran.
Remarque : Vous ne devez masquer que les objets répétitifs ou qui ne véhiculent aucun contenu.
Lorsqu’un objet est masqué, le logiciel de lecture d’écran ignore l’objet.
1. Sur la scène, sélectionnez le bouton ou le champ de saisie de texte que vous souhaitez
masquer au logiciel de lecture d’écran.
2. Sélectionnez Fenêtre > Autres panneaux > Accessibilité.
3. Dans le panneau Accessibilité, procédez de l’une des façons suivantes :
Si l’objet est un clip, bouton, champ de texte ou un autre objet, désactivez l’option
Rendre l’objet accessible.
Si l’objet est l’enfant d’un clip, désactivez l’option Rendre les objets enfants
accessibles.
Création d’un raccourci clavier pour un objet de lecteurs d’écran
Vous pouvez créer un raccourci clavier pour un objet, tel qu’un bouton de façon à ce que les utilisateurs
puissent y accéder rapidement sans écouter le contenu d’une page entière. Par exemple, vous pouvez créer
un raccourci clavier de façon à ce que les utilisateurs puissent naviguer rapidement vers un menu, une barre
d’outils, la page suivante ou un bouton d’envoi.
Pour créer un raccourci clavier, rédigez du code ActionScript pour un objet. Si vous fournissez un raccourci
clavier pour un champ de saisie de texte ou un bouton, vous devez utiliser la classe ActionScript Key pour
détecter la touche sur laquelle l’utilisateur appuie en cours de lecture du contenu Animate. Voir Clé dans le
Guide de référence du langage ActionScript 2.0. Voir « Capture des pressions sur les touches » dans
Formation à ActionScript 2.0 dans Adobe Animate à l’adresse
http://www.adobe.com/go/learn_cs5_learningas2_fr.
Sélectionnez l’objet et ajoutez le nom du raccourci clavier au panneau Accessibilité de manière à ce que le
logiciel de lecture d’écran puisse le lire.
Testez votre contenu Animate avec plusieurs logiciels de lecture d’écran. La fonctionnalité des raccourcis
clavier dépend également du logiciel de lecture d’écran utilisé. La combinaison de touches Ctrl+F, par
132
exemple, est réservée au navigateur et au logiciel de lecture d’écran. Les touches de direction sont
également réservées par le logiciel de lecture d’écran. En général, vous pouvez utiliser les touches de 0 à 9
du clavier pour les raccourcis clavier. Cependant, même ces touches sont de plus en plus utilisées par les
logiciels de lecture d’écran.
Création d’un raccourci clavier
1. Sur la scène, sélectionnez le bouton ou le champ de saisie de texte pour lequel vous
souhaitez créer un raccourci clavier
2. Sélectionnez Fenêtre > Autres panneaux > Accessibilité.
3. Dans le champ Raccourci, entrez le nom du raccourci clavier, en appliquant les
conventions suivantes :
Écrivez le nom des touches en toutes lettres (Contrôle ou Alt, par exemple).
Utilisez des majuscules pour les caractères alphabétiques.
Utilisez un signe plus (+) entre les noms des touches, sans espace (par exemple,
Contrôle+A).
Remarque : Animate ne vérifie pas si le code ActionScript devant coder le raccourci clavier a bien été créé.
Etablissement d’une correspondance entre un raccourci clavier et une occurrence de
bouton Ctrl+7 avec l’occurrence myButton
1. Sélectionnez l’objet sur la scène, affichez le panneau Accessibilité, puis entrez la
combinaison de touches du raccourci dans le champ Raccourci. Par exemple, Ctrl+7.
2. Saisissez le code ActionScript 2.0 suivant dans le panneau Actions :
Remarque : dans cet exemple, le raccourci est Ctrl+7.
function myOnPress() {
trace( "hello" );
}
function myOnKeyDown() {
if (Key.isDown(Key.CONTROL) && Key.getCode() == 55) // 55 is key code for 7
{
Selection.setFocus(myButton);
myButton.onPress();
}
}
var myListener = new Object();
myListener.onKeyDown = myOnKeyDown;
Key.addListener(myListener);
myButton.onPress = myOnPress;
myButton._accProps.shortcut = "Ctrl+7"
Accessibility.updateProperties();
Remarque : dans cet exemple, le raccourci clavier affecte la combinaison de touches Contrôle+7 à un
bouton dont le nom d’occurrence est myButton et rend les informations sur le raccourci clavier disponibles
pour les logiciels de lecture d’écran. Dans cet exemple, lorsque vous appuyez sur Ctrl+7, la fonction
myOnPress affiche le texte « bonjour » dans le panneau Sortie. Voir addListener (méthode IME.addListener)
dans le Guide de référence du langage ActionScript 2.0 à l’adresse www.adobe.com/go/learn_cs5_as2lr_fr.
Haut de la page
Création d’accessibilité avec ActionScript
À propos du code ActionScript et de l’accessibilité
133
Vous pouvez créer des documents accessibles avec du code ActionScript®. Pour les propriétés
d’accessibilité qui s’appliquent à l’intégralité du document, vous pouvez créer ou modifier une variable globale
appelée _accProps. Voir la propriété _accProps dans le Guide de référence du langage ActionScript 2.0 à
l’adresse www.adobe.com/go/learn_cs5_as2lr_fr.
Pour les propriétés qui s’appliquent à un objet spécifique, vous pouvez utiliser la syntaxe
instancename._accProps. La valeur de _accProps est un objet qui peut inclure n’importe laquelle des
propriétés suivantes :
Propriété
Type
Sélection équivalente dans le panneau
Accessibilité
S’applique
à
.silent
Boolean Rendre une animation accessible/Rendre l’objet
accessible (logique inverse)
Documents
entiers
Boutons
Clips
Texte
dynamique
Saisie de
texte
.forceSimple Boolean Rendre les objets enfants accessibles (logique
inverse)
Documents
entiers
Clips
.name
chaîne
Nom
Documents
entiers
Boutons
Clips
Saisie de
texte
.description chaîne
Description
Documents
entiers
Boutons
Clips
Texte
dynamique
Saisie de
texte
.shortcut
chaîne
Raccourci
Boutons
Clips
Saisie de
texte
Remarque : la logique inverse signifie qu’une valeur true en ActionScript correspond à une case à cocher
non sélectionnée dans le panneau Accessibilité et que la valeur false en ActionScript correspond à une
case à cocher sélectionnée dans le panneau Accessibilité.
La modification de la variable _accProps n’a pas d’effet en soi. Vous devez également recourir à la méthode
Accessibility.updateProperties pour informer les utilisateurs des logiciels de lecture d’écran du
changement du contenu Animate. Lorsque la méthode est appelée, Flash Player réexamine toutes les
propriétés d’accessibilité, met à jour les descriptions de propriétés pour le logiciel de lecture d’écran et, si
134
nécessaire, envoie des événements au logiciel de lecture d’écran qui indiquent que des changements se sont
produits.
Lorsque les propriétés d’accessibilité de plusieurs objets sont mises à jour en même temps, il suffit d’inclure
un seul appel à Accessiblity.updateProperties (si les mises à jour vers le logiciel de lecture d’écran
sont trop fréquentes, certains logiciels de lecture d’écran peuvent devenir trop détaillés).
Voir la méthode Accessibility.updateProperties dans le Guide de référence du langage
ActionScript 2.0 à l’adresse www.adobe.com/go/learn_cs5_as2lr_fr.
Détection de la lecture d’écran avec la méthode Accessibility.isActive()
Pour créer du contenu Animate qui se comporte de manière spécifique si un logiciel de lecture d’écran est
actif, utilisez la méthode ActionScript Accessibility.isActive(), qui renvoie la valeur true si un
logiciel de lecture d’écran est présent ou false dans le cas contraire. Vous pouvez alors concevoir votre
contenu Animate pour qu’il se comporte d’une manière compatible avec l’utilisation du logiciel de lecture
d’écran (en masquant les éléments enfants vis-à-vis du logiciel de lecture d’écran, par exemple). Pour plus
d’informations, voir la méthode Accessibility.isActive dans le Guide de référence du langage
ActionScript 2.0 à l’adresse www.adobe.com/go/learn_cs5_as2lr_fr.
Par exemple, vous pouvez utiliser la méthode Accessibility.isActive() pour décider d’inclure ou non
une animation non sollicitée. Une animation non sollicitée est une animation qui se produit sans action du
logiciel de lecture d’écran, ce qui peut être source de confusion pour ce dernier.
La méthode Accessibility.isActive() assure une communication asynchrone entre le contenu
Animate et Flash Player. De ce fait, un léger décalage peut se produire en temps réel entre le moment où la
méthode est appelée et celui où Flash Player devient actif, renvoyant une valeur incorrecte de false. Pour
garantir que la méthode est appelée correctement, vous pouvez effectuer l’une des opérations suivantes :
Plutôt que d’utiliser la méthodeAccessibility.isActive() lorsque le contenu
Animate est lu pour la première fois, appelez la méthode à chaque fois que vous devez
prendre une décision concernant l’accessibilité.
Insérez un court délai d’une ou deux secondes au début de votre document pour laisser
suffisamment de temps au contenu Animate pour contacter Flash Player.
Par exemple, vous pourriez utiliser un événement onFocus pour associer cette méthode
à un bouton. En général, cela laisse assez de temps au fichier SWF pour se charger et
vous pouvez supposer sans crainte que les utilisateurs de logiciel de lecture d’écran
accéderont par tabulation au premier bouton ou objet sur la scène.
Utilisation du code ActionScript pour créer un ordre de tabulation pour les
objets accessibles
Pour créer l’ordre de tabulation avec du code ActionScript®, affectez la propriété tabIndex aux objets
suivants :
Texte dynamique
Saisie de texte
Boutons
Clips, y compris les clips compilés
images du scénario
Écrans
Préparez un ordre de tabulation complet pour tous les objets accessibles. Si vous créez un ordre de
tabulation pour une image et ne spécifiez pas d’ordre de tabulation pour un objet accessible dans l’image,
Flash Player ignore toutes les affectations d’ordre de tabulation personnalisées. De plus, un nom
d’occurrence doit être spécifié pour tous les objets affectés à un ordre de tabulation, à l’exception des
135
images, dans le champ de texte Nom de l’occurrence de l’inspecteur des propriétés. Même les éléments qui
ne sont pas des arrêts de tabulation, comme le texte, doivent être inclus dans l’ordre de tabulation s’ils
doivent être lus dans cet ordre.
Puisque le texte statique ne peut pas recevoir de nom d’occurrence, il ne peut pas être inclus dans la liste
des valeurs de propriétés de tabIndex. Par conséquent, une seule occurrence de texte statique à tout
endroit dans le fichier SWF entraîne le retour à l’ordre de lecture par défaut.
Pour indiquer un ordre de tabulation, affectez un numéro d’ordre à la propriété tabIndex, comme dans
l’exemple suivant :
_this.myOption1.btn.tabIndex = 1
_this.myOption2.txt.tabIndex = 2
Voir tabIndex dans Button, MovieClip et TextField dans le Guide de référence du langage
ActionScript 2.0 à l’adresse www.adobe.com/go/learn_cs5_as2lr_fr.
Pour affecter un ordre de tabulation personnalisé, vous pouvez également utiliser la méthode
tabChildren() ou tabEnabled(). Voir MovieClip.tabChildren, MovieClip.tabEnabled et
TextField.tabEnabled dans le Guide de référence du langage ActionScript 2.0 à l’adresse
www.adobe.com/go/learn_cs5_as2lr_fr.
Utilisation des composants accessibles
Un ensemble de composants IU de base accélère la création d’applications accessibles. Ces composants
automatisent un grand nombre des pratiques d’accessibilité les plus courantes liées à l’étiquetage et à l’accès
clavier, alors que le test et l’aide garantissent une expérience cohérente dans différentes applications
sophistiquées. Animate contient l’ensemble suivant de composants accessibles :
SimpleButton
CheckBox
RadioButton
Label
TextInput
TextArea
ComboBox
ListBox
Window
Alert
DataGrid
Pour chaque composant accessible, activez la partie accessible du composant à l’aide de la commande
enableAccessibility(). Cette commande inclut l’objet d’accessibilité avec le composant lorsque le
document est compilé. Étant donné qu’il n’existe pas de méthode simple de suppression d’un objet après qu’il
a été ajouté au composant, ces options sont désactivées par défaut. Il est par conséquent important que
vous activiez l’accessibilité pour chaque composant. Cette étape ne doit être effectuée qu’une seule fois pour
chaque composant ; il n’est pas nécessaire d’activer l’accessibilité pour chaque occurrence d’un composant
pour un document donné. Voir les composants Button, CheckBox, ComboBox, Label, List, RadioButton et
Window dans le Guide de référence du langage des composants ActionScript 2.0 à l’adresse
www.adobe.com/go/learn_cs5_as2lr_fr.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
136
Activation de la prise en charge des plates-formes personnalisées
Cet article explique aux développeurs de modules externes comment créer des modules externes d’Animate
afin de prendre en charge les plates-formes personnalisées. Pour créer un module externe de prise en
charge des plates-formes personnalisées, les développeurs doivent télécharger le kit de développement de
prise en charge des plates-formes personnalisées à partir de l’emplacement suivant :
Téléchargez un exemple de module externe à partir de l’emplacement suivant et utilisez-le comme référence
pour la création d’un module externe de prise en charge des plates-formes personnalisées :
CustomPlatformSupportDevelopmentKit.zip
Kit de développement de prise en charge des plates-formes personnalisées
SampleCreateJSPlatform.zip
Exemple de module externe
Un module externe se compose des éléments suivants :
DocType ajoute un nouveau type de document pour la plate-forme personnalisée dans
Animate et contrôle les fonctions de création.
L’éditeur autorise la configuration des paramètres de publication et la publication du
document sur la plate-forme personnalisée.
Pour une présentation de la fonctionnalité de prise en charge des plates-formes personnalisées, voir Prise en
charge des plates-formes personnalisées.
Création d’un module externe de prise en charge des plates-formes personnalisées
Animate
Configuration logicielle requise
Documentation de référence des API pour les développeurs de modules
complémentaires
Création d’un module externe de prise en charge des plates-formes personnalisées
Groupement du module externe de prise en charge des plates-formes personnalisées
Distribution de votre module externe de prise en charge des plates-formes
personnalisées
Demandes de fonctions et rapport de bogues
Haut de la page
Création d’un module externe de prise en charge des plates-formes
personnalisées Animate
Vous pouvez développer un module externe de prise en charge des plates-formes personnalisées en utilisant
l’une des méthodes suivantes :
Création d’un module externe à l’aide des API du kit de développement de prise en
charge des plates-formes personnalisées.
Personnalisez les paramètres de l’exemple de module externe inclus dans le kit de
développement pour répondre à vos besoins.
Les modules externes de prise en charge des plates-formes personnalisées sont regroupés sous forme de
137
fichiers .zxp pouvant être installés avec Animate CC. Vous pouvez héberger le module externe sur la
page Modules complémentaires Adobe pour permettre aux utilisateurs de le télécharger et de l’installation au
moyen de l’application Creative Cloud. Vous pouvez aussi distribuer les modules externes au format .zxp
pour permettre leur installation au moyen d’Adobe Extensions Manager.
Configuration logicielle requise
Un développeur doit disposer des logiciels suivants pour créer un module externe au moyen du kit de
développement de prise en charge de plates-formes personnalisées.
Microsoft Windows 7 ou Apple Mac OS 10.8 et versions ultérieures
Microsoft Visual Studio 2012 (Windows) ou XCode 4.5.2 (Mac)
Animate CC 2014.1 (octobre)
Eclipse IDE pour développeurs C/C++
Adobe Extension Builder 3.0
Adobe Extension Manager 7.2.1.6
Documentation de référence des API pour les développeurs de modules
complémentaires
Le kit de développement de prise en charge des plates-formes personnalisées contient les éléments
suivants :
FCM (Flash Component Model) : les fichiers d’en-tête figurant dans le kit de
développement définissent un cadre appelé FCM, qui est chargé de la gestion des
modules externes.
DocType : contient un ensemble d’interfaces qui vous permettent d’ajouter un nouveau
type de document à la page de démarrage d’Animate et d’activer ou de désactiver des
fonctionnalités pour le type de document personnalisé.
DOM (Document Object Model) : contient un ensemble d’interfaces qui vous permettent
d’accéder au contenu du document Animate sous forme de DOM.
Éditeur : contient un ensemble d’interfaces fournissant des crochets pour les processus
de publication.
Pour obtenir des informations complètes sur les API dans la prise en charge des plates-formes
personnalisées et des exemples d’utilisation pour créer votre module externe, voir Référence des API de
prise en charge des plates-formes personnalisées.
Création d’un module externe de prise en charge des plates-formes
personnalisées
Vous pouvez créer un module externe de prise en charge des plates-formes personnalisées comme suit :
1. Téléchargez le Kit de développement de prise en charge des plates-formes
personnalisées.
2. Extrayez le contenu du kit sur votre ordinateur.
3. Ouvrez un nouveau projet dans VisualStudio ou Xcode et incluez les fichiers d’en-tête
dans le kit de développement à vos projets de développement. Pour démarrer
rapidement la création de votre module externe de prise en charge des plates-formes
personnalisées, vous pouvez utiliser l’exemple suivant de module externe disponible
sous le répertoire SampleCreateJSPlatform comme code de base pour votre projet de
module externe.
Par exemple, les fichiers du module externe SampleCreateJS se trouvent dans
SampleCreateJSPlatform\Plugin\SampleCreateJS\project\
4. Apportez les modifications requises pour votre plateforme cible.
138
5. Compilez le code pour générer un module externe (.dll ou .plug-in).
Groupement du module externe de prise en charge des plates-formes
personnalisées
Vous pouvez générer un module distribuable à partir du module externe de prise en charge des plates-formes
personnalisées comme suit :
1. Ouvrez l’exemple de fichier Eclipse ou dans l’assistant Nouveau projet Eclipse, créez un
nouveau projet d’extension d’application. Donnez un nom au projet, puis cliquez sur
Suivant.
2. Dans le panneau Nouveau projet d’extension d’application Adobe, sélectionnez
Adobe Animate en tant qu’application cible et cliquez sur Suivant.
3. Convertissez les extensions des fichiers de module externe que vous avez créés de
.dll en .fcm sous Windows et de .plug-in en .fcm.plug-in sous Mac, et ajoutez les
fichiers de module externe au projet (ExtensionContent/plugins/lib/win pour
Windows et ExtensionContent/plugins/lib/mac pour Mac).
4. Configurez l’extension en modifiant le fichier manifest.xml. Pour ouvrir le fichier
manifeste, cliquez avec le bouton droit de la souris sur l’extension dans l’explorateur de
projets et sélectionnez Adobe Extension Builder 3 > Bundle Manifest Editor, puis
sélectionnez l’onglet manifeste dans Bundle Manifest Editor à l’emplacement
EclipseProject\.staged-extension\CSXS.
5. Pour modifier le fichier manifest.xml, cliquez avec le bouton droit de la souris à
l’intérieur de la fenêtre et sélectionnez Ouvrir avec > Éditeur XML. Les deux balises sur
lesquelles vous devez travailler sont les suivantes : ExtensionList et
DispatchInfoList :
Une balise ExtensionList type se présente comme suit :
<ExtensionList>
<Extension Id="PluginID" Version="1.0" />
<Extension Id="PublishSettingsID" Version-"1.0" />
</ExtensionList>
Cette balise contient la liste des extensions dans le package ZXP final dans lequel chaque extension
comporte une chaîne unique comme ID. Dans ce cas, le fichier .dll ou .plugin créé dans la section
précédente est inclus dans une extension. Ensuite, l’autre extension permet de configurer l’interface
utilisateur des paramètres de publication de l’éditeur. Dans l’exemple, la balise ExtensionList
portant l’ID d’extension PluginID contient le fichier .dll/.plugin et l’extension avec l’ID
PublishSettingsID configure l’interface utilisateur des paramètres de publication de l’éditeur.
6. La balise DispatchInfoList contient des informations détaillées sur chaque extension
mentionnée dans ExtensionList. Voici un exemple de DispathInfoList :
<DispatchInfoList>
<Extension Id="PluginID">
<DispatchInfo >
<Resources>
<MainPath>./plugin/fcm.xml</MainPath>
</Resources>
<Lifecycle>
<AutoVisible>true</AutoVisible>
</Lifecycle>
<UI>
<Type>ModalDialog</Type>
139
<Menu>CreateJS</Menu>
<Geometry>
<Size>
<Height>200</Height>
<Width>200</Width>
</Size>
</Geometry>
</UI>
</DispatchInfo>
</Extension>
<Extension Id="PublishSettingsID">
<DispatchInfo >
<Resources>
<MainPath>./index.html</MainPath>
</Resources>
<Lifecycle>
<AutoVisible>true</AutoVisible>
</Lifecycle>
<UI>
<Type>ModalDialog</Type>
<Menu>Publish Settings</Menu>
<Geometry>
<Size>
<Height>170</Height>
<Width>486</Width>
</Size>
</Geometry>
</UI>
</DispatchInfo>
</Extension>
</DispatchInfoList>
7. Pour l’extension contenant le fichier .dll ou .plugin, vous pouvez ignorer toutes les balises
à l’exception de la balise MainPath. La balise MainPath contient le chemin d’accès au
fichier fcm.xml relatif au dossier ExtensionContent. Vous devez renommer le fichier .dll
en .fcm et le placer dans le dossier win près du fichier fcm.xml. De même, sur Mac,
renommez le fichier .plugin en .fcm.plugin et placez-le dans le dossier mac près du
fichier fcm.xml.
8. L’extension HTML permettant de configurer l’interface utilisateur des paramètres de
publication est une extension HTML pour Animate. Pour en savoir plus sur les extensions
HTML pour Animate, voir Création d’extensions HTML.
9. Vérifiez que la valeur inférieure de l’attribut de version dans la balise Host est 14.0, la
version (interne) minimale d’Animate CC avec prise en charge des plates-formes
personnalisées.
<ExecutionEnvironment>
<HostList>
<Host Name="FLPR" Version="14.0" />
</HostList>.
.
.
</ExecutionEnvironment>
10. Passez en mode Script Explorer (Explorateur de scripts), puis cliquez avec le bouton
droit sur votre projet et sélectionnez Exporter > Adobe Extension Builder 3 > Extension
d’application. L’assistant Exportation apparaît.
11. Vous devez détenir un certificat pour signer le package d’extension. Sélectionnez un
certificat existant ou cliquez sur Créer pour en créer un.
12. Cliquez sur Terminer pour compiler le projet. Eclipse génère un fichier de module externe
140
avec l’extension .zxp, que vous pouvez héberger sur le site Modules complémentaires
Adobe.
Haut de la page
Distribution de votre module externe de prise en charge des platesformes personnalisées
Vous pouvez distribuer le module externe de prise en charge des plates-formes personnalisées en
l’hébergeant sur la page Modules complémentaires Adobe et en le monétisant. Votre module externe passe
par un processus de révision et d’approbation d’Adobe avant d’être répertorié dans la page. Vous pouvez
héberger un module externe comme suit :
1. Connectez-vous à la page Modules complémentaires Adobe au moyen de votre ID
d’utilisateur et de votre mot de passe.
2. Dans le panneau de gauche, sous « Become a producer » (Devenir un producteur),
cliquez sur le lien Go to the producer portal (Accéder au portail du producteur).
3. Cliquez sur le bouton « Sign-up » (S’enregistrer) si vous n’êtes pas enregistré en tant
que producteur.
4. Pour des instructions détaillées sur la façon de s’enregistrer en tant que producteur et
d’héberger vos modules externes, voir Getting Started with the Producer Portal (Prise en
main du portail du producteur).
5. Effectuez les étapes suivantes du processus du portail du producteur telles que
documentées dans la page Getting Started (Prise en main) :
a. Compactez votre produit dans un seul fichier.
b. Entrez des informations relatives au produit et téléchargez le fichier.
c. Ajoutez des ressources marketing.
d. Prévisualisez votre produit.
e. Envoyez votre produit pour approbation.
6. Une fois approuvé, votre module externe est répertorié sous la catégorie des produits
Animate sur la page Add-ons.
Remarque :
Si, en tant qu’utilisateur, vous souhaitez installer un module externe, créer un document
de plate-forme personnalisée et le publier au moyen d’Animate, consultez la section
Utilisation du module externe de prise en charge des plates-formes personnalisées.
Pour des informations complètes sur la gestion des extensions Adobe, voir
Téléchargement et installation des extensions.
Haut de la page
Demandes de fonctions et rapport de bogues
Remplissez le formulaire suivant pour faire part de vos questions ou problèmes, signaler les bogues du
produit ou demander des fonctions à l’équipe produit d’Animate :
Demandes de fonctions Adobe et formulaire de signalement de bogues
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
141
Utilisation du module externe de prise en charge des plates-formes
personnalisées
Les modules externes de prise en charge des plates-formes personnalisées étendent les fonctionnalités
d’Animate aux plates-formes qui ne sont pas prises en charge par défaut. L’installation d’un module externe
de prise en charge des plates-formes personnalisées vous permet de créer des graphiques et des animations
dans Animate et de les publier dans le format pris en charge par le module externe. Vous pouvez tirer parti
des puissants outils pour graphiques et animations dans Animate pour créer vos tâches sur la plate-forme de
votre choix, si vous disposez d’un module externe de prise en charge pour cette plate-forme. Pour activer
cette fonctionnalité, installez le module externe pour la plate-forme avec Animate en utilisant l’une des
méthodes suivantes :
Téléchargez le module externe à partir de la page Modules complémentaires Adobe et
installez-le au moyen de l’application Creative Cloud.
Si vous disposez du module externe en tant que package ZXP, installez-le à l’aide de
l’application Adobe Extension Manager.
Une fois installé, le module externe ajoute un nouveau type de document dans Animate. Vous pouvez utiliser
un ensemble d’outils que le module externe a activé pour que la plate-forme crée votre travail. Lorsque vous
publiez votre travail, Animate utilise les paramètres de publication configurés pour la plate-forme
personnalisée.
Haut de la page
Installation d’un module externe de prise en charge des platesformes personnalisées à partir de la page des modules
complémentaires
Vous pouvez acquérir un module externe de prise en charge des plates-formes personnalisées à partir du
site Modules complémentaires Adobe et l’installer comme suit :
1. Installez et lancez l’application Adobe Creative Cloud.
2. Connectez-vous à la page Modules complémentaires Adobe avec votre ID Adobe et
votre mot de passe.
3. Cliquez sur Animate dans le volet de gauche. Les modules complémentaires d’Animate
disponibles en achat/téléchargement sont répertoriés.
4. Sélectionnez le module externe qui prend en charge votre plate-forme personnalisée
pour afficher des détails tels que les fonctions prises en charge et la compatibilité.
5. Dans la page de détails du module complémentaire, achetez ou téléchargez le module
externe. Le module externe s’affiche sur l’application Adobe Creative Cloud installée sur
votre ordinateur et une notification apparaît s’il est correctement installé.
6. Lancez Animate. La page de démarrage répertorie la plate-forme personnalisée en tant
que l’un des types de documents.
142
Installation du fichier de module externe ZXP
Si votre module externe est au format ZXP, procédez comme suit pour installer le module externe :
1. Vérifiez que vous avez installé Animate CC 2014.1 ou une version ultérieure.
2. Téléchargez le module externe Adobe Extension Manager CC à partir de la page Adobe
Exchange et installez-le sur votre ordinateur.
3. Double-cliquez sur le fichier <plug-in>.zxp. La fenêtre Adobe Extension Manager
apparaît.
4. Adobe Extension Manager affiche le module externe sous Extensions si le module
externe a été correctement installé.
Haut de la page
143
Création et publication d’un document de plate-forme
personnalisée
Procédez comme suit pour créer et publier un document pour une plate-forme personnalisée :
1. Choisissez Fichier > Nouveau.
2. Dans la boîte de dialogue Nouveau document, sélectionnez le nouveau type de
document ajouté par le module externe de plate-forme personnalisée et cliquez sur OK.
Vous pouvez voir les modifications suivantes :
Le titre du document affiche <nom-document> (Personnalisé)
Le panneau Propriétés affiche le nom du module externe de pair avec les paramètres
de publication et les propriétés.
Le panneau d’outils affiche les outils activés par le module externe.
3. Utilisez les outils de création Animate pour créer votre contenu d’animation.
4. Pour afficher ou modifier les paramètres de publication pour la plate-forme
personnalisée, choisissez Fichier > Paramètres de publication.
5. Choisissez Fichier > Publier pour publier votre document.
Remarque :
Si vous êtes développeur et que vous voulez créer des modules externes (plug-ins) pour
prendre en charge une plate-forme personnalisée sur Animate, vous pouvez vous
reporter à la documentation complète du kit de développement Prise en charge des
plates-formes personnalisées.
Pour des informations complètes sur la gestion des extensions Adobe, voir
Téléchargement et installation des extensions.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
144
Débogage du code ActionScript 3.0
Présentation du débogueur d’ActionScript 3.0
Passage en mode débogage
Définition et suppression des points d’arrêt
Examen du code ligne par ligne
Affichage et examen des scripts de la pile d’appels
Affichage et modification des valeurs des variables
Contrôle des avertissements du compilateur
Localisation des erreurs dans le code
Débogage d’un fichier SWF ActionScript 3.0 distant
Haut de la page
Présentation du débogueur d’ActionScript 3.0
Ressources supplémentaires
Les ressources suivantes fournissent d’autres informations détaillées sur le débogage d’ActionScript 3.0 :
Haut de la page
Passage en mode débogage
La façon dont vous commencez une session de débogage dépend du type de fichier sur lequel vous
travaillez. Pendant une session de débogage, Animate interrompt l’exécution d’ActionScript dès qu’il
rencontre un point d’arrêt ou une erreur d’exécution.
Lorsque Animate démarre une session de débogage, il ajoute des informations spéciales au fichier SWF
exporté pour la session. Ces informations permettent au débogueur d’indiquer les numéros des lignes
contenant les erreurs rencontrées.
Vous pouvez inclure ces informations de débogage spéciales dans tous les fichiers SWF créés depuis un
certain fichier FLA dans les paramètres de publication. Cela vous permet de déboguer le fichier SWF sans
déclencher explicitement une session de débogage. Ces informations de débogage accroissent légèrement la
taille du fichier SWF.
Choix d’un environnement de débogage par défaut
Choisissez Déboguer > Déboguer l’animation, puis sélectionnez l’une des options
suivantes :
Animate
dans l'application de débogage du lanceur AIR (bureau)
dans l'application de débogage du lanceur AIR (mobile)
sur le périphérique via USB (CS5.5 uniquement)
Toutes les sessions de débogage ont lieu dans l'environnement de votre choix. Vous
pouvez à tout moment modifier l'environnement par défaut.
145
Démarrage du débogage à partir d’un fichier FLA
Choisissez Déboguer > Déboguer
(Versions CS6 et antérieures) Sélectionnez Déboguer > Déboguer l’animation >
Déboguer.
Démarrage du débogage à partir d’un fichier AS ActionScript 3.0
1. Le fichier ActionScript étant ouvert dans la fenêtre Script, vous pouvez sélectionner,
depuis le menu Cible dans la partie supérieure de la fenêtre Script, le fichier FLA avec
lequel le fichier ActionScript devrait être compilé. Le fichier FLA doit aussi être ouvert
pour apparaître dans ce menu.
2. Choisissez Déboguer > Déboguer
(Versions CS6 et antérieures) Sélectionnez Déboguer > Déboguer l’animation >
Déboguer.
Ajout d’informations de débogage à tous les fichiers SWF créés à partir d’un fichier FLA
1. Le fichier FLA étant ouvert, sélectionnez Fichier > Paramètres de publication.
2. Dans la boîte de dialogue Paramètres de publication, cliquez sur l'onglet (CS5) ou sur la
catégorie (CS5.5).
3. Sélectionnez Autoriser le débogage.
Annulation du mode débogage
Cliquez sur le bouton Terminer la session de débogage dans la console de débogage.
Haut de la page
Définition et suppression des points d’arrêt
Ajoutez des points d’arrêt dans votre code ActionScript pour interrompre son exécution à différents endroits
stratégiques. Lorsque l’exécution s’interrompt, vous pouvez alors exécuter le code ligne par ligne, afficher ses
différentes sections ActionScript, afficher les valeurs des variables et des expressions et modifier celles des
variables.
Remarque : les points d’arrêt ne peuvent pas être ajoutés à des fichiers ASC (ActionScript pour
Communication) ou JSFL (JavaScript Flash).
Définition d’un point d’arrêt
Dans le panneau Actions ou la fenêtre Script, cliquez sur la marge gauche en regard de la
ligne de code où vous voulez faire apparaître un point d’arrêt.
Suppression d’un point d’arrêt
Dans le panneau Actions ou la fenêtre Script, cliquez sur le point d’arrêt à supprimer.
Haut de la page
Examen du code ligne par ligne
Après l’interruption de l’exécution d’ActionScript à un point d’arrêt ou une erreur d’exécution, vous pouvez
examiner le code ligne par ligne. Vous pouvez choisir de parcourir les appels de fonction ou de les ignorer.
Vous pouvez également choisir de poursuivre l’exécution du code sans cet examen pas à pas.
146
Parcourir le code ligne par ligne
Cliquez sur le bouton Pas à pas détaillé dans la console de débogage.
Ignorer un appel de fonction
Cliquez sur le bouton Pas à pas principal dans la console de débogage.
Sortir d’un appel de fonction
Cliquez sur le bouton Sortir du pas à pas dans la console de débogage.
Reprendre l’exécution normale du code
Cliquez sur le bouton Continuer dans la console de débogage.
Haut de la page
Affichage et examen des scripts de la pile d’appels
Lorsque l’exécution du code s’interrompt dans le débogueur, vous pouvez afficher la pile d’appels dans la
Console de débogage et examiner les scripts contenant les fonctions présentes dans la pile. La pile d’appels
présente la liste actuelle des appels de fonction imbriqués qui sont en attente de fin d’exécution.
Vous pouvez afficher individuellement les scripts contenant chaque fonction.
Dans le panneau Console de débogage, double-cliquez sur le nom du script dans la pile
d’appels.
Haut de la page
Affichage et modification des valeurs des variables
Affichez et modifiez les valeurs des variables et des propriétés dans le panneau Variables.
Affichage de la valeur d’une variable
1. Dans le panneau Variables, sélectionnez dans le menu Panneau les types de variables à
afficher.
L’option Afficher les constantes affiche les valeurs constantes (variables à valeur
fixe).
L’option Afficher les valeurs statiques affiche les variables qui appartiennent à la
classe plutôt qu’aux occurrences de la classe.
L’option Afficher les variables de membre inaccessibles affiche les variables qui ne
sont pas accessibles aux autres classes ou espaces de noms. Ceci inclut les
variables protégées, privées ou internes à l’espace de noms.
L’option Activer l’affichage hexadécimal supplémentaire ajoute des valeurs
hexadécimales là où des valeurs décimales sont affichées. Ceci est surtout utile pour
des valeurs de couleur. Les valeurs hexadécimales ne sont pas affichées dans le cas
de valeurs décimales de 0 à 9.
L’option Afficher les noms qualifiés affiche des types de variables avec à la fois leur
nom de package et leur nom de classe.
2. Développez l’affichage de l’arborescence de la structure objet du fichier FLA jusqu’à ce
que vous aperceviez la variable.
147
Modification de la valeur d’une variable
1. Dans le panneau Variables, double-cliquez sur la valeur de la variable.
2. Saisissez la nouvelle valeur pour la variable et appuyez sur la touche Entrée. La
nouvelle valeur est utilisée durant l’exécution du code par la suite.
Haut de la page
Contrôle des avertissements du compilateur
Contrôlez les types d’avertissements générés par le compilateur d’ActionScript dans le panneau Erreurs de
compilation. Lorsque le compilateur signale une erreur, double-cliquez sur son entrée pour atteindre la ligne
de code qui provoque l’erreur.
1. Choisissez Fichier > Paramètres de publication.
2. Cliquez sur Animate.
3. Cliquez sur le bouton Paramètres d’ActionScript.
4. Choisissez parmi les options Erreurs :
Le Mode strict signale les avertissements comme des erreurs, ce qui signifie que la
compilation échouera tant que ces erreurs persisteront.
Le Mode avertissements signale des avertissements supplémentaires qui aident à
détecter les incompatibilités lors du passage d’ActionScript 2.0 à ActionScript 3.0.
Haut de la page
Localisation des erreurs dans le code
Lorsque Animate rencontre une erreur dans le code ActionScript, pendant la compilation ou l’exécution, il la
signale dans le panneau Erreurs de compilation. Localisez la ligne de code qui provoque l’erreur dans le
panneau Erreurs de compilation.
Double-cliquez sur l’erreur dans le panneau Erreurs de compilation.
Haut de la page
Débogage d’un fichier SWF ActionScript 3.0 distant
Avec ActionScript 3.0, vous pouvez déboguer un fichier SWF distant à l’aide de la version autonome, ActiveX
ou module externe de Debug Flash Player que vous trouverez dans le répertoire d’installation
d’Animate/Players/Debug/. Cependant, dans le débogueur d’ActionScript 3.0, le débogage à distance est
limité aux fichiers qui se trouvent sur le même hôte local que l’application de création Animate et lus sur le
lecteur de débogage autonome, le contrôle ActiveX ou le module externe.
Pour permettre le débogage à distance du fichier, activez le débogage dans les paramètres Publication. Vous
pouvez également publier votre fichier avec un mot de passe de débogage pour vous assurer que seuls les
utilisateurs autorisés pourront le déboguer.
Comme dans JavaScript ou HTML, vous pouvez afficher les variables côté client dans ActionScript. Pour
stocker les variables de façon sécurisée, envoyez-les à une application côté serveur au lieu de les stocker
dans votre fichier. Cependant, en tant que développeur, vous ne voudrez peut-être pas révéler vos secrets
de fabrication, tels que vos structures de clips. Vous pouvez donc utiliser un mot de passe de débogage pour
protéger votre travail.
Activation du débogage distant d’un fichier SWF et définition d’un mot de passe de débogage
Dans les fichiers FLA d’ActionScript 3.0, le code de scripts d’images ne peut pas être débogué. Seul le code
148
des fichiers AS externes peut être débogué avec le Débogueur d’ActionScript 3.0.
1. Ouvrez le fichier FLA.
2. Choisissez Fichier > Paramètres de publication.
3. Dans la boîte de dialogue Paramètres de publication, cliquez sur l'onglet (CS5) ou sur la
catégorie (CS5.5), puis sélectionnez Autoriser le débogage.
4. Fermez la boîte de dialogue Paramètres de publication, puis choisissez l’une des
commandes suivantes :
Fichier > Exporter > Exporter l’animation
Fichier > Publier
5. Vous pouvez laisser le fichier SWF sur la machine locale pour exécuter une session de
débogage à distance sur l’hôte local ou le télécharger vers votre serveur Web.
Le fichier SWF ne contient pas d’informations sur les points d’arrêt ; par conséquent, si
vous téléchargez le fichier vers un serveur distant, vous ne pourrez pas faire défiler le
code pas à pas. Utiliser l’hôte local pour exécuter cette tâche.
6. Dans Animate, sélectionnez Déboguer > Commencer la session de débogage à
distance > ActionScript 3.0.
Animate ouvre le panneau Débogueur d’ActionScript 3.0 et attend que le lecteur de
débogage de Flash Player se connecte. Vous avez deux minutes pour démarrer le
lecteur de débogage. Si plus de deux minutes s’écoulent, répétez cette opération.
7. Ouvrez le fichier SWF dans la version de débogage du module externe, contrôle ActiveX
ou lecteur autonome de Flash Player. Le lecteur autonome de débogage se trouve dans
le répertoire répertoire d’installation d’Animate/Players/Debug/. Veillez à ne pas vous
connecter à un fichier sur une autre machine car le débogueur ne sera pas en mesure de
recevoir des informations sur les points d’arrêt.
La session de débogage démarre lorsque le lecteur de débogage se connecte au
panneau Débogueur ActionScript 3.0 de
Remarque : le débogage à distance ne fonctionne pas si vous sélectionnez l’interface
réseau par défaut pour AIR 3.4. Sélectionnez plutôt les options permettant de définir
le nom de l’interface réseau et l’adresse IP du système.
Activation du débogueur à distance
1. Le cas échéant, ouvrez l’application de création Animate.
2. Dans Flash, sélectionnez Déboguer > Commencer la session de débogage à distance >
ActionScript 3.0.
3. Dans un navigateur ou dans le débogueur du lecteur autonome, ouvrez le fichier SWF
publié à partir de son emplacement distant.
Si la boîte de dialogue du débogage à distance ne s’ouvre pas, cliquez avec le bouton
droit de la souris sur le fichier SWF (Windows) ou en appuyant sur la touche Ctrl
(Macintosh) pour afficher un menu contextuel, et choisissez Débogueur.
4. Dans la boîte de dialogue Débogage à distance, sélectionnez Hôte local et choisissez le
fichier à ouvrir.
La liste hiérarchique du fichier SWF apparaît dans le débogueur. Lorsque le fichier SWF
n’est pas lu, le débogueur peut être en pause. Cliquez sur Continuer pour le redémarrer.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
149
Espace de travail et workflow
150
Utilisation des bibliothèques Creative Cloud et d’Adobe Animate CC
À propos des bibliothèques Creative Cloud
Utilisation du service Bibliothèques Creative Cloud
Création d’une bibliothèque CC
Partage de votre bibliothèque et de vos ressources
À propos d’Adobe Stock
Utilisation d’Adobe Stock dans Animate CC
Haut de la page
À propos des bibliothèques Creative Cloud
Grâce au service Bibliothèques Creative Cloud, vos fichiers sont disponibles où que vous soyez. Créez des
images, des couleurs, des thèmes chromatiques, des pinceaux, des formes et bien plus encore dans
Photoshop, Illustrator et les applications mobiles, telles qu’Adobe Capture CC, puis retrouvez-les facilement à
partir d’autres applications mobiles ou de bureau, pour un flux de création tout en fluidité.
Animate CC (anciennement Flash Professional CC) intègre les bibliothèques CC. Les bibliothèques CC vous
aident à gérer l’ensemble de vos ressources de création. Lorsque vous créez des éléments graphiques et les
enregistrez dans des bibliothèques, ils sont disponibles en vue d’être utilisés dans vos documents Animate.
Vos ressources de création sont synchronisées automatiquement et peuvent être partagées avec les
utilisateurs qui possèdent un compte Creative Cloud. Tandis que votre équipe de création utilise des
applications de bureau et mobiles Adobe, vos éléments de bibliothèque partagés sont toujours à jour et prêts
à être utilisés n’importe où. Cette préversion prend en charge des options d’importation d’éléments à partir de
bibliothèques et de réutilisation de graphiques. Les types d’éléments pris en charge dans Animate sont les
suivants :
Couleurs et thèmes chromatiques
Pinceaux
Graphiques
Pinceaux vectoriels
Pour en savoir plus, reportez-vous à la section Bibliothèques Creative Cloud.
Utilisation de couleurs, de pinceaux et de formes créés à l’aide
d’applications mobiles dans votre document Animate
151
Vous pouvez utiliser des graphiques et des ressources de conception créés à l’aide d’applications mobiles
Adobe, telles qu’Adobe Capture CC, dans votre document Animate en utilisant le nouveau panneau
Bibliothèque CC. Vous pouvez enregistrer et partager les couleurs, thèmes chromatiques, formes et pinceaux
que vous et d’autres collaborateurs créez par le biais des bibliothèques CC, de sorte qu’il soit possible de les
utiliser dans toute autre application Adobe prenant en charge les bibliothèques CC, comme Animate.
Adobe Capture CC est une application Adobe pour mobile qui vous permet d’effectuer les opérations
suivantes :
Créer des pinceaux personnalisés à partir de photos prises avec votre iPhone, votre iPad
ou votre appareil Android, pour les utiliser immédiatement dans Adobe Animate. Pour
utiliser les pinceaux que vous avez capturés à l’aide de l’application Pinceau, vous devez
les stocker dans votre bibliothèque CC.
Capturez des formes avec votre iPhone, votre iPad ou votre appareil Android, et
transformez-les en vecteurs utilisables dans vos créations. Enregistrez-les dans les
bibliothèques Creative Cloud en vue d’y accéder rapidement dans des applications Adobe
et partagez vos bibliothèques avec les membres de votre équipe de création.
Capturez des combinaisons de couleurs au gré de votre inspiration à l’aide de votre
iPhone, de votre iPad ou d’un appareil Android. Vos thèmes de couleurs,
automatiquement enregistrés dans le service Bibliothèques Creative Cloud, sont
accessibles depuis les logiciels sur ordinateur et les applications mobiles, et disponibles
pour les autres membres de votre équipe.
Pour plus d’informations sur la création de vecteurs, de pinceaux, de formes et de couleurs à utiliser dans
Animate CC, rendez-vous sur la page http://www.adobe.com/fr/products/capture.html
Haut de la page
Utilisation du service Bibliothèques Creative Cloud
Le panneau Bibliothèque Creative Cloud d’Animate CC répertorie toutes les ressources de création que vous
avez stockées dans vos bibliothèques, ainsi que les ressources que d’autres utilisateurs ont partagées avec
vous.
L’illustration suivante décrit en détail le panneau Bibliothèque CC.
152
A. Dossier Bibliothèque CC B. Affichage des éléments sous forme d’icônes C. Affichage d’éléments sous la
forme d’une liste D. Recherche d’images dans Adobe Stock E. Panneau de contenu de la bibliothèque CC F.
Ajout d’une couleur G. Synchronisation des bibliothèques CC H. Suppression d’un élément de la bibliothèque
Utilisation des bibliothèques CC
1. Cliquez sur Fenêtre > Bibliothèques CC pour ouvrir le panneau Bibliothèques CC. Vous
pouvez afficher tous les éléments que vous avez enregistrés dans votre
bibliothèque CC.
2. Vous pouvez effectuer les opérations suivantes :
Faire glisser un élément de la bibliothèque sur la scène.
Cliquer sur un thème de couleur pour l’appliquer à un objet sur la scène.
Cliquer sur un pinceau vectoriel de votre bibliothèque pour l’utiliser sur la scène.
153
Modification de ressources de votre bibliothèque CC et utilisation de ces ressources sur un document
Animate
Emplacement des éléments de bibliothèques CC sur votre ordinateur
Vos ressources Creative Cloud sont synchronisées avec un répertoire de votre poste de travail. Sous Windows, par exemple, il
peut s’agir du répertoire C:\Users\<nom d’utilisateur>\Creative Cloud Files.
Haut de la page
Création d’une bibliothèque CC
Vous pouvez créer une bibliothèque pour stocker vos ressources de création en ligne. Une bibliothèque peut
stocker jusqu’à 1 000 ressources et le nombre de bibliothèques que vous pouvez créer n’est pas limité. Les
éléments que vous stockez dans la bibliothèque sont enregistrés en local, mais synchronisés avec
Creative Cloud.
Haut de la page
Partage de votre bibliothèque et de vos ressources
Vous pouvez collaborer avec d’autres utilisateurs et partager un dossier ou une bibliothèque depuis votre
compte Creative Cloud avec des utilisateurs Creative Cloud donnés. Tous les utilisateurs invités peuvent
collaborer sur les ressources enregistrées dans la bibliothèque ou le dossier partagé. Vos collaborateurs
peuvent afficher, modifier, renommer, déplacer ou supprimer le contenu stocké dans la bibliothèque ou le
dossier partagé. Pour en savoir plus sur la collaboration à l’aide des bibliothèques CC, reportez-vous à la
section Collaboration sur des bibliothèques.
Pour partager des liens publics vers des fichiers et des dossiers avec d’autres utilisateurs (partager des
ressources avec accès en lecture seule), reportez-vous à la section Partage de fichiers et de dossiers.
Pour plus d’informations sur les bibliothèques dans Creative Cloud, reportez-vous à la section Bibliothèques
Creative Cloud.
Vidéo : Utilisation des bibliothèques Creative Cloud dans Adobe Animate CC
De Train Simple (www.trainsimple.com)
Haut de la page
154
À propos d’Adobe Stock
Pour obtenir des instructions détaillées sur l’utilisation d’Adobe Stock, consultez la page d’aide d’Adobe Stock
à l’adresse suivante : https://helpx.adobe.com/fr/stock/help/using-adobe-stock.html.
Remarque : Pour l’instant, Adobe Stock est disponible uniquement dans les pays suivants : États-Unis,
Canada, Mexique, Royaume-Uni, Irlande, Afrique du Sud, Nouvelle-Zélande, Australie, Japon, Pays-Bas,
Norvège, Suède, Danemark, Belgique, Suisse, Finlande, Luxembourg, Allemagne, France, Italie, Autriche,
Espagne, Portugal, Grèce, Pologne, République tchèque, Bulgarie, Estonie, Lettonie, Lituanie, Hongrie,
Malte, Roumanie, Slovénie, Slovaquie et Chypre.
Pour plus d’informations, voir https://helpx.adobe.com/fr/stock/faq.html
Haut de la page
Utilisation d’Adobe Stock dans Animate CC
L’option « Rechercher dans Adobe Stock », disponible dans le panneau Bibliothèque CC, vous permet de
rechercher des images dans Adobe Stock, de prévisualiser une image dans votre bibliothèque, d’acheter
l’image, puis de l’ajouter à un document. Les images que vous ajoutez à la scène peuvent ensuite être
animées.
Recherche et importation d’images à partir d’Adobe Stock
1. Cliquez sur Fenêtre > Bibliothèques CC. Le panneau Bibliothèques CC s’affiche.
Recherche d’images dans Adobe Stock
2. Dans la zone Rechercher dans Adobe Stock, entrez le mot-clé recherché et appuyez
ensuite sur Entrée. Les résultats de la recherche s’affichent dans le panneau de contenu
du panneau Bibliothèque.
3. Placez le curseur sur l’image que vous souhaitez utiliser dans votre document Animate.
Les options suivantes s’affichent :
Acheter et enregistrer dans ma bibliothèque : permet d’acheter l’image. Vous pouvez
également cliquer sur l’image avec le bouton droit de la souris, puis sélectionner
Acheter l’image.
Enregistrer l’aperçu dans ma bibliothèque : enregistre un aperçu de l’image avec
filigrane dans votre bibliothèque CC.
155
4. Les options du menu contextuel vous permettent d’effectuer les tâches suivantes sur une
image Adobe Stock :
Acheter l’image sélectionnée
Rechercher des images semblables sur le Web
Utiliser l’image dans votre document Animate en l’ajoutant à la scène
Partager le lien vers l’image
Effectuer une copie de l’image
Copier ou déplacer l’image dans un dossier de votre bibliothèque CC
Renommer l’image
Supprimer l’image de la bibliothèque
Vidéo : Utilisation des ressources Adobe Stock dans Animate CC
De Train Simple (www.trainsimple.com)
Ressources
Vidéo : Utilisation des images Adobe Stock dans Animate
Aide des bibliothèques Creative Cloud
Initiation aux bibliothèques Creative Cloud
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
156
Utilisation du panneau Scène et Outils pour Animate
Utilisation de la scène
Utilisation des règles
Utilisation des guides
Utilisation de la grille
Présentation de la barre d’outils principale et de la barre d’édition
Utilisation du panneau Outils
Utilisation des menus contextuels
Haut de la page
Utilisation de la scène
La scène est une zone rectangulaire où vous placez le contenu graphique lors de la création de documents
Animate. La scène de l’environnement auteur représente l’espace rectangulaire dans Flash Player ou dans
une fenêtre de navigateur Web dans lequel votre document est affiché pendant la lecture. Vous pouvez
effectuer un zoom avant/arrière pour modifier l’affichage de la scène. Vous pouvez utiliser la grille, les
repères et les règles pour vous aider à placer des éléments sur la scène.
Scénario et scène avec contenu.
Zoom de la scène
Pour afficher l’ensemble de la scène à l’écran ou visualiser une portion particulière de votre dessin à fort
agrandissement, vous pouvez modifier le niveau de zoom. Le zoom maximal dépend de la résolution de votre
moniteur et de la taille du document. La valeur minimale de zoom arrière sur la scène est de 8 %. La valeur
maximale de zoom avant sur la scène est de 2 000 %.
Pour zoomer sur un élément particulier, sélectionnez l’outil Zoom
dans le panneau
Outils et cliquez sur l’élément. Pour basculer l’outil Zoom entre le zoom avant et le zoom
arrière, utilisez les modificateurs Agrandir
ou Réduire
(situés en bas du panneau
157
Outils lorsque l’outil Zoom est sélectionné) ou cliquez en maintenant la touche Alt
(Windows) ou Option (Macintosh) enfoncée.
Pour faire un zoom avant sur une zone spécifique de votre dessin, tracez un cadre de
sélection sur la scène avec l’outil Zoom.
Pour faire un zoom avant ou arrière sur l’ensemble de la scène, sélectionnez Affichage >
Zoom avant ou Affichage > Zoom arrière.
Pour faire un zoom avant ou arrière d’un pourcentage spécifique, sélectionnez
Affichage > Zoom et sélectionnez un pourcentage dans le sous-menu, ou sélectionnez un
pourcentage dans la zone de zoom située dans le coin supérieur droit de la fenêtre du
document.
Pour redimensionner la scène afin de l’ajuster à la fenêtre de l’application, sélectionnez
Affichage > Zoom > Ajuster à la fenêtre.
Pour afficher le contenu de l’image actuelle, sélectionnez Affichage > Zoom > Afficher
tout, ou choisissez Afficher tout dans la zone de zoom de la fenêtre de l’application (coin
supérieur droit). Si la séquence est vide, toute la scène est affichée.
Pour afficher toute la scène, sélectionnez Affichage > Zoom > Afficher une image ou
choisissez Afficher une image dans la zone de zoom du coin supérieur droit de la fenêtre
du document.
Pour afficher l’espace de travail autour de la scène ou pour visualiser dans une scène
des éléments qui sont partiellement ou totalement extérieurs à la zone de la scène,
sélectionnez Affichage > Espace de travail. L’espace de travail apparaît en gris clair. Par
exemple, pour faire en sorte que le vol d’un oiseau passe par une image, vous devrez
d’abord placer l’oiseau en dehors de la scène dans l’espace de travail, puis l’animer dans
la zone de la scène.
Déplacement de la vue de la scène
Il est possible que vous ne puissiez pas voir l’ensemble de la scène lorsque vous faites un zoom avant. Pour
changer la vue sans avoir à modifier le zoom, vous pouvez utiliser l’outil Main pour déplacer la scène.
Dans le panneau Outils, sélectionnez l’outil Main et faites glisser la scène. Pour basculer
temporairement entre l’outil Main et un autre outil, appuyez sur la barre d’espace et
cliquez sur l’outil souhaité dans le panneau Outils.
Mise à l’échelle du contenu selon la taille de la scène
L’option Mettre à l’échelle le contenu de l’inspecteur des propriétés permet de mettre à l’échelle le contenu
sur la scène en fonction de la taille de cette dernière. Lorsque la scène est redimensionnée avec cette option
sélectionnée, le contenu est redimensionné avec les mêmes proportions.
158
Option de mise à l’échelle du contenu dans l’inspecteur de propriétés
Mise à l’échelle de la taille de la scène
Désormais, l’option « Mettre à l’échelle le contenu » disponible dans les paramètres avancés est également
accessible à partir de l’inspecteur de propriétés. Lorsque la scène est redimensionnée avec cette option
sélectionnée, le contenu est redimensionné avec les mêmes proportions.
L’inspecteur de propriétés et la boîte de dialogue Paramètres du document proposent une option Lien qui
permet d’augmenter les dimensions de la scène de manière proportionnelle. Par défaut, les propriétés de
hauteur et de largeur de la scène sont dissociées. Lorsque vous cliquez sur le bouton Lien et activez la
liaison, si vous modifiez les valeurs des propriétés de hauteur ou de largeur, la valeur de l’autre propriété est
modifiée de manière proportionnelle.
Si vous sélectionnez l’option « Mettre à l’échelle le contenu », les dimensions de la scène sont
automatiquement liées et désactivées. Cela est dû au fait que la mise à l’échelle du contenu a du sens en cas
de modification proportionnelle des dimensions de la scène.
Option Lien permettant d’effectuer une mise à l’échelle proportionnelle de la taille de la scène
Mise à l’échelle d’une scène sur la base de l’ancre sélectionnée
Vous pouvez sélectionner un point d’ancrage dans les paramètres du document, spécifier la hauteur et la
largeur, et mettre à l’échelle la scène en fonction des dimensions. Lorsque l’option « Mettre à l’échelle le
contenu » est désactivée, la scène est étendue en fonction du point d’ancrage sélectionné, comme illustré
dans les images suivantes.
Points d’ancrage sur la base desquels vous pouvez mettre à l’échelle la scène
Exemple de mise à l’échelle d’une scène
Dans l’exemple suivant, une scène mesurant 550 x 400 est mise à l’échelle de manière proportionnelle à une
159
taille de 750 x 600 à partir du point d’ancrage situé dans le coin inférieur droit :
Définition de la mise à l’échelle de la scène en utilisant le coin inférieur droit comme point d’ancrage
Scène mise à l’échelle dans la direction définie à partir du point d’ancrage situé dans le coin inférieur droit
Rotation de la scène
Animate CC comporte un nouvel outil Rotation qui permet de faire pivoter temporairement l’affichage de la
scène, pour vous aider à dessiner et à peindre selon un angle particulier, sans avoir à faire pivoter de façon
permanente les objets sur la scène, comme le fait l’outil Transformer librement. Vous pouvez rapidement faire
pivoter la scène, quel que soit l’outil actuellement sélectionné, en maintenant les touches Maj+Espace
enfoncées et en faisant glisser le curseur pour faire pivoter la vue.
Rotation de la scène à l’aide de l’outil Rotation
(H), qui est groupé avec l’outil Main
(H) ou appuyez
1. Sélectionnez l’outil Rotation
sur Maj+Espace pour activer temporairement l’outil Rotation tandis qu’un autre outil est
sélectionné, tel l’outil Pinceau.
160
Outil Rotation de la barre d’outils
2. Avec l’outil Rotation sélectionné, le point de pivot pour la rotation apparaît à l’écran,
signalé par un réticule.Pour modifier la position du point de pivot, cliquez sur la position
souhaitée.
Point de pivot (réticule)
3. Une fois le point de pivot défini, faites glisser la souris pour faire pivoter la vue de scène
autour de ce point.
Scène pivotée
4. Avec l’outil Rotation de la scène sélectionné, faites glisser la souris pour faire pivoter
temporairement la scène. L’angle de rotation est indiqué par la ligne rouge sur le réticule
du pivot.
5. Pour réinitialiser la scène à sa vue par défaut, cliquez sur le bouton Centrer la scène
.
Haut de la page
Utilisation des règles
Lorsque les règles sont affichées, elles apparaissent le long des bords supérieurs ou latéraux du document.
Vous pouvez modifier l’unité de mesure utilisée dans les règles (qui est le pixel, par défaut). Lorsque vous
déplacez un élément sur la scène alors que les règles sont affichées, des lignes indiquant les dimensions des
éléments apparaissent sur les règles.
Pour afficher ou masquer les règles, sélectionnez Affichage > Règles.
Pour spécifier l’unité de mesure des règles d’un document, sélectionnez Modification >
Document et choisissez une unité dans le menu Unités des règles.
161
Haut de la page
Utilisation des guides
Quand les règles sont affichées (Affichage > Règles), vous pouvez faire glisser les guides horizontaux et
verticaux des règles sur la scène.
Lorsque vous créez des scénarios imbriqués, les guides déplaçables apparaissent uniquement sur la scène
lorsque le scénario dans lequel ils sont créés est actif.
Vous pouvez utiliser les calques de guide pour créer des guides personnalisés ou irréguliers.
Pour afficher ou masquer des guides de dessin, sélectionnez Affichage > Guides >
Afficher les guides.
Remarque : Si la grille est déjà visible et que l’option Accrocher à la grille est activée
lorsque vous créez les guides, ces derniers sont accrochés à la grille.
Pour activer ou désactiver l’accrochage des guides, sélectionnez
Affichage >Accrochage > Accrocher aux guides.
Remarque : L’accrochage aux guides est prioritaire par rapport à l’accrochage à la grille
lorsque les guides sont derrière les lignes de grille.
Pour déplacer un guide, utilisez l’outil Sélection pour cliquer n’importe où sur la règle et
tirer le guide à l’endroit désiré de la scène.
Pour supprimer un guide, déverrouillez les guides, puis utilisez l’outil Sélection pour faire
glisser le guide vers la règle horizontale ou verticale.
Pour verrouiller les guides, sélectionnez Affichage > Guides > Verrouiller les guides ou
utilisez l’option Verrouiller les guides dans la boîte de dialogue Éditer les guides
(Affichage > Guides > Modifier les guides).
Pour effacer les guides, sélectionnez Affichage > Guides > Effacer les guides. Si vous
êtes en mode de modification de document, tous les guides du document seront
supprimés. Si vous êtes en mode de modification de symboles, seuls les guides utilisés
dans les symboles sont supprimés.
Définition des préférences pour les guides
1. Sélectionnez Affichage > Guides > Modifier les guides et effectuez l’une des opérations
suivantes :
Pour Couleur, cliquez sur le triangle de la puce de couleur et sélectionnez une
couleur de guide dans la palette. La couleur par défaut des guides est le vert.
Pour afficher ou masquer les guides, sélectionnez ou désélectionnez Afficher les
guides.
Pour activer ou désactiver l’accrochage des repères, sélectionnez ou désélectionnez
Accrocher aux repères.
Sélectionnez ou désélectionnez Verrouiller les guides.
Pour définir Précision d’ajustement, sélectionnez une option dans le menu
contextuel.
Pour supprimer tous les guides, cliquez sur Effacer tout. L’option Effacer tout
supprime tous les guides de la séquence actuelle.
Cliquez sur Enregistrer par défaut pour enregistrer les paramètres courants comme
paramètres par défaut.
2. Cliquez sur OK.
162
Haut de la page
Utilisation de la grille
Lorsque la grille est affichée dans un document, elle apparaît sous la forme de lignes placées derrière les
illustrations dans chacune des séquences.
Affichage ou masquage des grilles de dessin
Effectuez l’une des opérations suivantes :
Choisissez Affichage > Grille > Afficher la grille.
Appuyez sur Ctrl+'' (guillemet) (Windows) ou sur Commande+'' (guillemet)
(Macintosh).
Activation ou désactivation de l’accrochage à la grille
Choisissez Affichage > Accrochage > Accrocher à la grille.
Définition des préférences pour les grilles
1. Sélectionnez Affichage > Grille > Modification de la grille et sélectionnez à partir des
options.
2. Cliquez sur Enregistrer par défaut pour enregistrer les paramètres courants comme
paramètres par défaut.
Haut de la page
Présentation de la barre d’outils principale et de la barre d’édition
La barre de menus située en haut de la fenêtre de l’application affiche les menus et les commandes
contrôlant les diverses fonctions.
La barre d’édition, située en haut de la scène, comprend les commandes et informations concernant la
modification des séquences et des symboles, ainsi que la modification du niveau de zoom de la scène.
Haut de la page
Utilisation du panneau Outils
Les éléments du panneau Outils vous permettent de dessiner, de peindre, de sélectionner, de modifier une
illustration ou de modifier l’affichage de la scène. Ce panneau est divisé en quatre sections :
La zone Outils contient les outils de dessin, de peinture et de sélection.
La zone Affichage contient les outils de zoom et de panoramique utilisés dans la fenêtre
de l’application.
La zone Couleurs contient les modificateurs de couleur de trait et de remplissage.
La zone d’options affiche des modificateurs pour l’outil sélectionné. Les modificateurs
affectent les opérations de peinture ou d’édition de l’outil.
Pour afficher ou masquer le panneau Outils, sélectionnez Fenêtre > Outils.
Sélection des outils
Effectuez l’une des opérations suivantes :
163
Cliquez sur l’outil dans le panneau Outils. Un ensemble de modificateurs peut
apparaître dans la zone des options au bas du panneau Outils en fonction de l’outil
que vous sélectionnez.
Appuyez sur le raccourci clavier de l’outil. Sélectionnez Modifier > Raccourcis clavier
(Windows) ou Animate > Raccourcis clavier (Macintosh) pour afficher les raccourcis
clavier. Sur le Macintosh, vous devrez peut-être déplacer la souris pour voir
apparaître le nouveau pointeur.
Pour sélectionner un outil situé dans le menu contextuel comme outil visible (par
exemple, l’outil Rectangle), cliquez sur l’icône de l’outil visible et choisissez un autre
outil dans le menu contextuel.
Haut de la page
Utilisation des menus contextuels
Les menus contextuels contiennent des commandes spécifiques à la sélection en cours. Par exemple,
lorsque vous sélectionnez une image dans la fenêtre Scénario, le menu contextuel contient les commandes
permettant de créer, supprimer ou modifier des images et des images-clés. Des menus contextuels existent
pour de nombreux éléments et contrôles de nombreux emplacements, tels que la scène, le scénario, le
panneau Bibliothèque ou le panneau Actions.
Cliquez avec le bouton droit de la souris (Windows) ou tout en appuyant sur la touche
Contrôle (Macintosh) sur un élément.
Adobe recommande également :
Accrochage de l’illustration à la position
Symboles, instances et éléments de bibliothèque
Utilisation des séquences
Création et modification d’une illustration
Sélection d’objets
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
164
Flux de travail et espace de travail Animate
Qu’est-ce qu’Animate CC ?
Flux de travail Animate général
Présentation de l’espace de travail
Gestion des fenêtres et des panneaux
Enregistrement et basculement d’un espace de travail à l’autre
Haut de la page
Flux de travail Animate général
Pour créer une application Animate CC, vous devez généralement exécuter les opérations de base
suivantes :
Organiser l’application
Choisir les tâches de base exécutées par l’application.
Ajouter les éléments multimédias
Créez et importez des éléments multimédias, tels que des images, des vidéos, du son et du texte.
Organiser les éléments
Disposer les éléments de média sur la scène et dans le scénario afin de définir quand et comment les faire
apparaître dans votre application.
Appliquer des effets spéciaux
Appliquer des filtres graphiques (tels que des flous, des rayonnements et des biseaux), des fusions et autres
effets spéciaux suivant les besoins.
Utiliser le code ActionScript pour contrôler le comportement
Écrivez du code ActionScript® pour contrôler le comportement des éléments multimédias, y compris leurs
réponses aux interactions des utilisateurs.
Tester et publier votre application
Testez votre fichier FLA (Contrôle > Tester l'animation) pour vous assurer que votre application fonctionne
comme vous le souhaitiez ; recherchez et corrigez toutes les anomalies qui surviennent. Testez votre
application tout au long de son processus de création. Testez votre fichier dans Animate et dans les
applications de débogage du lanceur AIR.
165
Publiez votre fichier FLA (Fichier > Publier) sous forme de fichier SWF affichable dans une page Web et
lisible avec Flash® Player.
Suivant la nature de votre projet et votre façon de travailler, vous pouvez modifier l’ordre de ces étapes.
Haut de la page
Présentation de l’espace de travail
Vous pouvez créer et manipuler vos documents et fichiers à l’aide de divers éléments tels que des panneaux,
barres et fenêtres. Un espace de travail désigne l’organisation de ces éléments. Les espaces de travail des
différentes applications de la suite Adobe® Creative Suite® 5 ont le même aspect, ce qui facilite le passage
d’une application à une autre. Vous pouvez également adapter chaque application aux exigences de votre
travail, en créant votre propre espace de travail ou en effectuant une sélection parmi ceux prédéfinis.
Bien que la disposition de l’espace de travail par défaut varie selon les applications, la manipulation des
éléments est pratiquement identique dans chacune d’elles.
La barre d’application occupe la partie supérieure et contient un sélecteur permettant de
basculer vers un autre espace de travail, des menus (sous Windows uniquement), ainsi
que d’autres commandes d’application. Sous Mac et pour certains produits, vous pouvez
l’afficher ou la masquer à l’aide du menu Fenêtre.
Le panneau Outils contient des outils permettant de créer et de modifier des images, des
illustrations, des éléments de page, etc. Les outils connexes sont regroupés.
Le panneau Contrôle affiche des options relatives à l’outil sélectionné. Dans Illustrator, le
panneau Contrôle affiche des options relatives à l’objet sélectionné. (Il est appelé Barre
d’options dans Adobe Photoshop®. Dans Adobe Animate®, Adobe Dreamweaver® et
Adobe Fireworks®, il est appelé Inspecteur de propriétés et inclut les propriétés relatives
à l’élément actuellement sélectionné.)
La fenêtre de document affiche le fichier sur lequel vous travaillez. Les fenêtres de
document peuvent présenter un onglet et, dans certains cas, être regroupées et ancrées.
Les panneaux vous permettent de contrôler et de modifier votre travail. Citons notamment
le scénario dans Adobe Animate, le panneau Pinceau dans Adobe Illustrator, le panneau
Calques dans Adobe Photoshop® et le panneau Styles CSS dans Adobe Dreamweaver.
Ils peuvent être regroupés, empilés ou ancrés.
Le Cadre de l’application regroupe tous les éléments des espaces de travail dans une
seule et même fenêtre uniforme, ce qui permet de manipuler toutes les applications
comme s’il s’agissait d’une seule entité. Lorsque vous déplacez ou que vous
redimensionnez le Cadre de l’application ou l’un de ses éléments, tous les éléments qu’il
contient sont réagencés pour éviter tout chevauchement. Les panneaux ne disparaissent
pas lorsque vous changez d’application ou lorsque vous cliquez par erreur à côté de
l’application. Si vous utilisez plusieurs applications, vous pouvez les placer côte à côte à
l’écran ou sur plusieurs moniteurs.
Si vous préférez l’interface utilisateur Mac classique que vous pouvez personnaliser à
votre convenance, il vous suffit de désactiver le Cadre de l’application. Dans
Adobe Illustrator®, par exemple, sélectionnez la commande Fenêtre > Cadre de
l’application pour l’activer ou le désactiver. (Dans Animate, le cadre de l’application est
activé en permanence pour Mac et Dreamweaver pour Mac n’en utilise pas.)
166
Espace de travail Illustrator par défaut
A. Documents sous forme d’onglets B. Barre d’application C. Sélecteur d'espace de travail D. Barre de titre
de panneau E. Panneau Contrôle F. Panneau Outils G. Bouton de réduction à la taille d’une icône H. Quatre
groupes de panneaux en ancrage vertical
Affichage et masquage de tous les panneaux
(Illustrator, Adobe InCopy®, Adobe InDesign®, Photoshop, Fireworks) Pour afficher ou
masquer tous les panneaux, y compris les panneaux Outils et Contrôle, appuyez sur la
touche de tabulation.
(Illustrator, InCopy, InDesign, Photoshop) Pour afficher ou masquer tous les panneaux, à
l’exception des panneaux Outils et Contrôle, appuyez sur les touches Maj+tabulation.
Conseil : vous pouvez afficher temporairement les panneaux masqués si l’option Afficher
automatiquement les panneaux masqués est sélectionnée dans les préférences Interface.
Cette option est toujours activée dans Illustrator. Déplacez le pointeur vers le bord de la
fenêtre de l’application (Windows®) ou vers le bord de l’écran (Mac OS®) et laissez le
pointeur au-dessus de la bande qui s’affiche.
(Animate, Dreamweaver, Fireworks) Pour afficher ou masquer tous les panneaux,
appuyez sur la touche F4.
Affichage des options de panneau
Cliquez sur l’icône de menu de panneau
dans le coin supérieur droit du panneau.
Conseil : l’ouverture d’un menu est possible même lorsque le panneau est réduit.
Conseil : dans Photoshop, vous pouvez modifier le corps de la police du texte situé dans
les panneaux et les info-bulles. Dans les préférences d’interface, choisissez une option
dans le menu Corps de la police de l’interface utilisateur.
Réglage de la luminosité du panneau (Illustrator)
Faites glisser le curseur Luminosité dans les préférences de l’interface utilisateur. Cette
commande affecte tous les panneaux, y compris le panneau Contrôle.
167
Reconfiguration du panneau Outils
Vous pouvez afficher les outils du panneau Outils dans une seule colonne ou côte à côte dans deux
colonnes. (Cette fonction n’est pas disponible dans le panneau Outils de Fireworks et d’Animate.)
Dans InDesign et InCopy, une option des préférences d’interface vous permet également de basculer d’un
affichage en une colonne vers un affichage en deux colonnes.
Cliquez sur la double flèche dans la partie supérieure du panneau Outils.
Haut de la page
Gestion des fenêtres et des panneaux
Pour créer un espace de travail personnalisé, vous déplacez et manipulez les fenêtres de document et les
panneaux. Vous pouvez également enregistrer des espaces de travail, puis passer de l’un à l’autre. Dans
Fireworks, renommer les espaces de travail personnalisés peut provoquer un comportement inattendu.
Remarque : les exemples suivants sont basés sur Photoshop. L’espace de travail est le même dans tous les
produits.
Réorganisation, ancrage ou déplacement des fenêtres de document
Les fenêtres de document comportent des onglets lorsque plusieurs fichiers sont ouverts.
Pour modifier l’ordre des onglets de la fenêtre de document, faites glisser un onglet de la
fenêtre à l’emplacement voulu dans le groupe.
Pour annuler l’ancrage d’une fenêtre de document à un groupe de fenêtres, faites glisser
l’onglet de cette fenêtre hors du groupe.
Remarque : Dans Photoshop, vous pouvez également sélectionner Fenêtre >
Réorganiser > Afficher dans une fenêtre flottante pour afficher une seule fenêtre flottante
de document ou Fenêtre > Réorganiser > Tout afficher dans des fenêtres flottantes pour
afficher simultanément toutes les fenêtres flottantes de document. Pour plus
d’informations, consultez la note technique kb405298.
Remarque : Dreamweaver ne prend pas en charge l’ancrage des fenêtres de document,
ni l’annulation de cette opération. Utilisez le bouton Réduire de la fenêtre de document
pour créer des fenêtres flottantes (sous Windows), ou Fenêtre > Mosaïque verticale pour
créer des fenêtres de document côte à côte. Pour plus d’informations sur cette rubrique,
recherchez « Mosaïque verticale » dans l’aide de Dreamweaver. Le flux de travaux diffère
légèrement pour les utilisateurs Macintosh.
Pour ancrer une fenêtre de document à un groupe de fenêtres de document distinct,
faites glisser cette fenêtre dans le groupe.
Pour créer des groupes de documents empilés ou juxtaposés, faites glisser la fenêtre
vers l’une des zones de largage situées en haut, en bas ou sur les côtés d’une autre
fenêtre. Vous pouvez également sélectionner une disposition pour le groupe en utilisant
le bouton Disposition de la barre d’application.
Remarque : Certains produits ne prennent pas en charge cette fonctionnalité. Cependant,
votre produit peut présenter des commandes Cascade et Mosaïque (ou Juxtaposer),
sous le menu Fenêtre, pour vous permettre d’organiser vos documents.
Dans un groupe à onglets, pour passer à un autre document lors du glissement d’une
sélection, faites glisser cette sélection sur l’onglet du document souhaité pendant un
moment.
Remarque : Certains produits ne prennent pas en charge cette fonctionnalité.
168
Ancrage et annulation d’ancrage de panneaux
Un dock est un ensemble de panneaux ou de groupes de panneaux affichés ensemble, généralement en
position verticale. Pour ancrer et annuler l’ancrage des panneaux, insérez-les dans le dock et déplacez-les
hors du dock.
Pour ancrer un panneau, cliquez sur l’onglet correspondant et faites-le glisser dans le
dock, au-dessus, sous ou entre d’autres panneaux.
Pour ancrer un groupe de panneaux, cliquez sur sa barre de titre (barre vide de couleur
unie située au-dessus des onglets) et faites-le glisser dans le dock.
Pour supprimer un panneau ou un groupe de panneaux, faites-le glisser en dehors du
dock en cliquant sur l’onglet ou la barre de titre. Vous pouvez faire glisser l’élément vers
un autre dock ou le rendre flottant.
Déplacement du panneau Navigation vers un nouveau dock ; cette opération est indiquée par une
surbrillance verticale bleue.
Panneau Navigation dans son propre dock
Vous pouvez faire en sorte que les panneaux n’occupent pas la totalité de l’espace disponible dans un
dock. Faites glisser le bord inférieur du dock vers le haut de sorte qu’il ne coïncide plus avec le bord de
l’espace de travail.
Déplacement de panneaux
Lorsque vous déplacez des panneaux, des zones de largage en surbrillance bleue apparaissent : il s’agit des
zones dans lesquelles vous pouvez déplacer le panneau. Vous pouvez, par exemple, déplacer un panneau
vers le haut ou vers le bas en le faisant glisser sur la fine zone de largage bleue située au-dessus ou sous
un autre panneau. Si vous faites glisser le panneau vers un emplacement autre qu’une zone de largage, ce
dernier flotte dans l’espace de travail.
Remarque : la position de la souris active la zone de largage (au lieu de la position du panneau). Si la zone
de largage ne s'affiche pas, faites glisser la souris à l'emplacement où devrait se situer la zone de largage.
169
Pour déplacer un panneau, faites-le glisser en cliquant sur son onglet.
Pour déplacer un groupe de panneaux, faites glisser la barre de titre.
La fine zone de largage bleue indique que le panneau Couleur va être ancré seul au-dessus du groupe de
panneaux Calques.
A. Barre de titre B. Tabulation C. Zone de largage
Pour empêcher l’ancrage d’un panneau, appuyez sur la touche Ctrl (Windows) ou Commande (Mac OS)
lors de son déplacement. Pour annuler l’opération, appuyez sur la touche Échap lors du déplacement du
panneau.
Ajout et suppression de panneaux
Lorsque vous supprimez tous les panneaux d’un dock, ce dernier disparaît. Vous pouvez créer un dock en
déplaçant les panneaux vers le bord droit de l’espace de travail jusqu’à ce qu’une zone de largage soit
visible.
Pour supprimer un panneau, cliquez sur son onglet avec le bouton droit de la souris
(Windows) ou en appuyant sur la touche Contrôle (Mac), puis sélectionnez l’option
Fermer ; vous pouvez également le désélectionner dans le menu Fenêtre.
Pour ajouter un panneau, sélectionnez-le dans le menu Fenêtre et ancrez-le à
l’emplacement de votre choix.
Manipulation de groupes de panneaux
Pour déplacer un panneau dans un groupe, faites glisser son onglet vers la zone de
largage en surbrillance située dans le groupe.
Ajout d’un panneau à un groupe
Pour réorganiser les panneaux d’un groupe, faites glisser l’onglet du panneau de votre
choix vers son nouvel emplacement.
Pour rendre un panneau flottant, faites-le glisser en dehors du groupe au moyen de son
onglet.
Pour déplacer un groupe, faites glisser la barre de titre (zone située au-dessus des
onglets).
170
Empilage de panneaux flottants
Lorsque vous faites sortir un panneau de son dock et que vous le placez en dehors de toute zone de
largage, ce panneau flotte dans l’espace de travail. Un panneau flottant peut être placé à n’importe quel
endroit dans l’espace de travail. Vous pouvez empiler des panneaux ou groupes de panneaux flottants de
sorte qu’ils se comportent comme une seule entité lorsque vous faites glisser la barre de titre supérieure.
Panneaux empilés flottants
Pour empiler des panneaux flottants, cliquez sur un onglet pour faire glisser le panneau
correspondant vers la zone de largage située au bas d’un autre panneau.
Pour modifier l’ordre d’empilage, cliquez sur un onglet afin de faire glisser le panneau
correspondant vers le haut ou vers le bas.
Remarque : Prenez soin de « déposer » l’onglet sur l’étroite zone de largage située entre
les panneaux, plutôt que sur la large zone de largage située dans une barre de titre.
Pour rendre un panneau ou groupe de panneaux de la pile flottant, déplacez-le hors de la
pile au moyen de son onglet ou de sa barre de titre.
Redimensionnement des panneaux
Pour réduire ou agrandir un panneau, un groupe de panneaux ou une pile de panneaux,
cliquez deux fois sur un onglet. Vous pouvez également double-cliquer sur la zone
d’onglets (l’espace vide situé à côté des onglets).
Pour redimensionner un panneau, faites glisser l’un de ses côtés. Cette méthode de
redimensionnement ne fonctionne pas toujours, notamment avec le panneau Couleur de
Photoshop.
Réduction et développement des icônes de panneaux
Vous pouvez réduire des panneaux à la taille d’icônes afin de limiter l’encombrement de l’espace de travail.
Dans certains cas, les panneaux sont réduits de la sorte dans l’espace de travail par défaut.
Panneaux réduits à la taille d’icônes
171
Panneaux agrandis
Pour réduire ou développer toutes les icônes de panneau d’une colonne, cliquez sur la
double flèche située dans la partie supérieure du dock.
Pour développer une seule icône de panneau, cliquez sur cette dernière.
Pour redimensionner les icônes de panneau afin de voir les icônes uniquement (et non
les libellés), réglez la largeur du dock jusqu’à ce que le texte ne soit plus visible. Pour
afficher à nouveau le texte, augmentez la largeur du dock.
Pour réduire à la taille d’une icône un panneau qui a été développé, cliquez sur son
onglet, sur son icône ou sur la double flèche affichée dans sa barre de titre.
Conseil : dans certaines applications, si vous sélectionnez l’option Réduction
automatique des panneaux en icône dans les préférences d’interface ou les options
d’interface utilisateur, une icône de panneau développée est réduite automatiquement
lorsque vous cliquez en dehors de cette dernière.
Pour ajouter un panneau flottant ou un groupe de panneaux à un dock d’icônes, faites-le
glisser au moyen de son onglet ou de sa barre de titre (les panneaux sont réduits
automatiquement à la taille d’icônes lorsque vous les ajoutez à un dock d’icônes).
Pour déplacer une icône de panneau (ou un groupe d’icônes de panneau), faites-la
glisser. Vous pouvez déplacer des icônes de panneau vers le haut et vers le bas dans le
dock, dans d’autres docks (elles apparaissent dans le style du panneau de ce dock) ou
en dehors du dock (elles apparaissent sous la forme d'icônes flottantes).
Haut de la page
Enregistrement et basculement d’un espace de travail à l’autre
En enregistrant la taille et la position actuelles des panneaux comme espace de travail nommé, vous gardez
la possibilité de restaurer cet espace par la suite, et ce, même si vous avez déplacé ou fermé un panneau.
Les noms des espaces de travail enregistrés sont visibles dans le sélecteur d’espace de travail de la barre
d’application.
Enregistrement d’un espace de travail personnalisé
1. Lorsque l’espace de travail se trouve dans la configuration que vous souhaitez
enregistrer, utilisez l’une des méthodes suivantes :
(Illustrator) Choisissez la commande Fenêtre > Espace de travail > Enregistrer
l’espace de travail.
(Photoshop, InDesign, InCopy) Choisissez la commande Fenêtre > Espace de
travail > Nouvel espace de travail.
(Dreamweaver) Choisissez la commande Fenêtre > Présentation de l’espace de
travail > Nouvel espace de travail.
(Animate) Choisissez la commande Nouvel espace de travail dans le sélecteur
d’espace de travail de la barre d’application.
(Fireworks) Choisissez la commande Enregistrer la présentation active dans le
sélecteur d’espace de travail de la barre d’application.
2. Attribuez un nom à l’espace de travail.
3. (Photoshop, InDesign) Sélectionnez ensuite une ou plusieurs options dans la section
172
Capture :
Position des panneaux Enregistre la position actuelle des panneaux (InDesign
uniquement).
Raccourcis clavier Enregistre l’ensemble de raccourcis clavier actuel (Photoshop
seulement).
Menus ou Personnalisation des menus Enregistre l’ensemble de menus actuels.
Affichage de l’espace de travail ou basculement d’un espace de travail à
l’autre
Sélectionnez un espace de travail dans le sélecteur d’espace de travail de la barre
d’application.
Dans Photoshop, vous pouvez attribuer un raccourci clavier à chacun des espaces de travail pour pouvoir
passer de l’un à l’autre plus rapidement.
Suppression d’un espace de travail personnalisé
Choisissez l’option Gérer les espaces de travail dans le sélecteur d’espace de travail de
la barre d’application, sélectionnez l’espace de travail, puis cliquez sur la commande
Supprimer. (Cette option n’est pas disponible dans Fireworks.)
(Photoshop, InDesign, InCopy) Sélectionnez la commande Supprimer l’espace de travail
dans le sélecteur d’espace de travail.
(Illustrator) Choisissez la commande Fenêtre > Espace de travail > Gérer les espaces de
travail, sélectionnez l’espace de travail, puis cliquez sur l’icône Supprimer.
(Photoshop, InDesign) Choisissez la commande Fenêtre > Espace de travail > Supprimer
l’espace de travail, sélectionnez l’espace de travail, puis cliquez sur le bouton Supprimer.
Restauration de l’espace de travail par défaut
1. Sélectionnez l’espace de travail de base ou par défaut à l’aide du sélecteur situé dans la
barre d’application.
Remarque : Dans Dreamweaver, Designer correspond à l’espace de travail par défaut.
2.
3. (PhotoShop, InDesign, InCopy) Choisissez la commande Fenêtre > Espace de travail >
Réinitialiser [Nom de l’espace de travail].
(Photoshop) Restauration d'une disposition d’espace de travail enregistrée
Dans Photoshop, les espaces de travail s’affichent automatiquement en fonction de leur dernière disposition,
mais vous pouvez restaurer la disposition d’origine des panneaux.
Pour restaurer un espace de travail individuel, sélectionnez Fenêtre > Espace de travail >
Réinitialiser Nom de l’espace de travail.
Pour restaurer tous les espaces de travail installés avec Photoshop, cliquez sur Restaurer
les espaces de travail par défaut dans les préférences d’interface.
173
Pour réorganiser l'ordre des espaces de travail de la barre d’application, faites-les glisser.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
174
Utilisation de polices web Typekit dans les documents HTML5
Canvas
Utilisation de polices web Typekit
Utilisation de polices web Typekit dans un document HTML5 Canvas
Haut de la page
Utilisation de polices web Typekit
Les polices web Adobe Typekit sont désormais disponibles pour les documents HTML5 Canvas dans
Adobe Animate CC.
Grâce à l’intégration de Typekit à Animate CC, des milliers de polices web haut de gamme issues de
fonderies de qualité sont disponibles instantanément dans les documents HTML5 Canvas.
Avec tout abonnement à Creative Cloud, vous avez accès à une sélection limitée de polices de la
bibliothèque Typekit ; si vous avez souscrit à une formule payante, vous avez accès à la bibliothèque
complète, qui comprend des milliers de polices.
Pour plus d’informations sur les formules d’abonnement à Typekit, voir Formules d’hébergement de polices
Web de Typekit.
Contrairement aux polices web auto-hébergées, Typekit héberge les polices que vous décidez d’utiliser dans
votre contenu hébergé. Si vous sélectionnez des polices de la bibliothèque Typekit puis publiez votre
document sur le web, Typekit héberge automatiquement ces polices et connecte votre compte Typekit à votre
contenu sur le web.
La bibliothèque Typekit est à votre disposition dans votre abonnement Creative Cloud. Pour en savoir plus,
voir https://typekit.com/.
Utilisation de polices web Typekit dans un document HTML5 Canvas
1. Ouvrez un document HTML5 Canvas et sélectionnez l’outil Texte dans la barre d’outils.
2. Dans le panneau Propriétés, sélectionnez Texte dynamique, puis cliquez sur le bouton
Ajouter des polices web en regard de la liste déroulante Famille de polices.
3. Dans la fenêtre Ajouter des polices Web qui s’affiche, cliquez sur Commencer.
175
4. La boîte de dialogue Polices Web répertorie toutes les polices web Typekit disponibles
dans votre abonnement Creative Cloud. Vous pouvez désormais sélectionner la police
qui convient le mieux à votre création en parcourant les polices, en recherchant des
polices spécifiques ou en filtrant les polices en fonction de leurs propriétés.
Cliquez sur Filtrer pour appliquer l’un des filtres suivants :
Classification : filtrez les polices Typekit en fonction de leurs classifications, par
exemple Serif, Sans Serif et Cursive.
Recommandées pour : filtre les polices en fonction des recommandations de Typekit
pour les paragraphes ou les titres.
Propriétés : filtre les polices d’après des propriétés telles que la graisse, la chasse et
la hauteur.
5. Une fois que vous avez trouvé la police que vous souhaitez utiliser, il vous suffit de
cliquer dessus. Une coche apparaît, indiquant que la police est sélectionnée. Vous
pouvez ajouter plusieurs polices simultanément. L’onglet Polices sélectionnées répertorie
176
toutes les polices que vous avez sélectionnées.
Cliquez sur le pied de page d’aperçu de la police pour afficher toutes ses variantes, telles
que fin, gras ou italique.
Cliquez sur OK pour ajouter les polices sélectionnées au menu Texte > Police et à la
liste déroulante Famille de polices dans la catégorie Polices Web.
Police web sélectionnée dans le menu Famille
177
Police web sélectionnée dans le menu Police
6. Sélectionnez la police web ajoutée pour l’utiliser dans votre document HTML5 Canvas.
Utilisation de la police sélectionnée dans le document
7. Avant de publier votre contenu sur le web, ouvrez les Paramètres de publication,
cliquez sur l’onglet Polices Web et spécifiez l’URL de la page sur laquelle votre contenu
HTML5 sera hébergé. Par exemple, www.adobe.com. Vous pouvez également spécifier
plusieurs URL séparées par des virgules.
Champ de l’URL de la police web dans les Paramètres de publication
Remarque :
Les polices web de Typekit se chargent uniquement sur les noms de domaine qui
178
sont répertoriés dans les paramètres de publication. Si les polices ne fonctionnent
pas ou si une erreur 403 de Typekit apparaît sur votre page web, assurez-vous que
vous avez inclus le domaine du site web dans cette liste et republiez le projet.
La sortie générée au moyen de l’option Tester l’animation est destinée aux seules
fins de prévisualisation. Utilisez l’option Fichier > Publier pour générer la sortie pour
le déploiement final.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
179
Scénarios et ActionScript
Chemins absolus
Chemins relatifs
Utilisation de chemins cible absolus et relatifs
Spécifications de chemins cibles
Avec ActionScript®, vous pouvez contrôler le scénario à l’exécution. ActionScript vous permet de créer des
interactions et autres capacités dans vos fichiers FLA qui sont impossibles avec le scénario seul.
Avec ActionScript®, vous pouvez contrôler le scénario à l’exécution. ActionScript vous permet de créer des
interactions et autres capacités dans vos fichiers FLA qui sont impossibles avec le scénario seul.
Pour savoir comment contrôler les scénarios avec ActionScript, voir la rubrique sur les scénarios et
ActionScript dans l’Aide en ligne.
Haut de la page
Chemins absolus
Un chemin absolu commence par le nom du niveau dans lequel le document est chargé et continue dans la
liste d’affichage jusqu’à l’occurrence cible. Vous pouvez utiliser l’alias _root pour désigner le scénario
principal du niveau courant. Par exemple, une action dans le clip california qui fait référence au clip
oregon peut utiliser le chemin absolu _root.westCoast.oregon.
Le premier document ouvert dans Flash Player est chargé au niveau 0. Vous devez affecter un numéro de
niveau à chaque document chargé par la suite. Lorsque vous utilisez une référence absolue dans
ActionScript pour faire référence à un document chargé, utilisez la forme _levelX, où X est le numéro du
niveau dans lequel le document est chargé. Par exemple, le premier document ouvert dans Flash Player est
appelé _level0 ; un document chargé au niveau 3 est appelé _level3.
Pour communiquer entre les documents de niveaux différents, vous devez utiliser le nom de niveau dans le
chemin cible. L’exemple suivant indique comment l’occurrence portland ferait référence à l’occurrence
atlanta située sur un clip intitulé georgia (georgia se trouve au même niveau que oregon) :
_level5.georgia.atlanta
Vous pouvez utiliser l’alias _root pour désigner le scénario principal du niveau actuel. Pour le scénario
principal, l’alias _root équivaut à _level0 lorsqu’il est ciblé par un clip également dans _level0. Pour un
document chargé dans _level5, _root équivaut à _level5 lorsqu’il est ciblé par un clip situé aussi dans
le niveau 5. Par exemple, si les clips southcarolina et florida sont tous deux chargés dans le même
niveau, une action appelée depuis l’occurrence southcarolina peut utiliser le chemin absolu pour cibler
l’occurrence florida.
_root.eastCoast.florida
Haut de la page
Chemins relatifs
Un chemin relatif dépend de la relation qui existe entre le scénario contrôlant et le scénario cible. Les
chemins relatifs ne peuvent faire référence qu’à des cibles situées à leur propre niveau de Flash Player. Par
180
exemple, vous ne pouvez pas utiliser de chemin relatif dans une action sur _level0 qui cible un scénario
sur _level5.
Dans un chemin relatif, utilisez le mot-clé this pour faire référence au scénario actuel au niveau actuel ;
utilisez l’alias _parent pour indiquer le scénario parent du scénario actuel. Vous pouvez utiliser l’alias
_parent à plusieurs reprises pour remonter d’un niveau dans la hiérarchie, mais tout en restant dans le
même niveau de Flash Player. Par exemple, _parent._parent contrôle un clip situé deux niveaux audessus dans la hiérarchie. Le scénario principal de n’importe quel niveau dans Flash Player est le seul
scénario dont la valeur _parent n’est pas définie.
Une action dans le scénario de l’occurrence charleston, située un niveau sous southcarolina, peut
utiliser le chemin cible suivant pour cibler l’occurrence southcarolina :
_parent
Pour cibler l’occurrence eastCoast (un niveau vers le haut) à partir d’une action située dans charleston,
vous pourriez utiliser le chemin relatif suivant :
_parent._parent
Pour cibler l’occurrence atlanta à partir d’une action située dans le scénario de charleston, vous
pourriez utiliser le chemin relatif suivant :
_parent._parent.georgia.atlanta
Les chemins relatifs sont utiles pour la réutilisation des scripts. Par exemple, vous pouvez associer le script
suivant à un clip pour agrandir son parent de 150 % :
onClipEvent (load) { _parent._xscale
= 150; _parent._yscale = 150;
}
Vous pouvez réutiliser ce script en l’associant à une autre occurrence de clip.
Remarque : Flash Lite 1.0 et 1.1 prennent en charge l’association de scripts aux boutons uniquement.
L’association de scripts aux clips n’est pas prise en charge.
Que vous utilisiez un chemin absolu ou relatif, une variable dans un scénario ou une propriété dans un objet
est identifiée par un point (.) suivi du nom de la variable ou de la propriété en question. Par exemple,
l’instruction suivante donne à la variable nom de l’occurrence formulaire la valeur « Gilbert » :
_root.form.name = "Gilbert";
Haut de la page
Utilisation de chemins cible absolus et relatifs
Vous pouvez utiliser ActionScript pour envoyer des messages entre les scénarios. Le scénario contenant
l’action est appelé scénario contrôlant, celui qui reçoit l’action étant appelé scénario cible. Par exemple, une
action sur la dernière image d’un scénario peut demander la lecture d’un autre scénario. Pour faire référence
à un scénario cible, vous devez utiliser un chemin cible, qui indique l’emplacement d’un clip dans la liste
d’affichage.
L’exemple suivant présente la hiérarchie d’un document appelé westCoast au niveau 0 et contenant trois
clips : california, oregon et washington. Chacun de ces clips comprend deux clips.
_level0
westCoast
california
sanfrancisco
bakersfield
oregon
181
portland
ashland
washington
olympia
ellensburg
Comme sur un serveur Web, chaque scénario Animate peut être appelé de deux manières : avec un chemin
absolu ou avec un chemin relatif. Le chemin absolu d’une occurrence est toujours le même, quel que soit le
scénario qui appelle l’action ; par exemple, le chemin absolu de l’occurrence california est
_level0.westCoast.california. Un chemin relatif varie en fonction de l’endroit à partir duquel il est
appelé ; par exemple, le chemin relatif de california à partir de sanfrancisco est _parent, mais à
partir de portland, il s’agit de _parent._parent.california.
Haut de la page
Spécifications de chemins cibles
Pour contrôler un clip, un fichier SWF chargé ou un bouton, vous devez spécifier un chemin cible. Vous
pouvez le spécifier manuellement ou à l’aide de la boîte de dialogue Insérer un chemin cible ou encore par la
création d’une expression qui détermine un chemin cible. Pour spécifier le chemin cible d’un clip ou d’un
bouton, vous devez affecter un nom d’occurrence au clip ou au bouton. Un document chargé n’a pas besoin
de nom d’occurrence, car vous utilisez son numéro de niveau comme nom d’occurrence (par exemple,
_level5).
Affectation d’un nom d’occurrence à un clip ou à un bouton
1. Sélectionnez un clip ou bouton sur la scène.
2. Entrez un nom d’occurrence dans l’inspecteur des propriétés.
Spécification d’un chemin cible en utilisant la boîte de dialogue Insérer un
chemin cible
1. Sélectionnez l’occurrence de clip, d’image ou de bouton à laquelle vous souhaitez
affecter l’action.
Il s’agit du scénario contrôlant.
2. Dans le panneau Actions (Fenêtre > Actions), choisissez une action ou une méthode qui
requiert un chemin cible dans la boîte à outils Actions (côté gauche du panneau).
3. Cliquez sur le champ de paramètre ou l’emplacement du script auquel vous souhaitez
insérer le chemin cible.
4. Cliquez sur le bouton Insérer un chemin cible
, au-dessus du volet Script.
5. Sélectionnez le type de chemin cible : Absolu ou Relatif.
6. Sélectionnez un clip dans la liste d’affichage Insérer un chemin cible, puis cliquez sur
OK.
Spécification manuelle d’un chemin cible
1. Sélectionnez l’occurrence de clip, d’image ou de bouton à laquelle vous souhaitez
affecter l’action.
Il s’agit du scénario contrôlant.
2. Dans le panneau Actions (Fenêtre > Actions), choisissez une action ou une méthode qui
182
requiert un chemin cible dans la boîte à outils Actions (côté gauche du panneau).
3. Cliquez sur le champ de paramètre ou l’emplacement du script auquel vous souhaitez
insérer le chemin cible.
4. Saisissez un chemin absolu ou relatif dans le panneau Actions.
Utilisation d’une expression comme chemin cible
1. Sélectionnez l’occurrence de clip, d’image ou de bouton à laquelle vous souhaitez
affecter l’action.
Il s’agit du scénario contrôlant.
2. Dans le panneau Actions (Fenêtre > Actions), choisissez une action ou une méthode qui
requiert un chemin cible dans la boîte à outils Actions (côté gauche du panneau).
3. Effectuez l’une des opérations suivantes :
Entrez une expression évaluée comme chemin cible dans un champ de paramètre.
Cliquez pour placer le point d’insertion dans le script. Dans la catégorie Fonctions de
la boîte à outils Actions, double-cliquez sur la fonction targetPath. La fonction
targetPath convertit une référence à un clip en chaîne.
Cliquez pour placer le point d’insertion dans le script. Dans la catégorie Fonctions de
la boîte à outils Actions, sélectionnez la fonction eval. La fonction eval convertit
une chaîne en une référence à un clip pouvant être utilisée pour appeler des
méthodes telles que play.
L’exemple suivant affecte la valeur 1 à la variable i. Il utilise ensuite la fonction eval
pour créer une référence à une occurrence de clip et l’affecte à la variable x. La
variable x est à présent une référence d’occurrence de clip et peut appeler les
méthodes de l’objet MovieClip.
i = 1; x = eval("mc"+i); x.play(); // this is equivalent to
mc1.play();
Vous pouvez aussi utiliser la fonction eval pour appeler des méthodes directement,
comme dans l’exemple suivant :
eval("mc" + i).play();
Adobe recommande également :
Structuration des fichiers FLA
Organisation du code ActionScript dans une application
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
183
Utilisation de plusieurs scénarios
À propos des clips imbriqués et de la hiérarchie parent-enfant
Haut de la page
À propos des clips imbriqués et de la hiérarchie parent-enfant
Lorsque vous ajoutez une occurrence de clip dans un document Animate, le clip dispose de son propre
scénario. Chaque symbole de clip possède son propre scénario. Le scénario du clip est imbriqué dans le
scénario principal du document. Une occurrence de clip peut elle-même contenir une autre occurrence de
clip.
Lorsqu’un clip est ajouté dans un document Animate, ou imbriqué dans un autre clip, il devient l’enfant de ce
clip ou de ce document, qui en devient le parent. Les relations entre les clips imbriqués sont hiérarchiques :
les modifications apportées au parent affectent l’enfant. Le scénario principal pour chaque niveau est le
parent de tous les clips à son niveau et, comme il s’agit du scénario le plus élevé, il ne possède pas de
parent. Dans le panneau Explorateur d’animations, vous pouvez afficher la hiérarchie des clips imbriqués
dans un document en choisissant Afficher les définitions de symbole dans le menu du panneau.
Pour comprendre cette hiérarchie, imaginez la hiérarchie qui existe dans un ordinateur : le disque dur
contient un répertoire (ou dossier) racine et des sous-répertoires. Le répertoire racine correspond au scénario
principal (ou racine) d’un document Animate ; il est le parent de tout le reste. Les sous-répertoires
correspondent aux clips.
Vous pouvez utiliser la hiérarchie des clips d’Animate pour organiser les objets apparentés. Vous pouvez, par
exemple, créer un document Animate dans lequel une voiture se déplace à travers la scène. Vous pouvez
utiliser un symbole de clip pour représenter la voiture et créer une interpolation de mouvement pour déplacer
la voiture sur la scène.
Pour ajouter des roues en mouvement, vous créez un clip représentant une roue, puis deux occurrences de
ce clip, nommées frontWheel et backWheel. Ensuite, vous pouvez placer les roues dans le scénario du
clip de la voiture (et non dans le scénario principal). En tant qu’enfants de car, frontWheel et backWheel
sont affectés par toute modification apportée à car et se déplacent avec la voiture lorsque celle-ci traverse la
scène.
Pour faire tourner les deux occurrences de la roue, vous pouvez définir une interpolation de mouvement qui
fait tourner le symbole de roue. Même si vous modifiez frontWheel et backWheel, ils seront toujours
affectés par l’interpolation effectuée sur leur clip parent, car, et les roues tourneront, mais se déplaceront
également avec le clip parent car à travers la scène.
Adobe recommande également :
Symboles, occurrences et éléments de bibliothèque
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
184
Définition des préférences
Définition des préférences
Définition des préférences générales
Définition des préférences de synchronisation des paramètres
Définition des préférences de l’Éditeur de code
Définition des préférences relatives aux fichiers de script
Définition des préférences du compilateur
Définition des préférences du texte
Définition des préférences de dessin
Restauration des paramètres par défaut de toutes les préférences
Définissez des préférences pour les opérations générales, les opérations de modification, les opérations liées
au code et à la compilation, les paramètres de synchronisation et les options de dessin et de texte.
Catégorie Général de la boîte de dialogue Préférences.
Haut de la page
Définition des préférences
1. Sélectionnez Édition > Préférences (Windows) ou Animate > Préférences (Macintosh).
2. Faites un choix dans la liste Catégorie et sélectionnez parmi les options disponibles.
Haut de la page
Définition des préférences générales
Au démarrage Spécifiez quel document s’ouvre lorsque vous démarrez l’application.
185
Annulation au niveau du document ou de l’objet L’option Annulation au niveau du document conserve
une seule liste de toutes vos actions dans le document Animate entier. L’option Annulation au niveau de
l’objet conserve des listes distinctes de toutes vos actions pour chaque objet de votre document. Cette option
vous offre une plus grande souplesse car vous pouvez annuler une action sur l’un des objets sans avoir à
annuler également des actions sur d’autres objets qui ont pu être modifiés plus récemment que l’objet cible.
Nombre d’annulations Pour définir un nombre d’annulations ou de rétablissements, saisissez une valeur de
2 à 300. Chaque niveau d’annulation nécessite de la mémoire et plus ce nombre est élevé, plus la quantité
de mémoire utilisée est importante. La valeur par défaut est 100.
Récupération automatique Lorsque cette option est activée (paramètre par défaut), une copie de chaque
fichier ouvert est enregistrée aux intervalles définis dans le même dossier que les fichiers originaux. Si vous
n’avez pas encore enregistré le fichier, Animate enregistre les copies dans son dossier Temp. Les noms de
fichier sont identiques à ceux des originaux, mais comportent le suffixe « RECOVER_ ». Si Animate se ferme
de façon inattendue, une boîte de dialogue s’affiche lorsque vous redémarrez pour vous permettre d’ouvrir le
fichier récupéré automatiquement. Lorsque vous quittez Animate normalement, les fichiers récupérés
automatiquement sont supprimés.
Depuis la version Animate CC 2015, Animate ne crée plus de fichiers de récupération automatique inutiles.
Un fichier de récupération automatique est créé uniquement si le document a été modifié depuis la dernière
création de fichiers de récupération automatiquement. Le fichier de récupération automatique est supprimé
uniquement après une opération d’enregistrement réussie. Pour éviter la récupération automatique de courte
durée en boucle continue, un instantané de tous les fichiers modifiés depuis la dernière récupération
automatique est créé à chaque intervalle de récupération automatique. Le prochain minuteur de récupération
automatique est lancé uniquement lorsque ce processus est terminé.
Interface utilisateur Choisissez un style d’interface utilisateur, entre foncé et clair. Pour appliquer un
ombrage aux éléments de l’interface utilisateur, sélectionnez Activer l’ombrage.
Espace de travail Pour que les panneaux en mode icône se réduisent automatiquement lorsque vous
cliquez en dehors, sélectionnez Réduction automatique des panneaux d’icônes. Pour ouvrir une fenêtre
distincte lorsque vous sélectionnez Contrôle > Test, cochez l’option Ouvrir Animate et les documents de
script dans différentes fenêtres. Par défaut, le test d’animation s’affiche dans sa propre fenêtre.
Couleur de soulignement Pour utiliser la couleur de contour d’un calque actif, sélectionnez une couleur du
panneau ou sélectionnez Utiliser la couleur du calque.
Haut de la page
Définition des préférences de synchronisation des paramètres
Dans l’onglet Synchroniser les paramètres, vous pouvez définir les paramètres de synchronisation d’Animate
avec votre compte et vos bibliothèques Creative Cloud.
Onglet Paramètres de synchronisation dans la boîte de dialogue Préférences
186
Adobe ID Ceci affiche l’Adobe ID avec lequel vous avez ouvert une session Creative Cloud, ainsi que la
date et l’heure de la dernière synchronisation avec votre compte Creative Cloud.
Pour afficher votre profil et vos bibliothèques Creative Cloud ou pour vous connecter avec
un autre Adobe ID, cliquez sur Gérer le compte.
Pour synchroniser vos paramètres, cliquez sur Synchroniser les paramètres maintenant.
Options de synchronisation Cela a pour effet d’afficher les options de synchronisation que vous avez
définies entre Animate et votre compte Creative Cloud. Vous pouvez synchroniser vos préférences
d’application, les espaces de travail, les paramètres de document par défaut, les raccourcis clavier, la grille,
les repères et les paramètres d’accrochage, les paramètres de la feuille Sprite, les profils d’épaisseur variable
et les pinceaux personnalisés.
Sync. : définissez les préférences de synchronisation en choisissant Tous
(synchronisation de tous les paramètres), Personnalisé (synchronisation des paramètres
choisis parmi les options affichées ci-dessous) ou Désactivé (aucune synchronisation).
Pour synchroniser les paramètres avec vos paramètres Creative Cloud, cliquez sur
Synchroniser les paramètres maintenant.
Pour savoir comment synchroniser les préférences avec Creative Cloud, et entre plusieurs ordinateurs,
reportez-vous à la section Synchronisation des préférences d’Animate avec Creative Cloud.
Pour en savoir plus sur l’utilisation des bibliothèques Creative Cloud, reportez-vous à la section Bibliothèques
Creative Cloud.
Haut de la page
Définition des préférences de l’Éditeur de code
Dans l’onglet Éditeur de code, vous pouvez définir la manière dont s’affiche votre code dans Animate.
Onglet Éditeur de code dans la boîte de dialogue Préférences
Sous Options d’édition, vous pouvez modifier les paramètres par défaut des options suivantes :
Police : définissez la police et le corps de police.
187
Style : choisissez entre normal, italique, gras ou gras-italique.
Modifier la mise en couleur du texte : cliquez sur ce bouton pour définir la couleur du
texte du premier plan, de l’arrière-plan, des mots-clés, des commentaires, des identifiants
et des chaînes.
Accolade de fermeture automatique : activée par défaut. Toutes les accolades de code
sont fermées par défaut.
Indentation automatique : activée par défaut. Désactivez-la si vous ne souhaitez pas
que le code soit mis en retrait.
Conseils de code : activés par défaut. Désactivez cette case à cocher pour que les
conseils de code ne s’affichent pas pendant que vous saisissez du code.
Fichiers de la mémoire cache : définissez la limite pour les fichiers de la mémoire
cache. La valeur par défaut est 800.
Taille des tabulations : la taille par défaut de l’onglet de code est définie sur 4. Entrez
une valeur pour le redimensionner.
Sous Formater le code, définissez les préférences suivantes et vérifiez dans le volet d’aperçu de quelle
façon le changement sera appliqué à votre code :
Langage de script : choisissez le langage de script par défaut : ActionScript ou
JavaScript. Un exemple de code s’affiche lorsque vous sélectionnez une option.
Style de guillemets : sélectionnez votre style d’accolade préféré : sur la même ligne que
les instructions de contrôle, sur une ligne distincte ou uniquement les accolades de fin sur
une ligne distincte.
Couper les méthodes enchaînées : sélectionnez cette option pour afficher les lignes de
code comme logiquement divisées.
Conserver la mise en retrait de la plage : sélectionnez cette option pour conserver les
tableaux en retrait de manière logique.
Ajouter un espace après les mots-clés : option activée par défaut. Modifiez-la si vous
ne souhaitez pas qu’un espace soit ajouté après chaque mot-clé.
Haut de la page
Définition des préférences relatives aux fichiers de script
L’onglet Fichiers de script permet de définir les options d’importation des fichiers de script :
Ouvrir : choisissez Codage UTF-8 pour ouvrir ou importer du contenu à l’aide du codage Unicode, ou
choisissez Codage par défaut pour ouvrir ou importer du contenu à l’aide du format de codage de la langue
actuellement utilisée par votre système.
Recharger les fichiers modifiés : spécifie ce qui se produit lors de la modification, du déplacement et de la
suppression d’un fichier de script. Sélectionnez Toujours, Jamais ou Invite.
Toujours : aucun avertissement n’est affiché et le fichier est rechargé automatiquement.
Jamais : aucun avertissement n’est affiché et le fichier conserve son état actuel.
Invite (par défaut) : un avertissement est affiché et vous pouvez décider si le fichier est à
recharger ou non.
Lorsque vous élaborez des applications faisant appel à des scripts externes, cette préférence évite d’écraser
un script qui a été modifié par un membre de l’équipe depuis votre dernière ouverture de l’application. Elle
évite également de publier l’application avec des versions de script antérieures. L’avertissement vous permet
de fermer automatiquement un script pour rouvrir sa version la plus récente, modifiée.
Éditeur de classes : sélectionnez l’éditeur pour la modification des classes. Les options sont Animate,
Flash Builder et Ask.
Haut de la page
Définition des préférences du compilateur
L’onglet Compilateur dans la boîte de dialogue Préférences permet de définir les préférences du compilateur
suivantes pour la langue sélectionnée. Vous pouvez sélectionner un répertoire ou un fichier SWC donné ou
188
spécifier un nouveau répertoire :
Chemin d’accès au SDK : chemin d’accès au dossier contenant les dossiers bin,
frameworks, lib et autres.
Chemin source : chemin d’accès aux dossiers contenant des fichiers de classe
ActionScript.
Chemin de la bibliothèque : chemin d’accès aux fichiers SWC ou aux dossiers
contenant les fichiers SWC.
Chemin de bibliothèque externe : chemin d’accès aux fichiers SWC utilisés en tant que
bibliothèques partagées à l’exécution.
Haut de la page
Définition des préférences du texte
Définissez dans l’onglet Texte les préférences suivantes d’affichage du texte :
Police de correspondance par défaut
Style
Afficher la langue des noms de police
Afficher l’aperçu de la police
Taille d’aperçu de la police
Haut de la page
Définition des préférences de dessin
Outil Plume : permet de définir les options de l’outil Plume. Sélectionnez Afficher l’aperçu de plume pour
afficher un aperçu de la ligne reliant le dernier point sur lequel vous avez cliqué et l’emplacement actuel du
pointeur. Sélectionnez Afficher les points pleins pour afficher les points de contrôle sous forme de petits
carrés remplis plutôt que sous forme de carrés vides. Sélectionnez Afficher des curseurs précis pour qu’un
curseur en croix remplace l’icône de l’outil Plume lorsque vous utilisez cet outil. Cette option vous permet de
voir plus facilement la cible exacte des clics.
Outil Segment IK : l’option Définir automatiquement le point de transformation est activée par défaut pour
l’outil Segment.
Joindre les lignes : détermine la distance à laquelle l’extrémité d’une ligne doit se trouver par rapport à un
segment existant pour que celle-ci soit accrochée au point le plus proche de l’autre ligne. Ce paramètre
contrôle également la reconnaissance des lignes verticales et horizontales, le degré de rapprochement avec
l’horizontale ou la verticale que doit avoir une ligne que vous dessinez pour qu’Animate la rende parfaitement
horizontale ou verticale. Lorsque l’option Accrocher aux objets est activée, ce paramètre contrôle la distance
à laquelle doivent se trouver les objets les uns des autres pour être accrochés entre eux.
Lisser les courbes : indique le degré de lissage appliqué aux courbes dessinées avec l’outil Crayon lorsque
le mode de dessin est défini sur Redresser ou Lisser. Les courbes plus lisses sont plus faciles à remodeler,
alors que les courbes plus irrégulières sont plus fidèles aux traits d’origine.
Remarque : Vous pouvez accentuer le lissage des segments incurvés existants en sélectionnant
Modification > Forme > Lisser et Modification > Forme > Optimiser.
Reconnaître les lignes : définit le degré de rapprochement avec une ligne droite que doit avoir un segment
que vous dessinez à l’aide de l’outil Crayon pour qu’Animate le reconnaisse en tant que tel et le rende
parfaitement droit. Si l’option Reconnaître les lignes est désactivée lorsque vous dessinez, vous pourrez
redresser les lignes ultérieurement en sélectionnant un ou plusieurs segments de ligne et en choisissant
Modification >Forme > Redresser.
Reconnaître les formes : contrôle la précision avec laquelle vous devez dessiner des cercles, des ovales,
des carrés, des rectangles et des arcs de 90° et 180° pour qu’ils soient reconnus comme des formes
géométriques et redessinés avec précision. Les options disponibles sont : Désactivé(e), Précis, Normal et
Approximatif. L’option « Précis » exige que la forme dessinée soit très proche d’une ligne droite ;
« Approximatif » indique que la forme peut être quelque peu irrégulière et qu’Animate la redessine. Si l’option
Reconnaître les formes est désactivée lorsque vous dessinez, vous pourrez redresser les lignes
ultérieurement en sélectionnant une ou plusieurs formes (par exemple, des segments de ligne connectés) et
189
en choisissant Modification > Forme > Redresser.
Précision du clic : indique la distance à laquelle un élément doit se trouver du pointeur pour qu’Animate le
reconnaisse.
Haut de la page
Restauration des paramètres par défaut de toutes les préférences
Dans la boîte de dialogue Préférences, cliquez sur Valeurs par défaut ou maintenez les
touches Contrôle + Alt + Maj (Windows) ou Commande + Option + Maj (Mac OS) lorsque
vous démarrez Animate.
Adobe recommande également :
Préférences de dessin
Modification de l’apparence du scénario
À propos du scénario
Préférences de l’outil Plume
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
190
Utilisation des panneaux de création Animate CC
Panneaux de création Animate
Présentation de l’inspecteur des propriétés
Présentation du panneau Bibliothèque
Présentation du panneau Actions
Utilisation de l’Explorateur d’animations (obsolète dans Animate CC)
À propos des Composants Animate et du panneau Composants
Panneau Services du web
Vidéos et tutoriels
Vidéo: The Panels (11:15, Peachpit.com, disponible en anglais uniquement)
Haut de la page
Panneaux de création Animate
Dans l’espace de travail Animate, les panneaux de création contiennent des commandes de création et de
publication que vous pouvez organiser selon vos préférences. Vous pouvez également faire glisser un
panneau hors de son emplacement, le redimensionner, puis le placer n’importe où sur l’écran pour un accès
rapide. Il est également possible de verrouiller le panneau des menus volants d’Animate à un emplacement
donné de l’écran afin qu’il ne se déplace pas lorsque vous le faites glisser par inadvertance.
Panneaux Animate avec l’option de verrouillage
Haut de la page
Présentation de l’inspecteur des propriétés
191
L’inspecteur des propriétés facilite l’accès aux attributs le plus fréquemment utilisés de la sélection actuelle,
que ce soit sur la scène ou dans le scénario. Il vous permet de modifier les attributs d’un document ou objet
sans avoir à accéder aux menus ou panneaux qui déterminent ces attributs.
Selon ce qui est sélectionné, l’inspecteur des propriétés affiche les informations et les paramètres du
document, texte, symbole, forme, bitmap, vidéo, groupe, image ou outil actuel. Lorsque plusieurs types
d’objets sont sélectionnés, il affiche le nombre total d’objets sélectionnés.
Pour afficher l’inspecteur des propriétés, sélectionnez Fenêtre > Propriétés ou appuyez sur Ctrl+F3
(Windows) ou Commande+F3 (Macintosh).
Haut de la page
Présentation du panneau Bibliothèque
C’est dans le panneau Bibliothèque (Fenêtre > Bibliothèque) que vous stockez et organisez les symboles
créés dans Animate, ainsi que les fichiers importés, tels que les graphiques bitmap, les fichiers audio et les
clips vidéo. Le panneau Bibliothèque vous permet d’organiser le contenu de la bibliothèque dans des
dossiers, de voir la fréquence d’utilisation d’un élément dans un document et de trier les éléments par nom,
type, date, nombre d’utilisations ou identificateur de liaison ActionScript®. Par exemple, lorsque vous
importez un GIF animé dans la bibliothèque, un dossier nommé GIF est créé sous le dossier racine et le
fichier y est placé. Vous pouvez également effectuer une recherche dans le panneau Bibliothèque en
saisissant un nom de symbole ou de liaison dans le champ de recherche et définir les propriétés pour la
plupart des sélections d’objets multiples.
Panneau Bibliothèque avec un clip audio sélectionné
Haut de la page
Présentation du panneau Actions
Le panneau Actions vous permet de créer et de modifier le code ActionScript pour un objet ou une image. La
sélection d’une occurrence de bouton, de clip ou d’image rend le panneau Actions actif. Le titre du panneau
Actions devient Actions – Boutons, Actions – Clips ou Actions – Images en fonction de votre sélection.
192
Panneau Actions montrant une action stop() dans une image.
Pour afficher le panneau Actions, sélectionnez Fenêtre > Actions ou appuyez sur la touche F9.
Haut de la page
Utilisation de l’Explorateur d’animations (obsolète dans
Animate CC)
L’explorateur d’animations vous permet d’afficher et d’organiser le contenu d’un document et de sélectionner
des éléments d’un document pour les modifier. Il contient une liste affichant tous les éléments actuellement
utilisés, organisés dans une arborescence hiérarchique navigable.
Vous pouvez utiliser l’explorateur d’animations pour exécuter les actions suivantes :
Filtrer les catégories d’éléments d’un document qui apparaissent dans l’explorateur
d’animations.
Afficher les catégories sélectionnées en tant que séquences, définitions de symboles ou
les deux.
Développer ou réduire l’arborescence.
Rechercher un élément d’un document par son nom.
Vous familiariser avec la structure d’un document créé par un autre développeur.
Rechercher toutes les occurrences d’un symbole ou d’une action spécifique.
Imprimer la liste navigable actuellement affichée dans l’explorateur d’animations.
L’explorateur d’animations possède un menu Panneau, de même qu’un menu contextuel, contenant des
options permettant de réaliser des opérations sur des éléments sélectionnés ou de modifier l’affichage de
l’explorateur d’animations. Une coche avec un triangle juste en dessous dans le panneau Explorateur
d’animations signale le menu Panneau.
Remarque : les fonctionnalités de l’explorateur d’animations diffèrent légèrement lorsque vous travaillez
avec des écrans.
Utilisation de l’explorateur d’animations
Sélectionnez Fenêtre > Explorateur d’animations.
Filtrage des catégories d’éléments qui apparaissent dans l’explorateur
d’animations
193
Pour afficher le texte, les symboles, le code ActionScript, les fichiers importés, les images
ou les calques, cliquez sur un ou plusieurs boutons de filtre à droite de l’option Afficher.
Pour personnaliser les éléments à afficher, cliquez sur le bouton Personnaliser.
Sélectionnez des options dans la zone Afficher de la boîte de dialogue Paramètres de
l’explorateur d’animations pour afficher ces éléments.
Sélectionnez Afficher les éléments de l’animation dans le menu Panneau de l’explorateur
d’animations pour afficher des éléments dans des séquences.
Sélectionnez Afficher les définitions de symboles dans le menu Panneau de l’explorateur
d’animations pour afficher des informations sur les symboles.
Remarque : Les options Afficher les éléments d’animation et Afficher les définitions de
symbole peuvent être sélectionnées simultanément.
Recherche d’un élément dans le champ Rechercher
Saisissez un nom d’élément, un nom de police, une chaîne ActionScript ou un numéro
d’image dans le champ Rechercher. La fonction de recherche effectue la recherche sur
tous les éléments actuellement affichés dans l’explorateur d’animations.
Sélection d’un élément dans l’explorateur d’animations
Cliquez sur l’élément dans l’arborescence. Pour sélectionner plusieurs éléments, cliquez
sur chacun d’eux tout en maintenant la touche Maj enfoncée.
Le chemin complet de l’élément sélectionné apparaît en bas de l’explorateur
d’animations. Lorsque vous sélectionnez une séquence dans l’explorateur d’animations, la
première image de cette séquence s’affiche sur la scène. Lorsque vous sélectionnez un
élément dans l’explorateur d’animations, cet élément est sélectionné sur la scène si le
calque contenant l’élément n’est pas verrouillé.
Utilisation des commandes du menu Panneau de l’explorateur d’animations
ou du menu contextuel
1. Effectuez l’une des opérations suivantes :
Pour afficher le menu Panneau, cliquez sur sa commande dans le panneau
Explorateur d’animations.
Pour afficher le menu contextuel, cliquez avec le bouton droit de la souris (Windows)
ou tout en maintenant la touche Ctrl enfoncée (Macintosh) sur un élément dans
l’arborescence de l’explorateur d’animations.
2. Sélectionnez une option dans le menu :
Atteindre l’emplacement permet d’accéder au calque, à la séquence ou à l’image
sélectionné(e) dans le document.
Atteindre la définition du symbole permet d’accéder à la définition du symbole
sélectionné dans la zone des éléments d’animation de l’explorateur d’animations. La
définition de symbole répertorie tous les fichiers associés au symbole. L’option Afficher
les définitions de symbole doit être sélectionnée. Sa définition figure dans cette liste.
Sélectionner les occurrences de symbole permet d’accéder à la séquence contenant
les occurrences d’un symbole sélectionné dans la zone des définitions de symbole de
l’explorateur d’animations. L’option Afficher les éléments d’animation doit être
sélectionnée.
194
Afficher dans la bibliothèque souligne le symbole sélectionné dans la bibliothèque du
document. (Animate ouvre le panneau Bibliothèque s’il n’est pas déjà visible.)
Renommer vous permet de changer le nom d’un élément sélectionné.
Modifier en place vous permet de modifier un symbole sélectionné sur la scène.
Modifier dans une nouvelle fenêtre vous permet de modifier un symbole dans une
nouvelle fenêtre.
Afficher les éléments de l’animation affiche les éléments de votre document organisés
en séquences.
Afficher les définitions de symbole affiche tous les éléments associés à un symbole.
Copier le texte entier dans le Presse-papiers copie le texte sélectionné dans le
Presse-papiers. Vous pouvez coller le texte dans un éditeur de texte externe en vue de
vérifier l’orthographe ou d’apporter d’autres modifications.
Couper, copier, coller et Effacer exécute ces fonctions courantes sur un élément
sélectionné. Si vous modifiez un élément dans la liste, l’élément correspondant dans le
document est modifié.
Développer la branche développe l’arborescence au niveau de l’élément sélectionné.
Réduire la branche réduit l’arborescence au niveau de l’élément sélectionné.
Réduire les autres réduit les branches de l’arborescence qui ne contiennent pas
l’élément sélectionné
Imprimer imprime la liste actuellement affichée dans l’explorateur d’animations.
Haut de la page
À propos des Composants Animate et du panneau Composants
Dans Animate, un composant est un module préparé et réutilisable qui ajoute une fonctionnalité particulière à
un document Animate. Les composants peuvent inclure des graphiques, ainsi que du code. Ils contiennent
donc des fonctionnalités prédéfinies que vous pouvez aisément ajouter à vos projets Animate. Il peut s’agir
par exemple d’un bouton radio, d’une boîte de dialogue, d’une barre de chargement ou même d’un élément
sans aucun graphique, tel qu’un minuteur, un utilitaire de connexion au serveur ou un analyseur XML
personnalisé.
Si vous êtes peu expérimenté(e) en écriture de code ActionScript, vous pouvez ajouter des composants à un
document, définir leurs paramètres dans l’inspecteur des propriétés ou dans l’Inspecteur des composants,
puis gérer leurs événements dans le panneau Comportements. Par exemple, sans écrire aucun code
ActionScript, vous pouvez affecter un comportement Atteindre la page Web à un composant Button pour
qu’une adresse URL s’ouvre dans un navigateur Web lorsque l’utilisateur clique sur ce bouton.
Si vous êtes programmeur et que vous souhaitez créer des applications plus robustes, vous pouvez créer les
composants dynamiquement, utiliser ActionScript pour définir les propriétés et appeler les méthodes à
l’exécution. Vous pouvez également exploiter le modèle à écouteur d’événement pour gérer les événements.
Insertion d’un composant à l’aide du panneau Composants
195
Lorsque vous ajoutez un composant à un document pour la première fois, Animate l’importe en tant que clip
dans le panneau Bibliothèque. Vous pouvez également faire glisser un composant du panneau Composants
directement vers le panneau Bibliothèque, puis en ajouter une occurrence sur la scène. Vous devez à chaque
fois ajouter un composant à la bibliothèque pour pouvoir accéder aux éléments de sa classe.
1. Sélectionnez Fenêtre > panneau Composants.
2. Sélectionnez une occurrence de composant dans le panneau Composant, puis faites-la
glisser sur la scène ou sur le panneau Bibliothèque. Après l’ajout d’un composant dans la
bibliothèque, vous pouvez en faire glisser plusieurs occurrences sur la scène.
3. Configurez le composant selon vos besoins à l’aide de l’inspecteur des propriétés ou de
l’Inspecteur des composants. Pour plus d’informations sur les paramètres utilisés par le
composant, consultez la documentation du composant concerné pour la version
d’ActionScript que vous utilisez dans votre document Animate.
Saisie des paramètres d’un composant à l’aide de l’Inspecteur des
composants
1. Choisissez Fenêtre > Inspecteur des composants.
2. Sélectionnez une occurrence de composant sur la scène.
3. Cliquez sur l’onglet Paramètres, puis entrez les valeurs des paramètres qui apparaissent.
Haut de la page
Panneau Services du web
Vous pouvez afficher la liste des services web, les actualiser et en ajouter ou en supprimer à l’aide du
panneau Services web (Fenêtre > Autres panneaux > Services web). Une fois que vous l’avez ajouté dans le
panneau Services Web, vous pouvez utiliser le service Web pour toutes les applications que vous créez.
Pour actualiser tous les services Web é la fois dans le panneau Services Web, cliquez sur le bouton
Actualiser les services Web. Si, au lieu d’utiliser la scène, vous rédigez du code ActionScript pour la couche
de connectivité de votre application, vous pouvez utiliser le panneau Services web pour gérer ces services.
Adobe recommande également :
Utilisation des bibliothèques
Présentation du panneau Actions
Présentation de la fenêtre Script
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
196
Création de calques de scénario avec Animate CC
Création et organisation de calques
Affichage des calques ou des dossiers de calques
(Animate CC uniquement) Définition de propriétés sur plusieurs calques
Haut de la page
Création et organisation de calques
Les calques permettent d’organiser les différents éléments d’un document. Vous pouvez dessiner et modifier
des objets sur un calque sans affecter les objets des autres calques. Dans les zones de la scène où les
calques sont vides, vous pouvez apercevoir les calques situés en dessous.
Pour dessiner, peindre ou encore modifier un calque ou un dossier, vous devez sélectionner le calque dans
le scénario pour le rendre actif. L’icône Crayon en regard du nom d’un calque ou d’un dossier dans le
scénario indique que le calque ou le dossier est actif. Vous ne pouvez activer qu’un seul calque à la fois
(même si vous pouvez en sélectionner plusieurs à la fois).
Lorsque vous créez un document Animate CC (anciennement Flash Professional CC), celui-ci contient un
seul calque. Vous pouvez y ajouter d’autres calques de façon à organiser le contenu, les effets animés et les
autres éléments de votre document. Vous pouvez également masquer, verrouiller ou réorganiser les calques.
Le nombre de calques que vous pouvez créer n’a de limite que la mémoire de votre ordinateur, les calques
n’augmentant pas la taille de votre fichier SWF publié. Seuls les objets que vous placez sur les calques
influent sur la taille du fichier.
Pour organiser et gérer les calques, créez des dossiers de calques et placez-y des calques. Vous pouvez
développer ou réduire les dossiers de calques dans le scénario sans affecter ce qui est affiché sur la scène.
Utilisez des calques ou des dossiers distincts pour les fichiers audio, ActionScript, les étiquettes d’images et
les commentaires d’images. Cela vous permet de retrouver plus rapidement ces éléments lorsque vous devez
les modifier.
Pour vous aider à créer des effets sophistiqués, vous pouvez utiliser des calques de guide spéciaux pour
faciliter les opérations de dessin et de retouche et pour faire des calques de masque.
Il existe cinq types de calques que vous pouvez utiliser dans Animate :
Les calques normaux contiennent la plus grosse partie de l’illustration dans un fichier
FLA.
Les calques de masque contiennent des objets utilisés comme masques pour recouvrir et
cacher les parties sélectionnées des calques. Pour plus d’informations, voir Utilisation de
calques de masque.
Les calques masqués sont des calques placés sous un calque de masque que vous
associez avec ce dernier. Seule la partie du calque masqué non recouverte par le
masque est visible. Pour plus d’informations, voir Utilisation de calques de masque.
Les calques de guide contiennent des traits qui peuvent servir à guider la disposition des
objets sur d’autres calques ou le mouvement d’animations d’interpolation classiques sur
d’autres calques. Pour plus d’informations, voir Calques de guide et Création d’un
mouvement d’interpolation classique le long d’une trajectoire.
Les calques guidés sont des calques associés à un calque de guide. Les objets placés
sur le calque guidé peuvent être disposés ou animés le long des traits sur le calque de
guide. Les calques guidés peuvent contenir du contenu statique et des interpolations
classiques, mais pas d’interpolations de mouvement.
Les calques d’interpolation de mouvement contiennent les objets animés avec des
197
interpolations de mouvement. Pour plus d'informations, voir À propos des animations
interpolées.
Les calques de squelette contiennent des objets auxquels sont liés des segments de
cinématique inverse. Pour plus d’informations, voir Animation de cinématique inverse à
l’aide de l’outil Segment.
Les calques normaux, de masque, masqués et de guide peuvent contenir des interpolations de mouvement
ou des segments de cinématique inverse. Lorsque ces éléments sont présents dans l’un de ces calques,
seuls certains types de contenu peuvent être ajoutés au calque. Pour plus d’informations, voir Interpolations
de mouvement et Animation de cinématique inverse à l’aide de l’outil Segment.
Création d’un calque
Lorsque vous créez un calque, il apparaît au-dessus du calque sélectionné. Le calque que vous venez
d’ajouter devient le calque actif.
Effectuez l’une des opérations suivantes :
Cliquez sur le bouton Nouveau calque
en bas du scénario.
Choisissez Insertion > Scénario > Calque.
Cliquez avec le bouton droit de la souris (Windows) ou avec la touche Contrôle
enfoncée (Macintosh) sur le nom d’un calque dans le scénario, puis choisissez
Insérer un calque dans le menu contextuel.
Création d’un dossier de calque
Effectuez l’une des opérations suivantes :
Sélectionnez un calque ou un dossier dans le scénario, puis choisissez Insertion >
Scénario > Dossier de calques.
Cliquez avec le bouton droit de la souris (Windows) ou avec la touche Ctrl enfoncée
(Macintosh) sur le nom d’un calque dans le scénario, puis choisissez Insérer un
calque dans le menu contextuel. Le nouveau dossier apparaît au-dessus du calque
ou du dossier que vous avez sélectionné.
Cliquez sur l’icône Nouveau dossier en bas du Scénario. Le nouveau dossier
apparaît au-dessus du calque ou du dossier que vous avez sélectionné.
Organisation des calques et dossiers de calques
Vous pouvez réorganiser les différents calques et dossiers dans le scénario pour mieux organiser votre
document.
Les dossiers de calques vous permettent de mieux organiser vos tâches en plaçant les calques dans une
structure arborescente. Vous pouvez développer ou réduire le dossier pour voir les calques contenus dans un
dossier sans affecter ceux qui sont visibles sur la scène. Les dossiers pouvant contenir des calques et
d’autres dossiers, vous pouvez organiser les calques de la même manière que vous organisez les fichiers de
votre ordinateur.
Les commandes du scénario relatives aux calques s’appliquent à tous les calques d’un même dossier. Par
exemple, le verrouillage d’un dossier de calques entraîne le verrouillage de tous les calques qu’il contient.
Faites glisser le calque ou le nom du dossier de calque jusqu’au nom du dossier de
calque souhaité afin de déplacer un calque ou un dossier de calque dans le dossier visé.
Faites glisser un ou plusieurs calques ou dossiers du scénario dans la position souhaitée
pour changer l’ordre des calques ou des dossiers.
198
Pour développer ou réduire un dossier, cliquez sur le triangle à gauche de son nom.
Pour développer ou réduire tous les dossiers, cliquez sur le bouton droit (Windows) ou
maintenez appuyée la touche Contrôle (Macintosh) et sélectionnez Développer tous les
dossiers ou Réduire tous les dossiers.
Changement du nom d’un calque ou d’un dossier
Par défaut, les nouveaux calques sont nommés dans l’ordre de leur création : Calque 1, Calque 2, etc.
Renommez les calques pour mieux représenter leur contenu.
Effectuez l’une des opérations suivantes :
Double-cliquez sur le nom du calque ou dossier dans le scénario puis entrez un
nouveau nom.
Cliquez avec le bouton droit (Windows) ou avec la touche Contrôle enfoncée
(Macintosh) sur le nom du calque ou dossier et choisissez Propriétés dans le menu
contextuel. Saisissez le nouveau nom dans Nom, puis cliquez sur OK.
Sélectionnez le calque ou le dossier dans le scénario, puis choisissez Modification >
Scénario > Propriétés du calque. Saisissez le nouveau nom dans Nom, puis cliquez
sur OK.
Sélection d’un calque ou d’un dossier
Effectuez l’une des opérations suivantes :
Cliquez sur le nom du calque ou dossier dans le scénario.
Cliquez sur l’image du scénario du calque que vous souhaitez sélectionner.
Sélectionnez un objet sur la scène, dans le calque que vous souhaitez sélectionner.
Pour sélectionner des calques ou dossiers contigus, cliquez avec la touche Maj
enfoncée sur leurs noms dans le scénario.
Pour sélectionner des calques ou dossiers non contigus, cliquez avec la touche
Contrôle enfoncée (Windows) ou la touche Commande (Macintosh) enfoncée sur
leurs noms dans le scénario.
Copie d’images à partir d’un calque unique
1. Sélectionnez une plage d’images dans un calque. Cliquez sur le nom du calque dans le
scénario pour sélectionner le calque entier.
2. Choisissez Modifier > Scénario > Copier les images.
3. Cliquez sur l’emplacement de l’image où effectuer le collage et choisissez Modifier >
Scénario > Coller les images. Utilisez la commande Coller et remplacer les images pour
coller et remplacer le nombre exact d’images copiées sur le scénario cible.
Collage et remplacement des images
199
A. Sélectionnez les images et copiez-les. B. Cliquez avec le bouton droit sur l’image
dans laquelle vous souhaitez coller des images et sélectionnez Coller et remplacer les
images. C. Les images collées écrasent le nombre exact d’images sur le scénario.
Copie d’images à partir d’un dossier de calques
1. Réduisez le dossier (cliquez sur le triangle à gauche du nom de dossier dans le
scénario) et cliquez sur le nom de dossier pour sélectionner le dossier en entier.
2. Choisissez Modifier > Scénario > Copier les images.
3. Sélectionnez Insérer >Scénario > Dossier de calques pour créer un dossier.
4. Cliquez sur le nouveau calque et choisissez Modifier > Scénario > Coller les images.
Suppression d’un calque ou d’un dossier
1. Sélectionnez le calque ou le dossier en cliquant sur son nom dans le scénario ou sur
n’importe quelle image du calque.
2. Effectuez l’une des opérations suivantes :
Cliquez sur l’icône Supprimer le calque dans le scénario.
Faites glisser le calque ou dossier sur l’icône Supprimer le calque.
Cliquez avec le bouton droit (Windows) ou avec la touche Contrôle enfoncée
(Macintosh) sur le nom du calque ou dossier et choisissez Supprimer le calque dans
le menu contextuel.
Remarque : Lorsque vous supprimez un dossier de calques, tous les calques et leur
contenu sont également supprimés.
Verrouillage ou déverrouillage d’un ou plusieurs calques ou dossiers
Pour verrouiller un calque ou un dossier, cliquez sur la colonne de verrouillage à droite
du nom. Cliquez de nouveau pour le déverrouiller.
Cliquez sur l’icône de verrouillage pour verrouiller tous les calques et dossiers. Pour
déverrouiller tous les calques et dossiers, cliquez de nouveau.
Faites glisser le pointeur de la souris dans la colonne de verrouillage pour verrouiller ou
déverrouiller plusieurs calques ou dossiers.
Cliquez en appuyant sur la touche Alt (Windows) ou Option (Macintosh) dans la colonne
de verrouillage, à droite du nom du calque ou de dossier, pour verrouiller tous les autres
calques ou dossiers. Cliquez de nouveau en appuyant sur la touche Alt ou Option dans la
colonne de verrouillage pour déverrouiller tous les calques ou dossiers.
Copier-coller de calques (CS5.5 uniquement)
Vous pouvez copier des calques ou dossiers de calques entiers dans le scénario et les coller dans le même
scénario ou dans des scénarios distincts. Vous pouvez copier tous types de calques.
Lors du copier-coller de calques, la structure du dossier de calques des calques copiés est préservée.
1. Sélectionnez un ou plusieurs calques dans le scénario en cliquant sur le nom du calque.
Cliquez tout en appuyant sur la touche Maj pour sélectionner les calques contigus.
Cliquez tout en appuyant sur la touche Contrôle (Windows) ou sur la touche Commande
(Macintosh) pour sélectionner les calques non contigus.
200
2. Choisissez Modifier > Scénario >Copier les calques ou Couper les calques. Vous pouvez
également cliquer sur les calques avec le bouton droit de la souris et choisir Copier les
calques ou Couper les calques dans le menu contextuel.
3. Dans le scénario sur lequel vous souhaitez effectuer le collage, sélectionnez le calque
situé juste en dessous de l'emplacement d'insertion des calques collés.
4. Choisissez Modifier > Scénario > Coller les calques.
Les calques s'affichent dans le scénario au-dessus du calque que vous avez sélectionné. Si vous avez
sélectionné un dossier de calques, les calques collés se trouvent dans le dossier.
Pour coller un calque dans un calque de masque ou dans un calque de guide, vous devez tout d'abord
sélectionner un calque sous le masque ou le guide, puis le coller. Il est impossible de coller un calque de
masque, un calque de guide ou un calque de dossier sous un calque de masque ou un calque de guide.
Vous pouvez également dupliquer des calques en les sélectionnant et en choisissant Modifier >
Scénario >Dupliquer les calques. Les nouveaux calques incluent le mot « copie » en appendice.
Haut de la page
Affichage des calques ou des dossiers de calques
Affichage ou masquage d’un calque ou d’un dossier
Une croix rouge (X) placée en regard du nom d’un calque ou d’un dossier dans le scénario indique que celuici est masqué. Dans les paramètres de publication, vous pouvez choisir si les calques masqués sont inclus
lorsque vous publiez un fichier SWF.
Pour masquer un calque ou un dossier, cliquez dans la colonne d’affichage à la droite du
calque ou du dossier dans le scénario. Cliquez de nouveau pour l’afficher.
Pour masquer tous les calques et dossiers dans le scénario, cliquez sur l’icône Affichage.
Pour afficher tous les calques et dossiers, cliquez à nouveau.
Faites glisser le pointeur de la souris dans la colonne d’affichage pour afficher ou
masquer plusieurs calques ou dossiers.
Pour masquer tous les calques et dossiers autres que le calque ou le dossier courant,
cliquez en appuyant sur la touche Alt (Windows) ou Option (Macintosh) dans la colonne
d’affichage, à la droite du nom du calque ou dossier. Cliquez de nouveau en appuyant
sur la touche Alt ou Option pour afficher tous les calques et dossiers.
Affichage du contenu d’un calque sous forme de contours
Pour savoir à quel calque appartient un objet, affichez tous les objets d’un calque sous forme de contours
colorés.
Cliquez dans la colonne d’affichage sous forme de contours, à droite du nom du calque,
pour afficher tous les objets présents sur ce calque sous forme de contours. Pour
désactiver l’affichage de contours, cliquez de nouveau dessus.
Cliquez sur l’icône de contours pour afficher les objets présents sur tous les calques sous
forme de contours. Cliquez de nouveau dessus pour désactiver l’affichage des contours
sur tous les calques.
Pour afficher les objets sur tous les calques autres que celui en cours sous forme de
contours, cliquez en appuyant sur la touche Alt (Windows) ou Option (Macintosh) dans la
colonne Contour, à la droite du nom d’un calque. Cliquez de nouveau en appuyant sur la
touche Alt ou Option pour désactiver l’affichage des contours pour tous les calques.
201
Changement de la couleur du contour d’un calque
1. Effectuez l’une des opérations suivantes :
Double-cliquez sur l’icône du calque (l’icône située à gauche du nom du calque)
dans le scénario.
Cliquez avec le bouton droit (Windows) ou avec la touche Contrôle enfoncée
(Macintosh) sur le nom du calque et choisissez Propriétés dans le menu contextuel.
Sélectionnez le calque dans le scénario et choisissez Modification > Scénario >
Propriétés du calque.
2. Dans la boîte de dialogue Propriétés des calques, cliquez sur la case Couleur de
contour, sélectionnez une nouvelle couleur, puis cliquez sur OK.
Remarque : les trajectoires de mouvement du calque utilisent également la couleur du contour du calque.
Définition de la transparence du calque
1. Dans Animate CC, créez un fichier FLA ou ouvrez un fichier existant.
2. Cliquez en appuyant sur la touche Maj sur la colonne œil du scénario afin de définir la
visibilité sur transparent.
Remarque : L’action Maj+clic n’a aucun effet sur les calques masqués.
3. Utilisez l’une des options suivantes pour définir la transparence du calque :
Cliquez avec le bouton droit de la souris sur un calque et sélectionnez Propriétés
dans le menu contextuel. Dans la boîte de dialogue Propriétés du calque,
sélectionnez Visibilité > Transparent.
Cliquez avec le bouton droit sur un calque, puis sélectionnez Afficher d’autres
transparents.
202
Propriétés du calque
4. Cliquez sur OK.
Remarque : La transparence du calque n’a aucun effet sur les calques masqués.
Haut de la page
(Animate CC uniquement) Définition de propriétés sur plusieurs
calques
1. Dans Animate CC, créez un fichier FLA ou ouvrez un fichier existant.
2. Sélectionnez les calques dont vous souhaitez modifier les propriétés, cliquez dessus
avec le bouton droit de la souris, puis choisissez Propriétés.
3. Dans la boîte de dialogue Propriétés du calque, modifiez les propriétés de votre choix.
4. Cliquez sur OK
Affichage ou masquage d’un calque ou d’un dossier
Une croix rouge (X) placée en regard du nom d’un calque ou d’un dossier dans le scénario indique que celuici est masqué. Dans les paramètres de publication, vous pouvez choisir si les calques masqués sont inclus
lorsque vous publiez un fichier SWF.
Pour masquer un calque ou un dossier, cliquez dans la colonne d’affichage à la droite du
calque ou du dossier dans le scénario. Cliquez de nouveau pour l’afficher.
Pour masquer tous les calques et dossiers dans le scénario, cliquez sur l’icône Affichage.
Pour afficher tous les calques et dossiers, cliquez à nouveau.
Faites glisser le pointeur de la souris dans la colonne d’affichage pour afficher ou
masquer plusieurs calques ou dossiers.
Pour masquer tous les calques et dossiers autres que le calque ou le dossier courant,
203
cliquez en appuyant sur la touche Alt (Windows) ou Option (Macintosh) dans la colonne
d’affichage, à la droite du nom du calque ou dossier. Cliquez de nouveau en appuyant
sur la touche Alt ou Option pour afficher tous les calques et dossiers.
Affichage du contenu d’un calque sous forme de contours
Pour savoir à quel calque appartient un objet, affichez tous les objets d’un calque sous forme de contours
colorés.
Cliquez dans la colonne d’affichage sous forme de contours, à droite du nom du calque,
pour afficher tous les objets présents sur ce calque sous forme de contours. Pour
désactiver l’affichage de contours, cliquez de nouveau dessus.
Cliquez sur l’icône de contours pour afficher les objets présents sur tous les calques sous
forme de contours. Cliquez de nouveau dessus pour désactiver l’affichage des contours
sur tous les calques.
Pour afficher les objets sur tous les calques autres que celui en cours sous forme de
contours, cliquez en appuyant sur la touche Alt (Windows) ou Option (Macintosh) dans la
colonne Contour, à la droite du nom d’un calque. Cliquez de nouveau en appuyant sur la
touche Alt ou Option pour désactiver l’affichage des contours pour tous les calques.
Changement de la couleur du contour d’un calque
1. Effectuez l’une des opérations suivantes :
Double-cliquez sur l’icône du calque (l’icône située à gauche du nom du calque)
dans le scénario.
Cliquez avec le bouton droit (Windows) ou avec la touche Contrôle enfoncée
(Macintosh) sur le nom du calque et choisissez Propriétés dans le menu contextuel.
Sélectionnez le calque dans le scénario et choisissez Modification > Scénario >
Propriétés du calque.
2. Dans la boîte de dialogue Propriétés des calques, cliquez sur la case Couleur de
contour, sélectionnez une nouvelle couleur, puis cliquez sur OK.
Remarque : les trajectoires de mouvement du calque utilisent également la couleur du contour du calque.
Adobe recommande également :
Modification de l’apparence du scénario
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
204
Création d’une feuille Sprite
Création de feuilles Sprite
Une feuille Sprite est un fichier d’images bitmap qui contient plusieurs graphiques de taille inférieure disposés
en forme de grille en mosaïque. La compilation de plusieurs graphiques au sein d’un fichier unique permet à
Animate et à d’autres applications d’utiliser les graphiques en ne chargeant qu’un seul fichier. Cette efficacité
de chargement peut s’avérer très utile, notamment dans le cas de développement de jeux, où les
performances sont particulièrement importantes.
Feuille Sprite contenant les sprites dans une animation image par image.
Vous pouvez créer une feuille Sprite à partir d’une sélection d’une combinaison de clips, symboles de
boutons, symboles de graphiques ou bitmaps. Vous pouvez sélectionner des éléments soit dans le panneau
Bibliothèque soit sur la scène, mais pas dans les deux. Chaque bitmap (et chaque image) des symboles
sélectionnés apparaît comme graphique distinct dans la feuille Sprite. Si vous exportez depuis la scène,
toutes les transformations (mise à l’échelle, inclinaison, etc.) que vous avez appliquées à l’occurrence de
symbole sont préservées dans l’image de sortie.
Pour créer une feuille Sprite :
1. Sélectionnez un ou plusieurs symboles dans la bibliothèque ou des occurrences de
symboles sur la scène. Votre sélection peut également contenir des bitmaps.
2. Cliquez sur votre sélection avec le bouton droit de la souris et choisissez Générer la
feuille Sprite.
3. Sélectionnez les options de votre choix dans la boîte de dialogue Générer la feuille
Sprite, puis cliquez sur Exporter.
Les options d’exportation suivantes sont disponibles :
Dimensions de l’image Taille totale de la feuille Sprite, en pixels. La valeur par défaut, Taille automatique,
dimensionne la feuille de façon à inclure tous les sprites que vous ajoutez.
Format de l’image Format d’image de la feuille Sprite exportée. Les formats PNG 8 bits et PNG 32 bits
prennent en charge l’utilisation d’un arrière-plan transparent (canal alpha). Les formats PNG 24 bits et JPG
ne prennent pas en charge les arrière-plans transparents. En règle générale, la différence visuelle entre le
format PNG 8 bits et le format PNG 32 bits est minime. Les fichiers au format PNG 32 bits sont 4 fois plus
volumineux que les fichiers au format PNG 8 bits.
205
Remplissage des bordures Remplissage des bordures de la feuille Sprite, en pixels.
Remplissage des formes Remplissage entre chaque image dans la feuille Sprite, en pixels.
Algorithme Technique utilisée pour mettre en package les images dans la feuille Sprite. Deux options sont
disponibles :
Basic (option par défaut)
MaxRects
Format de données Format interne utilisé pour les données d’image. Choisissez le format en fonction de
l’utilisation prévue de la feuille Sprite après l’exportation. Le format par défaut est Starling.
Faire pivoter Cette option permet de faire pivoter les sprites de 90 degrés. Cette option est disponible
uniquement pour certains formats de données.
Réduire Cette option permet d’économiser de l’espace dans la feuille Sprite en supprimant les pixels non
utilisés de chaque image de symbole ajoutée à la feuille.
Empiler les images Cette option permet d’éviter que les images dupliquées des symboles sélectionnés
soient également dupliquées dans la feuille Sprite générée.
Mots-clés : feuille sprite, flash professional, cs6, starling, easeljs, créer une feuille sprite, création d’une
feuille sprite, exporter une feuille sprite
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
206
Déplacement et copie d’objets
Déplacement des objets par glissement
Déplacement des objets à l’aide des touches de direction
Déplacement des objets à l’aide de l’inspecteur des propriétés
Déplacement des objets à l’aide du panneau Info
Déplacement et copie d’objets par collage
Copie d’objets à l’aide du Presse-papiers
Copie d’objets transformés
Haut de la page
Déplacement des objets par glissement
1. Sélectionnez un ou plusieurs objets.
2. Sélectionnez l’outil Sélection
des opérations suivantes :
, placez le pointeur au-dessus de l’objet et effectuez l’une
Pour déplacer l’objet, il vous suffit de le faire glisser vers le nouvel emplacement.
Pour copier l’objet et déplacer la copie, appuyez sur Alt (Windows) ou Option
(Macintosh) pendant que vous faites glisser le curseur.
Pour contraindre le mouvement de l’objet aux multiples de 45°, appuyez sur la
touche Maj pendant que vous faites glisser le curseur.
Haut de la page
Déplacement des objets à l’aide des touches de direction
1. Sélectionnez un ou plusieurs objets.
2. Effectuez l’une des opérations suivantes :
Appuyez sur la touche de direction correspondant à la direction dans laquelle vous
souhaitez déplacer l’objet de 1 pixel à la fois.
Appuyez sur Maj+touche de direction pour déplacer la sélection de 10 pixels à la fois.
Remarque : lorsque l’option d’accrochage aux pixels est sélectionnée, les touches fléchées permettent de
déplacer les objets par incréments sur la grille de pixels de l’animation, mais pas sur ceux de l’écran.
Haut de la page
Déplacement des objets à l’aide de l’inspecteur des propriétés
1. Sélectionnez un ou plusieurs objets.
2. Si l’inspecteur des propriétés n’est pas visible, sélectionnez Fenêtre > Propriétés.
3. Saisissez les valeurs x et y pour l’emplacement de l’angle supérieur gauche de la
sélection.
Les unités sont calculées par rapport à l’angle supérieur gauche de la scène.
Remarque : l’inspecteur des propriétés utilise les unités spécifiées pour l’option Unités
207
de la règle dans la boîte de dialogue Propriétés du document.
Haut de la page
Déplacement des objets à l’aide du panneau Info
1. Sélectionnez un ou plusieurs objets.
2. Si le panneau Info n’est pas visible, sélectionnez Fenêtre > Info.
3. Saisissez les valeurs x et y pour l’emplacement de l’angle supérieur gauche de la
sélection.
Les unités sont calculées par rapport à l’angle supérieur gauche de la scène.
Haut de la page
Déplacement et copie d’objets par collage
Si vous souhaitez déplacer ou copier des objets entre des calques, des séquences ou d’autres fichiers
Animate, utilisez la technique de collage. Vous pouvez coller un objet dans une position définie par rapport à
sa position d’origine.
1. Sélectionnez un ou plusieurs objets.
2. Choisissez Modifier > Couper ou Modifier > Coller.
3. Sélectionnez un autre calque, une autre séquence ou un autre fichier, puis choisissez
Modifier > Coller en place pour coller la sélection è la même position par rapport à la
scène. Choisissez Modifier > Coller au centre pour coller la sélection au centre de la
zone de travail.
Haut de la page
Copie d’objets à l’aide du Presse-papiers
Les éléments copiés dans le Presse-papiers sont anticrénelés, de sorte qu’ils conservent une aussi bonne
apparence dans d’autres applications que dans Animate. Cela est utile pour des images qui comprennent un
bitmap, des dégradés, des transparences ou un calque de masque.
Les graphiques collés depuis d’autres documents Animate ou d’autres logiciels sont placés dans l’image
active du calque actif. La manière dont un élément graphique est collé dans une scène Animate dépend du
type de l’élément, de son origine et des préférences que vous avez définies :
Le texte créé dans un éditeur de texte devient un objet texte simple.
Les graphiques vectoriels provenant d’un programme de dessin deviennent un groupe
que vous pouvez dissocier et modifier.
Les bitmaps deviennent un seul objet groupé tout comme les bitmaps importés. Vous
pouvez séparer des bitmaps collés ou les convertir en graphiques vectoriels.
Remarque : convertissez les couleurs au format RVB dans Illustrator avant de coller des graphiques
d’Illustrator dans Animate.
Haut de la page
Copie d’objets transformés
Vous pouvez créer une copie avec redimensionnement, rotation ou inclinaison d’un objet.
1. Sélectionnez un objet.
208
2. Sélectionnez Fenêtre > Transformer.
3. Entrez les valeurs d’échelle, de rotation ou d’inclinaison.
4. Cliquez sur le bouton Dupliquer la sélection et la transformer
du panneau Transformer.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
209
Synchronisation des préférences d’Animate avec Creative Cloud
Animate est désormais totalement intégré à Creative Cloud. Cette intégration permet de synchroniser les
préférences sur Creative Cloud, puis sur plusieurs ordinateurs (maximum deux). Outre la création d’une
sauvegarde sur Creative Cloud, la fonction de synchronisation des préférences permet de restaurer et de
réutiliser les préférences même si vous réinstallez Animate.
Le jeu de préférences suivant peut être synchronisé avec Creative Cloud et sur plusieurs ordinateurs :
Espace de travail : inclut la synchronisation de l’espace de travail actif et des espaces
de travail définis par l’utilisateur. Une fois téléchargés sur un autre ordinateur, les
panneaux conservent leur position avec les paramètres appropriés définis en fonction de
la résolution de l’écran.
Raccourcis clavier/Présélections personnalisées : raccourcis clavier par défaut et
personnalisés.
Propriétés du document : comprend les paramètres du document liés à la scène.
Préférences au niveau de l’application : comprend les options définies dans les onglets
suivants du panneau Préférences :
Général
Synchroniser les paramètres
Éditeur de code
Fichiers de script
Compilateur
Texte
Dessin
Préférences de la feuille Sprite : options de sortie pour le générateur de feuilles Sprite,
y compris la dimension de l’image, l’algorithme, le format de données, etc.
Paramètres de grille, de guide et d’accrochage : options de grille, d’alignement, de
pixels, d’objets, de guides et d’accrochage définies à l’aide du menu Affichage dans
Animate CC.
210
Vous pouvez également choisir de synchroniser les préférences sur deux plates-formes différentes (MAC et
Windows). Néanmoins, étant donné les différences dans les systèmes d’exploitation, certaines restrictions
s’appliquent lors de la synchronisation interplateformes. Il est impossible de synchroniser certains
paramètres. Par exemple, les raccourcis clavier qui incluent la touche contrôle (MAC) sont ignorés lors du
téléchargement des préférences sur un ordinateur Windows.
Haut de la page
Synchronisation des préférences d’Animate avec Creative Cloud
1. Lancez Animate CC.
2. La boîte de dialogue Adobe Animate s’affiche lors du lancement initial d’Animate CC.
a. Lancement de la synchronisation : cliquez sur le bouton Synchroniser les
211
paramètres maintenant pour commencer la synchronisation des préférences
Animate avec Creative Cloud.
b. Modification des paramètres de synchronisation par défaut : cliquez sur
Avancé. La section Paramètres de synchronisation du panneau Préférences
s’affiche. Vérifiez ou modifiez ces paramètres au besoin.
c. Désactivation de la synchronisation : cliquez sur le bouton Désactiver la
synchronisation des paramètres pour désactiver la synchronisation des préférences
Animate avec Creative Cloud.
3. Si vous souhaitez synchroniser les paramètres avec Creative Cloud, vous pouvez, à tout
dans la barre de titres d’Animate CC, puis cliquez sur
moment, cliquer sur le bouton
Synchroniser les paramètres maintenant.
4. En outre, pour modifier les paramètres de synchronisation, cliquez sur Modifier >
Préférences > Paramètres de synchronisation. Vous pouvez cliquer sur le bouton
Synchroniser les paramètres maintenant pour synchroniser les paramètres modifiés avec
Creative Cloud.
Haut de la page
Téléchargement des préférences depuis Creative Cloud
Vous pouvez synchroniser les préférences d’Animate sur deux systèmes. Vous pouvez modifier les
préférences sur un ordinateur, synchroniser ces paramètres modifiés avec Creative Cloud, puis les
télécharger sur un autre ordinateur.
Si les préférences du deuxième ordinateur sont des préférences par défaut ou des préférences non
modifiées, vous pouvez continuer de télécharger les préférences depuis Creative Cloud. Lorsque les
préférences sont correctement téléchargées sur un système, la boîte de dialogue Les paramètres mis à jour
son prêts s’affiche.
Néanmoins, un conflit se produit si vous synchronisez les préférences sans les synchroniser avec Creative
Cloud. Pour plus d’informations sur la résolution de ce type de conflits, voir Résolution des conflits de
synchronisation.
Par exemple, vous avez modifié les raccourcis clavier sur un ordinateur de votre lieu de travail et les avez
synchronisés avec Creative Cloud. Vous pouvez télécharger et appliquer ces préférences chez vous sur un
autre ordinateur.
1. Lancez Animate CC.
2. Dans Animate CC, cliquez sur le bouton
.
3. Cliquez sur le bouton Synchroniser les préférences maintenant.
4. Dans la boîte de dialogue Les paramètres mis à jour sont prêts, cliquez sur Appliquer
pour remplacer les préférences actuelles par la copie téléchargée.
Remarque : si vous quittez Animate avant d’appliquer les préférences téléchargées, celles-ci sont
automatiquement appliquées au redémarrage de l’application.
212
Haut de la page
Résolution des conflits
Lorsque vous utilisez plusieurs ordinateurs, vous pouvez modifier les paramètres de synchronisation sur l’un
de ces ordinateurs. Néanmoins, un conflit se produit si vous modifiez les mêmes paramètres sur un autre
ordinateur.
Par exemple, supposons que vous ayez modifié les paramètres de la feuille Sprite sur votre ordinateur
professionnel (bureau). Vous avez ensuite modifié ces mêmes paramètres sur votre ordinateur personnel. Si
vous n’avez pas synchronisé votre ordinateur personnel avec Creative Cloud avant de modifier les
paramètres de la feuille Sprite, un conflit se produit.
Pour résoudre ce type de conflits :
1. Dans Animate CC, cliquez sur le bouton
.
2. La boîte de dialogue suivante s’affiche :
3. Vous pouvez décider de conserver les paramètres locaux ou de télécharger les
paramètres depuis Creative Cloud en utilisant l’une des options suivantes :
Synchronisation locale synchroniser les paramètres locaux de cet ordinateur sur Creative Cloud ;
remplacer la version de Creative Cloud par la version locale des paramètres.
Synchronisation du cloud synchroniser de Creative Cloud vers l’ordinateur local ; ignorer les modifications
apportées aux paramètres locaux et les remplacer par les paramètres téléchargés depuis Creative Cloud.
Haut de la page
Résolution des problèmes
Les raccourcis clavier ajoutés aux présélections avec des noms non valides (noms non
pris en charge par le système d’exploitation) ne sont pas synchronisés avec Creative
Cloud.
En outre, les raccourcis clavier répertoriés sous les différents menus ne sont pas
synchronisés sur les systèmes de plates-formes différentes. Par exemple, la commande
Mappage des polices apparaît sous différents menus dans les versions Mac et Windows
d’Animate CC. Si la commande Mappage des polices est affectée à un nouveau raccourci
clavier sous Mac et synchronisée avec Creative Cloud, il est impossible de la télécharger
et de l’utiliser sous Windows.
Les paramètres de police ne sont pas synchronisés avec Creative Cloud.
Gestion des erreurs :
Pas de connexion Internet : s’il n’y a pas de connexion Internet, Animate CC
renvoie une erreur et il est impossible de télécharger les paramètres de
synchronisation vers ou depuis Creative Cloud. Vérifiez qu’une connexion Internet
stable est établie avec le système.
Serveur occupé : si le serveur Creative Cloud est occupé, Animate CC renvoie une
erreur et il est impossible de synchroniser les préférences depuis Creative Cloud.
Espace disque insuffisant : si l’espace disque est insuffisant sur le système local,
Animate CC renvoie une erreur et le téléchargement des préférences de
Creative Cloud échoue.
213
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
214
Utilisation du panneau Couleur Adobe
Adobe® Color® est une application Web utilisée pour expérimenter, créer et partager les thèmes de couleurs
que vous utilisez dans un projet. Animate CC (anciennement Flash Professional CC) est doté d’un panneau
Couleur intégré qui permet d’afficher et d’utiliser les thèmes de couleur que vous avez créés ou marqués
comme favoris dans l’application Adobe Color. Pour plus d’informations sur Adobe Color, cliquez ici.
Haut de la page
Panneau Couleur
Dans Animate CC, le panneau Couleur Adobe (Windows > Extensions > Thèmes de couleur Adobe) affiche
les éléments suivants :
Les thèmes que vous avez créés et qui sont synchronisés avec votre compte sur le site
Web Adobe Color (color.adobe.com).
Les thèmes publics que vous avez marqués comme favoris sur le site Web Adobe Color.
L’Adobe ID utilisé dans Animate CC est automatiquement utilisé pour la connexion au site Web Adobe Color
et le panneau Couleur est actualisé.
Remarque : Si les informations d’identification que vous utilisez avec Animate CC ne sont pas associées à
un ID Color, un ID Color est automatiquement créé avec les informations d’identification d’Animate. Vous
pouvez alors accéder au site Web Adobe Color à l’aide des informations d’identification de votre ID Adobe.
Haut de la page
Utilisation du panneau Couleur
Remarque : Pour que le panneau Couleur fonctionne, vous devez être connecté à Internet lors du
démarrage d’Animate. Sinon, vous ne pourrez pas utiliser le panneau Couleur.
Les nuances et les thèmes de couleur disponibles dans le panneau Couleur sont en lecture seule. Vous
pouvez utiliser une nuance ou un thème dans votre illustration directement à partir du panneau Couleur.
Toutefois, pour modifier un nuancier ou un thème de couleur, vous devez d’abord l’ajouter au panneau
Nuanciers.
1. Cliquez sur Fenêtre > Extensions > Thèmes de couleur Adobe pour ouvrir le panneau
Couleur.
Tous les thèmes disponibles dans votre compte Adobe Color au démarrage d’Animate
sont répertoriés dans le panneau Couleur.
2. Si vous avez ajouté un thème dans Color après avoir démarré Animate, cliquez sur
Actualiser dans le panneau Couleur pour inclure ce dernier thème.
215
A. Recherche de thème par nom B. Icône de thème favori C. Icône de dossier de
thème D. Actualiser E. Lancer le site Web Color F. Nom du thème
Remarque : Le panneau Couleur répertorie les thèmes que vous avez créés, modifiés
ou marqués comme favoris (répertoriés sur le site Web Adobe Color sous Mycolor).
3. Vous pouvez ajouter le thème entier au panneau Nuanciers (Fenêtre > Nuanciers) en
cliquant sur le dossier Thème ou sur l’icône Thème favori. Le thème est ajouté au
dossier Couleur dans le panneau Nuanciers.
4. Si vous disposez de nombreux thèmes, recherchez le thème à l’aide de l’option de
recherche. Les recherches portent sur les noms des thèmes.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
216
Modèles
À propos des modèles
Utilisation d’un modèle
Haut de la page
À propos des modèles
Les modèles Animate vous offrent un point de départ très pratique pour vos projets standard. La boîte de
dialogue Nouveau fichier propose un aperçu et une description de chaque modèle. Les modèles sont
disponibles dans six catégories :
Publicité : inclut des tailles de scène standard utilisées dans des annonces publicitaires
sur Internet.
Animation : inclut de nombreux types d’animations, notamment le mouvement, la mise en
surbrillance, le rayonnement et l’accélération.
Bannières : inclut les tailles et les fonctionnalités standard utilisées dans les interfaces
des sites Web.
Lecture multimédia : inclut des albums photo, ainsi que la lecture de plusieurs dimensions
et formats vidéo.
Présentations : inclut des styles de présentation simples et plus complexes.
Fichiers d’exemples : fournit des exemples de fonctions fréquemment utilisées dans
Animate.
Remarque concernant les modèles de publicité
Les modèles de publicité facilitent la création de médias enrichis de types et de formats standard définis par
l’IAB (Interactive Advertising Bureau) et reconnus par le secteur. Pour plus d’informations sur les types de
publicités recommandés par l’IAB, voir le site Web de l’IAB sur iabfrance.com.
Testez la stabilité de vos annonces publicitaires dans plusieurs combinaisons de navigateurs et platesformes. Votre application de publicité est considérée comme stable si elle n’est pas à l’origine de messages
d’erreur, de blocages du navigateur ou de blocages du système.
Travaillez avec les administrateurs Web et les administrateurs réseau pour créer des plans de test détaillés
qui incluent les tâches que vous souhaitez que le public effectue dans la publicité. Vous trouverez des
exemples de plans de test sur le site Web de l’IAB à la rubrique concernant le test des médias enrichis IAB. Il
peut également exister d’autres exigences en matière de taille et de format des annonces publicitaires,
suivant les fournisseurs et les sites Web. Consultez votre fournisseur, le fournisseur de services Internet ou le
site IAB pour connaître les critères susceptibles d’affecter la conception d’annonces publicitaires.
Haut de la page
Utilisation d’un modèle
1. Choisissez Fichier > Nouveau.
2. Cliquez sur l’onglet Modèles dans la boîte de dialogue Nouveau fichier.
3. Sélectionnez un modèle dans l’une des catégories, puis cliquez sur OK.
217
4. Ajoutez du contenu au fichier FLA qui s’ouvre.
5. Enregistrez et publiez le fichier.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
218
Recherche et remplacement de contenu dans Animate
À propos de Rechercher et remplacer
Recherche et remplacement de texte
Recherche et remplacement de polices
Recherche et remplacement des couleurs
Recherche et remplacement de symboles
Recherche et remplacement de fichiers audio, vidéo ou bitmap
Haut de la page
À propos de Rechercher et remplacer
La fonction Rechercher et remplacer vous permet d’exécuter les opérations suivantes :
Vous pouvez rechercher une chaîne de texte, une police, une couleur, un symbole, un
fichier audio ou vidéo ou un fichier bitmap importé.
Vous pouvez également remplacer l’élément spécifié par un autre élément du même type.
Vous pouvez utiliser différentes options dans la boîte de dialogue Rechercher et
remplacer selon le type de l’élément spécifié.
Vous pouvez rechercher et remplacer des éléments dans le document ou la séquence en
cours.
Vous pouvez rechercher l’occurrence suivante ou toutes les occurrences d’un élément et
remplacer une occurrence ou toutes les occurrences.
Remarque : dans un document contenant des écrans, vous pouvez rechercher et remplacer des éléments
dans le document ou l’écran en cours ; en revanche, vous ne pouvez pas utiliser de séquences.
L’option Modification en direct vous permet de modifier l’élément spécifié directement sur la scène. Si vous
utilisez cette option lorsque vous recherchez un symbole, Animate ouvre le symbole en mode de modification
en place.
Le journal des recherches et remplacements en bas de la fenêtre Rechercher et remplacer affiche
l’emplacement, le nom et le type des éléments recherchés.
Haut de la page
Recherche et remplacement de texte
1. Choisissez Modifier > Rechercher et remplacer.
2. Sélectionnez Texte dans le menu contextuel Pour.
3. Dans le champ Texte, saisissez le texte à rechercher.
4. Dans la zone Remplacer par du texte, saisissez le texte que vous souhaitez utiliser en
remplacement du texte existant.
5. Sélectionnez des options pour affiner votre recherche :
Mot entier recherche la chaîne de texte spécifiée uniquement sous forme de mot entier,
219
c’est-à-dire entourée de part et d’autre d’espaces, de guillemets ou de marqueurs de
type similaire. Lorsque l’option Mot entier est désélectionnée, la chaîne de texte
spécifiée peut être recherchée à l’intérieur d’un mot. Par exemple, lorsque Mot entier est
désélectionné, une recherche de place renvoie les mots remplace, placement, et ainsi de
suite.
Respecter la casse recherche la chaîne de texte dont la casse est identique au texte
spécifié (majuscules ou minuscules).
Expressions régulières recherche la chaîne de texte dans des expressions régulières
dans ActionScript. Une expression est une instruction que Flash Professional peut
évaluer et qui renvoie une valeur.
Contenu du champ de texte renvoie le contenu d’un champ de texte.
Images/Calques/Paramètres permet de faire porter la recherche sur les étiquettes
d’images, les noms des calques et des séquences et les paramètres de composants.
Chaînes dans ActionScript recherche des chaînes (texte entre guillemets) ActionScript
dans le document ou dans la séquence (les fichiers ActionScript externes ne sont pas
compris dans la recherche).
ActionScript effectue la recherche sur l’ensemble du code ActionScript, y compris code
et chaînes.
6. Choisissez Modification en direct pour sélectionner l’occurrence suivante de la chaîne
spécifiée sur la scène et la modifier directement.
Remarque : seule l’occurrence suivante est sélectionnée pour une modification en
direct, même si vous sélectionnez Rechercher tout à l’étape 7.
7. Pour rechercher une chaîne de texte, effectuez l’une des opérations suivantes :
Cliquez sur Rechercher le suivant pour trouver l’occurrence suivante de la chaîne de
texte spécifiée.
Cliquez sur Rechercher tout pour trouver toutes les occurrences de la chaîne de
texte spécifiée.
8. Pour remplacer une chaîne de texte, effectuez l’une des opérations suivantes :
Cliquez sur Remplacer pour remplacer l’occurrence actuellement sélectionnée de la
chaîne de texte spécifiée.
Cliquez sur Rechercher tout pour trouver toutes les occurrences de la chaîne de
texte spécifiée.
Haut de la page
Recherche et remplacement de polices
1. Choisissez Modifier > Rechercher et remplacer.
2. Choisissez Police à partir du menu contextuel Pour, puis choisissez parmi les options
suivantes :
Pour une recherche par nom de police, sélectionnez Nom de la police et choisissez
une police dans le menu contextuel ou saisissez le nom d’une police dans le champ.
Lorsque l’option Nom de la police est désélectionnée, la recherche porte sur toutes
les polices de la séquence ou du document.
Pour une recherche par style de police, sélectionnez Style de la police et choisissez
un style dans le menu contextuel. Lorsque l’option Style de la police est
désélectionnée, la recherche porte sur tous les styles de police de la séquence ou du
220
document.
Pour une recherche par taille de police, sélectionnez Taille de la police et saisissez
des valeurs minimale et maximale pour spécifier la plage de tailles de police sur
laquelle porter la recherche. Lorsque l’option Taille de la police est désélectionnée, la
recherche porte sur toutes les tailles de police de la séquence ou du document.
Pour remplacer la police spécifiée par une autre police, sélectionnez Nom de la
police dans la zone Remplacer par et choisissez un nom de police dans le menu
contextuel ou saisissez un nom dans le champ. Lorsque l’option Nom de la police est
désélectionnée dans la zone Remplacer par, la police n’est pas modifiée.
Pour remplacer le style de police spécifié par un autre style de police, sélectionnez
Style de la police dans la zone Remplacer par et choisissez un style de police dans
le menu contextuel. Lorsque l’option Style de la police est désélectionnée dans la
zone Remplacer par, le style de la police n’est pas modifié.
Pour remplacer la taille de police spécifiée par une autre taille de police, sélectionnez
Taille de la police dans la zone Remplacer par et choisissez une taille dans le menu
contextuel. Lorsque l’option Taille de la police est désélectionnée dans la zone
Remplacer par, la taille de la police n’est pas modifiée.
3. Choisissez Modification en direct pour sélectionner l’occurrence suivante de la chaîne
spécifiée sur la scène et la modifier directement.
Remarque : seule l’occurrence suivante est sélectionnée pour une modification en
direct, même si vous sélectionnez Rechercher tout à l’étape 4.
4. Pour rechercher une police, effectuez l’une des opérations suivantes :
Cliquez sur Rechercher le suivant pour trouver l’occurrence suivante de la chaîne de
texte spécifiée.
Cliquez sur Rechercher tout pour trouver toutes les occurrences de la chaîne de
texte spécifiée.
5. Pour remplacer une police, effectuez l’une des opérations suivantes :
Cliquez sur Remplacer pour remplacer l’occurrence actuellement sélectionnée de la
chaîne de texte spécifiée.
Cliquez sur Rechercher tout pour trouver toutes les occurrences de la chaîne de
texte spécifiée.
Haut de la page
Recherche et remplacement des couleurs
Vous ne pouvez pas chercher et remplacer des couleurs dans des objets groupés.
Remarque : Pour rechercher et remplacer des couleurs dans un fichier GIF ou JPEG contenu dans un
document Flash Professional, modifiez ce fichier dans une application de modification d’images.
1. Choisissez Modifier > Rechercher et remplacer.
2. Sélectionnez Couleur dans le menu contextuel Pour.
3. Pour rechercher une couleur, cliquez sur la puce de couleur et effectuez l’une des
opérations suivantes :
Sélectionnez une couleur dans la fenêtre contextuelle du nuancier.
Saisissez une valeur colorimétrique hexadécimale dans le champ de la fenêtre
contextuelle du nuancier.
Cliquez sur le bouton Sélecteur de couleur et sélectionnez une couleur dans le
sélecteur de couleur du système.
Faites-la glisser à partir du contrôle de couleur pour faire apparaître l’outil Pipette.
Sélectionnez une couleur à l’ écran.
221
4. Pour sélectionner une couleur à utiliser en remplacement de la couleur spécifiée, cliquez
sur la puce de couleur dans la zone Remplacer par et effectuez l’une des opérations
suivantes :
Sélectionnez une couleur dans la fenêtre contextuelle du nuancier.
Saisissez une valeur colorimétrique hexadécimale dans le champ de la fenêtre
contextuelle du nuancier.
Cliquez sur le bouton Sélecteur de couleur et sélectionnez une couleur dans le
sélecteur de couleur du système.
Faites-la glisser à partir du contrôle de couleur pour faire apparaître l’outil Pipette.
Sélectionnez une couleur à l’ écran.
5. Sélectionnez l’option Remplissages, Traits ou Texte ou une combinaison de ces options
pour spécifier les occurrences de la couleur spécifiée à rechercher et remplacer.
6. Choisissez Modification en direct pour sélectionner l’occurrence suivante de la chaîne
spécifiée sur la scène et la modifier directement.
Remarque : seule l’occurrence suivante est sélectionnée pour une modification en
direct, même si vous sélectionnez Rechercher tout à l’étape suivante.
7. Recherchez une couleur.
Cliquez sur Rechercher le suivant pour trouver l’occurrence suivante de la chaîne de
texte spécifiée.
Cliquez sur Rechercher tout pour trouver toutes les occurrences de la chaîne de
texte spécifiée.
8. Remplacez une couleur.
Cliquez sur Remplacer pour remplacer l’occurrence actuellement sélectionnée de la
chaîne de texte spécifiée.
Cliquez sur Rechercher tout pour trouver toutes les occurrences de la chaîne de
texte spécifiée.
Haut de la page
Recherche et remplacement de symboles
La recherche de symboles s’effectue par nom. Vous pouvez remplacer un symbole par un autre symbole de
tout type : clip, bouton ou graphique.
1. Choisissez Modifier > Rechercher et remplacer.
2. Sélectionnez Symbole dans le menu contextuel Pour.
3. Dans le champ Nom, choisissez un nom dans le menu contextuel.
4. Dans la zone Remplacer par - Nom, choisissez un nom dans le menu contextuel.
5. Choisissez Modification en direct pour sélectionner l’occurrence suivante de la chaîne
spécifiée sur la scène et la modifier directement.
Remarque : seule l’occurrence suivante est sélectionnée pour une modification en
direct, même si vous sélectionnez Rechercher tout à l’étape suivante.
6. Pour rechercher un symbole, effectuez l’une des opérations suivantes :
Cliquez sur Rechercher le suivant pour trouver l’occurrence suivante de la chaîne de
texte spécifiée.
Cliquez sur Rechercher tout pour trouver toutes les occurrences de la chaîne de
texte spécifiée.
7. Pour remplacer un symbole, effectuez l’une des opérations suivantes :
222
Cliquez sur Remplacer pour remplacer l’occurrence actuellement sélectionnée de la
chaîne de texte spécifiée.
Cliquez sur Rechercher tout pour trouver toutes les occurrences de la chaîne de
texte spécifiée.
Haut de la page
Recherche et remplacement de fichiers audio, vidéo ou bitmap
1. Choisissez Modifier > Rechercher et remplacer.
2. Sélectionnez Son, Vidéo ou Bitmap dans le menu contextuel Pour.
3. Dans le champ Nom, saisissez le nom d’un fichier audio, vidéo ou bitmap ou
sélectionnez un nom dans le menu contextuel.
4. Dans la zone Remplacer par - Nom, saisissez le nom d’un fichier audio, vidéo ou bitmap
ou sélectionnez un nom dans le menu contextuel.
5. Choisissez Modification en direct pour sélectionner l’occurrence suivante du fichier audio,
vidéo ou bitmap spécifié sur la scène et la modifier directement.
Remarque : seule l’occurrence suivante est sélectionnée pour une modification en
direct, même si vous sélectionnez Rechercher tout à l’étape suivante.
6. Recherchez un fichier audio, vidéo ou bitmap.
Cliquez sur Rechercher le suivant pour trouver l’occurrence suivante du fichier audio,
vidéo ou bitmap spécifié.
Cliquez sur Rechercher le suivant pour trouver l’occurrence suivante du fichier audio,
vidéo ou bitmap spécifié.
7. Remplacez un fichier audio, vidéo ou bitmap.
Cliquez sur Remplacer pour remplacer l’occurrence actuellement sélectionnée du
fichier audio, vidéo ou bitmap spécifié.
Cliquez sur Rechercher le suivant pour trouver l’occurrence suivante du fichier audio,
vidéo ou bitmap spécifié.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
223
Commandes Annuler et Rétablir, et panneau Historique
Commandes Annuler, Rétablir et Répéter
Utilisation du panneau Historique
Annulation d’opérations à partir du panneau Historique
Réexécution d’opérations à partir du panneau Historique
Copie et collage des étapes entre les documents
Haut de la page
Commandes Annuler, Rétablir et Répéter
Spécifiez les commandes Annuler ou Rétablir (Modifier >Annuler ou Modification > Rétablir) au niveau de
l’objet ou au niveau du document afin d’annuler ou de rétablir des actions portant sur des objets particuliers
ou sur tous les objets dans le document en cours. Par défaut, les commandes Annuler et Répéter
s’appliquent au niveau document.
Pour sélectionner les options d’annulation au niveau de l’objet ou du document, procédez comme suit :
1. Dans Animate CC, sélectionnez Édition > Préférences.
2. Dans l’onglet Général, sélectionnez Annulation au niveau de l’objet dans la liste
déroulante Annuler.
Remarque : Vous ne pouvez pas annuler certaines actions lorsque vous procédez à une annulation au niveau
de l’objet. Parmi celles-ci, il y a l’activation et la désactivation du mode d’édition ; la sélection, l’édition et le
déplacement d’actifs d’une bibliothèque ; et la création, la suppression et le déplacement de séquences.
Vous pouvez utiliser la commande Répéter pour appliquer une opération précédente au même objet ou à un
objet différent. Par exemple, si vous déplacez une forme nommée forme_A, vous pouvez choisir Modifier >
Répéter pour déplacer de nouveau la forme, ou vous pouvez sélectionner une autre forme, forme_B, et
choisir Modifier > Répéter pour déplacer cette deuxième forme de façon identique.
Par défaut, Animate autorise 100 niveaux d’annulation pour la commande de menu Annuler. Vous pouvez
sélectionner le nombre de niveaux d’annulation et de rétablissement (de 2 à 300) dans les préférences
d’Animate.
Par défaut, lorsque vous annulez une opération à l’aide de la commande Modifier > Annuler ou du panneau
Historique, la taille du fichier du document reste identique, même lorsque vous supprimez un élément du
document. Par exemple, si vous importez un fichier vidéo dans un document et annulez ensuite l’importation,
la taille du document continue d’inclure la taille du fichier vidéo. En effet, les éléments supprimés à l’aide de
la commande Annuler sont conservés dans l’éventualité de leur restauration à l’aide de la commande
Répéter.
Haut de la page
224
Utilisation du panneau Historique
Le panneau Historique (Fenêtre > Historique) affiche la liste des opérations (étapes) effectuées dans le
document actif depuis sa création ou son ouverture en tenant compte du nombre maximal d’opérations
spécifié (il n’affiche pas les opérations effectuées dans d’autres documents). Le curseur est automatiquement
placé en regard de la dernière opération effectuée.
Vous pouvez utiliser le panneau Historique pour annuler ou refaire une ou plusieurs
opérations simultanément. Vous pouvez appliquer des opérations du panneau Historique
au même objet que précédemment ou à d’autres objets. Il n’est pas possible de modifier
l’ordre des opérations dans le panneau Historique. Le panneau Historique enregistre les
opérations dans l’ordre dans lequel elles ont été effectuées.
Remarque : si Vous annulez une opération ou une série d’opérations, puis modifiez le
document, vous ne pouvez plus refaire ces opérations depuis le panneau Historique
(elles n’y figurent plus).
Par défaut, Animate prend en charge 100 niveaux d’annulation pour le panneau
Historique. Vous pouvez sélectionner le nombre de niveaux d’annulation et de
rétablissement (de 2 à 300) dans les préférences d’Animate.
Vous pouvez vider le panneau Historique pour effacer la liste des opérations effectuées
dans le document actif. Une fois l’historique effacé, il vous sera impossible d’annuler les
opérations affichées précédemment. Lorsque vous effacez l’historique, vous n’annulez
pas les opérations ; vous supprimez uniquement leur enregistrement dans la mémoire du
document actif.
En fermant le document, vous effacez son historique. Si vous prévoyez d’utiliser les opérations d’un
document après sa fermeture, copiez-les à l’aide de l’option Copier les étapes ou enregistrez les opérations
comme commande.
Haut de la page
Annulation d’opérations à partir du panneau Historique
Lorsque vous annulez une opération, elle apparaît en grisé dans le panneau.
Pour annuler l’exécution de la dernière étape, faites glisser le curseur du panneau
Historique d’un cran vers le haut dans la liste.
Faites glisser le curseur de façon à pointer sur une étape de la liste, ou cliquez à gauche
d’une étape le long de la trajectoire du curseur pour annuler plusieurs étapes à la fois. Le
curseur se dirige automatiquement vers cette étape en annulant toutes les étapes se
trouvant sur son passage.
Remarque : L’accès à une opération en faisant glisser le curseur (et la sélection par là même des opérations
postérieures) ne produit pas le même résultat que la sélection d’une simple opération. Pour accéder à une
opération en faisant glisser le curseur, vous devez cliquer à gauche de cette opération.
Haut de la page
Réexécution d’opérations à partir du panneau Historique
Lorsque vous réexécutez des opérations à partir du panneau Historique, les opérations exécutées sont celles
sélectionnées (en surbrillance) dans le panneau Historique et pas forcément l’étape désigné par le curseur.
Vous pouvez appliquer des opérations du panneau Historique aux objets sélectionnés dans le document.
Réexécution d’une étape
Dans le panneau Historique, sélectionnez une opération et cliquez sur le bouton
225
Réexécuter.
Réexécution d’une série d’étapes contiguës
1. Sélectionnez les opérations dans le panneau Historique en effectuant l’une des
opérations suivantes :
Faites glisser la souris d’une opération à une autre Ne faites pas glisser le curseur ;
faites simplement glisser la souris du libellé d’une étape au libellé d’une autre.
Sélectionnez la première étape, puis maintenez la touche Maj enfoncée tout en
cliquant sur la dernière étape ou sélectionnez la dernière étape, puis maintenez la
touche Maj enfoncée tout en cliquant sur la première.
2. Cliquez sur Réexécuter. Les étapes sont réexécutées dans l’ordre chronologique et une
nouvelle opération, intitulée Réexécuter les étapes, apparaît dans le panneau Historique.
Réexécution d’une série d’étapes non contiguës
1. Sélectionnez une opération dans le panneau Historique, puis cliquez avec le bouton droit
de la souris (Windows) ou tout en appuyant sur la touche Contrôle (Macintosh) sur
d’autres opérations. Pour désélectionner une étape sélectionnée, cliquez sur celle-ci tout
en appuyant sur Ctrl (Windows) ou Commande (Macintosh).
2. Cliquez sur Réexécuter.
Haut de la page
Copie et collage des étapes entre les documents
Chaque document ouvert possède son propre historique d’opérations. Vous pouvez copier les opérations
effectuées dans un document et les coller dans un autre document à l’aide de la commande Copier les
étapes du menu d’options du panneau Historique. Si vous copiez les opérations dans un éditeur de texte,
elles sont collées sous forme de code JavaScript™.
1. Sélectionnez les étapes désirées dans le panneau Historique du document qui contient
les étapes à réutiliser.
2. Dans le menu d’options du panneau Historique, sélectionnez Copier les étapes.
3. Ouvrez le document dans lequel vous souhaitez coller les étapes.
4. Sélectionnez un objet auquel vous souhaitez appliquer les étapes.
5. Choisissez Modifier > Coller pour coller les étapes. Les opérations sont réexécutées au
moment où elles sont collées dans le panneau Historique du document. Le panneau
Historique les affiche comme une seule opération, intitulée Coller les étapes.
Adobe recommande également :
Définition des préférences dans Animate
Automatisation des tâches à l’aide du menu Commandes
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
226
Raccourcis clavier
Copie du raccourci en cours dans le Presse-papiers
Création et modification de raccourcis clavier personnalisés
Haut de la page
Copie du raccourci en cours dans le Presse-papiers
1. Sélectionnez Édition > Raccourcis clavier (Windows) ou Animate > Raccourcis clavier
(Macintosh).
2. Cliquez sur le bouton Copier dans le Presse-papiers. Vous pouvez alors coller le
raccourci clavier sélectionné dans n’importe quel éditeur de texte à des fins de référence
ou d’impression.
Haut de la page
Création et modification de raccourcis clavier personnalisés
Vous pouvez créer et modifier des raccourcis clavier dans Animate.
Personnalisation des raccourcis clavier
1. Sélectionnez (Windows) Édition > Raccourcis clavier ou (Macintosh) Animate >
Raccourcis clavier.
La boîte de dialogue Raccourcis clavier apparaît.
2. Ajoutez, supprimez ou modifiez des raccourcis clavier à l’aide des options suivantes :
Disposition du clavier préconfigurée Cette option permet de sélectionner une
présélection de raccourcis clavier dans un menu déroulant ou toute disposition
personnalisée que vous avez préalablement définie.
Rechercher Cette option permet de rechercher les commandes dont vous souhaitez
définir ou modifier le raccourci. Vous pouvez également explorer de détail de chaque
commande dans l’arborescence des commandes.
Respecter la casse Cette option permet de rechercher une commande en respectant la
casse.
Ajouter Cette option permet d’ajouter un nouveau raccourci pour la commande en
cours. Pour ajouter un nouveau raccourci clavier à la commande sélectionnée, cliquez
sur Ajouter et saisissez la nouvelle combinaison de touches. Un seul raccourci clavier
peut être affecté une commande ; si un raccourci est déjà affecté à une commande, le
bouton Ajouter est désactivé.
Annuler Cette option permet d’annuler le dernier raccourci clavier défini pour une
227
commande.
Copier dans le Presse-papiers Cette option permet de copier la liste complète des
raccourcis clavier dans le Presse-papiers de votre système d’exploitation.
Aller au conflit Cette option permet de rechercher la commande conflictuelle. Un
message d’avertissement s’affiche en cas de conflit lors de la définition d’un raccourci.
Enregistrer les raccourcis dans une présélection Cette option permet d’enregistrer
l’ensemble complet de raccourcis dans une présélection. Il est possible de sélectionner
les présélections dans le menu déroulant Disposition du clavier
préconfigurée.
Supprimer le raccourci Cette option permet de supprimer le raccourci sélectionné.
Remarque : vous ne pouvez pas utiliser des touches isolées telles que supprimer ou
page vers le haut, des touches prédéfinies pour des tâches génériques telles que la
suppression de contenu, le défilement de page, etc.
3. Cliquez sur OK.
Suppression d’un raccourci d’une commande
1. Dans le menu contextuel Commandes, sélectionnez une catégorie de commandes, puis
une commande dans la liste.
2. Cliquez sur le symbole X en regard du raccourci.
Ajout d’un raccourci clavier à une commande
1. Dans le menu contextuel Commandes, sélectionnez une catégorie de commande et une
commande.
2. Cliquez sur le bouton Ajouter.
3. Appuyez sur une combinaison de touches.
Remarque : s’il existe un conflit avec la combinaison de touches (par exemple, si la
combinaison de touches est déjà affectée à une autre commande), un message
d’explication s’affiche juste en-dessous de la liste de commandes. Cliquez sur le bouton
Aller au conflit pour accéder rapidement à la commande conflictuelle et modifier le
raccourci.
4. Cliquez sur OK.
Modification d’un raccourci existant
1. Dans le menu contextuel Commandes, sélectionnez une catégorie de commandes, puis
une commande dans la liste.
2. Cliquez deux fois sur le raccourci.
3. Appuyez sur une nouvelle combinaison de touches.
Remarque : s’il existe un conflit avec la combinaison de touches (par exemple, si la
combinaison de touches est déjà affectée à une autre commande), un message
d’explication s’affiche juste en-dessous de la liste de commandes. Cliquez sur le bouton
Aller au conflit pour accéder rapidement à la commande conflictuelle et modifier le
raccourci.
228
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
229
Utilisation du scénario dans Animate
À propos du scénario
Modification de l’apparence du scénario
Redimensionnement du scénario
Pelure d’oignon
Déplacement de la tête de lecture
Haut de la page
À propos du scénario
Remarque : Lors de la lecture d’une animation, la vitesse réelle des images est indiquée. Elle peut être
différente de la vitesse des images du document si l’ordinateur ne peut pas calculer et afficher l’animation
assez rapidement.
Le scénario indique les endroits auxquels un document contient des effets animés (animation image par
image, animation interpolée ou trajectoires de mouvement, par exemple).
Les commandes de la section des calques du scénario vous permettent d’afficher, de masquer, de verrouiller
ou de déverrouiller les calques, de même qu’en afficher le contenu sous forme de contours. Vous pouvez
également faire glisser des images du scénario vers un nouvel emplacement du même calque ou d’un calque
différent.
Haut de la page
Modification de l’apparence du scénario
Par défaut, le scénario apparaît sous la fenêtre du document principal. Pour changer sa position, détachez le
scénario de la fenêtre du document et faites-le flotter dans sa propre fenêtre ou ancrez-le à tout autre
panneau de votre choix. Vous pouvez également masquer le scénario.
Vous pouvez redimensionner le scénario de manière à changer le nombre de calques et d’images visibles.
Utilisez les barres de défilement à la droite du scénario pour afficher d’autres calques quand celui-ci contient
plus de calques qu’il ne peut en afficher.
230
Déplacement du scénario
Faites glisser l’onglet de la barre d’outils dans la partie supérieure gauche du scénario
pour déplacer celui-ci lorsqu’il est ancré à la fenêtre du document.
Pour ancrer un scénario non ancré à la fenêtre de l’application, faites glisser l’onglet de la
barre d’outils en haut ou en bas de la fenêtre du document.
Faites glisser l’onglet de la barre d’outils du scénario jusqu’à l’emplacement de votre
choix pour ancrer un scénario non ancré à d’autres panneaux. Pour éviter un ancrage
intempestif à d’autres panneaux, appuyez sur Ctrl durant tout le déplacement. L’apparition
d’une barre bleue indique le point d’ancrage du scénario.
Faites glisser la barre de séparation des noms de calque des portions d’images dans le
scénario pour allonger ou raccourcir les champs de noms de calque du panneau
Scénario.
Changement de l’affichage des images dans le scénario
1. Cliquez sur le bouton d’affichage des images situé dans le coin supérieur droit du
scénario pour afficher le menu contextuel d’affichage des images.
Menu contextuel d’affichage des images.
2. Choisissez l’une des options suivantes :
Pour changer la largeur des cellules des images, sélectionnez Minuscules, Petites,
Normales, Moyennes ou Grandes. L’option Grandes permet de visualiser les détails
des courbes audio.
Pour réduire la hauteur des lignes de cellules, sélectionnez Courtes.
Options d’affichage des images Normales et Courtes.
Pour activer ou désactiver la teinte des séquences d’images, sélectionnez Images
teintées.
Pour afficher des vignettes du contenu de chaque image mises à l’échelle en fonction
des images du scénario, sélectionnez Aperçu. Ceci peut amener la taille du contenu
apparent à varier et ainsi nécessiter davantage d’espace à l’écran.
Pour afficher une vignette de chaque image au complet (y compris l’espace vide),
sélectionnez Afficher un aperçu dans le contexte. Cette option permet de visualiser la
manière dont les éléments se déplacent au sein de leurs images au cours de l’effet
animé. Toutefois, les aperçus sont généralement plus petits qu’avec l’option Afficher
un aperçu.
231
Pour adapter le nombre d’images dans le scénario, sélectionnez Ajuster moins
d’images dans la vue ou Ajuster plus d’images dans la vue dans le scénario en
regard du curseur Redimensionner la vue Scénario.
Pour réinitialiser le niveau par défaut du zoom du scénario, sélectionnez Réinitialiser
le zoom du scénario au niveau par défaut en regard de la barre de curseur de
l’image.
Changement de la hauteur du calque dans le scénario
1. Effectuez l’une des opérations suivantes :
Double-cliquez sur l’icône du calque (l’icône située à gauche du nom du calque)
dans le scénario.
Cliquez avec le bouton droit (Windows) ou avec la touche Contrôle enfoncée
(Macintosh) sur le nom du calque et choisissez Propriétés dans le menu contextuel.
Sélectionnez le calque dans le scénario et choisissez Modification > Scénario >
Propriétés du calque.
2. Dans la boîte de dialogue Propriétés du calque, sélectionnez une option pour Hauteur du
calque, puis cliquez sur OK.
Définition de la transparence du calque
Effectuez l’une des opérations suivantes :
Cliquez en appuyant sur la touche Maj sur la colonne œil du scénario afin de définir la
visibilité sur transparent.
Double-cliquez sur l’icône du calque (l’icône située à gauche du nom du calque) dans le
scénario.
Cliquez avec le bouton droit (Windows) ou avec la touche Contrôle enfoncée (Macintosh)
sur le nom du calque et choisissez Propriétés dans le menu contextuel.Dans la boîte de
dialogue Propriétés du calque, sélectionnez Visibilité >Transparent.
Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Contrôle
enfoncée (Macintosh) sur le nom du calque, puis sélectionnez Afficher d’autres
transparents.
Haut de la page
Redimensionnement du scénario
Si le scénario est ancré à la fenêtre principale de l’application, faites glisser la barre
séparant le scénario de la scène.
Si le scénario n’est pas ancré à la fenêtre principale de l’application, faites glisser le coin
inférieur droit (Windows) ou la case de redimensionnement située dans le coin inférieur
droit (Macintosh).
Haut de la page
Pelure d’oignon
Effectuez l’une des opérations suivantes :
Sélectionnez l’icône de pelure d’oignon (l’icône à gauche de l’icône de boucle) dans le
scénario. Toutes les images comprises entre les repères Début Pelure d’oignon et Fin
Pelure d’oignon (dans l’en-tête du scénario) sont superposées sous forme d’une image
dans la fenêtre Document.
232
Sélectionnez
pour afficher les images de pelures d’oignon comme des contours.
Haut de la page
Déplacement de la tête de lecture
La tête de lecture rouge située dans la partie supérieure du scénario se déplace lors de la lecture du
document pour indiquer l'image actuellement affichée sur la scène. L’en-tête du scénario affiche le numéro
des images de l’animation. Pour afficher une image sur la scène, vous devez déplacer la tête de lecture vers
cette image dans le scénario.
Lorsque vous travaillez avec de nombreuses images qui ne peuvent pas être toutes affichées en même
temps dans le scénario, vous pouvez déplacer la tête de lecture le long du scénario de manière à afficher
aisément une image spécifique.
Cliquez sur l’emplacement de l’image dans l’en-tête du scénario ou faites glisser la tête
de lecture vers la position souhaitée.
Pour centrer le scénario sur l’image actuelle, cliquez sur le bouton Image courante au bas
du panneau Scénario.
Lorsque l’option « Boucle » est activée dans le scénario, vous pouvez désormais lire en
boucle du son en continu sur une plage d’images avec d’autres animations.
Déplacement de la tête de lecture
Adobe recommande également :
Utilisation de scénarios
Interpolations de mouvement
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
233
Création d’extensions HTML
Création d’une extension HTML
Débogage de votre extension dans Animate CC
Exportation de l’extension
Installation de votre extension dans le Animate CC
Ajout d’interactivité aux extensions HTML
Animate CC peut être étendu au moyen d’extensions HTML. Adobe Extension Builder 3 permet de créer des
extensions HTML pour Animate CC. Auparavant, vous pouviez uniquement étendre Animate à l’aide des
extensions SWF. Toutefois, Adobe Extension Builder 3 permet de créer des extensions HTML pour les
applications Creative Cloud. Pour commencer, téléchargez et installez Eclipse et Extension Builder 3.0. Pour
en savoir plus, cliquez ici.
Haut de la page
Création d’une extension HTML
Pour créer une extension HTML, procédez comme suit :
1. Démarrez Eclipse.
2. Dans l’Assistant New Project (Nouveau projet), créez un projet d’extension d’application.
Donnez un nom significatif au projet, puis cliquez sur Suivant.
3. Dans le panneau Nouveau projet d’extension d’application Adobe, sélectionnez
Adobe Animate. Cliquez sur Suivant.
4. Configurez l’extension à l’aide des options disponibles :
a. Bundle ID (ID d’offre groupée) identifie l’extension de manière unique.
b. Le nom de menu est le nom affiché pour votre extension. Le nom de menu
s’affiche dans le menu Fenêtre > Extensions dans Animate CC.
c. Les détails de la fenêtre (Window Details) utilisent ces options pour personnaliser
le type et la taille de la fenêtre d’extension.
Cliquez sur Next (Suivant).
5. Vous pouvez personnaliser davantage les bibliothèques de référence pour votre
extension dans les écrans suivants :
a. La bibliothèque CEP Interface Library fournit les fonctions pour interagir avec
l’application hôte. Cette option est sélectionnée par défaut.
b. Les structures (Frameworks) servent aux bibliothèques JavaScript courantes telles
que jQuery.
c. Les Services incluent le kit Adobe IPC Communication Toolkit, qui permet la
communication entre les applications Adobe, les extensions et les applications
externes. Ils fournissent un protocole de messagerie au moyen du gestionnaire de
services CEP, qui agit comme un concentrateur pour les communications
Creative Cloud.
Cliquez sur Finish (Terminer) pour créer un projet Eclipse.
Haut de la page
234
Débogage de votre extension dans Animate CC
Vous pouvez exécuter l’extension directement dans Eclipse :
1. Cliquez sur le projet avec le bouton droit de la souris, puis sélectionnez Exécuter en
tant que > Extension Adobe Flash. Cette option lance Animate CC.
2. Dans Animate CC, sélectionnez l’option de menu Fenêtre > Extensions . Le panneau
des extensions s’ouvre.
Haut de la page
Exportation de l’extension
Pour distribuer l’extension, vous devez l’exporter en tant que package ZXP. Le package ZXP est ensuite
téléchargé et exécuté par Adobe Extension Manager dans les applications Creative Cloud :
1. Dans Eclipse, passez en mode Script Explorer (Explorateur de scripts), puis cliquez avec
le bouton droit sur le projet et sélectionnez Export > Adobe Extension Builder 3 >
Application Extension (Exporter > Adobe Extension Builder 3 > Extension
d’application). L’Assistant d’exportation s’ouvre.
2. Vous devez détenir un certificat pour signer le package d’extension. Sélectionnez un
certificat existant ou cliquez sur Create (Créer) pour en créer un.
3. Cliquez sur Finish (Terminer).
4. Le package ZXP exporté pour votre extension est placé dans le dossier du projet, prêt à
être distribué.
Remarque : Pour l’installation, vous devez accéder au fichier <extension>\.stagedextension\CSXS\manifest.xml et mettre à jour la balise host pour définir la version minimale
d’Animate sur 13.0.
Haut de la page
Installation de votre extension dans le Animate CC
Vous pouvez installer les extensions HTML dans Animate CC à l’aide d’Adobe Extension Manager. Les
extensions HTML permettent d’étendre les fonctionnalités et capacités d’Animate. Pour installer des
extensions, cliquez ici.
Haut de la page
Ajout d’interactivité aux extensions HTML
Vous pouvez créer une extension HTML pour interagir avec Animate en ajoutant des contrôles, en définissant
un comportement et en obtenant des informations au sujet de l’environnement hôte (y compris Animate et le
système d’exploitation). Ceci peut être accompli de deux façons :
1. Utilisation de la bibliothèque d’interface CEP : cette bibliothèque fournit des API pour
l’obtention d’informations sur l’environnement hôte et un script d’évaluation qui permet
d’exécuter des scripts JSFL. Pour en savoir plus sur la bibliothèque d’interfaces CEP,
sélectionnez Help > Help Contents > Adobe Extension Builder > References dans
Eclipse.
2. Utilisation de scripts JSFL : les scripts JSFL peuvent être exécutés à partir de l’API du
script d’évaluation de la bibliothèque d’interface CEP. Pour en savoir plus sur les
scripts JSFL, cliquez ici.
Outre les scripts JSFL, l’infrastructure CEP dans Animate expose les événements
suivants, qui peuvent être utilisés dans les panneaux HTML uniquement.
com.adobe.events.flash.documentChanged est déclenché suite à une modification
du document actif.
235
com.adobe.events.flash.timelineChanged est déclenché lorsque vous modifiez le
scénario du document actif.
com.adobe.events.flash.documentSaved est déclenché lorsque vous enregistrez le
document actif.
com.adobe.events.flash.documentOpened est déclenché lorsque vous ouvrez un
nouveau document.
com.adobe.events.flash.documentClosed est déclenché lorsque vous fermez le
document actif.
com.adobe.events.flash.documentNew est déclenché lorsque vous créez un
document.
com.adobe.events.flash.layerChanged est déclenché lorsque vous sélectionnez un
autre calque.
com.adobe.events.flash.frameChanged est déclenché lorsque vous sélectionnez
une autre image.
com.adobe.events.flash.selectionChanged est déclenché lorsque vous
sélectionnez un autre objet sur la scène.
com.adobe.events.flash.mouseMove est déclenché lorsque vous déplacez votre
souris au-dessus de la scène.
Exemple
csinterface.addEventListener("com.adobe.events.flash.selectionChanged", CallbackFunction)
Dans le fragment de code ci-dessus :
csinterface : objet de la bibliothèque d’interface CEP.
com.adobe.events.flash.selectionChanged : événement qui déclenche la modification
de la sélection d’un objet. Vous pouvez également utiliser n’importe lequel des
événements mentionnés ci-dessus.
CallbackFunction : méthode qui écoute l’événement déclenché.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
236
Animation et interactivité
237
Utilisation de l’animation de l’outil de segment dans Animate CC
À propos de la cinématique inverse
Ajout de segments à des symboles
Ajout de segments à des formes
Contrôles de la scène
Modification des objets et des squelettes IK
Contrainte du mouvement des segments IK
Ajout d’élasticité à des segments
Animation d’un squelette
Masquage des contrôles d’édition pendant l’animation
Animation d’un squelette dans le scénario
Modification de l'emplacement des poses dans le squelette
Application d’effets interpolés supplémentaires aux propriétés d’objet IK
Préparation d’un squelette à l’exécution d’une animation avec ActionScript 3.0
Ajout d’une accélération dans une animation IK
Haut de la page
À propos de la cinématique inverse
La cinématique inverse (IK) est un moyen d’animer des objets à l’aide de segments reliés au sein de
squelettes linéaires ou arborescents dans une relation parent-enfant. Lorsqu’un segment bouge, les segments
liés bougent en conséquence.
La cinématique inverse permet de créer facilement un mouvement naturel. Pour effectuer une animation à
l’aide de la cinématique inverse, il suffit de spécifier les positions de début et de fin des segments sur le
scénario. Animate interpole automatiquement les positions des segments dans le squelette entre les images
de début et de fin.
Vous pouvez utiliser la cinématique inverse de l’une des façons suivantes :
Utilisation d’une forme comme conteneur de plusieurs segments. Par exemple, vous
pouvez ajouter des segments au dessin d’un serpent de façon à ce qu’il glisse de façon
réaliste. Vous pouvez dessiner ces formes en mode Dessin d’objet.
Liaison d’occurrences de symbole. Par exemple, vous pouvez lier des clips présentant un
torse, un bras, un avant-bras et une main afin que tous ces éléments bougent de façon
réaliste les uns par rapport aux autres. Chaque occurrence ne possède qu’un seul
segment.
Animation de l’outil Segment en action
Styles de segment
Animate propose 4 styles de segments sur la scène :
Uni. Il s’agit du style par défaut.
Filaire. Ce style est utile lorsque le style Uni assombrit trop l'illustration située sous le
segment.
238
Ligne. Ce style est utile pour les petits squelettes.
Aucun. Le segment est masqué pour afficher uniquement l’illustration sous-jacente.
Pour définir le style d’un segment, sélectionnez la plage IK dans le scénario, puis choisissez le style de votre
choix dans le menu Style de la section Options du panneau Propriétés.
Remarque : Si vous enregistrez un document en définissant le style du segment sur Aucun, Animate définira
automatiquement le style sur Ligne la prochaine fois que vous ouvrirez le document.
Calques de pose
Lorsque vous ajoutez des segments à des occurrences de symbole ou à des formes, Animate leur crée un
calque dans le scénario. Ce nouveau calque est appelé calque de pose. Animate ajoute le calque de pose
dans le scénario entre les calques existants afin de conserver l’ordre d’empilement précédent des objets sur
la scène.
Haut de la page
Ajout de segments à des symboles
Vous pouvez ajouter des segments IK à des occurrences de clips, de graphiques et de boutons. Pour utiliser
du texte, convertissez-le d’abord en symbole. Les occurrences de symbole peuvent être placées sur des
calques différents avant l’ajout des segments. Animate les ajoute au calque de pose.
Remarque : Vous pouvez également diviser le texte (Modification > Séparer) en formes distinctes et utiliser
des segments avec les formes individuelles.
Lorsque vous liez des objets, tenez compte des relations parent-enfant que vous souhaitez créer, par
exemple épaule-coude-poignet.
1. Créez des occurrences de symbole sur la scène. Pour gagner du temps, disposez les
occurrences en essayant de respecter le plus possible la configuration spatiale définitive.
2. Sélectionnez l’outil Segment dans le panneau Outils.
Outil Segment de la barre d’outils
3. Cliquez sur l’occurrence de symbole que vous souhaitez définir comme segment racine
du squelette. Cliquez à l’emplacement où vous souhaitez lier le segment au symbole.
Par défaut, Animate crée le segment à l’emplacement du clic de souris. Pour ajouter un
segment de façon plus précise, désactivez l’option Définir automatiquement le point de
transformation pour l’outil Segment IK (Modifier > Préférences > Dessin). Lorsque
l'option Définir automatiquement le point de transformation est désactivée, le segment
s'accroche au point de transformation du symbole lorsque vous cliquez sur le symbole
suivant.
4. Faites glisser le pointeur jusqu’à une autre occurrence de symbole et relâchez le bouton
de la souris à l’emplacement où vous souhaitez effectuer la liaison.
5. Pour ajouter un autre segment au squelette, faites glisser le pointeur de la souris de la
queue du premier segment vers l’occurrence de symbole suivante.
Vous pourrez placer plus facilement la queue si vous désactivez l’option Accrocher aux
objets (Affichage > Accrochage > Accrocher aux objets).
239
6. Pour créer un squelette arborescent, cliquez sur la tête d’un segment existant, à
l’emplacement où vous souhaitez que la branche commence. Faites ensuite glisser la
souris pour créer le premier segment de la nouvelle branche.
Un squelette peut posséder autant de branches que nécessaire.
Remarque : Une branche ne peut pas être reliée à une autre branche, sauf s’il s’agit de
la racine.
7. Pour repositionner les éléments du squelette terminé, faites glisser les segments ou les
occurrences elles-mêmes.
Le glissement d’un segment déplace son occurrence associée sans lui permettre de
pivoter autour de son segment.
Le glissement d’une occurrence lui permet de se déplacer mais aussi de pivoter
autour de son segment.
Le glissement d’une occurrence au milieu d’une branche articule les segments parent
par rotation de la liaison. Les segments enfant ne se déplacent pas par rotation de la
liaison.
Après avoir créé un squelette, vous pouvez ajouter au squelette de nouvelles
occurrences à partir d’autres calques. Faites glisser un nouveau segment vers la
nouvelle occurrence et Animate la transfère vers le calque de pose du squelette.
Haut de la page
Ajout de segments à des formes
Vous pouvez ajouter des segments à une seule forme ou à un groupe de formes qui se trouvent sur le même
calque. Dans les deux cas, vous devez sélectionner toutes les formes avant d’ajouter le premier segment.
Après l’ajout de segments, Animate convertit toutes les formes et tous les segments en un objet de forme IK
et déplace cet objet vers un nouveau calque de pose.
Après avoir ajouté des segments à une forme, cette dernière présente les restrictions suivantes :
Vous ne pouvez pas fusionner une forme IK avec d’autres formes qui se trouvent en
dehors.
Vous ne pouvez pas faire pivoter, mettre à l'échelle ou incliner la forme à l'aide de l'outil
Transformation libre.
Il n'est pas recommandé de modifier les points de contrôle de la forme.
1. Créez une ou des formes remplies sur la scène.
La forme peut contenir plusieurs couleurs et plusieurs traits. Modifiez les formes de
manière à les rapprocher le plus possible de leur aspect définitif. Lorsque des segments
ont été ajoutés à une forme, les options de modification sont plus limitées.
Si la forme est trop complexe, Animate vous invite à la convertir en clip avant d’ajouter
des segments.
2. Sélectionnez l’ensemble de la forme sur la scène.
Si la forme contient plusieurs zones de couleur ou plusieurs traits, faites glisser un
rectangle de sélection autour de la forme pour vous assurer que l’ensemble de la forme
est sélectionnée.
3. Cliquez sur l’outil Segment dans le panneau Outils.
4. Avec l’outil Segment, cliquez à l’intérieur de la forme et faites glisser la souris vers un
autre emplacement de la forme.
5. Pour ajouter un autre segment, faites glisser la souris de la queue du premier segment
vers un autre emplacement au sein de la forme.
Le second segment devient un enfant du segment racine. Reliez les zones de la forme
aux segments dans l’ordre des relations parent-enfant que vous souhaitez créer. Par
exemple, effectuez une liaison épaule-coude-poignet.
240
6. Pour créer un squelette arborescent, cliquez sur la tête d’un segment existant, à
l’emplacement où vous souhaitez que la branche commence. Faites ensuite glisser la
souris pour créer le premier segment de la nouvelle branche.
Un squelette peut posséder autant de branches que nécessaire.
Remarque : Une branche ne peut pas être reliée à une autre branche, sauf s’il s’agit de
la racine.
7. Pour déplacer le squelette, sélectionnez l’objet forme IK avec l’outil Sélection et faites
glisser l’un des segments pour le déplacer.
Lorsque la forme devient une forme IK, elle présente les restrictions suivantes :
Vous ne pouvez plus la transformer (c'est-à-dire la mettre à l'échelle ou l'incliner).
Vous ne pouvez pas lui ajouter de nouveaux traits. Toutefois, vous pouvez encore ajouter
ou supprimer des points de contrôle des traits existants dans la forme.
Vous ne pouvez pas modifier la forme en place (en cliquant deux fois sur la scène).
La forme possède son propre point d’alignement, son propre point de transformation et
son propre cadre de sélection.
Haut de la page
Contrôles de la scène
Les contrôles de la scène permettent d’effectuer facilement des ajustements de rotation et de translation sur
la scène à l’aide de repères qui indiquent la plage de rotation et permettent un contrôle précis. Ils permettent
également de continuer à travailler sur la scène sans avoir à retourner dans l’inspecteur des propriétés pour
ajuster la rotation.
Guide d’utilisation des contrôles de la scène
Les contrôles de la scène de l’outil Segment décrits dans l’image fonctionnent de la manière suivante :
1. Pour commencer à utiliser les contrôles de la scène, sélectionnez le segment et utilisez
l’extrémité de celui-ci.
2. Pour afficher les contrôles de la scène, placez le curseur sur l’extrémité du segment.
L’extrémité se transforme en flèches à quatre pointes ou en signe plus (axes X et Y)
dans un cercle. Les flèches représentent les attributs de translation et le cercle
représente les attributs de rotation.
3. Cliquez sur l’extrémité du segment et sélectionnez le cercle pour modifier la rotation.
Cliquez sur le signe plus pour modifier les attributs de translation.
4. Pour afficher les poignées interactives de rotation et de translation à tout moment, placez
le curseur sur l’extrémité du segment.
5. Lorsque vous cliquez sur l’option de rotation ou de translation, les contrôles sur la scène
permettant de définir les contraintes s’affichent.
241
Utilisation des contrôles de rotation
Guide des contrôles de rotation
Pour utiliser les contrôles de rotation, procédez comme suit :
1. Cliquez sur l’extrémité du segment pour afficher les outils de rotation et de translation.
2. Placez le pointeur de la souris et cliquez sur le cercle représentant l’outil de rotation. Le
cercle devient rouge.
3. Cliquez sur l’icône de verrou pour activer la rotation libre. L’icône de verrou se
transforme en point.
4. Si vous déplacez le curseur du centre, une extrémité du rayon de rotation devient visible.
Cliquez sur le point où doit commencer la rotation.
5. Déplacez à nouveau le curseur vers le cercle pour sélectionner l’autre extrémité du rayon
de rotation. Cliquez à l’endroit où doit se trouver ce point.
6. Confirmez la définition du rayon en cliquant sur le cercle.
Remarque : Lorsque vous modifiez la rotation que vous avez déjà définie, vous pouvez augmenter ou
diminuer les bordures en cliquant sur la ligne et en la faisant glisser.
Utilisation des contrôles de translation
Guide des contrôles de translation
Vous pouvez utiliser les contrôles de translation de la manière suivante :
1. Placez le pointeur de la souris sur le signe plus avec des flèches à quatre pointes et
cliquez dessus pour sélectionner les contrôles de translation.
2. Cliquez sur le verrou pour activer les contrôles de translation. L’icône de verrou se
transforme en point.
3. Cliquez sur la pointe d’une flèche et faites-la glisser jusqu’au point où vous souhaitez
étendre la mobilité.
Haut de la page
Modification des objets et des squelettes IK
Vous ne pouvez pas modifier des squelettes IK si le calque de pose inclut des poses après la première
image dans le scénario. Avant toute modification, supprimez toutes les poses supplémentaires qui suivent la
première image du squelette dans le scénario.
Si vous vous contentez de repositionner un squelette afin de l’animer, vous pouvez en modifier les positions
dans chaque image du calque de pose. Animate convertit l’image en une image de pose.
Sélection des segments et des objets associés
242
Pour sélectionner un segment individuel, cliquez sur son entrée avec l’outil Sélection.
Cliquez en maintenant la touche Maj enfoncée afin de sélectionner plusieurs segments.
Pour déplacer la sélection vers les segments adjacents, cliquez sur les boutons Parent,
Enfant ou Suivant/Précédent de l’inspecteur des propriétés.
Pour sélectionner tous les segments d’un squelette, cliquez deux fois sur l’un d’eux.
Pour sélectionner l’ensemble d’un squelette et afficher les propriétés du squelette et son
calque de pose, cliquez sur une image dans le calque de pose contenant le squelette.
Pour sélectionner une forme IK, cliquez sur son entrée.
Pour sélectionner une occurrence de symbole connectée à un segment, cliquez sur son
entrée.
Repositionnement des segments et des objets associés
Pour repositionner un squelette linéaire, faites glisser l’un de ses segments. Si le
squelette contient des occurrences de symbole liées, vous pouvez également faire glisser
une occurrence. Vous pouvez ainsi faire pivoter l’occurrence par rapport à son segment.
Pour repositionner une branche d’un squelette, faites glisser l’un des segments de la
branche.
Tous les segments de la branche se déplacent. Les segments des autres branches du
squelette ne bougent pas.
Pour faire pivoter un segment avec ses segments enfant sans déplacer le segment
parent, faites glisser le segment en maintenant la touche Maj enfoncée.
Pour déplacer une forme IK vers un nouvel emplacement de la scène, sélectionnez-la,
puis modifiez ses propriétés X et Y dans l’inspecteur des propriétés. Vous pouvez en
outre faire glisser la forme tout en appuyant sur la touche Alt (Windows) ou Option
(Macintosh).
Suppression de segments
Effectuez l’une des opérations suivantes :
Pour supprimer un segment individuel et tous ses segments enfant, cliquez sur le
segment et appuyez sur la touche Suppr.
Vous pouvez sélectionner plusieurs segments à supprimer en cliquant sur chacun d’eux
en maintenant la touche Maj enfoncée.
Pour supprimer tous les segments d'une forme IK ou d'un squelette de symboles du
scénario, cliquez avec le bouton droit de la souris sur la plage de squelette IK dans le
scénario et choisissez Supprimer le squelette dans le menu contextuel.
Pour supprimer tous les segments d'une forme IK ou d'un squelette de symboles sur la
scène, cliquez deux fois sur un segment du squelette pour sélectionner tous les
segments. Appuyez ensuite sur Suppr. Les formes IK redeviennent des formes normales.
Déplacement de segments par rapport à la forme ou au symbole associé
Pour déplacer l’emplacement de l’une des extrémités d’un segment dans une forme IK,
faites glisser l’extrémité du segment avec l’outil Sous-sélection.
Remarque : L’outil Sous-sélection n’est pas disponible s’il existe plusieurs poses dans la plage IK. Avant
toute modification, supprimez toutes les poses supplémentaires qui suivent la première image du squelette
dans le scénario.
Pour déplacer l’emplacement d’une liaison, de la tête ou de la queue d’un segment au
243
sein d’une occurrence de symbole, déplacez le point de transformation de l’occurrence.
Utilisation de l’outil Transformation libre. Le segment se déplace avec le point de
transformation.
Pour déplacer une occurrence de symbole individuelle sans déplacer les autres
occurrences reliées, faites-la glisser en maintenant la touche Alt (Windows) ou la touche
Commande (Macintosh) enfoncée, ou utilisez l’outil Transformation libre. Les segments
connectés à l’occurrence s’étendent ou diminuent pour s’adapter au nouvel emplacement
de l’occurrence.
Modification d’une forme IK
Vous pouvez ajouter, supprimer ou modifier les points de contrôle des contours d’une forme IK à l’aide de
l’outil Sous-sélection.
Pour modifier la position d’un segment sans modifier la forme IK, faites glisser le point de
fin du segment.
Pour afficher les points de contrôle de la limite d’une forme IK, cliquez sur le trait de la
forme.
Pour déplacer un point de contrôle, faites-le glisser.
Pour ajouter un nouveau point de contrôle, cliquez sur une partie du trait ne comportant
pas de point de contrôle.
Pour supprimer un point de contrôle existant, cliquez sur celui-ci pour le sélectionner,
puis appuyez sur la touche Suppr.
Remarque : Il est impossible de transformer (mettre à l’échelle ou incliner) une forme IK.
Liaison de segments et de points de forme
Par défaut, les points de contrôle d’une forme sont connectés au segment le plus proche d’eux. Vous pouvez
faire appel à l’outil Liaison pour modifier les liaisons entre des segments individuels et les points de contrôle
de la forme. Vous êtes ainsi en mesure de gérer la déformation du trait lorsque chaque segment bouge afin
d’obtenir de meilleurs résultats. Cette technique est utile si le trait d’une forme ne se déforme pas comme
vous le souhaitez lorsque le squelette se déplace.
Vous pouvez lier plusieurs points de contrôle à un segment et plusieurs segments à un point de contrôle.
Pour mettre en évidence les points de contrôle connectés à un segment, cliquez sur le
segment avec l’outil Liaison.
Les points connectés apparaissent alors en jaune alors que le segment sélectionné
apparaît en rouge. Les points de contrôle connectés à un seul segment s’affichent sous
forme de carrés. Les points de contrôle connectés à plusieurs segments prennent la
forme de triangles.
Pour ajouter des points de contrôle au segment sélectionné, cliquez sur un point de
contrôle qui n’est pas en surbrillance tout en appuyant sur la touche Maj.
Vous pouvez également sélectionner plusieurs points de contrôle à ajouter au segment
sélectionné en faisant glisser la souris tout en maintenant la touche Maj enfoncée.
Pour supprimer des points de contrôle du segment, cliquez sur un point de contrôle
surligné en jaune en maintenant la touche Ctrl (Windows) ou la touche Option
(Macintosh) enfoncée.
Vous pouvez également supprimer plusieurs points de contrôle du segment sélectionné
en faisant glisser la souris en maintenant la touche Ctrl (Windows) ou la touche Option
(Macintosh) enfoncée.
Pour mettre en surbrillance les segments connectés à un point de contrôle, cliquez sur le
point de contrôle avec l’outil Liaison.
Les segments connectés apparaissent alors en jaune, alors que le point de contrôle
244
sélectionné s’affiche en rouge.
Pour ajouter d’autres segments au point de contrôle sélectionné, cliquez sur un segment
en maintenant la touche Maj enfoncée.
Pour supprimer un segment du point de contrôle sélectionné, cliquez sur un segment
surligné en jaune en maintenant la touche Ctrl (Windows) ou la touche Option
(Macintosh) enfoncée.
Haut de la page
Contrainte du mouvement des segments IK
Pour créer un mouvement de squelettes IK plus réaliste, vous pouvez contrôler la liberté de mouvement de
certains segments. Par exemple, vous pouvez contraindre deux segments d’un bras de façon à ce que le
coude ne se plie pas dans le mauvais sens.
Par défaut, une longueur fixe est affectée à chaque segment IK lors de sa création. Les segments peuvent
pivoter autour de leur liaison parente et le long des axes x et y. Néanmoins, ils ne peuvent pas effectuer de
mouvements qui impliquent la modification de la longueur de leur segment parent, à moins que vous
n’activiez le mouvement autour de l’axe x ou de l’axe y. Par défaut, la rotation des segments est activée et le
mouvement autour des axes x et y est désactivé.
Vous pouvez également limiter la vitesse de mouvement d’un segment afin de créer un effet de lourdeur.
Dans les squelettes contenant des chaînes de segments liés, il est impossible de contraindre le mouvement
de la dernière liaison dans les branches du squelette. Pour donner l’apparence de contrainte de la dernière
liaison, utilisez des segments avec des clips et reliez le dernier segment à un clip dont la propriété alpha est
définie sur zéro. Contraignez alors l’avant-dernier segment plutôt que le dernier.
Exemples :
Pour un bras, vous pouvez contraindre les degrés de rotation du coude afin que ce
dernier ne puisse pas pivoter au-delà de l'amplitude de mouvement normale d'un avantbras.
Pour qu'un caractère puisse se déplacer sur la scène, activez la translation X ou Y sur le
segment racine. Désactivez la rotation lors de l'utilisation de la translation X et Y pour un
mouvement plus précis.
Vous définissez ces propriétés dans l’inspecteur des propriétés lorsqu’un ou plusieurs segments sont
sélectionnés.
Pour permettre à un segment sélectionné de se déplacer le long de l’axe x ou y et de
modifier la longueur de son segment parent, sélectionnez Activer dans la section Liaison :
Translation X ou Liaison : Translation Y de l’inspecteur des propriétés.
Une flèche à deux pointes s’affiche perpendiculairement au segment sur la liaison pour
indiquer que le mouvement le long de l’axe x est activé. Une flèche à deux pointes
s’affiche parallèlement au segment sur la liaison pour indiquer que le mouvement le long
de l’axe y est activé. Activer la translation x et la translation y d’un segment simplifie le
positionnement du segment lorsque la rotation de ce dernier est désactivée.
Pour limiter la liberté de mouvement autorisée le long de l’axe x ou y, sélectionnez
Contraindre dans la section Liaison : Translation X ou Liaison : Translation Y de
l’inspecteur des propriétés, puis entrez une valeur pour les distances de déplacement
minimale et maximale du segment.
Pour désactiver la rotation du segment sélectionné autour de la liaison, désactivez la case
à cocher Activer dans la section Liaison : Rotation de l’inspecteur des propriétés.
Cette option est activée par défaut.
Pour limiter la rotation d’un segment, entrez les degrés de rotation minimale et maximale
dans la section Liaison : Rotation de l’inspecteur des propriétés.
Les degrés de rotation sont relatifs au segment parent. Un arc s’affiche au sommet de la
liaison du segment pour montrer le degré de liberté de la rotation.
Pour qu’un segment sélectionné demeure immobile par rapport à son segment parent,
désactivez la rotation et la translation x et y.
Le segment devient rigide et suit le mouvement de son parent.
245
Pour limiter la vitesse de mouvement d’un segment sélectionné, entrez une valeur dans le
champ Vitesse de liaison de l’inspecteur des propriétés.
La vitesse de liaison donne au segment un effet de lourdeur. La valeur maximale de
100 % équivaut à une vitesse illimitée.
Haut de la page
Ajout d’élasticité à des segments
Il est possible d’utiliser deux propriétés pour ajouter de l’élasticité aux segments de cinématique inverse. Les
propriétés Intensité et Amortissement des segments donnent un mouvement physique réel aux segments IK
en intégrant de la physique dynamique au système de segments IK. Ces propriétés facilitent la création
d’animations dotées de propriétés physiques améliorées. Les propriétés Intensité et Amortissement donnent
à l’animation du segment un mouvement réaliste hautement configurable. Il est conseillé de définir ces
propriétés avant d’ajouter des poses à un calque de pose.
Intensité : rigidité du ressort. Plus les valeurs sont élevées, plus le ressort est rigide.
Amortissement : valeur de déclin de l’effet de ressort. Plus les valeurs sont élevées, plus l’effet de ressort
diminue rapidement. Une valeur de 0 permet de maintenir toute l’intensité de l’effet de ressort dans les
images du calque de pose.
Pour activer l’effet de ressort, sélectionnez un ou plusieurs segments, puis définissez les valeurs des
paramètres Intensité et Amortissement dans la section Ressort de l’inspecteur des propriétés. Plus la valeur
d’intensité est élevée, plus le ressort devient rigide. L’amortissement détermine la valeur de déclin de l’effet
de ressort ; ainsi, plus la valeur est élevée, plus vite se termine l’animation.
Pour désactiver les propriétés Intensité et Amortissement, sélectionnez le calque de pose dans le scénario,
puis désélectionnez la case à cocher Activer dans la section Ressort de l’inspecteur des propriétés. Vous
pouvez ainsi voir sur la scène les poses que vous avez définies dans le calque de pose sans les effets des
propriétés du ressort.
Les facteurs suivants ont une incidence sur l’aspect final de l’animation de vos segments lorsque vous utilisez
les propriétés du ressort. Paramétrez chacune de ces propriétés afin d’obtenir l’aspect souhaité.
La valeur de la propriété Intensité.
La valeur de la propriété Amortissement.
Le nombre d’images entre les poses dans le calque de pose.
Le nombre total d’images dans le calque de pose.
Le nombre d’images entre la pose finale et la dernière image de la pose précédente.
Haut de la page
Animation d’un squelette
L’animation des squelettes IK diffère de celle des autres objets dans Animate. Avec les squelettes, vous
ajoutez simplement des images dans le calque de pose et vous repositionnez le squelette sur la scène pour
créer une image-clé. Dans les calques de pose, les images-clés sont appelées poses. Les squelettes IK
étant généralement utilisés pour des animations, chaque calque de pose joue automatiquement le rôle de
calque d’interpolation.
Toutefois, les calques de pose IK diffèrent des calques d’interpolation car vous ne pouvez pas interpoler
d’autres propriétés que la position du segment dans le calque de pose. Pour un interpoler les autres
propriétés d’un objet IK, telles que l’emplacement, la transformation, les effets de couleurs ou les filtres,
renfermez le squelette et ses objets associés dans un clip ou dans un symbole graphique. Vous pouvez alors
animer les propriétés du symbole à l’aide de la commande Insertion > Interpolation de mouvement et du
panneau Éditeur de mouvement.
Vous pouvez également animer les squelettes IK avec ActionScript 3.0 au moment de l’exécution. Si vous
envisagez d’animer un squelette avec ActionScript, vous ne pouvez pas l’animer dans le scénario. Le
squelette ne peut avoir qu’une pose dans le calque de pose et celle-ci doit être située dans la première
image dans laquelle le squelette apparaît dans le calque de pose.
246
Haut de la page
Masquage des contrôles d’édition pendant l’animation
Si vous conservez tous les contrôles de la scène toujours activés, il est possible que le positionnement et les
propriétés du squelette soient modifiés par inadvertance. Après la création des segments et du squelette pour
l'animation, vous pouvez désactiver les contrôles et conseils d'édition de squelette en cochant la case de
masquage des contrôles et conseils d'édition de squelette dans l'inspecteur des propriétés.
Haut de la page
Animation d’un squelette dans le scénario
Les squelettes IK sont présents sur les calques de pose dans le scénario. Pour animer des squelettes dans le
scénario, insérez des poses en cliquant avec le bouton droit de la souris sur une image dans un calque de
pose et en sélectionnant Insérer une pose. Utilisez l’outil Sélection pour modifier la configuration du squelette.
Animate interpole automatiquement les positions des segments dans les images intermédiaires.
1. Le cas échéant, ajoutez dans le scénario des images au calque de pose du squelette
pour faire de la place à l’animation que vous souhaitez créer.
Pour ajouter des images, cliquez avec le bouton droit de la souris (Windows) ou avec la
touche Option (Macintosh) sur une image du calque de pose, à droite de l’une des
images existantes, puis choisissez Insérer une image. Vous pourrez à tout moment
ajouter ou supprimer des images.
2. Pour ajouter une pose dans une image du calque de pose, effectuez l’une des
opérations suivantes :
Placez la tête de lecture sur l’image dans laquelle vous souhaitez ajouter la pose,
puis repositionnez le squelette sur la scène.
Cliquez avec le bouton droit de la souris (Windows) ou avec la touche Option
(Macintosh) sur une image du calque de pose, puis choisissez Insérer une pose.
Placez la tête de lecture sur l’image dans laquelle vous souhaitez ajouter la pose,
puis appuyez sur la touche F6.
Animate insère une pose dans le calque de pose de l’image en cours. Dans l’image, un
marqueur de pose en forme de losange signale la nouvelle pose.
3. Ajoutez d’autres poses dans d’autres images pour modifier l’animation selon vos besoins.
4. Pour modifier la durée de l'animation dans le scénario, placez le pointeur de la souris sur
la dernière image du squelette jusqu'à ce que le curseur de redimensionnement
apparaisse. Déplacez la dernière image du calque de pose vers la droite ou vers la
gauche pour ajouter ou supprimer des images.
Animate repositionne les images de pose en fonction des modifications apportées à la
durée du calque et interpole à nouveau les images intermédiaires. Pour redimensionner
la plage de squelette dans le scénario sans modifier l'emplacement des images de pose,
faites glisser la dernière image de la plage de squelette tout en appuyant sur la touche
Maj.
Lorsque vous avez terminé, faites défiler la tête de lecture dans le scénario pour afficher un aperçu de
l’animation. Vous pouvez voir les positions du squelette interpolée entre les images de pose.
Vous pouvez à tout moment repositionner le squelette dans les images de pose ou ajouter de nouvelles
images de pose.
Haut de la page
Modification de l'emplacement des poses dans le squelette
Procédez comme suit pour modifier l'emplacement des poses :
Pour déplacer une pose vers un nouvel emplacement, cliquez sur une pose tout en
appuyant sur la touche Ctrl (Windows) ou Commande (Macintosh), puis faites-la glisser
vers l'emplacement de votre choix dans le squelette.
247
Pour copier une pose sur un nouvel emplacement, cliquez sur une pose tout en appuyant
sur la touche Ctrl (Windows) ou Commande (Macintosh), puis faites-la glisser vers
l'emplacement de votre choix dans le squelette tout en appuyant sur la touche Alt
(Windows) ou Option (Macintosh).
Pour couper, copier et coller une pose : cliquez sur la pose que vous souhaitez couper ou
copier tout en appuyant sur la touche Ctrl (Windows) ou Commande (Macintosh), puis
choisissez Couper la pose ou Copier la pose dans le menu contextuel.
Cliquez ensuite sur l'image de la plage de squelette dans laquelle vous souhaitez coller la
pose tout en appuyant sur la touche Ctrl (Windows) ou Commande (Macintosh), puis
choisissez Coller la pose dans le menu contextuel.
Haut de la page
Application d’effets interpolés supplémentaires aux propriétés
d’objet IK
Pour appliquer des effets interpolés à des propriétés d’objet IK autres que la position du segment, enfermez
l’objet dans un clip ou un symbole graphique.
1. Sélectionnez le squelette IK et tous ses objets associés.
Dans le cas d’une forme IK, cliquez simplement sur la forme. Dans le cas d’ensembles
liés d’occurrences de symbole, vous pouvez cliquer sur le calque de pose dans le
scénario ou faire glisser un cadre de sélection autour de tous les symboles liés sur la
scène.
2. Cliquez sur la sélection avec le bouton droit de la souris (Windows) ou avec le bouton
Contrôle (Macintosh), puis choisissez Convertir en symbole dans le menu contextuel.
3. Dans la boîte de dialogue Convertir en symbole, entrez le nom du symbole, puis
choisissez Clip ou Graphique dans le menu Type. Cliquez sur OK.
Animate crée un symbole avec son propre scénario, contenant le calque de pose du
squelette.
4. Pour utiliser le nouveau symbole sur le scénario principal de votre fichier FLA, faites-le
glisser de la Bibliothèque vers la scène.
Vous pouvez à présent ajouter des effets d’interpolation de mouvement à la nouvelle
occurrence de symbole sur la scène.
Vous pouvez imbriquer des symboles contenant des squelettes IK dans autant de calques de symbole
imbriqués que nécessaire pour obtenir l’effet désiré.
Haut de la page
Préparation d’un squelette à l’exécution d’une animation avec
ActionScript 3.0
Vous pouvez utiliser le langage ActionScript 3.0 pour contrôler les squelettes IK liés à des formes ou à des
occurrences de clip. Vous ne pouvez toutefois pas contrôler les squelettes liés à des occurrences de symbole
de graphique ou de bouton avec ActionScript.
Seuls les squelettes ne présentant qu’une seule pose peuvent être contrôlés avec ActionScript. Les
squelettes présentant plusieurs poses ne peuvent être contrôlés que dans le scénario.
1. Avec l’outil Sélection, sélectionnez une image dans un calque de pose contenant un
squelette.
2. Dans l’inspecteur des propriétés, choisissez Exécution dans le menu Type.
La hiérarchie peut à présent être manipulée avec ActionScript 3.0 au moment de l’exécution.
Par défaut, le nom du squelette dans l’inspecteur des propriétés correspond à celui du calque de pose.
Utilisez ce nom pour faire référence au squelette dans ActionScript. Vous pouvez également modifier le nom
dans l’inspecteur des propriétés.
Haut de la page
248
Ajout d’une accélération dans une animation IK
L’accélération correspond au réglage de la vitesse de l’animation dans les images qui entourent chaque pose
en vue de créer un mouvement encore plus réaliste.
1. Sélectionnez soit une image entre deux images de pose dans le calque de pose soit une
image de pose.
Image intermédiaire : l’accélération a une incidence sur les images situées entre les
images de pose à gauche et à droite de l’image sélectionnée.
Image de pose : l’accélération a une incidence sur les images situées entre la pose
sélectionnée et la pose suivante dans le calque.
2. Dans l’inspecteur des propriétés, sélectionnez un type d’accélération dans le menu
Accélération.
Accélérations simples : quatre accélérations qui ralentissent le mouvement dans les
images situées soit immédiatement après ou avant l’image sélectionnée.
Accélérations de départ et d'arrêt : ralentissent le mouvement dans les images
situées immédiatement après l’image de pose et les images situées immédiatement
avant l’image de pose suivante.
Remarque : Ces mêmes types d’accélération sont disponibles dans l’Éditeur de
mouvement lorsque vous faites appels aux interpolations de mouvement. Vous pouvez
afficher la courbe de chaque type d’accélération dans l’Éditeur de mouvement lorsque
vous sélectionnez une interpolation de mouvement dans le scénario.
3. Dans l’inspecteur des propriétés, entrez une valeur pour la puissance de l’accélération.
La puissance par défaut est 0, c’est-à-dire aucune accélération. La valeur maximale est
100, ce qui applique l’effet d’accélération le plus notable aux images qui précèdent
l'image de pose. La valeur minimale est -100, ce qui applique l’effet d’accélération le plus
notable aux images qui suivent immédiatement la précédente image de pose. Lorsque
vous avez terminé, affichez un aperçu du mouvement accéléré sur la scène. Faites
défiler la tête de lecture dans le scénario entre deux les images de pose, à
l’emplacement où vous avez appliqué l’accélération.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
249
Guide d’animation
Aperçu
Le guide d’animation dans Adobe Animate CC (anciennement Flash Professional CC) vous permet
d’optimiser l’animation que vous créez en définissant un chemin pour les objets à animer. Cela est utile
lorsque vous travaillez avec une animation qui suit un chemin qui n’est pas une ligne droite. Ce processus
nécessite deux calques pour pouvoir effectuer une animation:
un calque contenant l’objet que vous êtes sur le point d’animer ;
un calque définissant le chemin, que l’objet est censé suivre pendant l’animation.
Le guide d’animation fonctionne uniquement avec les interpolations classiques.
Pour plus d’informations sur les guides d’animation, voir Utilisation d’animations interpolées classiques.
Haut de la page
Guide d’animation basé sur la largeur de trait variable
Vous pouvez animer un objet sur base de l’épaisseur variable du trait du chemin de guide.
Outre les images clés pour les positions initiale et finale de l’objet, vous n’avez besoin d’aucune autre image
clé pour marquer la variation de l’épaisseur du trait.
1. Pour animer un objet sur base de la largeur de trait variable, créez un chemin et animez
l’objet le long du chemin comme décrit dans la section précédente de ce document.
2. Avec la première image clé de l’interpolation sélectionnée dans la chronologie,
sélectionnez les cases à cocher Échelle et Échelle le long du chemin dans l’Inspecteur
de propriétés. À présent, l’objet est prêt à suivre la mise à l’échelle en fonction de
l’épaisseur du trait.
3. Définissez l’épaisseur du trait en utilisant l’une des méthodes suivantes :
Sélectionnez l’outil Largeur (U) dans la boîte à outils, cliquez n’importe où sur le chemin,
puis faites glisser pour faire varier l’épaisseur du chemin.
250
Sélectionnez le chemin à l’aide de l’outil Sélection (V) dans la boîte à outils et dans
l’Inspecteur des propriétés, choisissez un profil d’épaisseur pour le trait à partir de l’option
du menu déroulant Largeur.
Pour plus d’informations sur les traits d’épaisseur variable, voir Traits d’épaisseur variable.
Une fois qu’un trait de largeur variable est défini en tant que chemin, si vous exécutez l’interpolation de
mouvement, vous pouvez constater que non seulement l’objet suit le chemin, mais également que sa taille
change en fonction de la relation au changement d’épaisseur du trait.
Voici un exemple qui utilise le guide d’animation avec un trait de largeur variable :
Un chemin de guide de mouvement peut comporter plusieurs segments, chaque segment connecté
présentant un profil de largeur variable différent comme illustré ci-dessous. Sans images clés
supplémentaires pour l’objet, le profil de largeur de chaque segment est pris en considération pendant
l’animation.
251
Haut de la page
Guide d’animation basé sur la couleur du trait
Le guide d’animation vous permet également d’effectuer une interpolation de l’objet tout au long du chemin,
en modifiant la couleur de l’objet sur base de la couleur du chemin de guide lui-même. Pour enclencher la
variation, vous devez disposer d’au moins deux segments sur le chemin, c’est-à-dire, au minimum trois
nœuds ou points sur le chemin. Pour ce faire, lors de la création d’une interpolation de mouvement classique
et du tracé d’un chemin de guide comme décrit dans la section précédente de ce document, utilisez l’outil
Plume et dessinez une trajectoire comme illustré ci-dessous. Ce chemin comporte quatre nœuds/points dans
trois segments.
Outre les images clés pour les positions initiale et finale de l’objet, vous n’avez pas besoin de créer d’autres
images clés pour marquer la variation de l’épaisseur du trait.
1. Lorsque vous créez une interpolation de mouvement classique, sélectionnez la première
image clé de l’interpolation dans la chronologie. Dans l’Inspecteur des propriétés,
sélectionnez la case à cocher Couleur tout au long du chemin. Votre objet est
maintenant prêt à suivre la variation de couleurs selon le chemin de guide.
252
2. Désormais, à l’aide de l’outil Sélection (V) de la boîte à outils, cliquez pour sélectionner le
second segment du chemin de guide et choisissez une couleur différente. Répétez la
même procédure pour le troisième segment du chemin.
A présent, exécutez l’animation pour identifier l’influence de la couleur du chemin de guide sur l’objet luimême au cours de l’interpolation. Vous pouvez constater que l’influence ne concerne pas uniquement la
couleur, mais également la valeur alpha/opacité du segment de trait dans le chemin de guide.
Voici un exemple qui utilise le guide d’animation avec une variation de couleur :
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
253
Utilisation d’une animation interpolée classique dans
Animate CC
À propos des animations interpolées classiques
Création et modification d’images-clés pour des animations interpolées classiques
Ajout d’une animation d’interpolation classique à une occurrence, un groupe ou un
texte
Création d’un calque de guide de mouvement
Création d’une animation d’interpolation classique le long d’une trajectoire
Collage des propriétés d’une animation d’interpolation classique
Application d’une accélération/décélération personnalisée à une animation
d’interpolation classique
Haut de la page
À propos des animations interpolées classiques
Remarque : Comme la plupart des éléments dans Animate, les animations n’impliquent pas l’utilisation du
langage ActionScript. Vous pouvez néanmoins utiliser ActionScript si tel est votre choix.
Les interpolations classiques constituent l’ancienne méthode de création d’une animation dans Animate. Ces
interpolations sont similaires aux interpolations de mouvement plus récentes, mais sont un peu plus
compliquées à créer et donc moins souples. Les interpolations classiques fournissent toutefois un certain
type de contrôle de l’animation que les interpolations de mouvement ne permettent pas. La plupart des
utilisateurs choisissent de faire appel aux nouvelles interpolations de mouvement, mais d’autres préfèrent
encore utiliser les interpolations classiques. Pour plus d’informations sur les différences, voir Différences entre
interpolations de mouvement et interpolations classiques.
Avant de commencer:
Avant d’utiliser des interpolations classiques, notez les points suivants :
Les interpolations classiques constituent l’ancienne méthode de création d’une animation
interpolée dans Animate. La méthode la plus facile et la plus récente est d’utiliser les
interpolations de mouvement. Voir Animation d’interpolations de mouvement.
Il est impossible d’interpoler des propriétés 3D avec des interpolations classiques.
Pour voir des exemples d’animations interpolées classiques, consultez la page Exemples Animate sur le site
www.adobe.com/go/learn_fl_samples_fr. Les exemples suivants sont disponibles :
Ombre portée animée : téléchargez et décompressez le fichier zip Exemples et naviguez
jusqu’au dossier Graphics\AnimatedDropShadow afin d’accéder à l’exemple.
Animation et dégradés : téléchargez et décompressez le fichier zip Exemples et naviguez
jusqu’au dossier Graphics\AnimationAndGradients afin d’accéder à l’exemple.
Haut de la page
Création et modification d’images-clés pour des animations
interpolées classiques
254
Remarque : Cette section explique comment créer des image-clés pour les interpolations classiques. Pour
obtenir de l’aide sur les images-clés de propriété des interpolations de mouvement, consultez la section
Création d’une animation interpolée.
Les modifications au sein d’une animation d’interpolation classique sont définies dans une image-clé. Dans
une animation interpolée, vous définissez les images-clés à certains points importants de l’animation et
laissez Animate créer le contenu des images intermédiaires. Les images interpolées d’une animation
interpolée sont affichées en bleu clair ou vert clair avec une flèche entre chaque image-clé. Les documents
Animate conservant les formes de chaque image-clé, vous devriez créer des images-clés uniquement au
niveau des points de l’illustration dans lesquels se produisent des changements.
Les images-clés sont signalées dans le scénario : un cercle plein représente une image-clé avec du contenu,
tandis qu’un cercle vide précédant l’image représente une image-clé vide. Le contenu des images
supplémentaires que vous ajoutez à un même calque sera le même que celui de l’image-clé.
Dans une interpolation classique, seules les images-clés sont modifiables. Vous pouvez afficher des images
interpolées, mais vous ne pouvez pas les modifier directement. Pour modifier des images interpolées, vous
pouvez modifier l’une des images-clés de définition ou insérer une nouvelle image-clé entre celles de début
et de fin. Vous pouvez faire glisser des éléments du panneau Bibliothèque sur la scène pour ajouter des
éléments à l’image-clé en cours.
Pour afficher et modifier plusieurs images à la fois, consultez la section Utilisation de la pelure d’oignon.
Création d’images-clés
Effectuez l’une des opérations suivantes :
Sélectionnez une image dans le scénario, puis sélectionnez Insertion > Scénario >
Image-clé.
Cliquez avec le bouton droit de la souris (Windows) ou en appuyant sur la touche
Contrôle (Macintosh) sur une image du scénario, puis sélectionnez Insérer une
image-clé.
Insertion d’images dans le scénario
Pour insérer une nouvelle image, sélectionnez Insertion > Scénario > Image.
Pour créer une image-clé, choisissez Insertion > Scénario > Image-clé. Vous pouvez
également cliquer avec le bouton droit de la souris (Windows) ou en appuyant sur la
touche Ctrl (Macintosh) sur l’image dans laquelle placer l’image-clé, puis choisir Insérer
une image-clé.
Pour créer une image-clé vide, choisissez Insertion > Scénario > Image-clé vide. Vous
pouvez également cliquer avec le bouton droit de la souris (Windows) ou en appuyant sur
la touche Ctrl (Macintosh) sur l’image dans laquelle placer l’image-clé, puis choisir Insérer
une image-clé vide.
Suppression ou modification d’une image ou d’une image-clé
Pour supprimer une image, une image-clé ou une séquence d’images, sélectionnez-la,
puis cliquez sur le bouton droit de la souris (Windows) ou en appuyant sur la touche
Contrôle (Macintosh) sur l’image, l’image-clé ou la séquence, puis sélectionnez Supprimer
les images. Les images environnantes demeurent inchangées.
Pour déplacer une image-clé ou une séquence d’images et leur contenu, faites-la glisser
vers l’emplacement souhaité.
Pour augmenter la durée d’une image-clé, faites glisser l’image-clé tout en appuyant sur
Alt (Windows) ou sur Option (Macintosh) jusqu’à la dernière image de la nouvelle
séquence.
255
Pour copier et coller une image ou une séquence d’images, sélectionnez-la et choisissez
Modifier > Scénario > Copier les images. Sélectionnez une image ou séquence à
remplacer et choisissez Modifier > Scénario > Coller les images.Utilisez la commande
Coller et remplacer les images pour coller et remplacer le nombre exact d’images copiées
sur le scénario cible.
Pour convertir une image-clé en image, sélectionnez-la et choisissez Modification >
Scénario > Supprimer l’image-clé ou cliquez avec le bouton droit de la souris (Windows)
ou tout en appuyant sur la touche Contrôle (Macintosh) sur l’image et choisissez
Supprimer l’image-clé. L’image-clé effacée et toutes les images jusqu’à l’image-clé
suivante sont remplacées par le contenu de l’image précédant l’image-clé effacée.
Pour copier une image-clé ou une séquence d’images en la faisant glisser, sélectionnezla, puis faites-la glisser vers le nouvel emplacement tout en appuyant sur Alt (Windows)
ou sur Option (Macintosh).
Pour changer la longueur d’une séquence interpolée, faites glisser l’image-clé de début
ou de fin vers la gauche ou la droite.
Pour ajouter un élément de la bibliothèque à l’image-clé en cours, faites glisser l’élément
du panneau Bibliothèque vers la scène.
Pour inverser une séquence d’animation, sélectionnez les images appropriées dans un
ou plusieurs calques et choisissez Modification > Scénario > Inverser les images. Des
images-clés doivent se trouver au début et à la fin de la séquence.
Haut de la page
Ajout d’une animation d’interpolation classique à une occurrence,
un groupe ou un texte
Remarque : Cette section explique comment créer des interpolations classiques. Pour obtenir de l’aide sur
la création d’interpolations de mouvement, consultez la section Création d’une animation interpolée.
Pour interpoler les modifications apportées aux propriétés d’occurrences, de groupes et de type, vous pouvez
utiliser une interpolation classique. Animate peut interpoler la position, la taille, la rotation et l’inclinaison des
occurrences, des groupes et du type. En outre, Animate peut interpoler la couleur des occurrences ou du
type, en créant des décalages de couleur progressifs ou en appliquant un fondu en entrée ou en sortie d’une
occurrence.
Avant d’interpoler la couleur de groupes ou de types, transformez-les en symboles. Avant d’animer
séparément des caractères distincts d’un bloc de texte, placez chaque caractère dans un bloc de texte
distinct.
Si vous appliquez une interpolation classique, puis changez le nombre d’images entre les deux images-clés
ou déplacez le groupe ou symbole dans n’importe quelle image-clé, Animate interpole à nouveau
automatiquement les images.
Création d’une animation d’interpolation classique
1. Cliquez sur le nom d’un calque pour en faire le calque actif, puis sélectionnez une
image-clé vide dans le calque dans lequel vous voulez démarrer l’animation. Ce sera la
première image de l’interpolation classique.
2. Pour ajouter du contenu dans la première image de l’interpolation classique, effectuez
l’une des opérations suivantes :
Créez un objet graphique avec l’outil Plume, Ovale, Rectangle, Crayon ou Pinceau,
puis convertissez-le en symbole.
Créez une occurrence, un groupe ou un bloc de texte sur la scène.
Faites glisser une occurrence de symbole depuis le panneau Bibliothèque.
Remarque : pour créer une interpolation, il ne doit y avoir qu’un élément dans le calque.
256
3. Créez une seconde image-clé là où l’animation doit se terminer, puis laissez cette
nouvelle image-clé sélectionnée.
4. Effectuez l’une des opérations suivantes pour modifier l’élément de l’image de fin :
Déplacez l’élément vers un nouvel emplacement.
Modifiez la taille, la rotation ou l’inclinaison de l’élément.
Modifiez la couleur de l’élément (occurrence ou bloc de texte uniquement). Pour
interpoler la couleur d’éléments autres que des occurrences ou blocs de texte, vous
utiliserez l’interpolation de forme.
5. Pour créer l’interpolation classique, effectuez l’une des opérations suivantes :
Cliquez sur l’une des images de la plage d’images de l’interpolation et sélectionnez
Insertion > Interpolation classique.
Cliquez avec le bouton droit de la souris (Windows) ou avec la touche Contrôle
(Macintosh) sur l’une des images de la plage d’images de l’interpolation, puis
sélectionnez Créer une interpolation classique dans le menu contextuel.
Si vous avez créé un objet graphique à l’étape 2, Animate le convertit automatiquement
en symbole et lui attribue le nom tween1.
6. Si vous avez modifié la taille de l’élément à l’étape 4, sélectionnez Échelle dans la
section Interpolation de l’inspecteur des propriétés pour interpoler la taille de l’élément
sélectionné.
7. Pour obtenir un effet de mouvement plus réaliste, vous pouvez appliquer un effet
d’accélération à l’interpolation classique. Pour ce faire, utilisez le champ Accélération de
la section Interpolation de l’inspecteur des propriétés pour spécifier une valeur
d’accélération pour chaque interpolation classique créée. Utilisez la boîte de dialogue
Accélération/Décélération personnalisée pour mieux contrôler la vitesse de l’interpolation
classique.
Faites glisser la valeur du champ Accélération ou entrez une valeur pour ajuster le taux
de modification entre les images interpolées :
Pour commencer l’interpolation classique lentement et l’accélérer vers la fin de
l’animation, utilisez une valeur négative comprise entre -1 et -100.
Pour commencer l’interpolation classique rapidement et la ralentir vers la fin de
l’animation, utilisez une valeur positive comprise entre 1 et 100.
Pour produire des variations plus complexes de la vitesse dans la plage d’images de
l’interpolation, cliquez sur le bouton Modifier accolé au champ Accélération pour
ouvrir la boîte de dialogue Accélération/Décélération personnalisée.
Par défaut, le taux de modification entre les images interpolées est constant. L’option
Accélération permet de donner un aspect naturel d’accélération ou de décélération
en ajustant progressivement le taux de modification.
8. Pour faire pivoter l’élément sélectionné pendant l’interpolation, sélectionnez une option
dans le menu Rotation de l’inspecteur des propriétés :
Sélectionnez Aucune (valeur par défaut) pour empêcher la rotation.
Sélectionnez Auto pour faire pivoter l’objet une fois dans la direction nécessitant le
moindre mouvement.
Sélectionnez Vers la droite ou Vers la gauche pour faire pivoter l’objet comme
indiqué, puis saisissez le nombre de rotations.
Remarque : la rotation de l’étape 8 vient s’ajouter à toute rotation appliquée à l’image
de fin à l’étape 4.
9. Si vous utilisez une trajectoire de mouvement, activez l’option Orienter vers la trajectoire
dans l’inspecteur des propriétés pour orienter la ligne de base de l’élément interpolé vers
la trajectoire de mouvement.
10. Activez l’option Sync dans l’inspecteur des propriétés afin de synchroniser l’animation
257
des occurrences de symboles graphiques avec le scénario principal.
Remarque : la commande Modification > Scénario > Synchroniser les symboles et
l’option Sync servent toutes deux à recalculer le nombre d’images d’une interpolation,
afin de l’adapter au nombre d’images qui lui sont affectées dans le scénario. Utilisez
l’option Sync si le nombre d’images de la séquence d’animation dans le symbole n’est
pas un multiple pair du nombre d’images occupées par l’occurrence graphique dans
l’animation.
11. Si vous utilisez une trajectoire de mouvement, sélectionnez Accrocher pour associer
l’élément interpolé à la trajectoire par son point d’alignement.
Utilisation d’interpolations classiques enregistrées au format XML
Animate permet d’utiliser des interpolations classiques sous la forme de fichiers XML. En mode natif,
Animate permet d’appliquer les commandes suivantes à n’importe quelle interpolation classique :
Copier le mouvement au format XML
Exporter le mouvement au format XML
Importer le mouvement au format XML
Copier le mouvement au format XML
Permet de copier les propriétés du mouvement appliquées à un objet sur la scène sur une image particulière.
1. Créer une interpolation classique
2. Sélectionnez une image-clé dans le scénario.
3. Sélectionnez Commandes > Copier le mouvement au format XML.
Les propriétés du mouvement sont copiées dans le Presse-papiers sous forme de données XML ; vous
pouvez alors utiliser un éditeur de texte pour travailler directement sur le fichier XML.
Exporter le mouvement au format XML
Permet d’exporter les propriétés de mouvement appliquées à un objet sur la scène dans un fichier XML
pouvant être enregistré.
1. Créer une interpolation classique
2. Sélectionnez Commandes > Exporter le mouvement au format XML.
3. Accédez à l’emplacement où vous souhaitez enregistrer le fichier.
4. Attribuez un nom au fichier XML et cliquez sur Enregistrer.
L’interpolation classique est exportée au format XML à l’emplacement spécifié.
Importer le mouvement au format XML
Permet d’importer un fichier XML existant dont les propriétés de mouvement ont été définies.
1. Sélectionnez un objet sur la scène.
2. Sélectionnez Commandes > Importer le mouvement au format XML.
3. Accédez à l’emplacement du fichier XML et sélectionnez ce dernier. Cliquez sur OK.
258
4. Dans la boîte de dialogue Coller le mouvement spécial, sélectionnez les propriétés que
vous souhaitez appliquer à l’objet sélectionné.
5. Cliquez sur OK.
Haut de la page
Création d’un calque de guide de mouvement
Pour contrôler le mouvement des objets dans une animation d’interpolation classique, créez un calque de
guide de mouvement.
Vous ne pouvez pas faire glisser un calque d’interpolation de mouvement ou un calque de pause IK sur un
calque de guide.
Faites glisser un calque normal sur un calque de guide. Ceci convertit le calque de guide
en calque de guide de mouvement et relie le calque normal au nouveau calque de guide
de mouvement.
Remarque : pour éviter la conversion accidentelle d’un calque de guide, placez tous les
calques de guide en dernier dans l’ordre des calques.
Haut de la page
Création d’une animation d’interpolation classique le long d’une
trajectoire
Remarque : Cette section explique comment utiliser les interpolations classiques. Pour obtenir de l’aide sur
l’utilisation d’interpolations de mouvement avec des trajectoires de mouvement, consultez la section
Modification de la trajectoire de mouvement d’une animation interpolée.
Les calques de guide de mouvement vous permettent de tracer des trajectoires le long desquelles des
occurrences, des groupes ou des blocs de texte interpolés peuvent être animés. Vous pouvez lier plusieurs
calques à un calque de guide de mouvement pour que plusieurs objets suivent la même trajectoire. Un
calque normal lié à un calque de guide de mouvement devient un calque guidé.
Dans cet exemple, deux objets de calques distincts sont associés à la même trajectoire.
Création d’une trajectoire de mouvement pour une animation interpolée
classique
1. Créez une séquence d’animation d’interpolation classique.
Si vous sélectionnez Orienter vers la trajectoire dans l’inspecteur des propriétés, la ligne
de base de l’élément interpolé s’oriente vers la trajectoire du mouvement. Si vous activez
l’option Accrocher, le point d’alignement de l’élément interpolé s’ajuste à la trajectoire de
mouvement.
2. Cliquez avec le bouton droit de la souris (Windows) ou avec la touche Contrôle
(Macintosh) sur le nom du calque contenant l’interpolation classique et choisissez Ajouter
un guide de mouvement classique.
Animate ajoute un calque de guide de mouvement au-dessus du calque d’interpolation
classique et décale le nom du calque d’interpolation classique pour indiquer qu’il est lié
au calque du guide de mouvement.
Remarque : Si le scénario contient déjà un calque de guide, vous pouvez faire glisser le
calque contenant l’interpolation classique au-dessous du calque de guide pour convertir
259
ce dernier en guide de mouvement et le relier à l’interpolation classique.
Calque de guide de mouvement situé au-dessus du calque contenant l’interpolation
classique
3. Pour ajouter un chemin au calque de guide de mouvement pour guider l’interpolation
classique, sélectionnez le calque de guide de mouvement et utilisez l’outil Plume,
Crayon, Ligne, Cercle, Rectangle ou Pinceau pour tracer la trajectoire souhaitée.
Vous pouvez également coller un trait sur le calque de guide de mouvement.
4. Faites glisser l’objet que vous interpolez pour l’accrocher au début de la ligne de la
première image et à la fin de la ligne dans la dernière image.
Graphique d’une voiture accrochée au début d’un trait de guide
Remarque : faites glisser le symbole par son point de transformation pour obtenir les
meilleurs résultats à l’accrochage.
5. Pour masquer le calque de guide de mouvement et le tracé de sorte que seul le
mouvement de l’objet soit visible lorsque vous travaillez, cliquez sur la colonne
d’affichage du calque de guide de mouvement.
Le groupe ou symbole suit la trajectoire de mouvement lorsque vous exécutez
l’animation.
Pour en savoir plus sur le guide d’animation basé sur le trait d’épaisseur et de couleur variables, reportezvous à la section Guide d’animation.
Calques liés à un calque de guide de mouvement
Effectuez l’une des opérations suivantes :
Faites glisser un calque existant sous le calque de guide de mouvement. Le calque
est mis en retrait sous le calque de guide de mouvement. Tous les objets se trouvant
sur ce calque sont automatiquement accrochés à la trajectoire de mouvement.
Créez un calque sous le calque de guide de mouvement. Les objets que vous
interpolez sur ce calque sont automatiquement interpolés le long de la trajectoire de
mouvement.
Sélectionnez un calque sous un calque de guide de mouvement. Sélectionnez
Modification > Scénario > Propriétés du calque, puis sélectionnez Guide.
Suppression du lien entre les calques et un calque de guide de mouvement
Sélectionnez le calque à dissocier, puis procédez de l’une des façons suivantes :
Faites glisser le calque au-dessus du calque de guide de mouvement.
Sélectionnez Modification > Scénario > Propriétés du calque, puis sélectionnez le
type de calque Normal.
260
Haut de la page
Collage des propriétés d’une animation d’interpolation classique
Remarque : Cette section explique comment coller les propriétés des anciennes interpolations classiques.
Pour obtenir de l’aide sur le collage des propriétés de nouvelles interpolations de mouvement, consultez la
section Copier-coller de propriétés d’interpolation de mouvement.
La commande Coller le mouvement permet de copier une interpolation classique et de coller seulement des
propriétés spécifiques à appliquer à un autre objet.
1. Sélectionnez les images du scénario contenant l’interpolation classique à copier. Les
images que vous sélectionnez doivent être situées sur le même calque mais ne doivent
pas obligatoirement partager une même interpolation classique. La sélection peut
s’étendre sur une interpolation, des images vides ou bien deux ou trois interpolations.
2. Choisissez Modifier > Scénario > Copier le mouvement.
3. Sélectionnez l’occurrence du symbole devant recevoir l’interpolation classique copiée.
4. Choisissez Modifier > Scénario > Coller le mouvement spécial. Sélectionnez les
propriétés d’interpolation classique spécifiques à coller sur l’occurrence de symbole. Les
propriétés de l’interpolation classique sont les suivantes :
Position X La distance que parcourt un objet dans la direction x.
Position Y La distance que parcourt un objet dans la direction y.
Échelle horizontale Le rapport entre la taille actuelle de l’objet et sa taille naturelle dans
la direction horizontale (X).
Échelle verticale Spécifie le rapport entre la taille actuelle de l’objet et sa taille naturelle
dans la direction verticale (Y).
Rotation et inclinaison La rotation et l’inclinaison d’un objet. Ces propriétés doivent
être appliquées conjointement à un objet. L’inclinaison est une mesure de la rotation
exprimée en degrés. Lorsque vous effectuez une rotation et une inclinaison, chaque
propriété a une incidence sur l’autre.
Couleur Toutes les valeurs rattachées à la couleur telles que teinte, luminosité et alpha
sont appliquées à l’objet.
Filtres Tous les changements et valeurs rattachés au filtre pour la plage sélectionnée.
Si des filtres sont appliqués à un objet, le filtre est collé avec toutes ses valeurs intactes
et son état (activé ou désactivé) s’applique aussi bien au nouvel objet.
Mode de fusion Applique le mode de fusion de l’objet.
Écrasement des propriétés d’échelle de la cible Quand cette option est décochée,
toutes les propriétés collées sont relatives à l’objet cible. Quand elle est cochée, les
propriétés d’échelle de l’objet sont écrasées.
Écrasement des propriétés de rotation et d’inclinaison de la cible Quand cette
option est décochée, toutes les propriétés collées sont relatives à l’objet cible. Quand
elle est cochée, les propriétés de rotation et d’inclinaison de l’objet sont écrasées par le
collage.
Toutes les images, les interpolations et les informations relatives au symbole nécessaires
sont insérées pour que la copie soit identique à l’original.
261
Vous devez passer par la commande Copier le mouvement en tant qu’ActionScript 3.0
pour copier l’interpolation classique d’un symbole dans le panneau Actions ou pour
l’utiliser dans un autre projet en tant que code ActionScript.
Haut de la page
Application d’une accélération/décélération personnalisée à une
animation d’interpolation classique
Remarque : Cette section explique comment ajouter une accélération aux anciennes interpolations
classiques. Pour obtenir de l’aide sur l’ajout d’une accélération aux nouvelles interpolations de mouvement,
consultez la section Accélération des animations interpolées.
La boîte de dialogue Accélération/Décélération personnalisée affiche un graphique représentant le degré de
déplacement au fil du temps. Les images sont représentées par l’axe horizontal et le pourcentage de
modification par l’axe vertical. La première image-clé est représentée par la valeur 0 % et la dernière imageclé est représentée par la valeur 100 %.
La valeur de changement de vélocité de l’objet est représentée par la pente de la courbe. Lorsque la courbe
est horizontale (pas de pente), la vélocité est égale à zéro ; lorsque la courbe est verticale, il y a un
changement de vélocité instantané.
Graphique d’Accélération/Décélération personnalisée affichant une vélocité constante. Pour ouvrir cette boîte
de dialogue, sélectionnez une image dans une interpolation classique et cliquez sur le bouton Éditer de la
section Accélération de l’inspecteur des propriétés.
Contrôles supplémentaires pour la boîte de dialogue
Accélération/Décélération personnalisée
Case à cocher Utiliser un paramètre pour toutes les propriétés La valeur par défaut pour cette case est
sélectionnée, ce qui signifie que la courbe affichée est utilisée pour toutes les propriétés et que le menu
contextuel Propriétés est désactivé. Lorsque la case n’est pas cochée, le menu contextuel Propriétés est
activé et chaque propriété comporte une courbe séparée définissant la vélocité de cette propriété.
Menu contextuel Propriété Ce menu est activé uniquement lorsque la case Utiliser un paramètre pour
toutes les propriétés n’est pas sélectionnée. Lorsque ce menu est activé, une courbe séparée est conservée
pour chacune des cinq propriétés s’affichant dans le menu. La sélection d’une propriété dans ce menu
affiche la courbe de cette propriété. Les propriétés sont les suivantes :
Position Spécifie les paramètres d’accélération personnalisée pour la position d’un objet animé sur
la scène.
262
Rotation Spécifie les paramètres d’accélération personnalisée pour la rotation d’un objet animé. Par
exemple, vous pouvez régler la vitesse de rotation d’un personnage animé jusqu’à faire face à
l’utilisateur sur la scène.
Échelle Spécifie les paramètres d’accélération personnalisée pour le redimensionnement d’un objet
animé. Par exemple, vous pouvez plus facilement personnaliser le redimensionnement d’un objet de
sorte qu’il semble s’éloigner de l’utilisateur, puis se rapprocher, puis s’éloigner de nouveau.
Couleur Spécifie les paramètres d’accélération personnalisée pour les transitions de couleur
appliquées à un objet animé.
Filtres Spécifie les paramètres d’accélération personnalisée pour les filtres appliqués à un objet
animé. Par exemple, vous pouvez contrôler le paramètre d’accélération d’une ombre portée qui
simule une modification de la direction d’une source lumineuse.
Boutons Lire et Arrêter Ces boutons vous permettent d’afficher une animation sur la scène à l’aide des
courbes de vélocité courantes définies dans la boîte de dialogue Accélération/Décélération personnalisée.
Bouton Réinitialiser Ce bouton vous permet de réinitialiser la courbe de vélocité à l’état linéaire, par défaut.
Position du point de contrôle sélectionné Dans le coin inférieur droit de la boîte de dialogue, une valeur
numérique affiche l’image-clé et la position du point de contrôle sélectionné. Si aucun point de contrôle n’est
sélectionné, aucune valeur ne s’affiche.
Pour ajouter un point de contrôle à la ligne, cliquez une première fois sur la ligne en diagonale. Vous pouvez
obtenir un degré précis de contrôle sur le mouvement d’un objet en faisant glisser les positions des points de
contrôle.
Les indicateurs des images (poignées carrées) permettent de cliquer pour indiquer un point de ralentissement
ou d’accélération. En cliquant sur la poignée carrée d’un point de contrôle, vous sélectionnez ce point de
contrôle et affichez les points tangentiels sur l’un de ses côtés. Les points tangentiels sont représentés par
des cercles vides. Vous pouvez faire glisser le point de contrôle ou ses points tangentiels à l’aide de la souris
ou vous pouvez les positionner à l’aide des flèches de direction du clavier.
Conseil : par défaut, les points de contrôle s’accrochent à une grille. Vous pouvez désactiver l’accrochage en
appuyant sur la touche X tout en faisant glisser le point de contrôle.
En cliquant sur une zone de la courbe éloignée de tous les points de contrôle, vous ajoutez un nouveau point
de contrôle à la courbe au niveau de ce point, sans modifier la forme de la courbe. Pour désélectionner le
point de contrôle sélectionné, cliquez à l’extérieur de la courbe et des points de contrôle.
Ajout d’une accélération personnalisée
1. Dans le scénario, sélectionnez un calque auquel une interpolation classique est
appliquée.
2. Cliquez sur le bouton Éditer à côté du curseur Accélération de l’inspecteur des propriétés
de l’image.
3. (Facultatif) Pour afficher la courbe d’une propriété interpolée unique, désactivez l’option
Utiliser un paramètre pour toutes les propriétés et sélectionnez une propriété dans le
menu.
4. Cliquez sur la touche Ctrl (Windows) ou Commande (Macintosh) sur la ligne en
diagonale pour ajouter un point de contrôle.
5. Faites glisser le point de contrôle vers le haut pour augmenter la vitesse de l’objet ou
vers le bas pour ralentir sa vitesse.
6. Faites glisser les poignées des sommets pour ajuster la courbe d’accélération et régler
avec plus de précision la valeur d’accélération de l’interpolation.
7. Affichez l’animation sur la scène en cliquant sur le bouton Lire dans le coin inférieur
gauche.
263
8. Ajustez les réglages afin d’obtenir l’effet souhaité.
Remarque : si vous appliquez une accélération personnalisée à une image dans la boîte de dialogue
Accélération/Décélération personnalisée, le champ Éditer qui affiche la valeur d’accélération affiche « -- ». Si
vous appliquez une valeur d’accélération à une image à l’aide du champ Éditer ou du curseur du menu
contextuel, le graphique Accélération personnalisée est paramétré sur la courbe équivalente et la case Utiliser
un paramètre pour toutes les propriétés est cochée.
Copie et collage d’une courbe d’accélération
Copiez la courbe d’accélération courante en appuyant sur les touches Ctrl+C (Windows)
ou Commande+C (Macintosh).
Collez la courbe copiée dans une autre courbe d’accélération en appuyant sur les
touches Ctrl+V (Windows) ou Commande+V (Macintosh).
Vous pouvez copier et coller la courbe d’accélération. La courbe copiée reste disponible
jusqu’à ce que vous quittiez l’application Animate.
Courbes d’accélération non prises en charge
Certains types de courbes d’accélération ne sont pas pris en charge : aucune partie du graphique ne peut
représenter une courbe non linéaire (telle qu’un cercle)
La boîte de dialogue Accélération personnalisée empêche automatiquement le déplacement d’un point de
contrôle ou d’une poignée de tangente vers une position qui rendrait une courbe non valide.
Tous les points doivent exister sur le graphique. Les points de contrôle ne peuvent pas
être déplacés sous les limites du graphique.
Tous les segments de la courbe doivent exister dans le graphique. La forme de la courbe
sera aplatie pour l’empêcher de s’étendre au-delà des limites du graphique.
Adobe recommande également :
À propos des animations interpolées
Création de symboles
Séparation du texte TLF
À propos des animations interpolées
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
264
Animation d’interpolations de mouvement
À propos des animations interpolées
Application de présélections de mouvement
Création d’une animation interpolée
Modification de la trajectoire de mouvement d’une animation interpolée
Modification des plages d’interpolation d’une animation dans le scénario
Utilisation d’interpolations de mouvement enregistrées au format XML
Haut de la page
À propos des animations interpolées
Avant de commencer
Remarque : comme la plupart des éléments dans Animate (précédemment Flash Professional CC), les
animations n’impliquent pas l’utilisation du langage ActionScript. Vous pouvez néanmoins utiliser ActionScript
si tel est votre choix.
Avant de créer des interpolations, il est très utile de comprendre les concepts suivants associés à Animate :
Réalisation de dessins sur la scène
Calques de scénario et ordre d’empilement des objets dans un calque ou à travers les
calques
Déplacement et transformation d’objets sur la scène et dans l’inspecteur des propriétés
Utilisation du scénario, y compris durée de vie des objets et sélection des objets à des
points temporels spécifiques. Voir Images et images-clés pour connaître les principes de
base.
Symboles et propriétés des symboles. Les types de symboles interpolables comprennent
les clips, les boutons et les graphiques. Le texte n'est pas interpolable.
Symboles imbriqués. Il est possible d'imbriquer des occurrences de symboles dans
d'autres symboles.
Facultatif : modification de la courbe de Bézier avec les outils Sélection et Sous-sélection.
Ces outils permettent également de modifier les trajectoires de mouvement
d’interpolation. Pour plus d’informations, reportez-vous à la section Modification des
interpolations de mouvement avec l’Éditeur de mouvement.
Pour plus d’informations sur ces concepts, voir la liste des liens au bas de cette page.
Fonctionnement des interpolations de mouvement
Une interpolation de mouvement est une animation créée en spécifiant plusieurs valeurs pour la propriété
d’un objet dans plusieurs images. Animate calcule les valeurs de cette propriété entre ces deux images. Le
terme interpolation (« tween » en anglais) est la contraction de l’anglais « in between » qui signifie « au
milieu » ou « dans l’intervalle ».
265
Par exemple, vous pouvez placer un symbole à gauche de la scène dans l’image 1 et le déplacer à droite de
la scène dans l’image 20. Lorsque vous créez une interpolation, Animate calcule toutes les positions
intermédiaires du clip. Le résultat est une animation du symbole qui se déplace de gauche à droite, de
l’image 1 à l’image 20. Dans chaque image intermédiaire, Animate déplace le clip à travers la scène d’un
vingtième de la distance.
Une plage d’interpolation est un groupe d’images du scénario dans lequel une ou plusieurs propriétés d’un
objet peuvent changer avec le temps. Dans le scénario, la plage d’interpolation prend la forme d’un groupe
d’images placé dans un même calque sur fond bleu. Ces plages d’interpolation peuvent être sélectionnées
séparément sous la forme d’un seul objet, puis déplacées d’un emplacement à l’autre dans le scénario, y
compris vers un autre calque. Chaque plage d’interpolation permet d’animer un seul objet de la scène. Cet
objet est appelé objet cible de la plage d’interpolation.
Une image-clé de propriété est une image d’une plage d’interpolation dans laquelle vous définissez
explicitement une ou plusieurs valeurs de propriétés pour l’objet cible de l’interpolation. Ces propriétés
peuvent inclure la position, la valeur alpha (transparence), la teinte, etc. Chaque propriété que vous
définissez possède ses propres images-clés de propriété. Si vous définissez plusieurs propriétés pour une
même image, les images-clés de propriété de chacune de ces propriétés résident dans cette image. Vous
pouvez afficher chaque propriété d’une plage d’interpolation et ses images-clés de propriété dans l’Editeur de
mouvement. Vous pouvez également choisir quels types d’images-clés de propriété afficher dans le scénario
à partir du menu contextuel de la plage d’interpolation.
Dans l’exemple précédent d’interpolation d’un clip de l’image 1 à l’image 20, les images 1 et 20 sont des
images-clés de propriété. Vous pouvez utiliser l’inspecteur des propriétés, l’éditeur de mouvement et de
nombreux autres outils dans Animate pour définir les valeurs des propriétés que vous souhaitez animer. Vous
spécifiez ces valeurs de propriété dans les images de votre choix, et Animate ajoute les images-clés de
propriété requises à la plage d’interpolation. Animate interpole alors les valeurs de chaque propriété des
images placées entre les images-clés de propriété que vous avez créées.
Remarque : Le terme « image-clé » désigne une image du scénario dans laquelle une occurrence de
symbole apparaît sur la scène pour la première fois. Le terme « image-clé de propriété » désigne une valeur
définie pour la propriété d’un objet à une heure ou à une image spécifique dans une interpolation de
mouvement.
Si un objet interpolé change d’emplacement sur la scène au cours de l’interpolation, une trajectoire de
mouvement est associée à la plage d’interpolation. Cette trajectoire de mouvement montre la trajectoire
suivie par l’objet interpolé à travers la scène. Vous pouvez modifier la trajectoire du mouvement sur la scène
avec les outils Sélection, Sous-sélection, Convertir un point d’ancrage, Retirer un point d’ancrage et
Transformation libre, ainsi qu’avec les commandes du menu Modification. Si vous n’interpolez pas la position,
aucune trajectoire de mouvement n’apparaît sur la scène. Vous pouvez également appliquer une trajectoire
existante en la collant sur une plage d’interpolation dans le scénario.
L’animation interpolée est un moyen efficace de créer du mouvement et des modifications de façon
progressive tout en réduisant la taille du fichier. Dans l’animation interpolée, seules les valeurs des imagesclés de propriété que vous spécifiez sont stockées dans le fichier FLA et le fichier SWF publié.
Objets et propriétés pouvant faire l’objet d’une interpolation
Les types d’objets pouvant être interpolés comprennent les clips, les symboles graphiques et de bouton et les
champs de texte. Les propriétés pouvant être interpolées pour ces objets comprennent :
La position 2D X et Y
La position 3D Z (clips uniquement)
Rotation 2D (autour de l’axe z)
La rotation 3D X, Y et Z (clips uniquement)
Le mouvement en 3D exige que le fichier FLA cible ActionScript 3.0 et Flash Player 10 ou
une version ultérieure dans les Paramètres de publication. Adobe AIR prend également
en charge le mouvement 3D.
L’inclinaison X et Y
L’échelle X et Y
266
Effets de couleur
Les effets de couleur comprennent les paramètres alpha (transparence), luminosité, teinte
et les paramètres de couleur avancés. Les effets de couleur peuvent être interpolés
uniquement sur des symboles et du texte TLF. En interpolant ces propriétés, vous
pouvez faire apparaître les objets en fondu ou effectuer des transitions de couleur d’un
objet à l’autre.
Pour interpoler un effet de couleur sur du texte classique, convertissez ce texte en
symbole.
Propriétés de filtre (il est impossible d'appliquer des filtres aux symboles de graphique)
Différences entre interpolations de mouvement et interpolations classiques
Animate prend en charge deux différents types d’interpolations pour créer du mouvement. Les interpolations
de mouvement sont puissantes et faciles à créer. Les interpolations de mouvement offrent le plus grand
contrôle sur une animation interpolée. Les interpolations classiques, qui incluent toutes les interpolations
créées dans les versions antérieures d’Animate, sont plus complexes à créer. Alors que les interpolations de
mouvement offrent beaucoup plus de contrôle sur une interpolation, les interpolations classiques fournissent
des capacités spécifiques susceptibles d’intéresser certains utilisateurs.
Différences entre interpolations de mouvement et interpolations classiques :
Les interpolations classiques utilisent des images-clés. Les images-clés sont les images
dans lesquelles apparaît une nouvelle occurrence d’un objet. Les interpolations de
mouvement ne peuvent avoir qu’une seule occurrence d’objet associée et utilisent des
images-clés de propriété au lieu d’images-clés.
Une interpolation de mouvement est composée d’un seul objet sur la plage d’interpolation
entière. Une interpolation classique autorise l'interpolation entre deux images-clés
contenant des occurrences des mêmes symboles ou de symboles différents.
Les interpolations de mouvement et les interpolations classiques autorisent uniquement
l’interpolation de certains types d’objets. Lorsque vous appliquez une interpolation de
mouvement à des types d’objets non autorisés, Animate vous invite à les convertir en clip
lors de la création de l’interpolation. L’application d’une interpolation classique les
convertit en symboles graphiques.
Les interpolations de mouvement considèrent le texte comme un type interpolable et ne
convertissent pas les objets texte en animations. Les interpolations classiques
convertissent les objets texte en symboles graphiques.
Les scripts d’image ne sont pas autorisés sur une plage d’interpolation de mouvement.
Les interpolations classiques autorisent les scripts d’image.
Sur une cible d’interpolation, les scripts d’objet ne peuvent pas changer pendant le
déroulement de la plage d’interpolation de mouvement.
Les plages d’interpolation de mouvement peuvent être étirées et redimensionnées dans
le scénario ; elles sont traitées comme un seul objet. Les interpolations classiques sont
composées de groupes d’images individuellement sélectionnables dans le scénario.
Pour sélectionner des images individuelles dans une plage d’interpolation de mouvement,
cliquez sur les images tout en appuyant sur la touche Ctrl (Windows) ou Commande
(Macintosh).
Avec les interpolations classiques, les accélérations peuvent être appliquées aux groupes
d’images situées entre les images-clés de l’interpolation. Avec les interpolations de
mouvement, les accélérations s’appliquent sur toute la longueur de la plage
d’interpolation de mouvement. L’accélération uniquement des images spécifiques d’une
interpolation de mouvement requiert la création d’une courbe d’accélération
personnalisée.
Vous pouvez utiliser des interpolations classiques pour appliquer deux effets de couleur
différents, tels que la transparence alpha et la teinte. Les interpolations de mouvement ne
peuvent appliquer qu’un seul effet de couleur par interpolation.
Pour animer des objets 3D, vous ne pouvez utiliser que des interpolations de
267
mouvement. Vous ne pouvez pas animer un objet 3D à l’aide d’une interpolation
classique.
Seules les interpolations de mouvement peuvent être enregistrées en tant que
présélections de mouvement.
Avec les interpolations de mouvement, vous ne pouvez pas permuter des symboles ni
définir le nombre d’images d’un symbole graphique à afficher dans une image-clé de
propriété. Les animations qui comprennent ces techniques requièrent des interpolations
classiques.
Il peut exister plusieurs interpolations classiques ou de mouvement sur le même calque,
mais pas les deux types d'interpolation à la fois.
Ressources supplémentaires
Les articles et ressources suivants concernant les différences entre les interpolations de mouvement et les
interpolations classiques sont disponibles :
Création d’une animation simple dans Animate (Adobe.com)
Guide de migration du mouvement pour Animate (Adobe.com)
Jen DeHaan a écrit un article très intéressant sur le modèle de mouvement dans
Animate, et les différences entre les interpolations de mouvement et les interpolations
classiques sur son site /Flashthusiast.com (disponible en anglais uniquement).
Haut de la page
Application de présélections de mouvement
Les présélections de mouvement sont des interpolations de mouvement préconfigurées que vous pouvez
appliquer à un objet sur la scène. Il suffit de sélectionner cet objet et de cliquer sur le bouton Appliquer du
panneau Présélections de mouvement.
L’utilisation de présélections de mouvement permet d’apprendre rapidement les bases de l’ajout d’animations
dans Animate. Lorsque vous avez compris le fonctionnement des présélections, créer vos propres animations
devient encore plus facile.
Vous pouvez également créer et enregistrer vos propres présélections personnalisées. Ces dernières peuvent
provenir de présélections de mouvement existantes précédemment modifiées ou d’interpolations
personnalisées que vous avez vous-même créées.
Le panneau Présélections de mouvement permet également d’importer et d’exporter des présélections. Vous
pouvez alors partager des présélections avec vos collègues ou profiter des présélections partagées par les
membres de la communauté de conception Animate.
Utiliser des présélections peut vous faire gagner du temps lors de la conception et du développement de vos
projets, particulièrement si vous utilisez souvent les mêmes types d’interpolation.
Remarque : les présélections de mouvement ne peuvent contenir que des interpolations de mouvement. Les
interpolations classiques ne peuvent pas être enregistrées en tant que présélections de mouvement.
Aperçu d’une présélection de mouvement
Chaque présélection de mouvement fournie avec Animate s’accompagne d’un aperçu que vous pouvez
visionner dans le panneau Présélections de mouvement. Cet aperçu vous permet de voir à quoi ressemble
l’animation une fois appliquée à un objet dans votre document. Vous pouvez également ajouter votre propre
aperçu aux présélections personnalisées que vous créez ou que vous importez.
1. Ouvrez le panneau Présélections de mouvement.
2. Sélectionnez une présélection de mouvement dans la liste.
268
La lecture de l’aperçu commence dans la partie supérieure du panneau.
3. Pour interrompre la lecture de l’aperçu, cliquez hors du panneau Présélections de
mouvement.
Application d’une présélection de mouvement
Lorsqu’un objet interpolable (occurrence de symbole ou champ de texte) est sélectionné sur la scène, vous
pouvez cliquer sur le bouton Appliquer pour lui appliquer une présélection. Vous ne pouvez appliquer qu’une
seule présélection par objet. Si vous appliquez une seconde présélection au même objet, celle-ci remplace la
première.
Lorsqu’une présélection est appliquée à un objet sur la scène, l’interpolation créée dans le scénario n’est plus
reliée au panneau Présélections de mouvement. Si vous supprimez ou renommez une présélection dans le
panneau Présélections de mouvement, l’opération n’affecte pas les interpolations créées précédemment avec
cette présélection. Si vous enregistrez une nouvelle présélection sur une présélection présente dans le
panneau, l’opération n’affecte pas les interpolations créées précédemment avec la présélection d’origine.
Chaque présélection de mouvement contient un nombre spécifique d’images. Lorsque vous appliquez une
présélection, la plage d’interpolation créée dans le scénario contient ce nombre d’images. Si une interpolation
de longueur différente est déjà appliquée à l’objet cible, la plage d’interpolation est ajustée en fonction de la
longueur de la présélection de mouvement. Vous pouvez également ajuster la longueur de la plage
d’interpolation dans le scénario après application de la présélection.
Les présélections de mouvement qui contiennent un mouvement en 3D ne peuvent être appliquées qu’à des
occurrences de clip. Les propriétés 3D interpolées ne s’appliquent pas aux symboles de bouton ou de
graphique, ni aux champs de texte classique. Vous pouvez appliquer des présélections de mouvement 2D ou
3D à tout clip 2D ou 3D.
Remarque : les présélections de mouvement qui animent la position de l’axe z d’un clip 3D entraîneront
également un mouvement apparent de ses positions x et y. Ceci se produit car le mouvement le long de l’axe
des z suit les lignes de perspective invisibles qui rayonnent à partir du point de fuite 3D (défini dans
l’inspecteur des propriétés de l’occurrence du symbole) vers les bords de la scène.
Pour appliquer la présélection de mouvement :
1. Sélectionnez un objet interpolable sur la scène. Si vous appliquez une présélection de
mouvement à un objet non interpolable, une boîte de dialogue s’affiche et vous permet
de convertir l’objet en symbole.
2. Sélectionnez une présélection dans le panneau Présélections de mouvement.
3. Cliquez sur le bouton Appliquer du panneau ou choisissez Appliquer à l’emplacement
actuel dans le menu du panneau.
Le mouvement est appliqué de manière à commencer au niveau de la position actuelle
du clip sur la scène. Si une trajectoire de mouvement est associée à la présélection,
cette trajectoire apparaît sur la scène.
Pour appliquer la présélection de sorte que son mouvement se termine à la position
actuelle de l’objet sur la scène, cliquez sur le bouton Appliquer en maintenant la touche
Maj enfoncée ou choisissez Terminer à l’emplacement actuel dans le menu du panneau.
Vous pouvez également appliquer une présélection de mouvement à plusieurs images sélectionnées sur des
calques distincts, pour autant que chaque image sélectionnée ne contienne qu’un seul objet interpolable.
Enregistrement d’une interpolation en tant que présélection de mouvement
personnalisée
Si vous créez votre propre interpolation ou si vous modifiez une interpolation appliquée à partir du panneau
Présélections de mouvement, vous pouvez l’enregistrer en tant que nouvelle présélection de mouvement. La
269
nouvelle présélection apparaît dans le dossier Présélectionspersonnalisées du panneau Présélections de
mouvement.
Pour enregistrer une interpolation personnalisée en tant que présélection :
1. Sélectionnez l’un des éléments suivants :
la plage d’interpolation dans le scénario ;
l’objet de la scène auquel l’interpolation personnalisée a été appliquée ;
la trajectoire du mouvement sur la scène.
2. Cliquez sur le bouton Enregistrer la sélection sous forme de présélection du panneau
Présélections de mouvement ou choisissez Enregistrer en tant que présélection de
mouvement dans le menu contextuel de la sélection.
La nouvelle présélection apparaît dans le panneau Présélections de mouvement.
Animate enregistre la présélection sous la forme d’un fichier XML. Les fichiers sont
stockés dans les répertoires suivants :
Windows : <disque dur>\Documents and Settings\<utilisateur>\Local
Settings\Application Data\Adobe\Animate CC\<langue>\Configuration\Motion Presets\
Macintosh : <disque dur>/Users/<utilisateur>/Bibliothèque/Application
Support/Adobe/Animate CC/<langue>/Configuration/Motion Presets/
Remarque : vous ne pouvez pas annuler l’enregistrement, la suppression ou le changement de nom des
présélections personnalisées.
Importation d’une présélection de mouvement
Les présélections de mouvement sont stockées sous forme de fichiers XML. Pour ajouter une présélection
dans le panneau Présélections de mouvement, importez un fichier d’interpolation XML. Notez que les
présélections de mouvement importées en tant que fichiers XML peuvent être ajoutées uniquement à des
interpolations classiques.
1. Choisissez Importer dans le menu du panneau Présélections de mouvement.
2. Dans la boîte de dialogue Ouvrir, localisez le fichier XML à importer, puis cliquez sur
Ouvrir.
Animate ouvre le fichier XML et ajoute la présélection de mouvement dans le panneau.
Exportation d’une présélection de mouvement
Vous pouvez exporter les présélections de mouvement enregistrées sous forme de fichiers XML pour les
partager avec d’autres utilisateurs Animate.
1. Sélectionnez la présélection dans le panneau Présélections de mouvement.
2. Dans le menu du panneau, choisissez l’option Exporter.
3. Dans la boîte de dialogue Enregistrer sous, choisissez le nom et l’emplacement du fichier
XML, puis cliquez sur Enregistrer.
Suppression d’une présélection de mouvement
Vous pouvez supprimer des présélections du panneau Présélections de mouvement. Lorsque vous
supprimez une présélection, Animate efface son fichier XML sur le disque. Pensez à sauvegarder les
270
présélections que vous souhaitez réutiliser en en exportant d’abord des copies.
1. Sélectionnez la présélection à supprimer dans le panneau Présélections de mouvement.
2. Effectuez l’une des opérations suivantes :
Dans le menu du panneau, choisissez l’option Supprimer.
Dans le panneau, cliquez sur le bouton Supprimer l’élément.
Création d’un aperçu pour une présélection personnalisée
Vous pouvez créer un aperçu pour toutes vos présélections de mouvement personnalisées. Pour ce faire,
stockez un fichier SWF de démonstration de l’animation interpolée dans le même répertoire que le fichier
XML de la présélection de mouvement.
1. Créez l’animation interpolée et enregistrez-la sous forme de présélection personnalisée.
2. Créez un fichier FLA ne contenant qu’une démonstration de l’interpolation. Enregistrez le
fichier FLA sous le même nom que la présélection personnalisée.
3. Avec la commande Publier, créez un fichier SWF à partir du fichier FLA.
4. Placez le fichier SWF dans le même répertoire que le fichier XML enregistré de la
présélection de mouvement personnalisée. Ces fichiers sont stockés dans les répertoires
suivants :
Windows : <disque dur>\Documents and Settings\<utilisateur>\Local
Settings\Application Data\Adobe\Animate CC\<langue>\Configuration\Motion Presets\
Macintosh : <disque dur>/Users/<utilisateur>/Bibliothèque/Application
Support/Adobe/Animate CC/<langue>/Configuration/Motion Presets/
L’aperçu s’affiche à présent lorsque l’interpolation personnalisée est sélectionnée dans le panneau
Présélections de mouvement.
Haut de la page
Création d’une animation interpolée
271
Etapes de création d’une animation interpolée
Avant de commencer
Avant de commencer à animer des propriétés, notez les points suivants :
Le langage ActionScript n’est pas nécessaire. Comme de nombreux éléments dans Animate, les
animations n’impliquent pas l’utilisation du langage ActionScript. Vous pouvez néanmoins utiliser ActionScript
si tel est votre choix.
Principes de base du scénario et de la modification des propriétés. Avant de faire appel aux
interpolations de mouvement, vous devez vous familiariser avec l’utilisation de base du scénario et la
modification des propriétés. Voir Images et images-clés pour connaître les principes de base.
Vous pouvez modifier les images-clés de propriété individuelles sur la scène, dans l’inspecteur des propriétés
ou dans l’Editeur de mouvement. Notez cependant qu’il n’est pas impératif d’utiliser ce dernier pour créer de
nombreux types d’interpolations de mouvement simples.
L’Éditeur de mouvement a été abandonné dans Animate CC.
Occurrences de symbole et champs de texte uniquement. Dans Animate, seules les occurrences de
symbole et les champs de texte sont interpolées. Tous les autres types d’objets sont enveloppés dans un
symbole lorsque vous leur appliquez une interpolation. L’occurrence de symbole peut contenir des symboles
imbriqués, pouvant eux-mêmes être interpolés sur leurs propres scénarios.
Un seul objet par interpolation. Le bloc de construction minimal d’un calque d’interpolation est une plage
d’interpolation. Une plage d’interpolation de calque d’interpolation ne peut contenir qu’une seule occurrence
de symbole ou qu’un seul champ de texte. L’occurrence de symbole est appelée la cible de la plage
d’interpolation. Néanmoins, un seul symbole peut contenir plusieurs objets.
Modification de la cible. L’ajout d’un second symbole ou champ de texte dans la plage d’interpolation
remplace le symbole d’origine dans l’interpolation. Vous pouvez modifier l’objet cible d’une interpolation en
faisant glisser un autre symbole de la bibliothèque vers la plage d’interpolation dans le scénario ou en
utilisant la commande Modification > Symbole > Permuter le symbole. Vous pouvez supprimer le symbole
d’un calque d’interpolation sans supprimer ni diviser l’interpolation. Vous pouvez ensuite ajouter
ultérieurement une occurrence de symbole différente à l’interpolation. Par ailleurs, vous pouvez à tout
moment changer de type de symbole cible ou modifier le symbole.
Modification des trajectoires de mouvement. Lorsqu’une interpolation contient un mouvement, une
trajectoire de mouvement apparaît sur la scène. Cette trajectoire indique la position de l’objet interpolé dans
chaque image. Vous pouvez modifier la trajectoire de mouvement sur la scène en déplaçant ses points de
contrôle. Vous ne pouvez pas ajouter de guide de mouvement à un calque d’interpolation ou de cinématique
inverse.
Pour plus d’informations sur l’interpolation avec la cinématique inverse, reportez-vous à la section Animation
d’un squelette.
Procédure d’ajout d’interpolations au scénario
Lorsque vous ajoutez une interpolation à un objet sur un calque, Animate effectue l’une des opérations
suivantes :
Il convertit le calque en calque d’interpolation.
Il crée un nouveau calque pour préserver l’ordre d’empilement original des objets sur le
calque.
L’ajout de calques obéit aux règles suivantes :
Si le calque ne contient pas d’autre objet que la sélection, il est converti en calque
272
d’interpolation.
Si la sélection se trouve au bas de l’ordre d’empilement du calque (sous tous les autres
objets), Animate crée un calque au-dessus du calque original. Ce nouveau calque
contient les éléments non sélectionnés. Le calque original devient un calque
d’interpolation.
Si la sélection se trouve en haut de l’ordre d’empilement du calque (au-dessus de tous
les autres objets), Animate crée un calque. La sélection est déplacée vers le nouveau
calque et ce dernier devient un calque d’interpolation.
Si la sélection se trouve au milieu de l’ordre d’empilement du calque (des objets se
trouvent au-dessus et en dessous de la sélection), Animate crée deux calques. Un calque
contient la nouvelle interpolation et un autre au-dessus de lui les éléments sélectionnés
en haut de l’ordre d’empilement. Les éléments non sélectionnés situés au bas de l’ordre
d’empilement demeurent sur le calque d’origine, au-dessous des nouveaux calques
insérés.
Un calque d’interpolation peut contenir des plages d’interpolations, ainsi que des images statiques et du code
ActionScript. Toutefois, les images d’un calque d’interpolation contenant une plage d’interpolation ne peuvent
pas contenir d’autres objets que l’objet interpolé. Pour ajouter d’autres objets dans la même image, placez-les
sur des calques distincts.
Animation d’une position à l’aide d’une interpolation
Pour déplacer un objet ou le faire glisser sur la scène :
1. Sélectionnez une occurrence de symbole ou un champ de texte en vue de l’interpoler
sur la scène. L’objet peut être situé sur l’un des quatre types de calque suivants :
Normal, Guide, Masque ou Masqué.
Si la sélection contient d’autres objets ou si elle contient plusieurs objets d’un calque,
Animate vous invite à convertir votre sélection en symbole de clip.
Pour inverser la sélection, cliquez avec le bouton droit de la souris et sélectionnez
Inverser la sélection.
2. Effectuez l’une des opérations suivantes :
Choisissez Insertion > Interpolation de mouvement.
Cliquez sur la sélection ou sur l’image active avec le bouton droit de la souris
(Windows) ou avec le bouton Ctrl (Macintosh) et choisissez Créer une interpolation
de mouvement dans le menu contextuel.
Si la boîte de dialogue « Convertir la sélection en symbole en vue de l’interpolation »
s’affiche, cliquez sur OK pour convertir la sélection en occurrence de clip.
Si l’objet interpolé était le seul élément du calque, Animate convertit le calque contenant
l’objet en calque d’interpolation. Si le calque contient d’autres objets, Animate insère des
calques pour préserver l’ordre d’empilement. Animate place l’objet interpolé sur son
propre calque.
Si l’objet d’origine ne résidait que dans la première image du scénario, la durée de la
plage d’interpolation est égale à une seconde. Si l’objet d’origine était présent dans
plusieurs images contiguës, la plage d’interpolation contient le nombre d’images occupé
par l’objet d’origine.
3. Pour raccourcir ou étendre la plage jusqu’au nombre d’images souhaité, faites glisser
l’une des extrémités de la plage d’interpolation dans le scénario. Toute image-clé de
propriété existante dans l'interpolation se déplace proportionnellement à la fin de la
plage.
Pour déplacer la fin de la plage sans déplacer les images-clés existantes, faites glisser la
fin de la plage d'interpolation tout en appuyant sur la touche Maj.
273
4. Pour ajouter un mouvement à l’interpolation, placez la tête de lecture sur une image
dans la plage d’interpolation et faites glisser l’objet vers une nouvelle position.
Une trajectoire de mouvement apparaît sur la scène indiquant la trajectoire de la position
dans la première image de la plage d’interpolation vers la nouvelle position. Du fait que
vous avez explicitement défini les propriétés X et Y de l’objet, des images-clés de
propriété sont ajoutées pour X et Y dans l’image contenant la tête de lecture. Les
images-clés de propriété apparaissent sous forme de petits losanges dans la plage
d’interpolation.
Par défaut, le scénario affiche les images-clés de propriété de tous les types de
propriété. Vous pouvez choisir les types d’images-clés de propriété à afficher en
cliquant avec le bouton droit de la souris (Windows) ou en appuyant sur la touche
Commande (Macintosh) tout en cliquant sur la plage d’interpolation de mouvement et
en choisissant Afficher les images-clés > type de propriété.
5. Pour spécifier une autre position pour l’objet, placez la tête de lecture dans une autre
image de la plage d’interpolation et faites glisser l’objet sur la scène vers une autre
position.
La trajectoire de mouvement s’ajuste pour inclure toutes les positions spécifiées.
6. Pour interpoler une rotation ou une position 3D, utilisez l’outil Rotation 3D ou Translation
3D. Assurez-vous de placer la tête de lecture dans l’image dans laquelle vous souhaitez
ajouter l’image-clé de propriété 3D en premier.
Remarque : pour créer plusieurs interpolations simultanément, placez les objets interpolables sur plusieurs
calques, sélectionnez-les tous, puis choisissez Insertion > Interpolation de mouvement. Vous pouvez de la
même façon appliquer des présélections de mouvement à plusieurs objets.
Interpolation d’autres propriétés avec l’inspecteur des propriétés
La commande Créer une interpolation de mouvement permet d’animer la plupart des propriétés d’une
occurrence de symbole ou d’un champ de texte, notamment la rotation, l’échelle, la transparence ou la teinte
(symboles et texte TLF uniquement). Par exemple, vous pouvez modifier la propriété alpha (transparence)
d’une occurrence de symbole en vue de l’estomper à l’écran. Pour obtenir la liste des propriétés que vous
pouvez animer avec des interpolations de mouvement, voir Objets et propriétés pouvant faire l’objet d’une
interpolation.
1. Sélectionnez une occurrence de symbole ou un champ de texte sur la scène.
Si la sélection contient d’autres objets ou si elle contient plusieurs objets du calque,
Animate vous propose de la convertir en symbole de clip.
2. Choisissez Insertion > Interpolation de mouvement.
Si la boîte de dialogue « Convertir la sélection en symbole en vue de l’interpolation »
s’affiche, cliquez sur OK pour convertir la sélection en occurrence de clip.
Lorsque vous appliquez une interpolation à un objet présent dans une seule image, la
tête de lecture se déplace jusqu’à la dernière image de la nouvelle interpolation. Sinon,
la tête de lecture ne se déplace pas.
3. Placez la tête de lecture dans l’image de la plage d’interpolation à l’emplacement où
vous souhaitez spécifier une valeur de propriété.
Vous pouvez placer la tête de lecture dans une autre image de la plage d’interpolation.
L’interpolation commence avec les valeurs des propriétés de la première image de la
plage, correspondant toujours à une image-clé de propriété.
4. Lorsque l’objet est sélectionné sur la scène, définissez la valeur d’une propriété de non
position, telle que la transparence alpha ou l’inclinaison. Définissez la valeur avec
l’inspecteur des propriétés ou avec l’un des outils du panneau Outils.
L’image active de la plage devient une image-clé de propriété.
Vous pouvez afficher divers types d’images-clés de propriété dans des plages
d’interpolation. Cliquez avec le bouton droit de la souris sur une plage d’interpolation
274
(Windows) ou cliquez dessus tout en maintenant enfoncée la touche Ctrl (Macintosh)
et choisissez Afficher les images-clés > type de propriété dans le menu contextuel.
5. Faites défiler la tête de lecture dans le scénario pour afficher un aperçu de l’interpolation
sur la scène.
6. Pour ajouter d’autres images-clés de propriété, déplacez la tête de lecture vers l’image
souhaitée dans la page et définissez la valeur de la propriété dans l’inspecteur des
propriétés.
Ajout d’une interpolation supplémentaire dans un calque d’interpolation
existant
Vous pouvez ajouter des interpolations supplémentaires dans un calque d’interpolation existant. Cela vous
permet d’utiliser moins de calques lors de la création de contenu Animate avec une animation.
Effectuez l’une des opérations suivantes :
Ajoutez une image-clé vide dans le calque (Insertion > Scénario > Image-clé vide),
ajoutez des éléments dans l’image-clé, puis interpolez les éléments.
Créez une interpolation sur un calque distinct et faites glisser la plage vers le calque
désiré.
Faites glisser une image statique d’un autre calque vers le calque d’interpolation, puis
ajoutez une interpolation à un objet de l’image statique.
Faites glisser une plage existante vers le même calque ou vers un calque différent
tout en appuyant sur la touche Alt (Windows) ou sur la touche Option (Macintosh)
pour la dupliquer.
Copiez-collez une plage d'interpolation du même calque ou d'un calque différent.
Remarque : vous pouvez copier l’objet cible d’une interpolation de mouvement dans le Presse-papiers au
niveau de toute image de la plage d’interpolation.
Haut de la page
Modification de la trajectoire de mouvement d’une animation
interpolée
Vous pouvez modifier la trajectoire de mouvement d’une interpolation de mouvement en procédant comme
suit :
Modifiez la position de l’objet dans l’une des images de la plage d’interpolation.
Déplacez l’ensemble de la trajectoire de mouvement vers un autre emplacement sur la
scène.
Changez la forme ou la taille de la trajectoire avec les outils Sélection, Sous-sélection ou
Transformation libre.
Changez la forme ou la taille de la trajectoire avec le panneau Transformer ou
l’inspecteur des propriétés.
Servez-vous des commandes du menu Modification > Transformer.
Appliquez un trait personnalisé sous forme de trajectoire de mouvement.
Utilisez l’Editeur de mouvement.
Pour afficher simultanément toutes les trajectoires de mouvement sur tous les calques de la scène, utilisez
l’option Toujours afficher les trajectoires de mouvement. Cet affichage se révèle très utile lorsque l’on conçoit
de nombreuses animations sur des trajectoires de mouvement qui se recoupent. Si une trajectoire de
275
mouvement ou une plage d’interpolation est sélectionnée, choisissez cette option dans le menu d’options de
l’inspecteur des propriétés.
Modification de la forme d’une trajectoire de mouvement avec les outils
Sélection et Sous-sélection
Les outils Sélection et Sous-sélection permettent de modifier la forme d’une trajectoire de mouvement. L’outil
Sélection permet de modifier la forme d’un segment par glissement. Les images-clés de propriété
apparaissent sur le tracé sous forme de points de contrôle dans l’interpolation. L’outil Sous-sélection permet
d’afficher les points de contrôle et les poignées Bezier de la trajectoire correspondant à chaque image-clé de
propriété de position. Vous pouvez alors déplacer ces poignées pour modifier la forme de la trajectoire autour
des points des images-clés de propriété.
Lorsque vous créez une trajectoire de mouvement non linéaire, telle qu’un cercle, vous pouvez faire en sorte
que l’objet interpolé pivote lors de son déplacement le long de la trajectoire. Pour conserver une orientation
constante par rapport à la trajectoire, sélectionnez Orienter vers la trajectoire dans l’inspecteur des
propriétés.
Objet interpolé non orienté vers la trajectoire du mouvement (à gauche) et orienté vers la trajectoire de
mouvement (à droite)
1. Cliquez sur l’outil Sélection dans le panneau Outils.
2. Cliquez sur l’occurrence cible de l’interpolation de façon à ce que la trajectoire de
mouvement soit visible sur la scène.
3. Avec l’outil Sélection, faites glisser l’un des segments de la trajectoire de mouvement
pour en modifier la forme. Ne cliquez pas pour sélectionner d’abord le segment.
4. Pour afficher les points de contrôle Bézier d’un point d’image-clé de propriété sur la
trajectoire, cliquez sur l’outil Sous-sélection, puis sur la trajectoire.
Sur la trajectoire de mouvement, les points d’image-clé de propriété s’affichent sous
forme de points de contrôle (petits losanges).
5. Pour déplacer un point de contrôle, faites-le glisser avec l’outil Sous-sélection.
6. Pour ajuster la courbe de la trajectoire autour d’un point de contrôle, faites glisser les
poignées de Bézier du point de contrôle avec l’outil Sous-sélection.
Si les poignées ne sont pas développées, faites glisser le point de contrôle en
maintenant la touche Alt enfoncée (Windows) ou la touche Option (Macintosh) pour les
développer.
7. Pour supprimer un point d’ancrage cliquez dessus avec l’outil Supprimer le point
d’ancrage. La plupart des points d’ancrage générés avec l’outil Sélection sont des points
lisses. Pour convertir un point d’ancrage, cliquez dessus avec l’outil Convertir le point
d’ancrage. Le point d'ancrage se transforme en point d'angle.
8. Vous pouvez également faire glisser de nouvelles poignées de Bézier d'un point et les
positionner, comme vous le feriez pour un point d'ancrage standard.
Remarque : Vous ne pouvez pas ajouter de points d’ancrage à la trajectoire avec l’outil
Ajouter un point d’ancrage.
Modification de la position de l’objet interpolé
276
Pour modifier une trajectoire de mouvement, la méthode la plus simple consiste à déplacer l’occurrence cible
de l’interpolation sur la scène dans l’une des images de la plage d’interpolation. Si l’image actuelle ne
contient pas encore d’image-clé de propriété, Animate lui en ajoute une.
1. Placez la tête de lecture dans l’image vers laquelle vous souhaitez déplacer l’occurrence
cible.
2. Avec l’outil Sélection, faites glisser l’occurrence cible vers un nouvel emplacement de la
scène.
La trajectoire de mouvement s’actualise pour inclure le nouvel emplacement. Toutes les autres images-clés
de propriété de la trajectoire de mouvement conservent leur emplacement d’origine.
Modification de l’emplacement d’une trajectoire de mouvement sur la scène
Vous pouvez faire glisser l’ensemble de la trajectoire de mouvement sur la scène ou définir son emplacement
dans l’inspecteur des propriétés.
1. Cliquez sur l’outil Sélection dans le panneau Outils.
2. Sélectionnez la trajectoire de mouvement par l’une des opérations suivantes :
Cliquez sur la plage d’interpolation dans le scénario, puis sur la trajectoire de
mouvement sur la scène.
Cliquez sur l’objet interpolé sur la scène, puis sur la trajectoire de mouvement.
Faites glisser un cadre de sélection autour de la trajectoire de mouvement et de
l’occurrence cible pour les sélectionner.
3. Déplacez la trajectoire de mouvement par l’une des opérations suivantes :
Faites glisser la trajectoire vers l’emplacement souhaité sur la scène.
Définissez les valeurs X et Y de la trajectoire dans l’inspecteur des propriétés. Les
valeurs X et Y sont destinées au coin supérieur gauche du cadre de sélection de la
trajectoire de mouvement.
Servez-vous des touches de direction pour déplacer la trajectoire de mouvement.
Remarque : pour déplacer l’occurrence cible de l’interpolation et la trajectoire de mouvement en définissant
l’emplacement de cette dernière, sélectionnez les deux, puis entrez les emplacements X et Y dans
l’inspecteur des propriétés. Pour déplacer un objet interpolé qui n’a pas de trajectoire de mouvement,
sélectionnez-le et entrez les valeurs X et Y dans l’inspecteur des propriétés.
Modification d’une trajectoire de mouvement avec l’outil Transformation libre
1. Cliquez sur l’outil Transformation libre dans le panneau Outils.
2. Avec l’outil Transformation libre, cliquez sur la trajectoire de mouvement. Ne cliquez pas
sur l’occurrence cible de l’interpolation.
3. Toujours avec l’outil Transformation libre, modifiez l’échelle, inclinez ou faites pivoter la
trajectoire.
Remarque : vous pouvez également modifier librement la trajectoire de mouvement en la sélectionnant avec
l’outil Sous-sélection et en appuyant sur la touche Ctrl (Windows) ou Commande (Macintosh). Cette
opération affiche les mêmes contrôles que l’outil Transformation libre. Tout en appuyant sur la touche, vous
pouvez alors effectuer un glissement pour effectuer vos transformations.
277
Etant donné que la tête de lecture se trouve sur la première image des interpolations, la mise à l'échelle
s'applique à toutes les images interpolées. Aucune nouvelle image-clé de propriété n'est créée.
Suppression d’une trajectoire de mouvement dans une interpolation
1. Sélectionnez la trajectoire du mouvement sur la scène en cliquant sur son entrée avec
l’outil Sélection.
2. Appuyez sur la touche Suppr.
Copie d’une trajectoire de mouvement sous forme de trait
1. Cliquez sur la trajectoire de mouvement sur la scène pour la sélectionner.
2. Choisissez la commande Modifier > Copier.
Vous pouvez ensuite coller la trajectoire dans un autre calque sous forme de trait ou de trajectoire de
mouvement pour une autre interpolation de mouvement.
Application d’un trait personnalisé sous forme de trajectoire de mouvement
Vous pouvez appliquer un trait de calque ou de scénario distinct en tant que trajectoire de mouvement d’une
interpolation.
1. Sélectionnez un trait sur un calque autre que celui d’interpolation et copiez-le dans le
Presse-papiers.
Ce trait ne doit pas être fermé. Seuls les traits ininterrompus peuvent être utilisés.
2. Sélectionnez une plage d’interpolation dans le scénario.
3. La plage d’interpolation étant toujours sélectionnée, collez le trait.
Animate applique le trait en tant que nouvelle trajectoire de mouvement pour la plage
d’interpolation sélectionnée. L’occurrence cible de l’interpolation se déplace à présent le
long du nouveau trait.
4. Pour inverser les points de départ et de fin de l’interpolation, cliquez sur la plage
d’interpolation avec le bouton droit de la souris (Windows) ou avec la touche Ctrl
(Macintosh), puis sélectionnez Trajectoire de mouvement > Inverser le tracé dans le
menu contextuel de la plage d’interpolation.
Utilisation d’images-clés de propriété itinérantes
Une image-clé de propriété itinérante est une image-clé qui n’est pas reliée à une image spécifique du
scénario. Animate ajuste la position des images-clés itinérantes de sorte que la vitesse du mouvement soit
cohérente tout au long de l’interpolation.
Les images-clés itinérantes sont disponibles uniquement pour les propriétés spatiales X, Y et Z. Elles
s’avèrent pratiques lorsque vous avez modifié une trajectoire de mouvement sur la scène en faisant glisser
l’objet interpolé vers différents emplacements dans différentes images. Une telle modification des trajectoires
de mouvement crée souvent des segments de tracé dans lesquels le mouvement est plus rapide ou plus lent
que dans les autres segments. Ceci se produit car le segment du tracé contient plus ou moins d’images que
les autres segments.
L’utilisation des images-clés de propriété itinérantes permet d’adapter la vitesse d’une animation pour qu’elle
soit égale dans toute l’interpolation. Lorsque les images-clés de propriété sont réglées pour être itinérantes,
Animate ajuste leur position dans la plage d’interpolation de sorte que l’objet interpolé se déplace sur la
même distance dans chaque image de l’interpolation. Vous pouvez alors utiliser l’accélération pour ajuster le
278
mouvement afin que l’accélération soit réaliste du début à la fin de l’interpolation.
Lorsque vous collez une trajectoire personnalisée sur une interpolation, Animate définit les images-clés de
propriété sur « itinérant » par défaut.
Pour activer les images-clés itinérantes pour toute une interpolation, procédez comme suit :
Cliquez avec le bouton droit de la souris (Windows) ou avec la touche Commande
(Macintosh) sur la plage d’interpolation dans le scénario, puis choisissez Trajectoire de
mouvement > Définir les images-clés sur itinérant dans le menu contextuel.
Pour activer l’itinérance d’une image-clé de propriété individuelle dans une interpolation, procédez comme
suit :
Cliquez avec le bouton droit de la souris (Windows) ou avec le bouton Commande
(Macintosh) sur l’image-clé de propriété dans l’Editeur de mouvement, puis choisissez
Itinérant dans le menu contextuel. Pour plus d’informations sur l’Éditeur de mouvement,
reportez-vous à la section Modification des courbes de propriété avec l’Éditeur de
mouvement.
Lorsque les images-clés de propriété sont définies sur Itinérant, elles apparaissent sous forme de points
ronds au lieu de carrés dans l’Editeur de mouvement.
Remarque : si vous activez les images-clés itinérantes d’une plage d’interpolation, puis que vous les
désactivez, elles conservent dans la plage leurs emplacements résultant de l’activation de l’itinérance.
Trajectoire de mouvement avec images-clés itinérantes désactivées. Remarquez la distribution inégale des
images qui provoque un mouvement de vitesse inégale.
Même trajectoire de mouvement avec l’itinérance des images-clés activée, résultant en une distribution égale
des images le long de la trajectoire et la même vitesse de mouvement.
Haut de la page
Modification des plages d’interpolation d’une animation dans le
scénario
279
Lors de la création d’une animation dans Animate, il est souvent approprié de commencer par définir des
plages d’interpolation dans le scénario. En établissant la disposition initiale des objets dans des images et
des calques, vous pouvez alors terminer les interpolations en modifiant les valeurs des propriétés interpolées
dans l’inspecteur des propriétés ou dans l’Editeur de mouvement.
Pour sélectionner des plages d’interpolation et des images dans le scénario, effectuez l’une des opérations
suivantes : Vérifiez que l’option Sélection basée sur plages est activée dans le panneau Préférences
générales (Modifier > Préférences).
Pour sélectionner l’ensemble d’une plage d’interpolation, cliquez sur cette dernière.
Pour sélectionner plusieurs plages d’interpolation, y compris des plages non contiguës,
cliquez sur chaque plage en maintenant la touche Maj enfoncée.
Pour sélectionner une seule image dans une plage d’interpolation, cliquez sur cette
image tout en appuyant sur les touches Ctrl+Alt (Windows) ou Commande+Option
(Macintosh).
Pour sélectionner plusieurs images contiguës dans une plage, faites glisser la souris à
l’intérieur de la plage tout en appuyant sur les touches Ctrl+Alt (Windows) ou
Commande+Option (Macintosh).
Pour sélectionner des images de plusieurs plages d'interpolation dans des calques
différents, faites glisser la souris sur plusieurs calques tout en appuyant sur les touches
Ctrl+Alt (Windows) ou Commande+Option (Macintosh).
Pour sélectionner une image-clé de propriété individuelle dans une plage d'interpolation,
cliquez sur cette image-clé de propriété tout en appuyant sur les touches Ctrl+Alt
(Windows) ou Commande+Option (Macintosh). Vous pouvez ensuite la faire glisser vers
un nouvel emplacement.
Une liste complète de modificateurs de clavier à utiliser avec les plages d’interpolation dans le scénario est
disponible sur Flashthusiast.com.
Déplacement, duplication ou suppression de plages d’interpolation
Pour déplacer une plage vers un nouvel emplacement du même calque, faites-la glisser.
Remarque : Le verrouillage d’un calque empêche de modifier la scène, mais pas le
scénario. Le déplacement d’une plage au-dessus d’une autre détruit les images qui se
chevauchent dans la seconde plage.
Pour déplacer une plage d’interpolation vers un autre calque, faites-la glisser vers le
calque ou copiez-la et collez-la dans le nouveau calque.
Vous pouvez faire glisser une plage d’interpolation vers un calque normal, un calque
d’interpolation, un calque de guide, un calque de masque ou un calque masqué. Si le
nouveau calque est un calque normal et vide, il devient un calque d’interpolation.
Pour dupliquer une plage, faites-la glisser vers son nouvel emplacement dans le scénario
en maintenant la touche Maj enfoncée (Windows) ou Commande (Macintosh), ou copiezla et collez-la.
Pour supprimer une plage, sélectionnez-la et choisissez Supprimer les images ou Effacer
les images dans le menu contextuel de la plage.
Modification de plages d’interpolation adjacentes
Pour déplacer la ligne séparant deux plages d’interpolation contiguës, faites glisser cette
ligne de séparation.
Chaque interpolation est alors recalculée.
Pour séparer les images adjacentes de début et de fin de deux plages d’interpolation
contiguës, faites glisser l’image de début de la seconde plage en maintenant la touche Alt
280
enfoncée (Windows) ou Commande (Macintosh).
Cette opération vous permet d’ajouter d’autres images entre les deux plages.
Pour diviser une plage d’interpolation en deux plages distinctes, cliquez en maintenant la
touche Ctrl (Windows) ou Commande (Macintosh) enfoncée sur une image dans la plage,
puis choisissez Diviser le mouvement dans le menu contextuel de la plage.
Les deux plages d’interpolation ont alors la même occurrence cible.
Remarque : Vous ne pouvez pas diviser un mouvement si plusieurs images sont
sélectionnées. Si une accélération était appliquée à l’interpolation divisée, il est possible
que le mouvement des deux interpolations plus petites ne soit pas exactement le même
que l’original.
Pour relier deux plages d’interpolation contiguës, sélectionnez-les et choisissez Joindre
les mouvements dans le menu contextuel de la plage.
Modification de la longueur d’une plage d’interpolation
Pour modifier la longueur d’une animation, faites glisser l’extrémité (droite ou gauche) de
la plage d’interpolation.
Le glissement de l’extrémité d’une plage dans les images d’une autre plage remplace ces
dernières dans la seconde plage.
Pour étendre la présence d’un objet interpolé sur la scène au-delà de l’une des
extrémités de son interpolation, faites glisser l’image d’une des extrémités de sa plage
d’interpolation en maintenant la touche Maj enfoncée. Animate ajoute des images à la fin
de la plage sans les interpoler.
Vous pouvez également sélectionner une image située après la plage d’interpolation
dans le même calque et appuyer sur F6.Animate étend la plage d’interpolation et ajoute
une image-clé de propriété pour toutes les propriétés de l’image sélectionnée. Si vous
appuyez sur la touche F5, Animate ajoute des images, mais pas d’image-clé de propriété
à l’image-clé sélectionnée.
Remarque : Pour ajouter des images statiques à la fin d’une plage concomitante à une
autre plage, commencez par déplacer la plage adjacente pour faire de la place aux
nouvelles images.
Ajout ou suppression d’images dans une plage d’interpolation
Pour supprimer des images dans une plage, faites glisser la souris en maintenant la
touche Ctrl (Windows) ou Commande (Macintosh) enfoncée pour sélectionner des
images, puis choisissez Supprimer les images dans le menu contextuel de la plage.
Pour couper des images dans une plage, faites glisser la souris en maintenant la touche
Ctrl (Windows) ou Commande (Macintosh) enfoncée pour sélectionner les images, puis
choisissez Couper les images dans le menu contextuel de la plage.
Pour coller des images dans une plage d’interpolation existante, faites glisser la souris en
maintenant la touche Ctrl (Windows) ou Commande (Macintosh) enfoncée pour
sélectionner les images à remplacer, puis choisissez Coller les images dans le menu
contextuel de la plage.
Le fait de coller simplement l’ensemble d’une plage sur une autre remplace la totalité de
la seconde plage.
Remplacement ou suppression de l’occurrence cible d’une interpolation
Pour remplacer l’occurrence cible d’une plage d’interpolation, effectuez l’une des opérations suivantes :
281
Sélectionnez la plage et faites glisser le nouveau symbole du panneau Bibliothèque vers
la scène.
Sélectionnez le nouveau symbole dans le panneau Bibliothèque et l’occurrence cible de
l’interpolation sur la scènescène, puis choisissez Modification > Symbole > Permuter le
symbole.
Sélectionnez la plage, puis collez une occurrence de symbole ou du texte depuis le
Presse-papiers.
Pour supprimer l’occurrence cible d’une plage d’interpolation sans supprimer l’interpolation elle-même,
sélectionnez la plage et appuyez sur la touche Suppr.
Affichage et modification des images-clés de propriété d’une plage
d’interpolation
Pour afficher les images-clés de propriété contenant des images dans une plage pour
différentes propriétés, sélectionnez la plage et choisissez Afficher les images-clés dans le
menu contextuel de la plage, puis le type de propriété dans le sous-menu.
Pour supprimer une image-clé de propriété dans une plage, cliquez sur l’image-clé de
propriété en appuyant sur la touche Ctrl (Windows) ou Commande (Macintosh) pour la
sélectionner, puis avec le bouton droit de la souris (Windows) ou avec la touche Contrôle
(Macintosh) et choisissez Supprimer l’image-clé pour le type de propriété dont vous
souhaitez supprimer l’image-clé.
Pour ajouter des images-clés de propriété d’un type spécifique à une plage, appuyez sur
la touche Ctrl (Windows) ou Commande (Macintosh), puis cliquez sur une ou plusieurs
images de la plage pour les sélectionner. Cliquez ensuite avec le bouton droit de la souris
(Windows) ou avec la touche Ctrl (Macintosh) et choisissez Insérer une image-clé > type
de propriété dans le menu contextuel de la plage. Animate ajoute des images-clés de
propriété aux images sélectionnées. Vous pouvez également définir une propriété d’une
occurrence cible dans une image sélectionnée pour ajouter une image-clé de propriété.
Pour ajouter une image-clé de propriété pour tous les types de propriété à une plage,
placez la tête de lecture dans l’image qui doit recevoir l’image-clé, puis choisissez
Insérer > Scénario > Image-clé ou appuyez sur F6.
Pour inverser le sens d’une interpolation, choisissez Trajectoire de mouvement > Inverser
le tracé dans le menu contextuel de la plage.
Pour transformer une plage d’interpolation en images statiques, sélectionnez la plage et
choisissez Annuler l’interpolation dans le menu contextuel.
Pour convertir une plage d’interpolation en animation image par image, sélectionnez la
plage, puis choisissez Convertir en animation image par image dans le menu contextuel
de la plage.
Pour déplacer une image-clé de propriété vers une autre image de la même plage
d’interpolation ou vers une autre plage d’interpolation, cliquez sur l’image-clé de propriété
en appuyant sur Ctrl (Windows) ou Commande (Macintosh) pour la sélectionner, puis
faites-la glisser vers son nouvel emplacement.
Pour copier une image-clé de propriété vers un autre emplacement dans la plage
d’interpolation, cliquez sur son entrée en maintenant la touche Ctrl (Windows) ou
Commande (Macintosh) pour la sélectionner, puis faites-la glisser en maintenant la
touche Alt enfoncée (Windows) ou Option (Macintosh) vers son nouvel emplacement.
Ajout ou retrait d’images-clés de propriété 3D dans une interpolation
Effectuez l’une des opérations suivantes :
Ajoutez des propriétés 3D à l’aide des outils 3D du panneau Outils.
Cliquez avec le bouton droit de la souris (Windows) ou avec la touche Ctrl
282
(Macintosh) sur la plage d’interpolation dans le scénario, puis choisissez Interpolation
3D dans le menu contextuel.
Si la plage d’interpolation ne contient aucune image-clé de propriété 3D, Animate les
ajoute à chaque image-clé de propriété de position et de rotation X et Y existante. Si
la plage d’interpolation contient déjà des images-clés de propriété 3D, Animate les
supprime.
Déplacement ou duplication d'une plage d'interpolation
Vous pouvez déplacer ou dupliquer des plages d’interpolation ou des parties de plages d’interpolation en les
faisant glisser vers le panneau Scénario.
Faites glisser une plage d’interpolation pour la déplacer vers un autre emplacement dans
le scénario.
Faites glisser une plage d’interpolation tout en appuyant sur la touche Alt pour la
dupliquer sur un autre emplacement dans le scénario.
Copie et collage d’une interpolation de mouvement
Vous pouvez copier les propriétés interpolées d’une plage d’interpolation vers une autre. Les propriétés
interpolées sont appliquées au nouvel objet cible, sans modifier l’emplacement de celui-ci. Vous pouvez ainsi
appliquer une interpolation d’une zone de la scène à un objet d’une autre zone sans repositionner le nouvel
objet cible.
1. Sélectionnez la plage d’interpolation contenant les propriétés interpolées que vous
souhaitez copier.
2. Choisissez Modifier > Scénario > Copier le mouvement.
3. Sélectionnez la plage d’interpolation devant recevoir l’interpolation copiée.
4. Choisissez Modifier > Scénario > Coller le mouvement.
Animate applique les propriétés interpolées à la plage d’interpolation cible et ajuste la
longueur de la plage d’interpolation en fonction de celle de la plage copiée.
Pour copier une interpolation de mouvement dans le panneau Actions ou l’utiliser dans
un autre projet en tant que code ActionScript®, vous pouvez utiliser la commande Copier
le mouvement en tant qu’ActionScript 3.0.
Copier-coller de propriétés d’interpolation de mouvement
Vous pouvez copier les propriétés d’une image sélectionnée vers une autre dans la même plage
d’interpolation ou dans une autre. Lorsque les propriétés sont collées, leurs valeurs ne sont ajoutées qu’à
l’image sélectionnée. Les valeurs de propriété copiées pour des effets de couleur, des filtres et des
propriétés 3D ne sont collées que si ces éléments sont déjà appliqués à l’objet interpolé dans cette image.
Les propriétés de position 2D ne peuvent pas être collées dans une interpolation 3D.
Vous devez vous assurer que l’option Sélection basée sur plages est activée dans les préférences
(Modifier > Préférences).
1. Pour sélectionner une seule image dans une plage d’interpolation, cliquez sur cette
image tout en appuyant sur la touche Ctrl (Windows) ou Commande (Macintosh).
2. Cliquez sur l’image sélectionnée avec le bouton droit de la souris (Windows) ou en
appuyant sur la touche Ctrl (Macintosh) et choisissez Copier les propriétés dans le menu
contextuel.
283
3. Pour sélectionner une seule image et recevoir les propriétés copiées, cliquez sur son
entrée tout en appuyant sur les touches Ctrl+Alt (Windows) ou Commande+Option
(Macintosh).
L’image cible doit être dans une plage d’interpolation.
4. Pour coller les propriétés copiées dans l’image sélectionnée, effectuez l’une des
opérations suivantes :
Pour coller toutes les propriétés copiées, cliquez sur l’image sélectionnée dans la
plage d’interpolation cible avec le bouton droit de la souris (Windows) ou en
appuyant sur la touche Commande (Macintosh), puis choisissez Coller les propriétés
dans le menu contextuel.
Pour ne coller que certaines des propriétés copiées, cliquez sur l’image sélectionnée
dans la plage d’interpolation cible avec le bouton droit de la souris (Windows) ou en
appuyant sur la touche Commande (Macintosh), puis choisissez Coller les propriétés
spéciales dans le menu contextuel. Dans la boîte de dialogue qui apparaît,
sélectionnez les propriétés à coller, puis cliquez sur OK.
Animate crée une image-clé de propriété pour chaque propriété collée dans l’image sélectionnée et
recommence l’interpolation de mouvement.
Conversion d’une plage d’interpolation en animation image par image
Vous pouvez convertir une plage d’interpolation classique ou de mouvement en animation image par image.
Dans l’animation image par image, chaque image contient des images-clés distinctes (pas des images-clés
de propriété), qui contiennent elles-mêmes des occurrences distinctes du symbole animé. Une animation
image par image ne contient pas de valeurs de propriété interpolées. Pour plus d’informations, voir Animation
image par image.
Pour convertir la plage d’interpolation désirée, cliquez avec le bouton droit de la souris
(Windows) ou avec la touche Ctrl (Macintosh) sur son entrée, puis choisissez Convertir
en animation image par image dans le menu contextuel.
(Abandonné dans Animate CC) Copier le mouvement au format
ActionScript 3.0
Copiez les propriétés qui définissent l’interpolation de mouvement du scénario en tant que code
ActionScript 3.0 et appliquez le mouvement à un autre symbole, soit dans le panneau Actions, soit dans les
fichiers sources (tels que les fichiers de classe) d’un document Animate qui utilise ActionScript 3.0.
Utilisez les classes fl.motion pour personnaliser le code ActionScript généré par Animate pour votre projet
spécifique. Pour plus d’informations, voir les classes fl.motion dans le Guide de référence du langage
ActionScript 3.0.
La commande Copier le mouvement en tant qu’ActionScript 3.0 peut capturer les propriétés suivantes d’une
interpolation de mouvement :
Position
Echelle
Inclinaison
Rotation
Point de transformation
Couleur
Mode de fusion
284
Orientation vers la trajectoire
Mise en cache en tant que paramétrage de bitmap
Accélération
Filtres
Rotation 3D et position
1. Sélectionnez la plage d’interpolation du scénario ou l’objet sur la scène qui contient
l’interpolation de mouvement à copier.
Une seule plage d’interpolation ou un seul objet interpolé peut être sélectionné pour être
copié en tant qu’ActionScript 3.0.
2. Effectuez l’une des opérations suivantes :
Choisissez Modifier > Scénario > Copier le mouvement en tant qu’ActionScript 3.0.
Cliquez avec le bouton droit de la souris (Windows) ou en appuyant sur la touche
Contrôle (Macintosh) sur la plage d’interpolation ou sur l’occurrence interpolée sur la
scène et choisissez Copier le mouvement en tant qu’ActionScript 3.0.
Animate copie le code ActionScript 3.0 qui décrit l’interpolation de mouvement
sélectionnée dans le Presse-papiers de votre système. Le code décrit l’interpolation sous
la forme d’une animation image par image.
Pour utiliser le code copié, collez-le dans le panneau Actions d’un document Animate
contenant une occurrence du symbole devant recevoir l’interpolation copiée. Supprimez
les commentaires de la ligne qui appellent la fonction addTarget() et remplacez le
texte <instance name goes here> dans cette ligne par celui de l’occurrence du
symbole que vous souhaitez animer.
Pour nommer l’occurrence du symbole à animer avec le code ActionScript collé,
sélectionnez l’occurrence sur la scène et entrez le nom dans l’inspecteur des propriétés.
Vous pouvez également nommer une occurrence d’interpolation de mouvement en
sélectionnant la plage interpolation dans le scénario et en saisissant un nom dans
l’inspecteur des propriétés. Vous pouvez alors référencer la plage d’interpolation dans le
code ActionScript 3.0.
Pour plus d’informations sur l’animation avec ActionScript 3.0, voir les classes
fl.motion dans le Guide de référence du langage et des composants ActionScript 3.0.
Haut de la page
Utilisation d’interpolations de mouvement enregistrées au format
XML
Animate permet d’utiliser des interpolations de mouvement sous la forme de fichiers XML. Animate permet
d’appliquer les commandes suivantes à n’importe quelle interpolation de mouvement :
Copier le mouvement au format XML
Exporter le mouvement au format XML
Importer le mouvement au format XML
Copier le mouvement au format XML
Permet de copier les propriétés du mouvement appliquées à un objet sur la scène sur une image particulière.
1. Création d’une interpolation de mouvement
2. Sélectionnez une image-clé dans le scénario.
3. Sélectionnez Commandes > Copier le mouvement au format XML.
Les propriétés du mouvement sont copiées dans le Presse-papiers sous forme de données XML ; vous
pouvez alors utiliser un éditeur de texte pour travailler directement sur le fichier XML.
Exporter le mouvement au format XML
285
Permet d’exporter les propriétés de mouvement appliquées à un objet sur la scène dans un fichier XML
pouvant être enregistré.
1. Création d’une interpolation de mouvement
2. Sélectionnez Commandes > Exporter le mouvement au format XML.
3. Accédez à l’emplacement où vous souhaitez enregistrer le fichier.
4. Attribuez un nom au fichier XML et cliquez sur Enregistrer.
L’interpolation de mouvement est exportée au format XML à l’emplacement spécifié.
Importer le mouvement au format XML
Permet d’importer un fichier XML existant dont les propriétés de mouvement ont été définies.
1. Sélectionnez un objet sur la scène.
2. Sélectionnez Commandes > Importer le mouvement au format XML.
3. Accédez à l’emplacement du fichier XML et sélectionnez ce dernier. Cliquez sur OK.
4. Dans la boîte de dialogue Coller le mouvement spécial, sélectionnez les propriétés que
vous souhaitez appliquer à l’objet sélectionné.
5. Cliquez sur OK.
Voir aussi
Utilisation d’animations interpolées classiques
Vidéo : Création d’animations avec l’Éditeur de mouvement
Modification des interpolations de mouvement avec l’Editeur de mouvement
Principes de base des animations
Animation image par image
Animation de personnages dans Animate
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
286
Modification des interpolations de mouvement avec l’Éditeur de
mouvement
L’Éditeur de mouvement d’Animate CC permet de créer des interpolations de mouvement complexes avec un
minimum d’efforts. L’Éditeur de mouvement présente une vue compacte de toutes les propriétés appliquées à
une plage d’interpolation sélectionnée sous forme de graphiques bidimensionnels. Vous pouvez modifier
chacun de ces graphiques, et par conséquent leurs propriétés interpolées correspondantes individuellement.
Grâce à un contrôle précis et à un niveau de détail élevé, vous pouvez considérablement enrichir vos
animations afin de simuler le comportement réel à l’aide de l’Éditeur de mouvement.
Éditeur de mouvement
Pourquoi utiliser l’Éditeur de mouvement ?
Ouverture du panneau Éditeur de mouvement
Courbes de propriété
Points d’ancrage
Points de contrôle
Modification des courbes de propriété
Modification des courbes de propriété à l’aide des points de contrôle
Copie des courbes de propriété
Inversion d’une courbe de propriété
Application des accélérations présélectionnées et personnalisées
Accélérations personnalisées
Application de la courbe d’accélération sur une courbe de propriété
Création et application de courbes d’accélération personnalisées
Copie des courbes d’accélération
Application de l’accélération à plusieurs propriétés
Courbe résultante
Contrôle de l’affichage de l’Éditeur de mouvement
Raccourcis clavier
Haut de la page
Éditeur de mouvement
L’Éditeur de mouvement a pour but de vous aider à créer des interpolations complexes. Il vous permet de
contrôler et de manipuler les propriétés d’une interpolation. Après avoir créé une interpolation de mouvement,
vous pouvez la perfectionner à l’aide de l’Éditeur de mouvement, qui vous permet de sélectionner et de
modifier une seule propriété à la fois.
Pourquoi utiliser l’Éditeur de mouvement ?
L’Éditeur de mouvement a été conçu pour vous aider à créer des interpolations complexes. Il permet ainsi de
contrôler précisément l’interpolation et ses propriétés. L’Éditeur de mouvement offre les avantages suivants :
Sélection et modification faciles de toutes les propriétés appliquées à une interpolation
dans un seul panneau.
Ajout de différentes accélérations présélectionnées ou personnalisées : avec
287
l’Éditeur de mouvement, vous pouvez ajouter différentes ou plusieurs présélections, ou
encore créer une accélération personnalisée. L’ajout d’une accélération à une propriété
interpolée permet de simuler facilement le comportement réel des objets.
Courbe résultante : appliquez des accélérations à des propriétés individuelles et
visualisez leurs effets sur des graphiques de propriétés individuelles à l’aide de la courbe
résultante. Une courbe résultante est une représentation de l’interpolation réelle.
Points d’ancrage et points de contrôle : isolez et modifiez des sections clés d’une
interpolation en utilisant les points d’ancrage et les points de contrôle.
Animations affinées : l’Éditeur de mouvement constitue le seul moyen de créer certains
types d’animations, telle une interpolation de tracé incurvé sur une propriété individuelle
en adaptant sa courbe de propriété.
(A) Propriétés appliquées à l’interpolation (B) Bouton Ajouter un point d’ancrage (C) Activer/désactiver l’option
Ajuster à la vue (D) Bouton Supprimer la propriété (E) Ajouter une accélération (F) Activer/désactiver le zoom
vertical
Haut de la page
Ouverture du panneau Éditeur de mouvement
Dans cet article, on suppose que vous avez déjà créé une interpolation de mouvement et que vous utilisez
l’Éditeur de mouvement pour affiner l’interpolation. Pour plus d’informations sur la création d’une interpolation
de mouvement, voir Animation d’interpolations de mouvement.
Pour ouvrir l’Éditeur de mouvement, procédez comme suit :
1. Dans le montage, sélectionnez la plage d’interpolation de mouvement à affiner, puis
double-cliquez sur la plage d’interpolation. Vous pouvez également cliquer avec le
bouton droit sur la plage d’interpolation et sélectionner Améliorer l’interpolation pour
ouvrir l’Éditeur de mouvement.
Haut de la page
Courbes de propriété
L’Éditeur de mouvement représente les propriétés d’une interpolation à l’aide de graphiques bidimensionnels
288
appelés Courbes de propriété. Ces graphiques sont composés dans une grille de l’Éditeur de mouvement.
Chaque propriété possède sa propre courbe de propriété associée au temps sur l’axe horizontal (de gauche
à droite) et au changement de valeur de propriété sur l’axe vertical.
Pour manipuler des interpolations de mouvement, modifiez les courbes de propriété dans l’Éditeur de
mouvement. Au final, l’Éditeur de mouvement facilite la modification des courbes de propriété et vous donne
un contrôle plus précis sur les interpolations. Vous pouvez manipuler une courbe de propriété en ajoutant des
images-clés de propriété ou des points d’ancrage. Vous pouvez ainsi manipuler les parties fondamentales de
la courbe de propriété, là où l’interpolation doit afficher les transitions de ladite propriété.
Remarque : L’Éditeur de mouvement vous permet de modifier uniquement des propriétés modifiables
pendant une plage d’interpolation. Par exemple, une seule valeur peut être attribuée à la propriété Qualité du
filtre Biseau dégradé durant une plage d’interpolation ; par conséquent, la propriété Qualité du filtre ne peut
pas être modifiée à l’aide de l’Éditeur de mouvement.
(A) Courbes de propriété superposées les unes sur les autres. (B) Courbe de propriété correspondant à la
propriété actuellement sélectionnée.
Points d’ancrage
Les points d’ancrage optimisent le contrôle des courbes de propriété, en vous permettant de modifier
explicitement les parties fondamentales d’une courbe. Vous pouvez contrôler avec précision la forme de la
plupart des courbes dans l’Éditeur de mouvement en ajoutant des images-clés de propriété ou des points
d’ancrage.
Les points d’ancrage sont représentés par des carrés sur la grille. Dans l’Éditeur de mouvement, vous
pouvez contrôler le comportement de l’interpolation en ajoutant des points d’ancrage à une courbe de
propriété ou en modifiant leurs positions. L’ajout d’un point d’ancrage crée un coin, là où la courbe traverse
des angles. Cependant, vous pouvez lisser un segment d’une courbe de propriété à l’aide des contrôles
Bézier des points de contrôle.
Points de contrôle
289
Les points de contrôle permettent de lisser ou de modifier une courbe de propriété sur les côtés d’un point
d’ancrage. Ils peuvent être modifiés à l’aide des contrôles Bézier standard.
Modification des courbes de propriété
Pour modifier les propriétés d’une interpolation, procédez comme suit :
1. Dans Animate CC, avec une plage d’interpolation sélectionnée, cliquez avec le bouton
droit > sélectionnez Améliorer l’interpolation pour ouvrir l’Éditeur de mouvement (ou
double-cliquez simplement sur la plage d’interpolation sélectionnée).
2. Faites défiler la page et sélectionnez la propriété à modifier. Pour inverser la sélection,
cliquez avec le bouton droit de la souris et sélectionnez Inverser la sélection.
3. Avec la courbe de propriété de la propriété sélectionnée dans la vue, vous pouvez
procéder de l’une des manières suivantes :
puis sur une image sur la
a. Ajoutez un point d’ancrage en cliquant sur le bouton
courbe de propriété pour ajouter un point d’ancrage. Ou double-cliquez sur la courbe
pour ajouter un point d’ancrage.
b. Sélectionnez et déplacez un point d’ancrage existant (dans n’importe quel sens)
vers une image souhaitée sur la grille. La limite verticale du mouvement est
restreinte à la plage des valeurs de la propriété.
c. Supprimez un point d’ancrage en cliquant dessus tout en appuyant sur Ctrl
(Commande sur Mac).
Modification des courbes de propriété à l’aide des points de contrôle
Pour modifier des courbes de propriété avec des points de contrôle, procédez comme suit :
1. Dans Animate CC, avec une plage d’interpolation sélectionnée, cliquez avec le bouton
droit > sélectionnez Améliorer l’interpolation pour ouvrir l’Éditeur de mouvement (ou
double-cliquez sur la plage d’interpolation sélectionnée).
2. Faites défiler la page et sélectionnez la propriété à modifier. Pour inverser la sélection,
cliquez avec le bouton droit de la souris et sélectionnez Inverser la sélection.
3. Avec la courbe de propriété de la propriété sélectionnée dans la vue, vous pouvez
procéder de l’une des manières suivantes :
et en cliquant sur une image
a. Ajoutez un point d’ancrage en cliquant sur le bouton
dans la grille pour ajouter un point d’ancrage.Ou double-cliquez sur la courbe pour
ajouter un point d’ancrage.
OU
b. Sélectionnez un point d’ancrage existant sur la grille.
4. Faites glisser verticalement le point d’ancrage sélectionné en appuyant sur la touche Alt
pour activer les points de contrôle. Vous pouvez modifier la forme de la courbe afin de
lisser les segments angulaires à l’aide des contrôles Bézier.
290
Copie des courbes de propriété
Vous pouvez également copier les courbes de propriété sur plusieurs propriétés dans l’Éditeur de
mouvement.
Pour copier une courbe de propriété, procédez comme suit :
1. Dans Animate CC, avec une plage d’interpolation sélectionnée, cliquez avec le bouton
droit > sélectionnez Améliorer l’interpolation pour ouvrir l’Éditeur de mouvement (ou
double-cliquez sur la plage d’interpolation sélectionnée).
2. Sélectionnez la propriété dont vous souhaitez copier la courbe, puis cliquez avec le
bouton droit > Copier OU appuyez sur Ctrl + C (Commande + C sur Mac).
3. Pour coller la courbe avec des valeurs absolues, sélectionnez la propriété sur laquelle
vous souhaitez coller la courbe de propriété copiée, puis cliquez avec le bouton droit >
Coller ou appuyez sur Ctrl + V (Commande + V sur Mac).
4. Pour coller la courbe dans la plage de la courbe cible, sélectionnez la propriété sur
laquelle coller la courbe de propriété copiée, puis cliquez avec le bouton droit > Coller
pour adapter la plage actuelle.
Inversion d’une courbe de propriété
Pour inverser une courbe de propriété, procédez comme suit :
1. Dans l’Éditeur de mouvement, sélectionnez une propriété.
2. Cliquez avec le bouton droit > Inverser pour inverser la courbe de propriété.
Haut de la page
Application des accélérations présélectionnées et personnalisées
L’accélération permet de contrôler la vitesse d’une interpolation afin de générer des mouvements réalistes
avec des effets agréables. En appliquant des accélérations sur les interpolations de mouvement, vous
pouvez manipuler les parties du début et de la fin d’une animation afin d’obtenir un mouvement de l’objet plus
naturel. Par exemple, les accélérations sont fréquemment utilisées pour ajouter une accélération et une
décélération réalistes aux extrémités de la trajectoire d’un objet. En résumé, Animate CC altère le degré de
changement de la valeur de propriété selon l’accélération qui lui est appliquée.
Une accélération peut être simple ou complexe. Animate propose une vaste gamme d’accélérations
prédéfinies que vous pouvez appliquer pour obtenir des effets simples ou complexes. Vous pouvez
également définir la valeur Intensité afin d’améliorer l’aspect visuel d’une interpolation. L’Éditeur de
mouvement vous permet également de créer vos propres courbes d’accélération personnalisées.
Étant donné que les courbes d’accélération dans l’Éditeur de mouvement peuvent être complexes, vous
pouvez les utiliser pour créer un mouvement complexe sur la scène sans avoir à créer de trajectoires de
mouvement complexes sur celle-ci. Vous pouvez également utiliser les courbes d’accélération pour créer des
interpolations complexes de l’une des autres propriétés en plus des propriétés spatiales, tel l’emplacement X
et Y.
Courbe tracée pour l’accélération prédéfinie de rebond
291
Accélérations personnalisées
L’accélération personnalisée vous permet de créer votre propre accélération à l’aide de la courbe
Accélération personnalisée dans l’Éditeur de mouvement. Vous pouvez ensuite appliquer l’accélération
personnalisée à toute propriété d’une interpolation sélectionnée.
Le graphe d’accélération personnalisée représente le degré du mouvement au fil du temps. Les images sont
représentées par l’axe horizontal et le pourcentage de changement de l’interpolation est représenté par l’axe
vertical. La première valeur dans l’animation équivaut à 0 % ; la valeur de la dernière image clé peut être
comprise entre 0 et 100 %. Le degré de changement de l’occurrence interpolée est représenté par
l’inclinaison de la courbe du graphe. Si vous créez une ligne horizontale (aucune inclinaison) sur le graphe, la
vélocité est égale à zéro ; si vous créez une ligne verticale, un degré de changement se produit
instantanément.
Application de la courbe d’accélération sur une courbe de propriété
Pour ajouter une accélération à une propriété interpolée, procédez comme suit :
1. Dans l’Éditeur de mouvement, sélectionnez la propriété pour laquelle appliquer
l’accélération, puis cliquez sur le bouton Ajouter une accélération pour afficher le
panneau Accélération.
2. Dans le panneau d’accélération, vous pouvez :
a. Appliquer une accélération prédéfinie en sélectionnant un paramètre prédéfini dans
le volet gauche. Spécifiez l’intensité d’accélération en entrant une valeur dans le
champ Accélération.
b. Créer une accélération personnalisée en sélectionnant l’accélération personnalisée
dans le volet de gauche et en modifiant la courbe d’accélération. Pour plus
d’informations, voir Création et application de courbes d’accélération personnalisées.
3. Cliquez n’importe où en dehors du panneau d’accélération pour le fermer. Vous
constaterez que le bouton Ajouter une accélération indique le nom de l’accélération que
vous avez appliquée à la propriété.
Création et application de courbes d’accélération personnalisées
Pour créer et appliquer une accélération personnalisée à une propriété interpolée, procédez comme suit :
1. Dans l’Éditeur de mouvement, sélectionnez la propriété pour laquelle appliquer
l’accélération personnalisée, puis cliquez sur le bouton Ajouter une accélération pour
afficher le panneau d’accélération.
2. Dans le panneau Accélération, vous pouvez modifier la courbe d’accélération
personnalisée par défaut comme suit :
a. Appuyez sur Alt + cliquez pour ajouter des points d’ancrage sur la courbe. Vous
pouvez en outre déplacer ces points vers n’importe quel point de la grille.
b. Activez les points de contrôle (Alt + clic sur un point d’ancrage) sur un point
d’ancrage pour lisser les segments incurvés sur les côtés d’un point d’ancrage.
292
3. Cliquez en dehors du panneau d’accélération pour le fermer. Vous constaterez que le
bouton Ajouter une accélération indique Personnalisé, ce qui signifie que vous avez
appliqué une accélération personnalisée à la propriété.
Copie des courbes d’accélération
Pour copier une courbe d’accélération, procédez comme suit :
1. Sur le panneau Accélération, sélectionnez la courbe d’accélération à copier, puis
appuyez sur Ctrl + C (Commande + C sur Mac).
2. Sélectionnez la propriété sur laquelle vous souhaitez coller la courbe d’accélération
copiée, puis appuyez sur Ctrl + V (Commande + V sur Mac).
Application de l’accélération à plusieurs propriétés
Vous pouvez désormais appliquer une accélération prédéfinie ou personnalisée aux groupes de propriétés.
L’Éditeur de mouvement classe les propriétés de manière hiérarchique dans des groupes et des sousgroupes de propriétés. Dans cette hiérarchie, vous pouvez appliquer l’accélération à n’importe quel niveau,
aux propriétés individuelles comme aux groupes de propriétés.
Remarque : Après avoir appliqué une accélération à un groupe de propriétés, vous pouvez continuer à
modifier individuellement les sous-propriétés. Cela signifie également que vous pouvez appliquer une
accélération distincte (de celle du groupe) à une sous-propriété.
Pour appliquer une accélération à plusieurs propriétés, procédez comme suit :
1. Dans l’Éditeur de mouvement, sélectionnez le groupe de propriétés, puis cliquez sur le
bouton Ajouter une accélération pour afficher le panneau Accélération.
2. Dans le panneau Accélération, sélectionnez une accélération prédéfinie ou créez une
accélération personnalisée. Cliquez n’importe où en dehors du panneau Accélération
pour appliquer l’accélération sélectionnée au groupe de propriétés.
Haut de la page
Courbe résultante
Lorsque vous appliquez une courbe d’accélération à une courbe de propriété, une superposition visuelle,
appelée courbe résultante, apparaît sur la grille. Il s’agit d’une représentation précise de l’effet de
l’accélération appliquée à une courbe de propriété, qui reflète l’animation finale de l’objet interpolé. La courbe
résultante permet de mieux comprendre l’effet que vous voyez sur la scène lors du test de l’animation.
293
(A) Courbe résultante pour l’accélération présélectionnée Rebond avant appliquée à la propriété de
l’emplacement X.
Haut de la page
Contrôle de l’affichage de l’Éditeur de mouvement
L’Éditeur de mouvement vous permet de contrôler quelles courbes de propriété afficher pour les modifier,
ainsi que la taille d’affichage de chacune d’elles. Les courbes de propriétés affichées en grande taille sont
plus faciles à modifier.
Le nouvel Éditeur de mouvement affiche uniquement les propriétés appliquées à une
interpolation.
Activez/désactivez l’option Ajuster à la vue (
largeur du scénario.
) pour adapter l’Éditeur de mouvement à la
Ajustez la taille de l’Éditeur de mouvement et choisissez d’afficher moins ( ) ou plus
d’images ( ) à l’aide des commandes de zoom du scénario. Vous pouvez également
définir une vue appropriée de l’Éditeur de mouvement à l’aide du curseur.
L’Éditeur de mouvement est également équipé d’un bouton d’activation/désactivation du
zoom vertical. Utilisez le zoom vertical pour afficher une plage adaptée des valeurs de
propriété dans l’Éditeur de mouvement. Le zoom avant permet de modifier plus
précisément une courbe de propriété.
Par défaut, les propriétés sont développées dans le volet gauche de l’Éditeur de
mouvement. Pour réduire la liste hiérarchique, cliquez sur un nom de propriété.
Haut de la page
Raccourcis clavier
Double-cliquez – sur une courbe de propriété pour ajouter un point d’ancrage.
Alt+faire glisser – un point d’ancrage pour activer les points de contrôle.
Alt+faire glisser – pour manipuler un point de contrôle sélectionné (édition d’un seul côté).
Alt+clic – sur un point d’ancrage pour désactiver les points de contrôle (point d’angle).
294
Maj+faire glisser – pour déplacer un point d’ancrage dans un sens linéaire.
Commande/Ctrl+clic – pour supprimer un point d’ancrage.
Touches fléchées Haut/Bas – pour déplacer verticalement un point d’ancrage sélectionné.
Commande/Ctrl+C/V – pour copier/coller une courbe sélectionnée.
Commande/Ctrl+R – pour inverser une courbe sélectionnée.
Commande/Ctrl+Défil. – pour effectuer un zoom avant ou arrière.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
295
Interpolation de forme
Interpolations de forme
Création d’une interpolation de forme
Contrôle des modifications de formes avec des repères de formes
Interpolation de forme des traits à l’aide de l’épaisseur variable
Haut de la page
Interpolations de forme
Avec l’interpolation de forme, vous dessinez une forme vectorielle dans une image spécifique du scénario,
puis vous modifiez cette forme ou en dessinez une autre dans une autre image. Animate interpole ensuite les
formes intermédiaires pour les images intermédiaires, créant ainsi l’animation en transformant
progressivement une forme en une autre.
Animate vous permet d’ajouter des interpolations de forme aux traits continus uniformes ainsi qu’aux traits
fantaisie non uniformes. Vous pouvez également ajouter des interpolations de forme aux traits améliorés à
l’aide de l’outil Épaisseur variable. Procédez à des essais avec les formes à utiliser afin d’évaluer les
résultats. Vous pouvez utiliser des repères de forme pour indiquer à Animate quels points du début de la
forme doivent correspondre à certains points de la fin de la forme.
Vous pouvez également interpoler la position et la couleur des formes dans une interpolation de formes.
Pour appliquer une interpolation de forme à des groupes, des occurrences ou des images bitmap, vous
devez tout d’abord séparer ces éléments. Voir Séparation d’une occurrence de symbole.
Pour appliquer l’interpolation de forme à du texte, vous devez le séparer en deux afin de le convertir en
objets. Voir Séparation d’une occurrence de symbole.
Haut de la page
Création d’une interpolation de forme
La procédure suivante montre comment créer une interpolation de formes de l’image 1 à l’image 30 du
scénario. Toutefois, vous pouvez créer des interpolations dans la partie de votre choix au sein du scénario.
1. Dans l’image 1, dessinez un carré avec l’outil Rectangle.
2. Sélectionnez l’image 30 du même calque, puis ajoutez une image-clé vierge en
choisissant Insérer > Scénario > Image-clé vide ou en appuyant sur F7.
3. Sur la scène, dessinez un cercle avec l’outil Ovale dans l’image 30.
Vous devriez obtenir une image-clé dans l’image 1 avec un carré et une image-clé dans
l’image 30 avec un cercle.
4. Dans le scénario, sélectionnez l’une des images situées entre les deux images-clés du
calque contenant les deux formes.
5. Choisissez Insérer > Interpolation de forme.
Animate interpole les formes dans toutes les images situées entre les deux images-clés.
6. Pour obtenir un aperçu de l’interpolation, faites défiler la tête de lecture à travers les
images dans le scénario, ou appuyez sur Entrée.
296
7. Pour interpoler le mouvement en plus de la forme, déplacez cette dernière jusqu’à
l’image 30 dans un endroit de la scène différent de l’emplacement de la forme dans
l’image 1.
Pour voir un aperçu de l’animation, appuyez sur Entrée.
8. Pour interpoler la couleur de la forme, sa couleur dans l’image 1 doit être différente de
celle dans l’image 30.
9. Pour ajouter une accélération à l’interpolation, sélectionnez l’une des images situées
entre les deux images-clés, puis entrez une valeur dans le champ Accélération de
l’inspecteur des propriétés.
Entrez une valeur négative pour accélérer le début de l’interpolation. Entrez une valeur
positive pour accélérer la fin de l’interpolation.
Haut de la page
Contrôle des modifications de formes avec des repères de formes
Vous pouvez utiliser des repères de formes pour contrôler des modifications de forme plus complexes ou
improbables. Les repères de formes identifient les points qui doivent correspondre dans les formes de début
et de fin. Par exemple, si vous interpolez le dessin d’un visage à mesure que l’expression change, vous
pouvez utiliser un repère de forme pour marquer chaque œil. Puis, au lieu que le visage devienne un
enchevêtrement amorphe au fur et à mesure de la modification de la forme, chaque œil reste reconnaissable
et est modifié séparément.
Les repères de formes contiennent des lettres (de a à z) permettant d’identifier les points qui correspondent
dans les formes de début et de fin. Vous pouvez utiliser jusqu’à 26 repères de formes.
Les repères de formes sont jaunes dans une image-clé de début, verts dans une image-clé de fin et rouges
lorsqu’ils ne se trouvent pas sur une courbe.
Pour obtenir de meilleurs résultats lors de l’interpolation de forme, suivez ces conseils :
Dans l’interpolation de formes complexes, créez des formes intermédiaires et interpolezles au lieu de simplement définir une forme de début et de fin.
Assurez-vous que les repères de formes sont logiques. Par exemple, si vous utilisez trois
repères de formes pour un triangle, ils doivent être dans le même ordre sur le triangle
d’origine que sur le triangle à interpoler. L’ordre ne peut pas être abc dans la première
image-clé et acb dans la deuxième.
Les repères de formes fonctionnent mieux si vous les placez dans le sens inverse des
aiguilles d’une montre en partant du coin supérieur gauche de la forme.
Utilisation des repères de formes
1. Sélectionnez la première image-clé de la séquence d’interpolation de forme.
2. Sélectionnez Modification > Forme > Ajouter les repères de formes. Le repère de forme
de début apparaît comme un cercle rouge avec la lettre a quelque part sur la forme.
297
3. Déplacez le repère de forme vers un point que vous voulez marquer.
4. Sélectionnez la dernière image-clé de la séquence d’interpolation. Le repère de forme de
fin apparaît quelque part sur la forme comme un cercle vert avec la lettre a.
5. Déplacez le repère de forme vers le point de la forme de fin qui doit correspondre au
premier point que vous avez marqué.
6. Lancez de nouveau l’animation pour voir comment les repères de formes modifient
l’interpolation de forme. Déplacez les repères de formes pour ajuster l’interpolation.
7. Répétez ce processus pour ajouter des repères de formes supplémentaires. De
nouveaux repères apparaissent avec les lettres suivantes b, c, etc.
Visualisation de tous les repères de formes
Sélectionnez Affichage > Afficher les repères de formes. Le calque et l’image-clé
contenant les repères de formes doivent être actifs pour que l’option Afficher les repères
de formes soit disponible.
Suppression d’un repère de formes
Faites-le glisser hors de la scène.
Suppression de tous les repères de formes
Sélectionnez Modification > Forme > Supprimer tous les repères.
Haut de la page
Interpolation de forme des traits à l’aide de l’épaisseur variable
Animate CC permet d’ajouter une interpolation de forme à des traits à l’aide de l’outil Épaisseur variable.
Auparavant, Animate prenait uniquement en charge la création d’interpolations de forme pour les traits et les
formes continus uniformes. Les concepteurs ne pouvaient donc pas créer d’interpolations de forme pour des
traits non uniformes, tels que des traits améliorés à l’aide de l’outil Épaisseur variable. L’interpolation des
traits à l’aide de l’épaisseur variable améliore considérablement les possibilités de conception dans
Animate CC.
L’ajout d’interpolations de forme à des traits fantaisie ne diffère pas de l’interpolation d’une forme ou d’un trait
uniforme continu. Cette procédure suppose que vous définissiez la forme de début et de fin de l’interpolation ;
Animate crée ensuite des images transitoires de l’interpolation.
Outil Épaisseur variable
L’outil Épaisseur variable vous permet d’améliorer les traits continus uniformes afin de créer de superbes
traits fantaisie. Pour savoir comment améliorer les traits à l’aide de l’outil Épaisseur variable, voir Amélioration
des traits et des formes à l’aide de l’outil Épaisseur variable.
Ajout d’une interpolation de forme aux traits d’épaisseur variable
1. Dans Animate CC, tracez une ligne avec l’outil Ligne.
298
Ligne tracée à l’aide de l’outil Ligne sur la scène avec une valeur de 2 px.
2. Utilisez l’outil Épaisseur variable pour ajouter de l’épaisseur au centre du trait (voir la
figure ci-dessous). Pour plus d’informations sur l’utilisation de l’outil Épaisseur variable,
voir Amélioration des traits à l’aide de l’outil Épaisseur variable.
Trait d’épaisseur variable créé à l’aide de l’outil Épaisseur variable avec la valeur Trait
définie sur 68 px.
3. Sélectionnez une autre image dans le scénario, par exemple l’image 30, puis créez la
forme finale du trait pour l’interpolation.
299
Forme finale ajoutée à la dernière image clé de l’interpolation de forme.
4. Cliquez avec le bouton droit de la souris sur n’importe quelle image entre 1 et 30, puis
sélectionnez Créer une interpolation de forme.
Ajout d’une interpolation de forme aux profils d’épaisseur variable
Animate CC permet également d’ajouter des interpolations de forme aux traits fantaisie enregistrés sous
forme de profils d’épaisseur variable. Vous pouvez appliquer des profils d’épaisseur aux formes de début et
de fin d’une interpolation, puis laisser Animate créer une interpolation de forme lisse.
Les profils d’épaisseur sont simplement des traits fantaisie créés et enregistrés à l’aide de l’outil Épaisseur
variable pour une réutilisation facile. Pour plus d’informations sur les profils d’épaisseur, voir Enregistrement
des profils d’épaisseur.
Pour ajouter des interpolations de forme aux profils d’épaisseur variable, procédez comme suit :
1. Dans Animate CC, tracez une ligne sur la scène avec l’outil Ligne.
Ligne tracée à l’aide de l’outil Ligne sur la scène avec une valeur de 2 px.
300
2. Dans l’inspecteur des propriétés, sélectionnez et appliquez un profil d’épaisseur à partir
du menu déroulant Largeur.
Trait d’épaisseur variable créé à l’aide de l’outil Épaisseur variable avec la valeur Trait
définie sur 68 px.
3. Sélectionnez une autre image dans le scénario, par exemple l’image 30, puis
sélectionnez un profil d’épaisseur dans la liste déroulante Largeur de l’inspecteur des
propriétés.
4. Cliquez avec le bouton droit sur n’importe quelle image entre 1 et 30, puis sélectionnez
Créer une interpolation de forme pour ajouter une interpolation de forme aux profils
d’épaisseur sélectionnés.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
301
Utilisation des images et des images-clés dans Animate CC
Insertion d’images dans le scénario
Sélection d’images dans le scénario
Etiquetage d’images dans le scénario
Activation d’une sélection étendue à plusieurs images
(Animate CC uniquement) Répartir dans les images-clés
Copie ou collage d’une image ou d’une séquence d’images
Suppression d’une image ou d’une séquence d’images
Déplacement d'une image-clé ou d'une séquence d'images
Changement de la longueur d’une séquence d’images statiques
Conversion d’une image-clé en image
Affichage de l’aperçu du contenu d’une image dans le scénario
Tout comme les films, les documents Adobe Animate CC divisent les périodes de temps en images. Dans le
scénario, vous travaillez sur ces images pour organiser et contrôler le contenu de votre document. Vous
placez les images dans le scénario dans l’ordre dans lequel vous souhaitez voir leurs objets apparaître dans
votre contenu définitif.
Une image-clé est une image dans laquelle une nouvelle occurrence de symbole apparaît dans le scénario.
Une image-clé peut aussi être une image incluant du code ActionScript® pour contrôler un aspect de votre
document. Vous pouvez également ajouter une image-clé vide au scénario en tant qu’espace réservé pour
les symboles que vous ajouterez ultérieurement ou pour conserver cette image vide explicitement.
Une image-clé de propriété est une image dans laquelle vous définissez les changements de propriétés d’un
objet pour une animation. Animate peut interpoler, ou remplir automatiquement, les valeurs de propriété
situées entre les images-clés de propriété, de manière à produire des animations fluides. Les images-clés de
propriété facilitent la création des animations car elles évitent d’avoir à tracer chacune de leurs images. Une
série d’images contenant une animation interpolée est appelée interpolation de mouvement.
Une image interpolée est toute image qui fait partie d’une interpolation de mouvement.
Une image statique est toute image qui ne fait pas partie d’une interpolation de mouvement.
Vous organisez les images-clés et les images-clés de propriété différemment dans le scénario afin de
contrôler la séquence des événements dans votre document et son animation.
Haut de la page
Insertion d’images dans le scénario
Pour insérer une nouvelle image, choisissez Insertion > Scénario > Image (F5).
Pour créer une image-clé, choisissez Insertion > Scénario > Image-clé (F6). Vous pouvez
également cliquer sur l’image dans laquelle placer l’image-clé avec le bouton droit de la
souris (Windows) ou cliquer dessus tout en appuyant sur la touche Ctrl (Macintosh), puis
choisir Insérer une image-clé dans le menu contextuel.
Pour créer une image-clé vide, choisissez Insertion > Scénario > Image-clé vide ou
cliquez avec le bouton droit de la souris (Windows) ou en appuyant sur la touche Ctrl
(Macintosh) sur l’image dans laquelle placer l’image-clé, puis choisissez Insérer une
image-clé vide dans le menu contextuel.
Haut de la page
302
Sélection d’images dans le scénario
Animate propose deux méthodes distinctes pour sélectionner les images dans le scénario. Avec la sélection
à base d’images (paramètre par défaut), vous sélectionnez séparément les images dans le scénario. Avec la
sélection basée sur les plages, vous sélectionnez toute une séquence d’images (d’une image-clé à la
suivante) en cliquant sur n’importe quelle image de cette séquence. Vous pouvez spécifier une sélection
basée sur les plages dans les préférences d’Animate.
Pour sélectionner une image, cliquez sur son entrée. Si vous avez activé la sélection à
base de plages, cliquez sur l’image en maintenant la touche Ctrl (Windows) ou
Commande (Macintosh) enfoncée.
Pour sélectionner plusieurs images contiguës, faites glisser le curseur sur les images ou
cliquez sur les images tout en appuyant sur la touche Maj.
Pour sélectionner plusieurs images non contiguës, cliquez sur chacune d’elles tout en
maintenant la touche Ctrl (Windows) ou la touche Commande (Macintosh) enfoncée.
Pour sélectionner toutes les images d’un scénario, choisissez Modifier > Scénario >
Sélectionner toutes les images.
Pour sélectionner une plage entière d’images statiques, double-cliquez sur une image
située entre deux images-clés. Si vous avez activé la sélection à base de plages, cliquez
sur une image quelconque dans la séquence.
Pour sélectionner une plage entière d'images (interpolation de mouvement ou
cinématique inverse) cliquez une fois sur la plage si vous avez activé l'option Sélection
basée sur plages dans le menu Préférences. Si l'option Sélection basée sur plages n'est
pas activée, cliquez deux fois sur la plage. Pour sélectionner plusieurs plages, cliquez sur
chacune d'elle tout en appuyant sur la touche Maj.
Haut de la page
Etiquetage d’images dans le scénario
Vous pouvez étiqueter des images dans le scénario en vue d'organiser leur contenu. Vous pouvez par
ailleurs étiqueter une image afin de pouvoir la désigner par son étiquette dans ActionScript. Ainsi, lorsque
vous réorganisez le scénario et déplacez l'étiquette vers un autre numéro d'image, le code ActionScript
désigne toujours l'étiquette d'image et n'est pas mis à jour.
Il est uniquement possible d'appliquer des étiquettes d'images aux images-clés. Il est conseillé de créer un
calque spécifique dans le scénario contenant vos étiquettes d'images.
Pour ajouter une étiquette d'image :
1. Sélectionnez l'image que vous souhaitez étiqueter dans le scénario.
2. Une fois l'image sélectionnée, indiquez le nom de l'étiquette dans la section Etiquette de
l'inspecteur des propriétés. Appuyez sur la touche Entrée ou Retour.
Haut de la page
Activation d’une sélection étendue à plusieurs images
La sélection étendue à plusieurs images permet de sélectionner en un seul clic une plage d’images entre
deux images-clés.
1. Choisissez Modifier > Préférences.
2. Sélectionnez la catégorie Général.
3. Dans la section Scénario, activez l’option Sélection étendue à plusieurs images.
4. Cliquez sur OK.
303
Haut de la page
(Animate CC uniquement) Répartir dans les images-clés
L’option Répartir dans les images-clés permet de répartir plusieurs objets (symboles et bitmaps) sur la scène
dans des images-clés individuelles.
1. Sélectionnez plusieurs objets sur un calque de la scène.
2. Cliquez n’importe où sur la scène avec le bouton droit de la souris, puis choisissez
Répartir dans les images-clés.
Haut de la page
Copie ou collage d’une image ou d’une séquence d’images
Effectuez l’une des opérations suivantes :
Sélectionnez l’image ou la séquence et choisissez Modifier > Scénario > Copier les
images. Sélectionnez une image ou séquence à remplacer et choisissez Modifier >
Scénario > Coller les images.
Faites glisser une image-clé vers l'emplacement où vous souhaitez la copier tout
en appuyant sur la touche Alt (Windows) ou sur la touche Option (Macintosh).
Haut de la page
Suppression d’une image ou d’une séquence d’images
Sélectionnez l’image ou la séquence et choisissez Modifier > Scénario > Supprimer les
images ; vous pouvez également cliquer sur l’image ou la séquence avec le bouton droit
de la souris (Windows) ou cliquer dessus tout en appuyant sur la touche Contrôle
(Macintosh), puis choisir Supprimer les images dans le menu contextuel.
Les images environnantes demeurent inchangées.
Haut de la page
Déplacement d'une image-clé ou d'une séquence d'images
Sélectionnez une image-clé ou une séquence d'images, puis faites glisser celle-ci à
l'emplacement de votre choix.
Haut de la page
Changement de la longueur d’une séquence d’images statiques
Faites glisser le début ou la fin de l’image de la plage gauche ou droite tout en
maintenant la touche Ctrl appuyée (Windows) ou la touche Commande (Macintosh).
Pour changer la longueur d’une séquence d’animation image par image, voir Création d’animations image par
image.
Haut de la page
Conversion d’une image-clé en image
Sélectionnez l’image-clé et choisissez Modifier > Scénario > Supprimer l’image-clé ; vous
pouvez également cliquer sur l’image-clé avec le bouton droit de la souris (Windows) ou
cliquer dessus tout en appuyant sur la touche Contrôle (Macintosh), puis choisir
Supprimer l’image-clé dans le menu contextuel.
304
Le contenu sur la scène de l’image-clé effacée et toutes les images comprises entre elle
et l’image-clé suivante sont remplacées par le contenu, sur la scène, de l’image
précédant l’image-clé effacée.
Haut de la page
Affichage de l’aperçu du contenu d’une image dans le scénario
Vous pouvez afficher un aperçu des éléments contenus dans chaque image-clé du scénario.
Dans le coin supérieur droit du panneau Scénario, choisissez Aperçu dans le menu
Options.
Voir aussi
Le scénario
Principes de base des animations
Interpolations de mouvement
Animation image par image
Scénarios et ActionScript
Utilisation de sons dans Animate CC
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
305
Animation image par image dans Animate CC
Création d’animations image par image
Création d’animations image par image en convertissant des interpolations classiques
ou de mouvement
Utilisation de la pelure d’oignon
Haut de la page
Création d’animations image par image
L’animation image par image change le contenu de la scène dans chaque image ; elle est plus adaptée aux
animations complexes dans lesquelles le contenu change d’une image à l’autre au lieu d’être simplement
déplacé sur la scène. L’animation image par image accroît la taille du fichier plus rapidement qu’une
animation interpolée. Dans l’animation image par image, Animate CC (anciennement Flash Professional CC)
enregistre les valeurs de chaque image complète.
Pour créer une animation image par image, vous devez définir chaque image comme une image-clé, puis
créer une image différente pour chacune d’entre elles. Dans un premier temps, chaque nouvelle image-clé
possède le même contenu que l’image-clé qui la précède et vous pouvez donc modifier les images de
l’animation par incréments.
1. Cliquez sur le nom d’un calque pour en faire le calque courant, puis sélectionnez une
image sur ce calque dans lequel vous voulez démarrer l’animation.
2. Si l’image n’est pas déjà une image-clé, sélectionnez Insertion > Scénario > Image-clé.
3. Créez le contenu de la première image de la séquence. Vous pouvez utiliser les outils de
dessin, coller des graphiques depuis le Presse-papiers ou importer un fichier.
4. Pour créer une image-clé avec un contenu identique à celui de la première image-clé,
cliquez sur l’image suivante à droite sur la même ligne, puis sélectionnez Insertion >
Scénario > Image-clé ou cliquez sur le bouton droit de la souris (Windows) ou en
appuyant sur la touche Contrôle (Macintosh) et choisissez Insérer une image-clé.
5. Modifiez le contenu de cette image sur la scène pour développer la prochaine
incrémentation de l’animation.
6. Pour terminer la séquence d’animation image par image, répétez les étapes 4 et 5
jusqu’à ce le mouvement souhaité soit créé.
7. Pour tester la séquence d’animation, sélectionnez Contrôle > Lire ou cliquez sur le
bouton Lire du Contrôleur (Fenêtre > Barre d’outils > Contrôleur).
306
Haut de la page
Création d’animations image par image en convertissant des
interpolations classiques ou de mouvement
Vous pouvez convertir une plage d’interpolation classique ou de mouvement en animation image par image.
Dans l’animation image par image, chaque image contient des images-clés distinctes (pas des images-clés
de propriété), qui contiennent elles-mêmes des occurrences distinctes du symbole animé. Une animation
image par image ne contient pas de valeurs de propriété interpolées.
Pour convertir la plage d’interpolation désirée, cliquez avec le bouton droit de la souris
(Windows) ou avec la touche Ctrl (Macintosh) sur son entrée, puis choisissez Convertir
en animation image par image dans le menu contextuel.
Haut de la page
Utilisation de la pelure d’oignon
En général, une seule image de la séquence d’animation est affichée sur la scène à la fois. Cependant, vous
pouvez afficher deux ou plusieurs images à la fois sur la scène pour vous aider à positionner et modifier une
animation image par image. L’image sous la tête de lecture apparaît en couleur ; nous appliquons la couleur
et l’alpha afin de différencier les images précédentes et futures.
La pelure d’oignon colorée est appliquée par défaut. Pour maintenir l’ancien comportement, veillez à définir
les images passées et futures en noir.
Affichage simultané de plusieurs images d’une animation sur la scène
Cliquez sur le bouton Pelure d’oignon . Toutes les images comprises entre les repères
Début Pelure d’oignon et Fin Pelure d’oignon (dans l’en-tête du scénario) sont
superposées sous forme d’une image dans la fenêtre Document.
Repères de pelure d’oignon
Pelures d’oignon codées par couleur
Le codage couleur de la pelure d’oignon vous aide à différencier les images passées, présentes et futures. La
transparence des images en pelure d’oignon décroît progressivement à mesure que l’on s’éloigne de l’image
active.
Pelure d’oignon sur le scénario
307
Pelure d’oignon avec codage couleur affichant les images passées, présentes et futures
Pelure d’oignon : mode Contour
Personnalisation des couleurs pour l’affichage des pelures d’oignon
1. Pour personnaliser la couleur des images en pelure d’oignon, sélectionnez Image en
pelure d’oignon dans la barre du scénario.
2. Choisissez Édition > Préférences.
3. Sous l’option Couleur de pelure d’oignon, sélectionnez les boutons de nuancier pour
personnaliser les couleurs des images Passé, Présent et Futur.
Remarque : Le code de couleur s’applique également au mode Contour.
Pelure d’oignon : mode Scénario
308
Pelure d’oignon personnalisée
Pour changer la position d’un repère de pelure d’oignon, faites glisser son pointeur vers
un nouvel emplacement. Généralement, le repère de pelure d’oignon se déplace avec le
pointeur de la forme en cours. Faites glisser le curseur en maintenant la touche
Ctrl/Commande enfoncée pour augmenter ou réduire la position des deux côtés.
Pour activer la modification de toutes les images entre les repères de pelure d’oignon,
cliquez sur le bouton Modifier plusieurs images . En général, l’option de pelure d’oignon
vous permet de modifier uniquement l’image en cours. Cependant, vous pouvez afficher
normalement le contenu de chaque image se trouvant entre les repères de pelure
d’oignon et les rendre modifiables, quelle que soit l’image en cours.
Remarque : les calques verrouillés (identifiés par l’icône de verrou) ne sont pas affichés lorsque l’option
Pelure d’oignon est activée. Pour éviter l’affichage d’une multitude d’images rendant la visualisation difficile,
vous pouvez verrouiller ou masquer les calques qui ne doivent pas apparaître dans l’effet de pelure d’oignon.
Changement de l’affichage des repères de pelure d’oignon
Cliquez sur le bouton Modifier les repères de pelures d’oignon
élément dans le menu :
, puis sélectionnez un
Toujours afficher les repères Permet d’afficher les repères de pelure d’oignon dans
l’en-tête du scénario, que l’option de pelure d’oignon soit activée ou non.
Ancrer la pelure d’oignon Permet de verrouiller les repères de pelure d’oignon à leur
position en cours dans l’en-tête du scénario. Généralement, la plage de pelures dépend
du pointeur de l’image en cours et des repères de pelure d’oignon. L’ancrage des repères
de pelure d’oignon vous permet de les empêcher de se déplacer avec le pointeur de
l’image en cours.
Oignon 2 Permet d’afficher deux images de chaque côté de l’image en cours.
Oignon 5 Permet d’afficher cinq images de chaque côté de l’image en cours.
Oignon sur tout Permet d’afficher toutes les images de chaque côté de l’image en
cours.
Vidéo : Pelure d’oignon dans Animate CC
309
De Train Simple (www.trainsimple.com)
Aperçu de votre travail
Pour vérifier l’aspect de la pelure d’oignon, pointez la souris sur la plage entière du scénario. Votre animation
est lue dans des contours colorés, ce qui vous donne un aperçu précis des modifications.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
310
Utilisez le convertisseur de type de document pour convertir des
projets Animate CC en d’autres formats de document.
Conversion d’un document Animate dans un autre format de document
Conversion d’un document Animate à l’aide du convertisseur de type de document
Haut de la page
Conversion d’un document Animate dans un autre format de
document
Grâce au convertisseur universel de type de document, vous pouvez convertir des projets FLA existants (de
tout type) en n’importe quel autre type de document tel que HTML5 Canvas, ActionScript/AIR, WebGL ou un
type de document personnalisé. Lors de la conversion dans un format donné, vous pouvez profiter des
fonctions de création d’Animate pour ce type de document.
Conversion d’un document Animate à l’aide du convertisseur de type de
document
Pour convertir un document Animate dans un autre type de document, procédez comme suit :
1. Ouvrez le document à convertir et cliquez sur Commandes > Convertir en d’autres
formats de document. La boîte de dialogue Convertisseur de type de document s’affiche.
2. Dans la liste déroulante Convertir le document en, sélectionnez le type de document
dans lequel convertir le document.
3. Cliquez sur Parcourir pour sélectionner le dossier où enregistrer le fichier converti et
cliquez ensuite sur OK
Boîte de dialogue Convertisseur de type de document
Remarque : Si vous convertissez un document de plusieurs séquences en document de type
HTML5 Canvas, toutes les scènes sont enregistrées comme des fichiers distincts car le type de document
HTML5 Canvas ne prend pas en charge plusieurs séquences. Pour utiliser plusieurs séquences dans un
même document, placez chacune d’elles dans des symboles distincts.
Vous pouvez convertir vos projets Animate existants en un autre format ou réutiliser des éléments d’un
projet simplement en effectuant un copier-coller des calques et des symboles de la bibliothèque.
311
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
312
Pratiques recommandées – Publicité avec Animate CC
Utilisation des dimensions recommandées
Création de fichiers publicitaires SWF
Suivi des annonces publicitaires
Test de vos annonces
Haut de la page
Utilisation des dimensions recommandées
Utilisez les recommandations de l’agence IAB (Interactive Advertising Bureau) pour définir les dimensions de
vos annonces publicitaires Animate. Le tableau suivant contient les dimensions IMU (Interactive Marketing
Unit) recommandées pour les annonces :
Type d’annonce
Dimensions (pixels)
Gratte-ciel large
160 x 600
Gratte-ciel
120 x 600
Annonce de demi-page
300 x 600
Bandeau complet
468 x 60
Demi-bandeau
234 x 60
Micro barre
88 x 31
Button1
120 x 90
Button2
120 x 60
Bandeau vertical
120 x 240
Bouton carré
125 x 125
Leaderboard (têtes de liste)
728 x 90
Rectangle moyen
300 x 250
Menu déroulant carré
250 x 250
Rectangle vertical
240 x 400
Rectangle large
336 x 280
Rectangle
180 x 150
313
Lorsque vous créez un fichier FLA à partir d’un modèle (Sélectionnez Fichier > Nouveau et cliquez sur
l’onglet Modèles), vous pouvez apercevoir bon nombre de ces dimensions.
Haut de la page
Création de fichiers publicitaires SWF
Utilisez les recommandations suivantes pour créer des annonces publicitaires :
Optimisez vos graphiques. Construisez des bandeaux publicitaires de fichier SWF de 15K
ou moins.
Créez un bandeau publicitaire GIF de 12 Ko ou moins dans Animate.
Limitez à trois répétitions les bandeaux publicitaires en boucle. De nombreux sites Web
appliquent les recommandations normalisées de taille de fichier comme spécifications
pour leur publicité.
Utilisez la commande GET pour transmettre des données entre une publicité et un
serveur, et n’utilisez pas la commande POST. Pour plus d’informations sur GET et POST,
voir la fonction getURL dans le Guide de référence du langage ActionScript 20.
Remarque : fournissez des contrôles à l’utilisateur. Si vous sonorisez une publicité, ajoutez-lui un bouton de
sourdine. Si vous créez une annonce Animate transparente qui flotte au-dessus d’une page Web, fournissez
un bouton qui supprime l’intégralité du message publicitaire.
Haut de la page
Suivi des annonces publicitaires
Plusieurs grandes régies publicitaires appliquent aujourd’hui des méthodes normalisées de suivi dans les
fichiers SWF Animate. Les recommandations suivantes décrivent la méthodologie de suivi utilisée.
Création d’un bouton ou d’un bouton clip Utilisez les dimensions normalisées établies par l’IAB. Pour une
liste de dimensions normalisées, voir le site Web de l’IAB. Pour plus d’informations sur la création d’un bouton
dans Animate, voir Création de boutons.
Ajout d’un script à un bouton S’exécute quand l’utilisateur clique sur le bandeau. Vous pourriez utiliser la
fonction getURL() pour ouvrir une nouvelle fenêtre de navigateur. Les blocs de code suivants constituent
deux exemples de code ActionScript 2.0 que vous pourriez ajouter à l’image 1 du scénario :
myButton_btn.onRelease = function(){
getURL(clickTAG, "_blank");
};
Vous pourriez ajouter le code suivant à l’image1 du scénario :
myButton_btn.onRelease = function() {
if (clickTAG.substr(0, 5) == "http:") {
getURL(clickTAG);
}
};
La fonction getURL() ajoute la variable transmise dans les balises object et embed, puis envoie le
navigateur qui est lancé à l’emplacement désigné. Le serveur qui héberge l’annonce peut suivre les clics sur
la publicité. Pour plus d’informations sur l’utilisation de la fonction getURL(), voir le Guide de référence du
langage ActionScript 2.0.
Affectation du code clickTAG pour le suivi Suit l’annonce publicitaire et aide le réseau qui présente la
314
publicité à suivre la trace de l’apparition du pavé et à quel moment on a cliqué dessus.
Ce processus est le moyen classique pour lancer une campagne publicitaire dans le cadre d’une publicité
Animate. Si vous affectez getURL() au bandeau, vous pouvez utiliser le processus suivant pour y ajouter le
suivi. L’exemple suivant vous permet d’ajouter une variable à une chaîne URL pour transmettre des données,
ce qui vous permet de définir des variables dynamiques pour chaque bandeau au lieu de créer un bandeau
distinct pour chaque domaine. Vous pouvez utiliser un bandeau unique pour toute la campagne et n’importe
quel serveur qui héberge l’annonce peut suivre les clics sur le bandeau.
Dans les balises object et embed dans votre code HTML, vous ajouteriez un code semblable à celui décrit
dans l’exemple suivant (où www.helpexamples.com est le réseau de l’annonce et adobe.com est l’entreprise
avec une annonce) :
<EMBED src="your_ad.swf?clickTAG= http://helpexamples.com/tracking?http://www.adobe.com">
Saisissez le code suivant dans votre code HTML :
<PARAM NAME=movie VALUE="your_ad.swf?clickTAG =http: //helpexamples.com/tracking?
http://www.adobe.com">
<< this HTML stuff may need to be updated
to account for the Active content fix, which likely will cause users
to edit .js files instead of html files - JayA >>
Pour télécharger le kit Rich Media Tracking qui contient des exemples et de la documentation, rendez-vous
sur le site www.adobe.com/go/richmedia_tracking_fr
Haut de la page
Test de vos annonces
Procédez à un test de votre fichier d’annonce SWF sur les navigateurs les plus courants, et plus
particulièrement sur ceux qu’utilise le public que vous visez. Certains utilisateurs pourraient ne pas avoir
installé Flash Player ou avoir désactivé JavaScript. Pensez a ces situations en prévoyant une image GIF de
remplacement (par défaut) ou d’autres scénarios pour ces utilisateurs. Pour plus d’informations sur la
détection de Flash Player, voir Définition des paramètres de publication des fichiers SWF. Donnez à
l’utilisateur le contrôle du fichier SWF. Permettez à l’utilisateur de contrôler le son dans une annonce. Si
l’annonce est un fichier SWF sans contour qui flotte au-dessus d’une page Web, permettez à l’utilisateur de
supprimer l’annonce immédiatement et pour toute la durée de son déroulement.
Pour obtenir les dernières informations sur la disponibilité des versions Flash Player dans différentes régions,
rendez-vous sur le site www.adobe.com/go/fp_version_penetration_fr.
Adobe recommande également :
Optimisation des graphiques et animations
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
315
Principes de base de l’animation dans Animate CC
Types d’animation
À propos des cadences
Identification d’animations dans le scénario
À propos des calques d’une animation interpolée
Répartition d’objets dans des calques pour les animations interpolées
Création d’animations interpolées en répartissant des objets dans des images-clés
Ressources supplémentaires
Remarque : Comme la plupart des éléments dans Animate CC (anciennement Flash Professional CC), les
animations n’impliquent pas l’utilisation du langage ActionScript. Vous pouvez néanmoins utiliser ActionScript
si tel est votre choix.
Haut de la page
Types d’animation
Dans Animate CC, il existe plusieurs moyens de créer une animation et des effets spéciaux. Chaque
méthode offre différentes possibilités pour créer du contenu animé attractif.
Animate prend en charge les types d’animation suivants :
Interpolations de mouvement Utilisez des interpolations de mouvement pour définir les propriétés d’un
objet, telles que la position et la transparence alpha d’une image, et ainsi de suite pour chaque image.
Animate interpole alors les valeurs des propriétés des images intermédiaires. Ces interpolations se révèlent
très utiles dans le cas d’animations composées de mouvement ou d’une transformation d’objet. Les
interpolations de mouvement apparaissent dans le scénario sous forme de plage contiguë d’images, qui
peuvent être sélectionnées en tant qu’objet unique par défaut. Les interpolations de mouvement sont
puissantes et faciles à créer.
Interpolations classiques Les interpolations classiques sont comme des interpolations de mouvement,
mais leur création est plus complexe. Les interpolations classiques autorisent certains effets spéciaux animés
qui sont impossibles dans les interpolations à base de plage.
Poses de cinématiques inverses (abandonné dans Animate CC) Les poses de cinématique inverse
permettent d’étirer et d’incurver des objets forme et de relier des groupes d’occurrences de symbole pour les
faire bouger ensemble de manière naturelle. Après avoir ajouté des segments à une forme ou à un groupe de
symboles, vous pouvez modifier la position des segments ou des symboles dans plusieurs images-clés.
Animate interpole les positions dans les images intermédiaires.
Interpolations de forme Avec l’interpolation de forme, vous dessinez une forme dans une image spécifique
du scénario, puis vous modifiez cette forme ou dessinez une autre forme dans une autre image.
Animate interpole ensuite les formes intermédiaires pour les images intermédiaires, créant ainsi l’animation en
transformant progressivement une forme en une autre.
Animation image par image Cette technique d’animation vous permet de spécifier différents effets
artistiques pour chaque image du scénario. Utilisez cette technique pour créer un effet similaire aux images
d’un film défilant en accéléré. Cette technique est très utile pour les animations complexes dans lesquelles
les éléments graphiques de chaque image doivent être différents.
316
Haut de la page
À propos des cadences
La cadence, la vitesse à laquelle l’animation est lue, est exprimée en nombre d’images par seconde (ips).
Une cadence trop faible donne l’impression d’une animation qui s’arrête et redémarre, alors qu’une cadence
trop rapide risque d’entraîner un affichage flou des détails de l’animation. 24 i/s est la cadence d’image par
défaut pour les nouveaux documents Animate et celle qui donne les meilleures résultats sur le Web. La
cadence d’image en mouvement standard est également 24 ips.
La complexité de l’animation et la puissance de l’ordinateur sur lequel elle est exécutée affectent la fluidité de
la lecture. Pour déterminer les cadences optimales, testez vos animations sur différents ordinateurs.
Étant donné que vous indiquez une cadence pour l’intégralité du document Animate, il est conseillé de la
définir avant de commencer la création de l’animation.
Haut de la page
Identification d’animations dans le scénario
Animate différencie une animation interpolée d’une animation image par image dans le scénario en affichant
différents indicateurs dans chaque image renfermant du contenu.
Les indicateurs de contenu d’image suivants apparaissent dans le scénario :
Une plage d’images sur fond bleu indique une interpolation de mouvement. Un point noir
dans la première image de la plage indique qu’un objet cible est affecté à la plage
d’interpolation. Des losanges noirs indiquent la dernière image et toute autre image-clé
de propriété. Les images-clés de propriété sont des images qui contiennent les
changements de propriété que vous avez explicitement définis. Vous pouvez choisir quels
types d’images-clés de propriété afficher en cliquant avec le bouton droit de la souris
(Windows) ou en appuyant sur la touche Commande (Macintosh) tout en cliquant sur la
plage d’interpolation de mouvement et en choisissant Afficher les images-clés > type
dans le menu contextuel. Animate affiche tous les types d’images-clés de propriété par
défaut. Toutes les autres images de la plage contiennent les valeurs des propriétés
interpolées de l’objet cible.
Un point vide dans la première image indique que l’objet cible de l’interpolation de
mouvement a été supprimé. La plage d’interpolation contient toujours ses images-clés de
propriété et un nouvel objet cible peut lui être appliqué.
Une plage d’images sur fond vert indique une cinématique inverse (IK) calque de pose.
Les calques de pose contiennent des squelettes IK et des poses. Chaque pose apparaît
dans le scénario sous forme de losange noir. Animate interpole les positions du squelette
dans les images des poses intermédiaires.
Un point noir au niveau de la première image-clé, avec une flèche noire et un arrière-plan
bleu, signale une interpolation classique.
317
Une ligne pointillée indique que l’interpolation classique est rompue ou incomplète, par
exemple parce que l’image-clé finale est absente.
Un point noir au niveau de la première image-clé, avec une flèche noire et un arrière-plan
vert clair, indique une interpolation de formes.
Une image-clé unique est signalée par un point noir. Des images gris clair après une
seule image-clé contiennent le même contenu sans changement. Ces images comportent
une ligne noire verticale avec un rectangle vide au niveau de la dernière image de la
plage.
Un petit a indique qu’une action d’image est affectée à l’image avec le panneau Actions.
Un drapeau rouge signale que l’image contient une étiquette.
Une double barre oblique verte indique que l’image contient un commentaire.
Une ancre dorée indique que l’image est une ancre nommée.
Haut de la page
À propos des calques d’une animation interpolée
Chaque scène d’un document Animate peut être composée d’un nombre quelconque de calques de scénario.
Utilisez les claques et les dossiers de calques pour organiser le contenu d’une séquence d’animation et
séparer les objets animés. Leur organisation en calques et en dossiers empêche leur effacement, leur
connexion ou leur segmentation lorsqu’ils se chevauchent. Pour créer une animation comprenant un
mouvement interpolé de plusieurs symboles ou champs de texte en même temps, chaque objet doit être
placé sur un calque distinct. Vous pouvez utiliser un calque sous forme de calque d’arrière-plan renfermant
un contenu statique, et utiliser d’autres calques contenant un objet animé distinct.
Lorsque vous créez une interpolation de mouvement, Animate convertit le calque contenant l’objet
sélectionné pour l’interpoler en calque d’interpolation. Dans le scénario, le calque d’interpolation présente une
318
icône d’interpolation accolée à son nom.
Lorsque d’autres objets sont présents sur le même calque que l’objet interpolé, Animate ajoute le cas échéant
de nouveaux calques au-dessus ou en dessous du calque original. Tous les objets situés au-dessous de
l’objet interpolé sur le calque original sont déplacés vers un nouveau calque placé sous l’original. Tous les
objets situés au-dessus de l’objet interpolé sur le calque original sont déplacés vers un nouveau calque audessus de l’original. Animate insère ces nouveaux calques entre les calques préexistants du scénario.
Animate préserve ainsi l’ordre d’empilement d’origine de tous les objets graphiques de la scène.
Un calque d’interpolation ne peut contenir que des plages d’interpolation (groupes contigus d’images
contenant une interpolation), des images statiques, des images-clés vides ou des images vides. Chaque
plage d’interpolation ne peut contenir qu’un seul objet cible et une trajectoire de mouvement facultative pour
cet objet. Comme il est impossible de dessiner dans un calque d’interpolation, d’autres interpolations ou
images statiques doivent être créées sur d’autres calques, puis glissées vers le calque d’interpolation. Pour
placer des scripts d’image sur un calque d’interpolation, créez-les sur un autre calque, puis faites-les glisser
sur celui d’interpolation. Un script d’images ne peut résider que dans une image qui est hors de la plage
d’interpolation de mouvement elle-même. En général, il est conseillé de conserver tous les scripts d’images
sur un calque distinct qui ne contient que du code ActionScript.
Lorsqu’un document comporte plusieurs calques, il peut être difficile d’assurer son suivi et de modifier les
objets sur un ou plusieurs de ces calques. Cette tâche est plus facile si vous travaillez avec le contenu d’un
seul calque à la fois. Pour masquer ou verrouiller les calques sur lesquels vous ne travaillez pas
actuellement, cliquez sur l’icône d’affichage ou de verrou accolée au nom du calque dans le scénario. Les
dossiers de calques vous aident à organiser les calques dans des groupes gérables.
Haut de la page
Répartition d’objets dans des calques pour les animations
interpolées
Animate déplace automatiquement tout objet vers son propre calque d’interpolation lorsque vous lui
appliquez une interpolation de mouvement. Toutefois, vous pouvez également distribuer vous-même les
objets à leurs propres calques distincts. Par exemple, vous pouvez choisir de distribuer vous-même les objets
lorsque vous organisez du contenu. La distribution manuelle s’avère également pratique pour appliquer une
animation à des objets tout en maintenant un contrôle précis sur la manière dont ils se déplacent d’un calque
à l’autre.
Lorsque vous utilisez la commande Répartir dans les calques (Modifier > Scénario > Répartir dans les
calques), Animate distribue chaque objet sélectionné dans un nouveau calque distinct. Les objets que vous
ne sélectionnez pas (y compris ceux d’autres images) conservent leurs calques d’origine.
Vous pouvez appliquer la commande Répartir dans les calques à tout élément de la scène, tel que les objets
graphiques, les occurrences, les bitmaps, les clips vidéo et les blocs de texte séparés.
À propos des nouveaux calques créés avec la commande Répartir dans les
calques
Les calques créés pendant la répartition dans des calques sont baptisés selon le nom de l’élément que
chacun contient :
Un nouveau calque contenant un élément de bibliothèque (tel que symbole, bitmap ou
clip vidéo) prend le nom de cet élément.
Un nouveau calque contenant une occurrence nommée prend le nom de cette
occurrence.
Un nouveau calque contenant un caractère d’un bloc de texte séparé est nommé selon ce
caractère.
Un nouveau calque contenant un objet graphique (sans nom) est nommé Calque 1 (ou
Calque 2 et ainsi de suite), les objets graphiques ne possédant pas de nom.
Animate insère les nouveaux calques sous les calques éventuellement sélectionnés. Les
nouveaux calques sont organisés de haut en bas, selon l’ordre de création initial des
éléments sélectionnés. Dans le cas de texte séparé, les calques sont organisés dans
319
l’ordre des caractères, qu’il soit rédigé de gauche à droite, de droite à gauche ou de haut
en bas. Par exemple, supposons que vous sépariez en cinq parties le texte FLASH pour
le répartir dans plusieurs calques. Les nouveaux calques, nommés F, L, A, S et H, sont
disposés de haut en bas, le F étant en haut. Ces calques apparaissent immédiatement
sous le calque qui contenait le texte au départ.
Répartition d’objets dans des calques
1. Sélectionnez les objets à répartir dans des calques distincts. Ces objets peuvent se
trouver sur un même calque ou sur plusieurs, même non contigus.
2. Effectuez l’une des opérations suivantes :
Sélectionnez Modification > Scénario > Répartir dans les calques.
Cliquez avec le bouton droit de la souris (Windows) ou appuyez sur la touche
Contrôle (Macintosh) sur un des objets sélectionnés, puis sélectionnez Répartir dans
les calques.
Haut de la page
Création d’animations interpolées en répartissant des objets dans
des images-clés
Nouveauté d’Animate CC
Animate permet de répartir des objets dans des images-clés individuelles. Vous pouvez choisir de répartir
des objets lorsque vous organisez du contenu sur la scène. Manuellement, cette procédure est fastidieuse et
prend beaucoup de temps. La répartition est très utile lors de la création d’animations interpolées en plaçant
des objets sur des images-clés individuelles. Vous pouvez affecter différents objets ou états d’objet à des
images-clés individuelles. Lorsque la tête de lecture parcourt ces images-clés, l’effet d’une animation est
apparent.
Lorsque vous utilisez la commande Répartir dans les images-clés, Animate répartit chaque objet sélectionné
dans une nouvelle image-clé distincte. Les objets que vous ne sélectionnez pas (y compris ceux d’autres
images) conservent leurs calques d’origine.
Vous pouvez appliquer la commande Répartir dans les images-clés à tout élément de la scène, notamment à
des objets graphiques, des occurrences, des bitmaps, des clips vidéo et des blocs de texte.
À propos des nouvelles images-clés créées avec la commande Répartir dans
les images-clés
Les nouvelles images-clés créées avec la commande Répartir dans les images-clés sont
disposées selon l’ordre de sélection des objets.
Si certains objet sur le calque n’ont pas été sélectionnés lors de l’exécution de la
commande Répartir dans les images-clés, les images originales ne sont pas affectées à
ces objets. Les objets sélectionnés pour la répartition se voient attribuer des images-clés
à partir de l’image qui suit immédiatement la dernière image du contenu original. Par
exemple, si l’Objet 1 et l’Objet 2 se trouvent sur un calque qui possède 50 images et
que vous sélectionnez l’Objet 1 pour la répartition, ce dernier est placé sur la 51e
image-clé.
Répartition d’objets dans des images-clés
1. Sélectionnez les objets à répartir dans des calques distincts. Ces objets peuvent se
trouver sur un même calque ou sur plusieurs, même non contigus.
320
2. Cliquez avec le bouton droit de la souris (Windows) ou appuyez sur la touche Contrôle
(Macintosh) sur l’un des objets sélectionnés, puis sélectionnez Répartir dans les imagesclés.
Haut de la page
Ressources supplémentaires
L’article suivant traite de l’utilisation d’animations dans Animate :
How to Lip Sync a Character in Animate (2:30, YouTube.com, disponible en anglais
uniquement)
Ressources d’aide supplémentaires
Interpolations de mouvement
Utilisation d’animations interpolées classiques
Cinématique inverse
Interpolation de forme
Animation image par image
Création d’un nouveau document
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
321
Ajout d’interactivité à l’aide de fragments de code dans
Animate CC
Avant de commencer
Ajout d’un fragment de code à un objet ou à une image du scénario
Ajout de nouveaux fragments au panneau Fragments de code
Le panneau Fragments de code a été conçu pour apprendre aux utilisateurs qui disposent de peu de
connaissances en matière de programmation à utiliser rapidement JavaScript et ActionScript 3.0. Il vous
permet d’insérer du code à votre fichier FLA pour ajouter des fonctionnalités standard. Il n’est pas nécessaire
de connaître JavaScript ou ActionScript 3.0 pour utiliser le panneau Fragments de code.
Le panneau Fragments de code vous permet d’effectuer les opérations suivantes :
Insérer du code qui influe sur le comportement d’un objet sur la scène
Insérer du code qui gère le mouvement de la tête de lecture du scénario
(CS5.5 uniquement) Ajout de code permettant à l’utilisateur d’interagir avec l’écran tactile
Ajouter les fragments de code que vous avez créés au panneau
Les fragments de code inclus avec Animate constituent également un bon moyen de se familiariser avec
JavaScript ou ActionScript 3.0. Il suffit d’analyser le code dans les fragments et de suivre les instructions des
fragments pour comprendre la structure et le vocabulaire du code.
Haut de la page
Avant de commencer
Lors de l’utilisation du panneau Fragments de code, il est important de comprendre les notions
fondamentales d’Animate suivantes :
Avant d’utiliser certains fragments de code, il est nécessaire de personnaliser quelques
éléments dans le code. Pour cela, accédez au panneau Actions dans Animate . Chaque
fragment contient des instructions spécifiques.
Tous les fragments de code inclus sont au format JavaScript ou ActionScript 3.0.
Certains fragments de code influent sur le comportement d’un objet de façon à ce qu’il
puisse se déplacer ou disparaître, ou que l’utilisateur puisse cliquer dessus. Appliquez
ces fragments de code à l’objet sur la scène.
Certains fragments de code provoquent une action immédiate lorsque la tête de lecture
entre dans l’image qui contient le code. Appliquez ces fragments de code à une image du
scénario.
Lorsque vous appliquez un fragment de code, le code est ajouté à l’image actuelle du
calque Actions dans le scénario. Si vous n’avez pas créé un calque Actions, Animate en
ajoute un sur tous les autres dans le scénario.
Afin qu’ActionScript puisse contrôler un objet sur la scène, vous devez avoir attribué un
nom d’occurrence à l’objet dans l’inspecteur des propriétés.
Vous pouvez cliquer sur les boutons Afficher la description et Afficher le code disponibles
322
lorsque vous sélectionnez un fragment de code dans le panneau.
Haut de la page
Ajout d’un fragment de code à un objet ou à une image du scénario
Pour ajouter une action qui affecte l’objet ou la tête de lecture :
1. Sélectionnez un objet sur la scène ou une image dans le scénario.
Si vous sélectionnez un objet qui n’est pas une occurrence de symbole, Animate le
convertit en symbole de clip lors de l’application du fragment de code.
Si vous sélectionnez un objet qui n’est pas déjà un nom d’occurrence, Animate en ajoute
un lors de l’application du fragment de code.
2. Dans le panneau Fragments de code (Fenêtre > Fragments de code), cliquez deux fois
sur le fragment de code que vous souhaitez appliquer.
Si vous avez sélectionné un objet sur la scène, Animate ajoute le fragment de code au
panneau Actions dans les images contenant l’objet sélectionné.
Si vous avez sélectionné une image du scénario, Animate ajoute le fragment de code à
cette image uniquement.
3. Dans le panneau Actions, affichez le code que vous venez d’ajouter et remplacez les
éléments nécessaires en suivant les instructions situées dans la partie supérieure du
fragment de code.
Haut de la page
Ajout de nouveaux fragments au panneau Fragments de code
Il existe deux façons d’ajouter des fragments de code au panneau Fragments de code :
Saisie d’un fragment de code dans la boîte de dialogue Créer un fragment de code
Importation d’un fichier XML de fragments de code
Pour utiliser la boîte de dialogue Créer un fragment de code :
1. Dans le panneau Fragments de code, choisissez Créer un fragment de code dans le
menu du panneau.
2. Dans la boîte de dialogue qui s’affiche, saisissez le titre, le texte de l’info-bulle et le code
JavaScript ou ActionScript 3.0 correspondant à votre fragment.
Vous pouvez ajouter les codes actuellement sélectionnés dans le panneau Actions en
cliquant sur le bouton Remplissage automatique.
3. Cochez la case Remplacer automatiquement nom_occurrence_ici si votre code inclut la
chaîne « nom_occurrence_ici » et si vous souhaitez qu’Animate la remplace par le nom
d’occurrence correct lors de l’application du fragment de code.
Animate ajoute le nouveau fragment au panneau Fragments de code dans un dossier
appelé Personnalisé.
Pour importer un fragment de code au format XML :
1. Dans le panneau Fragments de code, choisissez Importer le fichier XML de fragments de
code à partir du menu du panneau.
2. Sélectionnez le fichier XML que vous souhaitez exporter, puis cliquez sur Ouvrir.
323
Pour afficher le format XML adapté aux fragments de code, choisissez Modifier le fichier XML de fragments
de code dans le menu du panneau.
Pour supprimer un fragment de code, cliquez avec le bouton droit de la souris sur le fragment dans le
panneau, puis choisissez Supprimer le fragment de code dans le menu contextuel.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
324
Création et publication de documents HTML5 Canvas dans
Animate CC
Qu’est-ce que HTML5 Canvas ?
Le nouveau type de document HTML5 Canvas
Animate et l’API Canvas
Création d’un document HTML5 Canvas
Rendre le document HTML5 Canvas interactif
Utilisation des fragments de code JavaScript
Références à la documentation CreateJS
Publication d’animations au format HTML5
Paramètres simples
Paramètres avancés
Variables des modèles HTML
Prise en charge JSAPI pour importer et exporter des modèles HTML pour les
documents Canvas
Code JavaScript incorporé au code HTML
Fusion des données JSON dans JS
Optimisation des sorties HTML5 Canvas
Définition d’un arrière-plan de travail transparent
Exportation des bitmaps comme une feuille Sprite
Utilisation du texte dans le document HTML5 Canvas
Texte statique
Texte dynamique
Présentation de la sortie HTML5 Canvas
Migration de contenu existant vers HTML5 Canvas
Modifications appliquées au contenu après la migration
Conversion d’autres types de documents en HTML5 Canvas
Haut de la page
Qu’est-ce que HTML5 Canvas ?
Canvas est un nouvel élément dans HTML5, qui fournit des API grâce auxquelles vous pouvez générer et
restituer de façon dynamique des graphiques, des diagrammes, des images et des animations. L’API Canvas
pour HTML5 perfectionne la plateforme HTML5 en fournissant des fonctions de dessin bidimensionnelles.
Ces fonctions sont prises en charge par la plupart des systèmes d’exploitation et navigateurs actuels.
Grosso modo, Canvas est un moteur de rendu de bitmaps ; les dessins sont définitifs et ne peuvent pas être
redimensionnés. En outre, les objets dessinés sur Canvas ne font pas partie du DOM de la page web.
Dans une page web, vous pouvez ajouter des éléments Canvas à l’aide de la balise <Canvas>. Vous pouvez
les rendre interactifs en utilisant du code JavaScript. Pour plus d’informations, suivez ce lien.
Haut de la page
Le nouveau type de document HTML5 Canvas
325
Animate CC vous permet de créer un document HTML5 Canvas qui contient des illustrations, des
graphiques, des animations, etc. enrichis. Un nouveau type de document (HTML5 Canvas) ajouté à Animate
assure une prise en charge native pour créer un contenu HTML5 riche et interactif. En d’autres termes, vous
pouvez utiliser le scénario, l’espace de travail et les outils traditionnels d’Animate pour créer du contenu, puis
produire ensuite une sortie HTML5. Quelques clics suffisent pour créer un document HTML5 Canvas et
générer une sortie entièrement fonctionnelle. À cette fin, les options de document et de publication dans
Animate sont prédéfinies afin de générer une sortie HTML5.
Animate CC est intégré à CreateJS, ce qui permet de produire un contenu interactif enrichi sur les
technologies web ouvertes par l’intermédiaire de HTML5. Animate CC génère du code HTML et JavaScript
pour le contenu (bitmaps, vecteurs, formes, sons, interpolations, etc.) créé sur la scène. La sortie peut être
exécutée sur tous les périphériques ou navigateurs compatibles avec HTML5 Canvas.
Animate et l’API Canvas
Animate utilise l’API Canvas pour publier du contenu au format HTML5. Il traduit en contreparties Canvas les
objets créés dans la scène et ce, de manière transparente. Il permet de publier du contenu complexe en
HTML5 grâce au mappage 1:1 des fonctions Animate avec les API dans Canvas.
Haut de la page
Création d’un document HTML5 Canvas
Pour créer un document HTML5 Canvas, procédez comme suit :
1. Dans l’écran de bienvenue d’Animate CC, cliquez sur l’option HTML5 Canvas. Dans le
fichier FLA qui s’ouvre, les paramètres de publication ont été modifiés pour générer la
sortie HTML5.
2. Vous pouvez aussi sélectionner Fichier > Nouveau pour ouvrir la boîte de dialogue
Nouveau document. Cliquez sur l’option HTML5 Canvas.
Vous pouvez maintenant commencer à créer du contenu HTML5 à l’aide des outils disponibles dans Animate.
Lorsque vous commencez à travailler avec le document HTML5 Canvas, certains outils et fonctions ne sont
pas pris en charge et sont désactivés. En effet, Animate prend en charge les fonctions qui sont elles-mêmes
prises en charge par l’élément Canvas dans HTML5. Par exemple, les transformations 3D, les lignes en
pointillés et les effets de biseau ne sont pas pris en charge.
Haut de la page
Rendre le document HTML5 Canvas interactif
Animate CC publie le contenu HTML5 en utilisant les bibliothèques CreateJS.La suite de bibliothèques et
d’outils modulaires CreateJS permet de produire un contenu interactif riche sur les technologies web ouvertes
au moyen de HTML5. Elle se compose des éléments suivants : EaselJS, TweenJS, SoundJS et PreloadJS.
CreateJS convertit en HTML5 le contenu créé sur scène à l’aide de ces différentes bibliothèques, pour
générer des fichiers de sortie HTML et JavaScript. Vous pouvez également améliorer le contenu en
manipulant ce fichier JavaScript.
Toutefois, Animate CC permet de rendre interactifs des objets sur scène créés dans l’application pour
HTML5 Canvas. Ainsi, vous pouvez ajouter du code JavaScript aux objets individuels sur scène directement
dans Animate et les prévisualiser au moment de la création. Animate assure alors une prise en charge native
du code JavaScript à l’aide des fonctions utiles de l’éditeur de code, afin de rendre plus efficaces les
processus des programmeurs.
Vous pouvez sélectionner des images et des images clés individuelles dans le scénario pour rendre votre
contenu interactif. Vous pouvez rendre un document HTML5 Canvas interactif à l’aide de JavaScript. Pour en
savoir plus sur la rédaction du code JavaScript, cliquez ici.
Il est possible d’écrire le code JavaScript directement dans le panneau Actions, qui prend en charge les
fonctions suivantes lors de l’écriture de code JavaScript :
326
Indicateurs de code Permet d’insérer et de modifier rapidement le code JavaScript, sans erreur. À mesure
que vous tapez des caractères dans le panneau Actions, une liste de suggestions s’affiche et vous aide à
compléter votre saisie.
En outre, Animate prend en charge certaines fonctions inhérentes au panneau Actions lorsque vous utilisez
HTML5 Canvas. Ces fonctions permettent d’améliorer l’efficacité du processus en rendant des objets sur la
scène interactifs. Il s’agit des fonctions suivantes :
Mise en évidence de la syntaxe Affiche le code dans différentes polices ou couleurs en fonction de la
syntaxe. Cette fonction permet de rédiger le code d’une manière structurée, vous aidant ainsi à différencier
visuellement le code correct et les erreurs de syntaxe.
Coloration du code Affiche le code dans différentes couleurs en fonction de la syntaxe. Vous pouvez ainsi
distinguer visuellement les différentes parties d’une syntaxe.
Parenthèse Ajoute automatiquement les crochets/parenthèses fermants et ouvrants lors de la rédaction de
code JavaScript.
(A) Mise en évidence de la syntaxe (B) Coloration du code (C) Parenthèses
Vous pouvez rendre des formes ou des objets sur la scène interactifs à l’aide de JavaScript. Vous pouvez
aussi ajouter du code JavaScript à des images et images clés individuelles.
1. Sélectionnez l’image à laquelle vous souhaitez ajouter du code JavaScript.
2. Pour ouvrir le panneau Actions, sélectionnez Fenêtre >Actions.
Utilisation des fragments de code JavaScript
Vous pouvez ajouter de l’interactivité en utilisant les fragments de code JavaScript disponibles dans Animate
CC. Pour accéder aux fragments de code et les utiliser, sélectionnez Fenêtre > Fragments de code. Pour
plus d’informations sur l’ajout de fragments de code JavaScript, reportez-vous à cet article.
Références à la documentation CreateJS
Bibliothèque
CreateJS
EaselJS
Exemples de code su
Documentation de l’API
http://createjs.com/Docs/EaselJS/modules/EaselJS.html
327
https://github.com/createj
TweenJS
http://createjs.com/Docs/TweenJS/modules/TweenJS.html
https://github.com/createj
SoundJS
http://createjs.com/Docs/SoundJS/modules/SoundJS.html
https://github.com/createj
PreloadJS
http://createjs.com/Docs/PreloadJS/modules/PreloadJS.html https://github.com/createj
EaselJS
TweenJS
SoundJS
PreloadJS
Haut de la page
Publication d’animations au format HTML5
Pour publier du contenu sur scène vers HTML5, procédez comme suit :
1. Sélectionnez Fichier > Paramètres de publication.
2. Dans la boîte de dialogue Paramètres de publication, spécifiez les paramètres suivants :
Paramètres simples
Sortie Répertoire de publication du fichier FLA. Il s’agit, par défaut, du même répertoire que celui du fichier
FLA, mais vous pouvez le changer en cliquant sur le bouton de navigation « ... ».
Scénario en boucle Lorsque cette option est activée, le scénario est exécuté en boucle ; dans le cas
contraire, il s’arrête une fois la lecture achevée.
Inclure les calques masqués Si cette option est désactivée, les calques masqués ne sont pas inclus dans
la sortie.
Centrer la scène Permet aux utilisateurs de spécifier si la scène doit être centrée horizontalement,
verticalement ou les deux. La scène ou le plan de travail HTML s’affiche au centre de la fenêtre du
navigateur par défaut.
Rendre réactif Permet aux utilisateurs de spécifier si l’animation doit réagir par rapport à la largeur, à la
328
hauteur ou les deux et redimensionne la sortie publiée en fonction de différents facteurs de forme. Il en
résulte une sortie HiDPI réactive, plus nette et plus précise.
La sortie s’étend également pour couvrir la zone entière de l’écran sans bordures, mais conserve les
proportions d’origine, bien qu’une partie du plan de travail puisse ne pas être visible.
Avec les options Largeur, Hauteur ou Les deux, le contenu entier est mis à l’échelle
selon la taille du plan de travail et est visible même sur un petit écran (appareils mobiles
ou tablettes, par exemple). Si la taille de l’écran est supérieure à la taille de la scène de
création, le plan de travail s’affiche à sa taille d’origine.
Ajuster à la zone visible Permet aux utilisateurs de spécifier si l’animation doit être adaptée pour afficher la
sortie en mode plein écran ou être adaptée à la taille de l’écran. Cette option est désactivée par défaut.
Ajuster à la vue : affiche la sortie en mode plein écran en utilisant tout l’espace à l’écran et en conservant
les proportions.
Étirer pour ajuster : étire la sortie pour qu’elle s’affiche sans bordures.
Inclure le pré-chargeur : Permet aux utilisateurs de spécifier s’ils souhaitent utiliser le fichier de
préchargement par défaut ou un fichier de préchargement de leur choix de la bibliothèque de documents.
Le fichier de préchargement est un indicateur visuel sous forme d’un fichier GIF animé qui s’affiche pendant
le chargement des scripts et des actifs requis pour le rendu d’une animation. Une fois les actifs chargés, le
fichier de préchargement est masqué et l’animation réelle est affichée.
Par défaut, l’option de préchargement n’est pas sélectionnée.
L’option Par défaut permet d’utiliser la méthode de préchargement par défaut ;
l’option Parcourir permet de choisir le fichier GIF de préchargement. Le fichier GIF de
préchargement est copié dans le dossier d’images configuré dans le volet Exporter des
éléments d’image.
Utilisez l’option Aperçu pour prévisualiser le fichier GIF sélectionné.
Paramètres de publication
Utilisez les options d’activation/désactivation pour choisir de publier au niveau de la racine ou du sousdossier. Ce bouton est Activé par défaut. Si vous sélectionnez Désactivé, le champ du dossier est désactivé
et les éléments sont exportés dans le même dossier que le fichier de sortie.
329
Publication d’éléments Canvas dans le dossier racine
Exporter des éléments d’image Dossier dans lequel sont placés les éléments d’images et à partir duquel
ils sont référencés.
Regrouper dans des feuilles Sprite : sélectionnez cette option pour regrouper tous les éléments d’image
dans une feuille Sprite. Pour plus d’options de feuilles Sprite, voir Exportation de bitmaps comme une feuille
Sprite.
Exporter les éléments sonores Dossier dans lequel sont placés les éléments sonores du document et à
partir duquel ils sont référencés.
Exporter les éléments CreateJS Dossier dans lequel sont placées les bibliothèques CreateJS et à partir
duquel elles sont référencées.
Remarque : Le paramètre par défaut continue à publier des fichiers répartis dans des sous-dossiers
logiques.
Paramètres avancés
Options d’exportation des actifs URL relatives pour exporter des images et des sons et prendre en charge
les bibliothèques JavaScript CreateJS. Si vous ne cochez pas la case de droite, ces actifs ne sont pas
exportés depuis le fichier FLA, mais le chemin spécifié est tout de même utilisé pour assembler leurs URL.
Cette option facilite la publication depuis un fichier FLA comportant de nombreux actifs multimédias et évite le
remplacement des bibliothèques JavaScript modifiées.
Grâce à l’option Exporter tous les bitmaps comme des feuilles Sprite, vous pouvez rassembler dans une
feuille Sprite tous les bitmaps du document du plan de travail, et réduire ainsi le nombre de requêtes de
serveur et améliorer les performances. Vous pouvez définir la taille maximale de la feuille Sprite en spécifiant
les valeurs de hauteur et de largeur.
330
Modèle pour la publication HTML :
Utiliser la valeur par défaut : publiez votre sortie HTML5 en utilisant le modèle par défaut.
Importer nouveau : importez un nouveau modèle pour votre document HTML5.
Exporter : exportez votre document HTML5 comme un modèle.
Bibliothèques hébergées : Si cette option est activée, les copies des bibliothèques hébergées sur le CDN
CreateJS à l’adresse code.createjs.com sont utilisées. Cette option permet de mettre en cache les
bibliothèques en vue de les partager sur divers sites.
Inclure les calques masqués : Si cette option est désactivée, les calques masqués ne sont pas inclus dans
la sortie.
331
Compacter les formes : Si cette option est activée, les instructions vectorielles sont produites sous forme
compactée. Désactivez cette option pour exporter des instructions lisibles et détaillées (option utile à des fins
didactiques).
Limites des images multiples : Si vous activez cette option, les symboles du scénario incluent une
propriété frameBounds contenant un tableau de rectangles qui correspond aux limites de chaque image dans
le scénario. Les limites des images multiples augmentent considérablement la durée de publication.
Remplacer le fichier HTML à la publication et Inclure le code JavaScript dans le fichier HTML : Si
l’option Inclure le code JavaScript dans le fichier HTML est sélectionnée, la case Remplacer le fichier HTML
à la publication est cochée et activée.Si vous décochez la case Remplacer le fichier HTML à la publication,
l’option Inclure le code JavaScript dans le fichier HTML est décochée et désactivée.
3. Cliquez sur Publier pour publier le contenu à l’emplacement spécifié.
Remarque : une animation conçue à l’aide de scénarios imbriqués, avec une seule image, ne peut pas être
lue en boucle.
Haut de la page
Variables des modèles HTML
Quand vous importez un nouveau modèle HTML personnalisé, pendant la publication, les variables par
défaut sont remplacées par les fragments de code personnalisés en fonction des composants de votre fichier
FLA.
Le tableau suivant répertorie les variables de modèle actuellement reconnues et remplacées par Animate :
Attribut/paramètre
Variable du modèle
Titre du document HTML
$TITLE
Espace réservé permettant d’inclure des scripts
CreateJS
$CREATEJS_LIBRARY_SCRIPTS
Espace réservé permettant d’inclure les scripts
générés (notamment des scripts de police web)
$ANIMATE_CC_SCRIPTS
Balise HTML pour lancer un script côté client
$SCRIPT_START
Espace réservé au code pour créer le chargeur
(CreateJS LoadQueue)
$CREATE_LOADER
Espace réservé au code pour charger les éléments
présents dans le manifeste
$LOAD_MANIFEST
Espace réservé au code définissant la méthode de
chargement des fichiers
$HANDLE_FILE_LOAD_START
Espace réservé au code pour gérer l’événement de
chargement du fichier
$HANDLE_FILE_LOAD_BODY
Espace réservé au code concluant la méthode de
chargement des fichiers
$HANDLE_FILE_LOAD_END
Espace réservé au code définissant la gestion de la
méthode Terminer ; fonction appelée une fois les
éléments chargés
$HANDLE_COMPLETE_START
Espace réservé au code pour créer la scène
$CREATE_STAGE
Espace réservé au code pour l’enregistrement de
l’événement Tick, après lequel commence l’animation
$START_ANIMATION
332
Espace réservé au code pour prendre en charge la
mise à l’échelle réactive et les affichages hidpi
$RESP_HIDPI
Espace réservé au code concluant la gestion de la
méthode Terminer
$HANDLE_COMPLETE_END
Espace réservé pour une fonction qui gère le contenu
avec
du son
$PLAYSOUND
Espace réservé pour styler la section afin de prendre
en charge le centrage sur le plan de travail
$CENTER_STYLE
Espace réservé à la propriété de style d’affichage du
plan de travail pour la prise en charge du fichier de
préchargement
$CANVAS_DISP
Espace réservé au code pour afficher le fichier de
préchargement
$PRELOADER_DIV
Balise HTML pour la fin du script côté client
$SCRIPT_END
Identifiant d’élément de plan de travail
$CANVAS_ID
Largeur de l’élément de la scène ou du plan de travail
$WT
Hauteur de l’élément de la scène ou du plan de
travail
$HT
Couleur d’arrière-plan de l’élément de la scène ou du
plan de travail
$BG
Version d’Animate CC utilisée pour générer
du contenu
$VERSION
Les jetons suivants issus des versions précédentes sont obsolètes dans la présente version :
Attribut/paramètre
Variable du modèle
Espace réservé pour inclure les scripts (CreateJS et JavaScript
généré)
$CREATEJS_SCRIPTS
Espace réservé au code permettant d’initialiser les bibliothèques
CreateJS, de charger le média, de créer et mettre à jour la
scène
$CJS_INIT*
Remarque : Ces jetons sont modularisés et remplacés par d’autres jetons.
Haut de la page
Prise en charge JSAPI pour importer et exporter des modèles
HTML pour les documents Canvas
Les commandes JSAPI suivantes prennent en charge l’importation et l’exportation de modèles HTML pour les
documents Canvas :
Exporte le modèle de publication HTML5 Canvas pour un document donné, à
333
l’emplacement spécifié :
bool document::exportCanvasPublishTemplate(pathURI)
Exemple :
var pathURI ="file:///C|/Users/username/desktop/CanvasTemplate.html”
var exportFlag =fl.getDocumentDOM().exportCanvasPublishTemplate(pathURI);
if(!exportFlag)
fl.trace(“Template could not be exported”);
Importe et définit le modèle de publication HTML5 Canvas pour un document donné, à
partir de l’emplacement pathURI spécifié :
bool document::importCanvasPublishTemplate(pathURI)
Exemple :
var pathURI= “file:///C|/Users/username/desktop/CanvasTemplate.html”;
var exportFlag =fl.getDocumentDOM().importCanvasPublishTemplate(pathURI);
if(!exportFlag)
fl.trace(“Template could not be imported”);
Haut de la page
Code JavaScript incorporé au code HTML
Animate permet d’inclure le fichier JS dans le fichier HTML durant la publication du plan de travail.
1. Dans le menu Paramètres de publication, passez à l’onglet Avancé et sélectionnez
Inclure le code JavaScript dans le fichier HTML.
2. Dans la boîte de dialogue Inclure le code JavaScript dans le fichier HTML à la
publication, cliquez sur OK pour republier le contenu écrasant le code HTML.
3. Ceci désactive la case à cocher Remplacer le fichier HTML à la publication ; pendant
un événement de publication, le code HTML est généré mais pas écrasé.
4. Sous Arrêter d’inclure le code JavaScript dans le fichier HTML, cliquez sur OK pour
exclure le code JavaScript et republier le fichier HTML.
5. Si l’option Remplacer le fichier HTML à la publication n’est pas sélectionnée, l’option
Inclure le code JavaScript dans le fichier HTML est automatiquement désactivée.
Remarque : Si vous ne souhaitez pas que le code HTML soit remplacé, les options ​Remplacer le fichier
HTML à la publication et Inclure le code JavaScript dans le fichier HTML ne peuvent pas coexister.
334
Fusion de JS avec HTML
Haut de la page
Fusion des données JSON dans JS
D’après les commentaires des utilisateurs et du fait que les fichiers JSON ne sont en soi pas sécurisés, nous
avons fusionné les données appropriées avec le fichier JS ; ainsi, aucun fichier JSON distinct n’est créé.
Haut de la page
Optimisation des sorties HTML5 Canvas
Animate optimise la taille et les performances des sorties HTML5 Canvas comme suit :
Exportation de bitmaps comme une feuille Sprite à l’aide des options de l’onglet Feuille
Sprite dans les Paramètres de publication.
En excluant les calques masqués (en désélectionnant l’option Inclure les calques
invisibles) de la sortie publiée.
En excluant tous les éléments inutilisés tels que les sons et les bitmaps, ainsi que tous
les éléments des images inutilisées (par défaut).
En spécifiant de ne pas exporter les éléments du fichier FLA en désélectionnant les
options d’exportation des actifs pour les images et les sons, en prenant en charge les
bibliothèques JavaScript CreateJS et en utilisant les URL relatives pour l’exportation.
Sortie HTML5 Canvas compatible avec HiDPI : Animate met à l’échelle la sortie en
fonction de la résolution de l’appareil sur lequel est affiché le contenu. Cette compatibilité
permet de générer une sortie plus nette lors de l’utilisation du zoom et corrige également
les problèmes de pixellisation des documents Canvas lorsque vous affichez la sortie
335
HTML5 Canvas sur un ordinateur haute résolution.
Définition d’un arrière-plan de travail transparent
Vous pouvez personnaliser le plan de travail en différentes couleurs et également modifier sa transparence
d’affichage. Lorsque vous créez un plan de travail transparent, vous pouvez afficher le contenu HTML sousjacent durant la publication.
Remarque : Ce paramètre rend l’arrière-plan transparent pendant la publication OAM.
1. Choisissez le plan de travail à modifier.
2. Dans le volet Propriétés, sélectionnez Scène.
3. Dans la scène, définissez les valeurs de pourcentage pour Alpha.
Prise en charge du nuancier « Aucune couleur »
Vous pouvez également utiliser l’option Aucune couleur du nuancier pour rendre l’arrière-plan de travail
transparent :
1. Sélectionnez Modification > Document > Couleur de la scène ou dans l’Inspecteur
des propriétés, sélectionnez Paramètres avancés.
2. Dans le nuancier Couleur de la scène, sélectionnez Aucune couleur.
Transparence du plan de travail
336
Transparence du plan de travail : paramètres avancés
Exportation des bitmaps comme une feuille Sprite
L’exportation sous forme de feuille Sprite d’un certain nombre de bitmaps que vous avez utilisés dans votre
document HTML5 Canvas réduit le nombre de requêtes de serveur et la taille de la sortie, et améliore les
performances. Vous pouvez exporter la feuille Sprite au format PNG (par défaut), JPEG ou les deux.
1. Dans l’onglet Feuille Sprite, activez la case à cocher Regrouper les éléments d’image
dans des feuilles Sprite.
2. Sélectionnez le Format PNG, JPEG ou Les deux.
3. Si vous avez sélectionné PNG ou Les deux, spécifiez les options suivantes sous
Paramètres PNG :
Qualité : définissez la qualité de la feuille Sprite : 8 bits (par défaut), 24 bits ou
32 bits.
Taille max. : spécifiez la hauteur et la largeur maximales de la feuille Sprite, en
pixels.
Arrière-plan : cliquez et définissez la couleur d’arrière-plan de la feuille Sprite.
4. Si vous avez sélectionné JPEG ou Les deux, spécifiez les options suivantes sous
Paramètres JPEG :
Qualité : définissez la qualité de la feuille Sprite.
Taille max. : spécifiez la hauteur et la largeur maximales de la feuille Sprite, en
pixels.
Arrière-plan : cliquez et définissez la couleur d’arrière-plan de la feuille Sprite.
337
Haut de la page
Utilisation du texte dans le document HTML5 Canvas
Le plan de travail HTML prend en charge le texte statique et dynamique.
Texte statique
Le texte statique offre plus de latitude : tous les éléments sont convertis en contours au moment de la
publication, ce qui fournit à l’utilisateur un excellent environnement tel écrit, tel écran. Le texte est publié sous
forme de contours vectoriels, vous pouvez donc les modifier au moment de l’exécution.
Remarque : Un recours trop intensif au texte statique peut gonfler la taille du fichier.
338
Texte dynamique
Le texte dynamique permet de modifier le texte au moment de l’exécution et n’augmente pas de manière
significative la taille du fichier. Il prend en charge moins d’options que le texte statique. En revanche, il prend
en charge les polices web par l’intermédiaire de Typekit.
Si vous employez du texte dynamique avec des polices indisponibles sur les ordinateurs de l’utilisateur final,
la sortie utilise la police par défaut pour l’affichage et biaise ainsi l’expérience utilisateur. Ces problèmes sont
résolus avec les polices web.
Ajout de polices web Typekit au document HTML5 Canvas
Animate CC offre des polices web Typekit pour le texte dynamique des documents HTML5 Canvas. Typekit
fournit un accès direct à des milliers de polices de qualité supérieure mises au point par nos meilleures
fonderies partenaires. Accédez aux polices Typekit et utilisez-les simplement dans votre sortie HTML5 pour
les navigateurs et les terminaux mobiles modernes, en utilisant votre abonnement à Creative Cloud.
Pour en savoir plus sur l’utilisation des polices Typekit dans Animate CC, voir Utilisation de polices web
Typekit dans les documents HTML5 Canvas.
Animate 2015.2 améliore l’environnement visuel du texte dynamique dans un document Canvas, de sorte que
la scène et les aspects publiés sont synchronisés.
Remarque : Les polices web de Typekit ne sont pas disponibles pour le texte statique.
Vidéo : Améliorations du texte dans Animate CC
De Train Simple (www.trainsimple.com)
Haut de la page
Présentation de la sortie HTML5 Canvas
La sortie HTML5 publiée contient les fichiers suivants :
Fichier HTML Contient des définitions pour tous les objets, formes et illustrations de l’élément Canvas. Il
invoque également l’espace de noms CreateJS pour convertir Animate en HTML5 et le fichier JavaScript
correspondant qui contient des éléments interactifs.
Fichier JavaScript Contient des définitions dédiées ainsi que le code pour tous les éléments interactifs de
l’animation. Le code pour tous les types d’interpolation est également défini dans le fichier JavaScript.
Ces fichiers sont copiés au même emplacement que celui du fichier FLA par défaut. Vous pouvez modifier
cet emplacement en spécifiant le chemin d’accès de la sortie dans la boîte de dialogue Paramètres de
publication (Fichier > Paramètres de publication).
Haut de la page
Migration de contenu existant vers HTML5 Canvas
Vous pouvez faire migrer le contenu existant dans Animate pour générer une sortie HTML5. À cette fin,
Animate vous permet de faire migrer le contenu en copiant ou en important manuellement des calques, des
symboles et d’autres éléments de bibliothèque individuels. Vous pouvez aussi exécuter la commande
Convertir AS3 en document HTML5 Canvas pour exporter automatiquement le contenu ActionScript existant
vers un nouveau document HTML5 Canvas. Pour plus d’informations, suivez ce lien.
Lorsque vous utilisez le type de document HTML5 dans Animate CC, certaines fonctions ne sont pas prises
339
en charge. Cela est dû au fait que ces fonctions dans Animate n’ont pas de fonctions correspondantes dans
l’API Canvas. Elles ne peuvent donc pas être utilisées dans le document de type HTML5 Canvas. Cela peut
se produire au cours de la migration de contenu, lorsque vous essayez d’effectuer les opérations suivantes :
Copier du contenu (calques ou symboles de la bibliothèque) d’un document Animate de type classique (par
exemple ActionScript 3.0, AIR for Android, AIR for Desktop, etc.) dans un document HTML5. Dans ce cas, le
type de contenu non pris en charge est supprimé ou converti en valeurs par défaut prises en charge.
Par exemple, le fait de copier une animation 3D supprime toutes les transformations 3D appliquées aux
objets sur la scène.
Importer un fichier PSD ou AI qui contient le contenu non pris en charge. Dans ce cas, le contenu est
supprimé ou converti en valeurs par défaut prises en charge.
Par exemple, si vous importez un fichier PSD sur lequel est appliqué l’effet Biseau dégradé, Animate
supprime l’effet.
Utiliser plusieurs types de documents (par exemple, ActionScript 3.0 et HTML5 Canvas) simultanément et
permuter entre les documents avec un outil ou une option sélectionné non pris en charge. Dans ce cas,
Animate CC indique visuellement que la fonction n’est pas prise en charge.
Par exemple, vous avez créé une ligne pointillée dans un document ActionScript 3.0 et êtes passé en mode
HTML5 Canvas alors que l’outil Ligne était toujours sélectionné. Observez le pointeur et l’inspecteur des
propriétés : des icônes s’y affichent pour indiquer que la ligne pointillée n’est pas prise en charge dans
HTML5 Canvas.
Scripts Les composants ActionScript sont supprimés et les marques de commentaire du code sont
supprimées. Par ailleurs, si le bloc de commentaires contient du code JavaScript (pour Toolkit for CreateJS
avec Animate CC 13.0), vérifiez que vous avez supprimé manuellement les marques de commentaire du
code.
Si, par exemple, vous avez copié des calques qui contiennent des boutons, ils sont supprimés.
Modifications appliquées au contenu après la migration
Voici une liste des types de modifications appliquées lorsque vous migrez le contenu existant vers un
document HTML5 Canvas.
Le contenu est supprimé Les types de contenu non pris en charge dans HTML5 Canvas sont supprimés.
Par exemple :
les transformations 3D sont supprimées ;
les marques de commentaire du code ActionScript sont supprimées ;
les vidéos sont supprimées.
Le contenu est modifié en une valeur par défaut prise en charge Le type de contenu ou la fonction est
pris en charge, mais une propriété de la fonction ne l’est pas. Par exemple :
L’incrustation BlendMode n’est pas prise en charge ; elle est modifiée en Normal.
La ligne pointillée n’est pas prise en charge ; elle est modifiée en Continu.
Pour obtenir la liste complète des fonctions qui ne sont pas prises en charge et de leurs valeurs de
substitution pendant la migration, consultez cet article.
Haut de la page
Conversion d’autres types de documents en HTML5 Canvas
Grâce au convertisseur universel de type de document, vous pouvez convertir des projets FLA existants (de
340
tout type) en n’importe quel autre type de document tel que HTML5 Canvas, ActionScript/AIR, WebGL ou un
type de document personnalisé. Lors de la conversion dans un format donné, vous pouvez profiter des
fonctions de création d’Animate pour ce type de document.
Pour en savoir plus, voir Conversion en d’autres formats de document.
Conversion d’un document ActionScript 3 en document HTML5 Canvas à l’aide d’un
script JSFL
Animate CC fournit un script JSFL qui permet de convertir un document AS3 en document HTML5 Canvas.
Une fois exécuté, le script JSFL effectue les opérations suivantes :
Il crée un document HTML5 Canvas.
Il copie tous les calques, symboles et éléments de bibliothèque dans le nouveau
document HTML5 Canvas.
Il applique les valeurs par défaut aux fonctions, sous-fonctions ou propriétés de fonction
non prises en charge.
Il crée des fichiers FLA distincts pour chaque scène, car le document HTML5 Canvas ne
prend pas en charge les scènes multiples.
Pour convertir un document AS3 en document HTML5 Canvas, procédez comme suit :
1. Ouvrez le document ActionScript 3 dans Animate CC.
2. Sélectionnez Commandes > Convertir AS3 en document HTML5 Canvas.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
341
Pinceaux personnalisés
Aperçu
Choix d’un pinceau personnalisé
Création d’un pinceau personnalisé
Taille du pinceau en cours de zoom avec niveau de zoom de la scène et
redimensionnement
Modification d’un pinceau personnalisé
Suppression d’un pinceau personnalisé
Synchronisation des pinceaux personnalisés sur le cloud
Haut de la page
Aperçu
L’outil Pinceau (B) d’Adobe Animate CC peut être personnalisé en définissant des paramètres tels que la
forme et l’angle. Cela vous permet de créer des illustrations naturelles dans vos projets en personnalisant
l’outil Pinceau en fonction de vos besoins de dessin. Vous pouvez sélectionner, modifier et créer un pinceau
personnalisé dans Animate par le biais de l’Inspecteur des propriétés, lorsque l’outil Pinceau est sélectionné
dans la boîte à outils.
Haut de la page
Choix d’un pinceau personnalisé
Par défaut, l’outil Pinceau fournit une série de pinceaux avec des formes personnalisées pour répondre à de
vos différents besoins de dessin. Vous pouvez voir un certain nombre de formes de pinceaux lorsque vous
sélectionnez l’outil Pinceau dans la boîte à outils et que vous regardez en dessous du paramètre « Pinceau »
dans l’Inspecteur des propriétés.
Vous pouvez sélectionner un pinceau dans le menu déroulant Pinceau et commencer à dessiner l’illustration
sur la scène.
Haut de la page
Création d’un pinceau personnalisé
Vous pouvez créer des pinceaux personnalisés avec une taille, un angle ou une planéité personnalisé(e)
comme suit :
1. Cliquez sur « Outil Pinceau (B) » dans la boîte à outils et cliquez sur le bouton « + » en
regard du paramètre « Pinceau » dans l’Inspecteur des propriétés.
342
2. Dans la boîte de dialogue Options de la plume, sélectionnez une forme, spécifiez un
angle et indiquez un pourcentage de planéité. Vous pouvez afficher un aperçu du
pinceau lorsque vous définissez les paramètres.
3. Cliquez sur OK. Le nouveau pinceau personnalisé est sélectionné dans l’Inspecteur des
propriétés comme pinceau par défaut pour le document actif.
Haut de la page
Taille du pinceau en cours de zoom avec niveau de zoom de la
scène et redimensionnement
Cochez la case Taille de zoom avec la scène pour adapter la taille du pinceau proportionnellement au niveau
de zoom modulable de la scène. Vous pouvez ainsi dessiner simplement quel que soit le niveau de zoom. Si
vous souhaitez rétablir le comportement de pinceau par défaut antérieur, qui préserve une taille de pixels
constante quel que soit le niveau de zoom, désactivez la case à cocher Taille de zoom avec la scène dans
l’inspecteur des propriétés du pinceau.
Vous pouvez redimensionner le pinceau à la taille souhaitée en réglant l’option Taille. L’icône d’aperçu en
regard de l’option Taille indique la taille du pinceau en fonction du niveau de zoom.
343
A. Redimensionnement du pinceau B. Obtenez un aperçu de la taille du pinceau au fur et à mesure que vous
changez le niveau de zoom. C. Effectuez un zoom sur la taille du pinceau avec le niveau de zoom de la
scène.
Haut de la page
Modification d’un pinceau personnalisé
Vous pouvez modifier les propriétés du pinceau personnalisé que vous avez créé comme suit :
1. Dans l’Inspecteur des propriétés, sélectionnez le pinceau personnalisé que vous voulez
modifier en cliquant sur le bouton présentant une icône en forme de crayon en regard
des options de pinceau.
2. Dans la boîte de dialogue Options de la plume, modifiez les propriétés telles que la
forme, l’angle et la planéité, puis cliquez sur OK.
Remarque : Vous ne pouvez modifier que les pinceaux que vous avez personnalisés et vous ne pouvez
modifier les propriétés d’aucun des pinceaux par défaut.
Haut de la page
Suppression d’un pinceau personnalisé
1. Pour supprimer un pinceau personnalisé que vous avez créé, choisissez « Outil Pinceau
(B) » dans la boîte à outils et choisissez le pinceau personnalisé à supprimer sous
Remplissage et trait dans l’Inspecteur des propriétés.
2. Cliquez sur le bouton « - » qui est activé. Le pinceau personnalisé sélectionné est
supprimé de la liste.
344
Remarque : Vous ne pouvez supprimer que les pinceaux que vous avez créés. Vous n’êtes pas autorisé à
supprimer les pinceaux par défaut.
Haut de la page
Synchronisation des pinceaux personnalisés sur le cloud
Les pinceaux personnalisés que vous créez peuvent être synchronisés avec le cloud (votre compte
Creative Cloud) par le biais des préférences d’Animate. Pour ce faire, sélectionnez Édition > Préférences
sous Windows ou Animate > Préférences sous Mac. L’option de synchronisation des pinceaux personnalisés
est disponible sous la section « Paramètres de synchronisation » comme indiqué ci-dessous : -
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
345
Création de boutons avec Animate CC
Étapes élémentaires de la création de boutons
Création d’un bouton avec un symbole de bouton
Activation, modification et test des symboles de bouton
Résolution des problèmes liés aux boutons
Ressources supplémentaires concernant les boutons
Haut de la page
Étapes élémentaires de la création de boutons
1. Choisissez le type de bouton le mieux adapté à vos besoins.
Symbole de bouton La plupart des utilisateurs préfèrent les symboles de bouton, car ils
offrent plus de souplesse. Les symboles de bouton contiennent un scénario interne
propre à l’état des boutons. Vous pouvez facilement créer des états Relevé, Enfoncé et
Survolé visuellement différents. Par ailleurs, les symboles de bouton modifient
automatiquement leur état en réponse aux actions de l’utilisateur.
Bouton de clip Vous pouvez utiliser un symbole de clip pour créer des effets de bouton
sophistiqués. Les symboles de clip peuvent contenir pratiquement tout type de contenu,
notamment une animation. Néanmoins, les symboles de clip ne disposent pas des états
RelevéEnfoncé et Survolé intégrés. Vous pouvez créer ces états vous-même à l’aide
d’ActionScript. L’un des inconvénients des fichiers de clip est qu’ils sont plus volumineux
que les fichiers de bouton.
Composant de bouton ActionScript Utilisez un composant de bouton si vous
nécessitez uniquement un bouton standard ou un bouton bascule, et ne souhaitez pas le
personnaliser outre mesure. Les composants de bouton ActionScript 2.0 et 3.0 disposent
de code intégré permettant de modifier l’état des boutons. Par conséquent, il n’est pas
nécessaire de définir l’aspect et le comportement des états de bouton. Il suffit de
déplacer le composant vers la scène.
Les composants de bouton ActionScript 3.0 permettent quelques
personnalisations. Vous pouvez lier le bouton à d’autres composants, et partager et
afficher les données de l’application. Ils disposent de fonctions intégrées, telles que la
prise en charge de l’accessibilité. Les composants Button, RadioButton et CheckBox
sont disponibles.
Les composants de bouton ActionScript 2.0 ne sont pas personnalisables. Ce
composant permet de modifier l’état des boutons.
2. Définissez les états de votre bouton.
Image Relevé Aspect du bouton lorsque l’utilisateur n’interagit pas avec.
Image Survolé Apparence du bouton lorsque l’utilisateur est sur le point de le
sélectionner.
Image Enfoncé Aspect du bouton lorsque l’utilisateur le sélectionne.
346
Image Cliqué Zone sensible aux clics de l’utilisateur. La définition de l’image Cliqué est
facultative. Si votre bouton est de petite taille ou si sa zone graphique n’est pas contiguë,
il peut être utile de définir cette image.
Le contenu de l’image Cliqué n’est pas visible sur la scène lors de la lecture.
Assurez-vous que le graphique de l’image Cliqué est une zone pleine suffisamment
grande pour englober tous les éléments graphiques des images Relevé, Enfoncé et
Survolé.
Si vous ne spécifiez pas une image Cliqué, l’image de l’état Relevé est utilisée.
Vous pouvez créer un bouton qui répond lorsque vous cliquez sur une autre zone de
la scène ou la survolez (survol discontinu). Placez le graphique de l’image Cliqué à
un emplacement différent de celui des graphiques de l’image du bouton.
3. Associez une action au bouton.
Pour qu’une réaction se produise lorsque l’utilisateur sélectionne un bouton, ajoutez du
code ActionScript au scénario. Placez le code ActionScript dans les mêmes images que
les boutons. Le panneau Fragments de code dispose de code ActionScript 3.0 pré-écrit
pour de nombreux cas d’utilisation de bouton. Voir Ajout d’interactivité à l’aide de
fragments de code.
Remarque : ActionScript 2.0 n’est pas compatible avec ActionScript 3.0. Si votre
version d’Animate fait utilise ActionScript 3.0, vous ne pouvez pas coller du code
ActionScript 2.0 dans votre bouton (et inversement). Avant de coller du code ActionScript
d’une autre source dans vos boutons, vérifiez que la version est compatible.
Haut de la page
Création d’un bouton avec un symbole de bouton
Pour rendre un bouton interactif, placez une occurrence du symbole de bouton sur la scène et affectez-lui
des actions. Affectez ces actions au scénario racine du fichier FLA. N’ajoutez pas d’actions au scénario du
symbole de bouton. Pour ajouter des actions au scénario du bouton, utilisez plutôt un bouton de clip.
1. Choisissez Modifier > Tout désélectionner ou cliquez sur un emplacement vide de la
scène pour vous assurer qu’aucun élément n’est sélectionné.
2. Choisissez Insertion > Nouveau symbole.
3. Dans la boîte de dialogue Créer un symbole, entrez un nom. Pour le Type de symbole,
sélectionnez Button.
Animate bascule en mode d’édition de symbole. Le scénario change et affiche quatre
images consécutives, Relevé, Survolé, Enfoncéet Cliqué. La première image, Relevé, est
une image-clé vide.
4. Pour créer l’image du bouton dans un état Relevé, sélectionnez l’image Relevé dans le
scénario, puis utilisez les outils de dessin, importez un graphique ou placez une
occurrence d’un autre symbole sur la scène.
Vous pouvez insérer des symboles graphiques et de clip dans un bouton mais pas un
autre symbole de bouton.
5. Dans le scénario, cliquez sur l’image Survolé, puis choisissez Insertion > Scénario >
Image-clé.
Animate insère une image-clé qui duplique le contenu de l’image Relevé précédente.
6. Sans désélectionner l’image Survolé, remplacez ou modifiez l’image du bouton sur la
scène pour créer l’apparence requise de l’état Survolé.
7. Répétez les étapes 5 et 6 pour l’image de l’état Enfoncé et pour l’image facultative
Cliqué.
8. Pour attribuer un son à un état du bouton, sélectionnez l’image correspondant à cet état
dans le scénario et choisissez Fenêtre > Propriétés. Sélectionnez ensuite un son dans le
menu Son de l’inspecteur des propriétés. Seuls les sons que vous avez importés vous
sont proposés.
347
9. Lorsque vous avez terminé, choisissez Modifier > Modifier le document. Animate revient
au scénario principal de votre fichier FLA. Pour créer une occurrence du bouton que
vous avez créée sur la scène, faites glisser son symbole du panneau Bibliothèque vers
la scène.
10. Pour tester la fonctionnalité d’un bouton, choisissez la commande Contrôle > Tester.
Vous pouvez également afficher un aperçu des états d’un symbole de bouton sur la
scène en choisissant Contrôle > Activer les boutons simples. Vous pouvez ainsi afficher
les états Relevé, Survolé et Enfoncé d’un symbole de bouton sans utiliser la commande
Contrôle > Tester.
Haut de la page
Activation, modification et test des symboles de bouton
Par défaut, Animate désactive les symboles de bouton lorsque vous les créez. Sélectionnez un bouton, puis
activez-le pour voir s’il répond aux événements de souris. Il est recommandé de désactiver les boutons
lorsque vous travaillez et de les activer pour tester rapidement leur comportement.
Pour sélectionner un bouton, utilisez l’outil Sélection et dessinez un rectangle de sélection
autour du bouton.
Pour activer ou désactiver les boutons sur la scène, choisissez Contrôle > Activer les
boutons simples. Cette commande permet de passer d’un état à l’autre.
Pour déplacer un bouton, utilisez les touches fléchées.
Pour modifier un bouton, utilisez l’inspecteur des propriétés. S’il n’est pas visible,
choisissez Fenêtre > Propriétés.
Pour tester le bouton dans l’environnement de création, choisissez Contrôle > Activer les
boutons simples.
Pour tester le bouton dans Flash Player, choisissez Contrôle > Tester l’animation [ou
Tester la séquence] > Tester. Cette méthode est l’unique moyen de tester des boutons
de clip.
Pour tester le bouton dans la fenêtre d’aperçu de la bibliothèque, sélectionnez le bouton
dans la bibliothèque et cliquez sur Lire.
Haut de la page
Résolution des problèmes liés aux boutons
Utilisez les ressources suivantes pour résoudre les problèmes les plus courants concernant les boutons :
Note technique : Adding actions to shared buttons (Adobe.com, disponible en anglais
uniquement)
Haut de la page
Ressources supplémentaires concernant les boutons
Les notes techniques suivantes contiennent des instructions pour des scénarios de bouton spécifiques :
Note technique : How to create a new button (Adobe.com, disponible en anglais
uniquement)
Note technique : Creating advanced buttons (Adobe.com, disponible en anglais
uniquement)
348
Note technique : How can one button do different things at different times? (Adobe.com,
disponible en anglais uniquement)
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
349
Utilisation de plusieurs scénarios
À propos des clips imbriqués et de la hiérarchie parent-enfant
Haut de la page
À propos des clips imbriqués et de la hiérarchie parent-enfant
Lorsque vous ajoutez une occurrence de clip dans un document Animate, le clip dispose de son propre
scénario. Chaque symbole de clip possède son propre scénario. Le scénario du clip est imbriqué dans le
scénario principal du document. Une occurrence de clip peut elle-même contenir une autre occurrence de
clip.
Lorsqu’un clip est ajouté dans un document Animate, ou imbriqué dans un autre clip, il devient l’enfant de ce
clip ou de ce document, qui en devient le parent. Les relations entre les clips imbriqués sont hiérarchiques :
les modifications apportées au parent affectent l’enfant. Le scénario principal pour chaque niveau est le
parent de tous les clips à son niveau et, comme il s’agit du scénario le plus élevé, il ne possède pas de
parent. Dans le panneau Explorateur d’animations, vous pouvez afficher la hiérarchie des clips imbriqués
dans un document en choisissant Afficher les définitions de symbole dans le menu du panneau.
Pour comprendre cette hiérarchie, imaginez la hiérarchie qui existe dans un ordinateur : le disque dur
contient un répertoire (ou dossier) racine et des sous-répertoires. Le répertoire racine correspond au scénario
principal (ou racine) d’un document Animate ; il est le parent de tout le reste. Les sous-répertoires
correspondent aux clips.
Vous pouvez utiliser la hiérarchie des clips d’Animate pour organiser les objets apparentés. Vous pouvez, par
exemple, créer un document Animate dans lequel une voiture se déplace à travers la scène. Vous pouvez
utiliser un symbole de clip pour représenter la voiture et créer une interpolation de mouvement pour déplacer
la voiture sur la scène.
Pour ajouter des roues en mouvement, vous créez un clip représentant une roue, puis deux occurrences de
ce clip, nommées frontWheel et backWheel. Ensuite, vous pouvez placer les roues dans le scénario du
clip de la voiture (et non dans le scénario principal). En tant qu’enfants de car, frontWheel et backWheel
sont affectés par toute modification apportée à car et se déplacent avec la voiture lorsque celle-ci traverse la
scène.
Pour faire tourner les deux occurrences de la roue, vous pouvez définir une interpolation de mouvement qui
fait tourner le symbole de roue. Même si vous modifiez frontWheel et backWheel, ils seront toujours
affectés par l’interpolation effectuée sur leur clip parent, car, et les roues tourneront, mais se déplaceront
également avec le clip parent car à travers la scène.
Adobe recommande également :
Symboles, occurrences et éléments de bibliothèque
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
350
Utilisation de séquences dans Animate
Affichage du panneau Séquence
Ajout d’une séquence
Suppression d’une séquence
Changement du nom d’une séquence
Duplication d’une séquence
Changement de l’ordre d’une séquence dans le document
Affichage d’une séquence particulière
Pour organiser un document de façon thématique, vous pouvez utiliser des séquences. Par exemple, vous
pouvez utiliser des séquences distinctes pour une introduction, un message de chargement ou un générique.
Malgré les inconvénients découlant de l’utilisation de séquences, il y a quelques situations dans lesquelles
ces inconvénients sont peu nombreux, telles que la création de longs métrages. Lorsque vous utilisez des
séquences, vous évitez la gestion d’un grand nombre de fichiers FLA car chaque séquence figure dans un
seul fichier FLA.
Les séquences correspondent au regroupement de plusieurs fichiers FLA pour créer une présentation plus
développée. Chaque séquence dispose d’un scénario. Les images du document sont numérotées de manière
consécutive, d’une séquence à une autre. Ainsi, dans un document contenant deux séquences de 10 images
chacune, les images de la séquence 2 seront numérotées de 11 à 20. Les séquences du document se lisent
dans l’ordre de leur énumération dans le panneau Séquence. Lorsque la tête de lecture atteint la dernière
image d’une séquence, elle passe à la séquence suivante.
Inconvénients des séquences
Lorsque vous publiez un fichier SWF, les scénarios des différentes séquences se combinent en un seul
scénario dans le fichier SWF. Une fois le fichier SWF compilé, il se comporte de la même façon qu’un fichier
FLA ne comportant qu’une seule séquence. Les séquences ont quelques inconvénients en raison de ce
comportement.
Les séquences peuvent rendre les documents confus et difficiles à modifier, surtout dans
les environnements comportant plusieurs auteurs. Toute personne utilisant le document
FLA risque de devoir parcourir plusieurs séquences pour rechercher du code et des
ressources. Envisagez plutôt de charger du contenu SWF externe ou d’utiliser des clips.
Les séquences se soldent généralement par des fichiers SWF volumineux. L’utilisation de
séquences favorise le placement de contenu supplémentaire dans un seul fichier FLA, ce
qui débouche sur des fichiers FLA et SWF plus volumineux..
Les séquences obligent les utilisateurs à télécharger le fichier SWF de façon progressive,
même s’ils ne souhaitent pas en consulter l’ensemble. Si vous évitez les séquences,
l’utilisateur peut contrôler le contenu à télécharger lors de la consultation du fichier SWF.
Les séquences incorporées dans du code ActionScript risquent de produire des résultats
inattendus. Dans la mesure où chaque scénario de séquence est compressé dans un seul
scénario, vous risquez de subir des erreurs impliquant le code ActionScript et les
séquences, ce qui nécessite un débogage supplémentaire et complexe.
Contrôle de la lecture des séquences
Pour arrêter un document, le mettre en pause après chaque séquence ou permettre aux utilisateurs de
351
naviguer dans le document de façon non linéaire, utilisez ActionScript. Pour plus d’informations, voir
ActionScript.
Haut de la page
Affichage du panneau Séquence
Choisissez Fenêtre > Autres panneaux > Séquence.
Haut de la page
Ajout d’une séquence
Sélectionnez Insertion > Séquence ou cliquez sur le bouton Ajouter une séquence
le panneau Séquence.
dans
Haut de la page
Suppression d’une séquence
Cliquez sur le bouton Supprimer la séquence
dans le panneau Séquence.
Haut de la page
Changement du nom d’une séquence
Double-cliquez sur le nom de la séquence dans le panneau Séquence et entrez le
nouveau nom.
Haut de la page
Duplication d’une séquence
Cliquez sur le bouton Dupliquer la séquence
dans le panneau Séquence.
Haut de la page
Changement de l’ordre d’une séquence dans le document
Faites glisser le nom de la séquence à un autre emplacement dans le panneau
Séquence.
Haut de la page
Affichage d’une séquence particulière
Effectuez l’une des opérations suivantes :
Sélectionnez Affichage > Atteindre, puis choisissez le nom de la séquence dans le
sous-menu.
Cliquez sur le bouton Modifier la séquence situé dans le coin supérieur droit de la
fenêtre du document et choisissez le nom de la séquence dans le menu déroulant.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
352
Création et publication d’un document WebGL
Remarque : WebGL est pris en charge uniquement en tant qu’aperçu. Cette mise à jour d’Animate prend en
charge des animations de base avec du son et des scripts, ainsi qu’un jeu de fonctions d’interactivité.
D’autres fonctions seront disponibles dans les futures versions d’Animate pour les documents de type
WebGL. Pour obtenir la liste complète des fonctions Animate prises en charge pour WebGL, consultez cet
article de la base de connaissances.
Qu’est-ce que WebGL ?
Type de document WebGL
Création d’un document WebGL
Aperçu du contenu WebGL sur les navigateurs
Publication de contenu au format WebGL
Présentation de la sortie WebGL
Ajout d’audio à votre document WebGL
Migration de contenu existant vers un document WebGL
Amélioration des performances de rendu grâce à la mise en cache sous forme de
bitmap
Haut de la page
Qu’est-ce que WebGL ?
WebGL est une norme Web ouverte qui permet d’effectuer le rendu des graphiques sur n’importe quel
navigateur compatible, sans avoir recours à d’autres modules complémentaires. Il est entièrement intégré à
toutes les normes Web du navigateur, ce qui permet d’utiliser le traitement des images et les effets accélérés
par GPU dans la zone de travail de la page Web. Les éléments WebGL peuvent être incorporés à d’autres
éléments HTML et combinés à d’autres parties de la page.
La plupart des navigateurs actuels prennent en charge le format WebGL. Toutefois, cliquez ici pour en savoir
plus sur les versions exactes prises en charge.
Dans certains navigateurs, WebGL n’est pas pris en charge par défaut. Pour activer WebGL dans votre
navigateur, consultez cet article.
Remarque : veillez à activer WebGL dans votre navigateur, car il est désactivé par défaut dans certains
navigateurs.
Haut de la page
Type de document WebGL
Animate CC permet de créer et de publier un contenu interactif enrichi au format WebGL (Web Graphics
Library). WebGL est complètement intégré aux navigateurs. Animate peut donc utiliser le traitement des
images et le rendu accélérés par GPU dans la zone de travail de la page Web.
Dans Animate CC, un nouveau type de document a été ajouté pour WebGL. Vous pouvez ainsi créer du
contenu et le publier rapidement pour une sortie WebGL. Créez un contenu enrichi à l’aide des puissants
outils d’Animate, puis restituez la sortie WebGL dans n’importe quel navigateur compatible. En d’autres
termes, vous pouvez utiliser le scénario, l’espace de travail et les outils de dessin traditionnels d’Animate
pour créer du contenu, puis produire ensuite du contenu WebGL. WebGL est pris en charge par la plupart
des navigateurs courants. Par conséquent, Animate peut restituer le contenu sur la plupart des plates-formes
Web.
353
Haut de la page
Création d’un document WebGL
Dans Animate CC, le document WebGL permet de créer et de publier rapidement le contenu pour le format
WebGL. Pour créer un document WebGL :
1. Lancez Animate CC.
2. Dans l’écran de bienvenue, cliquez sur l’option WebGL (Aperçu). Vous pouvez aussi
sélectionner Fichier > Nouveau pour ouvrir la boîte de dialogue Nouveau document.
Cliquez sur l’option WebGL (Aperçu).
Haut de la page
Aperçu du contenu WebGL sur les navigateurs
Vous pouvez utiliser la fonction Tester l’animation d’Animate pour prévisualiser ou tester votre contenu. Pour
afficher un aperçu, procédez comme suit :
1. Dans Animate CC, appuyez sur Ctrl + Entrée sous Windows ou Commande + Entrée sur
Mac. Le navigateur par défaut s’ouvre avec le contenu WebGL.
Un serveur Web est requis pour qu’Animate CC exécute le contenu WebGL. Animate CC comporte un
serveur Web intégré configuré pour exécuter le contenu WebGL sur le port 8090. Si un serveur utilise déjà ce
port, Animate le détecte automatiquement et résout le conflit.
Haut de la page
Publication de contenu au format WebGL
Animate vous permet de créer et de publier le contenu WebGL en mode natif directement dans l’application.
Pour publier le document WebGL, procédez comme suit :
1. Sélectionnez Fichier > Paramètres de publication pour ouvrir la boîte de dialogue
correspondante. Vous pouvez aussi sélectionner Fichier > Publier si vous avez déjà
spécifié les paramètres de publication pour WebGL.
2. Dans la boîte de dialogue Paramètres de publication, spécifiez les valeurs pour :
Fichier de sortie Donnez un nom significatif à la sortie. En outre, recherchez ou entrez l’emplacement où
vous souhaitez publier la sortie WebGL.
Remplacer HTML Permet d’indiquer si l’enveloppe HTML doit ou non être remplacée lors de la publication
de votre projet WebGL. Vous pouvez désélectionner cette option si vous avez apporté des modifications
externes au fichier HTML publié et souhaitez les conserver lors de la mise à jour de toute modification
apportée à l’animation ou à des éléments de Flash Pro.
Inclure les calques masqués Inclut tous les calques masqués dans la sortie WebGL. Si vous désactivez
cette option, les calques (y compris ceux imbriqués dans les clips) signalés comme masqués ne sont pas
exportés dans le document WebGL résultant. Vous pouvez ainsi facilement tester différentes versions de
documents WebGL en rendant des calques invisibles.
Scénario en boucle Répète le contenu lorsqu’il atteint la dernière image. Désactivez cette option pour
arrêter la lecture du contenu après la dernière image.
354
3. Cliquez sur Publier pour publier le contenu WebGL à l’emplacement spécifié.
Remarque : la fréquence maximale pouvant être définie pour le contenu WebGL exécuté sur des
navigateurs est de 60 i/s.
Haut de la page
Présentation de la sortie WebGL
La sortie WebGL publiée contient les fichiers suivants :
Fichier d’enveloppe HTML Comprend le moment de l’exécution, appelle les actifs et initialise le rendu
WebGL. Par défaut, le fichier est nommé <FLA_nom>.html. Vous pouvez entrer un autre nom pour le fichier
HTML dans la boîte de dialogue Paramètres de publication (Fichier > Paramètres de publication).
Le fichier HTML est placé dans le même répertoire que celui du fichier FLA par défaut. Vous pouvez préciser
un autre emplacement dans la boîte de dialogue Paramètres de publication.
Fichier JavaScript (WebGL à l’exécution) Restitue le contenu publié sur WebGL. Est publié dans le
dossier libs/ du document WebGL. Le fichier est nommé comme suit : flwebgl-<version>.min.js
L’enveloppe HTML utilise ce fichier JS pour restituer le contenu WebGL.
Atlas de textures Stocke toutes les valeurs de couleur (des formes), y compris les instances bitmap sur la
scène.
Haut de la page
Ajout d’audio à votre document WebGL
Vous pouvez importer et intégrer des données audio dans votre document WebGL, contrôler la lecture en
utilisant les paramètres de synchronisation (événement, démarrer et arrêter), et lire les données audio de la
chronologie à l’exécution. Actuellement, WebGL ne prend en charge que les formats .wav et .mp3.
Pour plus d’informations sur l’utilisation du contenu audio, voir Utilisation des sons dans Animate.
Haut de la page
Migration de contenu existant vers un document WebGL
Vous pouvez faire migrer le contenu existant dans Animate vers un document WebGL, en le copiant ou en
l’important manuellement. En outre, lorsque vous utilisez plusieurs documents dans Animate, vous pouvez
copier le contenu dans les documents sous la forme de calques ou d’actifs dans la bibliothèque. Même si la
plupart des fonctions d’Animate sont prises en charge, certains types de contenu sont modifiés en fonction
du format WebGL.
Animate s’accompagne de puissantes fonctions permettant de produire un contenu visuellement enrichi.
Cependant, certaines de ces fonctions étant natives dans Animate, elles ne seront pas prises en charge dans
un document WebGL. Animate a été conçu pour modifier un tel contenu dans un format pris en charge et
indique visuellement quand un outil ou une fonction n’est pas pris en charge.
355
Copier du contenu (calques ou symboles de la bibliothèque) d’un document Animate de type classique (par
exemple ActionScript 3.0, AIR for Android, AIR for Desktop, etc.) dans un document WebGL. Dans ce cas, le
type de contenu non pris en charge est supprimé ou converti en valeurs par défaut prises en charge.
Par exemple, le fait de copier une animation 3D supprime toutes les transformations 3D appliquées aux
objets sur la scène.
Importer un fichier PSD ou AI qui contient le contenu non pris en charge. Dans ce cas, le contenu est
supprimé ou converti en valeurs par défaut prises en charge.
Par exemple, si vous importez un fichier PSD sur lequel sont appliqués des effets de flou, Animate supprime
l’effet.
Utiliser plusieurs types de documents (par exemple, ActionScript 3.0 et WebGL) simultanément et permuter
entre les documents avec un outil ou une option sélectionné non pris en charge. Dans ce cas, Animate CC
indique visuellement que la fonction n’est pas prise en charge.
Par exemple, vous avez créé une ligne pointillée dans un document ActionScript 3.0 et êtes passé en mode
WebGL alors que l’outil Ligne était toujours sélectionné. Observez le pointeur et l’inspecteur des propriétés :
ils indiquent visuellement que la ligne pointillée n’est pas prise en charge dans WebGL.
Scripts Vous pouvez écrire du code JavaScript dans le panneau Actions, qui sera exécuté une fois que le
lecteur affiche l’image. La variable « this » dans le contexte des scripts d’image fait référence à l’occurrence
de MovieClip auquel elle appartient. Par ailleurs, les scripts d’image peuvent accéder aux fonctions et
variables JavaScript déclarées dans le fichier HTML conteneur. Lorsque vous copiez une image ou un calque
à partir d’un document ActionScript et que vous le collez dans un document WebGL, les scripts seront
commentés, le cas échéant.
Modifications appliquées au contenu après la migration
Voici une liste des types de modifications appliquées lorsque vous migrez le contenu existant vers un
document WebGL.
Le contenu est supprimé Les types de contenu non pris en charge dans HTML5 Canvas sont supprimés.
Par exemple :
Filtres ne sont pas pris en charge. L’effet sera supprimé et la forme adoptera un fond uni.
356
L’effet de filtre Flou est supprimé et remplacé par un fond uni.
Le contenu est modifié en une valeur par défaut prise en charge Le type de contenu ou la fonction est
pris en charge, mais une propriété de la fonction ne l’est pas. Par exemple :
Dégradé radial est modifié pour adopter un fond uni avec la couleur principale.
Le dégradé radial est modifié pour adopter un fond uni avec la couleur principale.
357
Pour obtenir la liste complète des fonctions qui ne sont pas prises en charge et de leurs valeurs de
substitution pendant la migration, consultez cet article.
Haut de la page
Amélioration des performances de rendu grâce à la mise en cache
sous forme de bitmap
La mise en cache des images bitmap à l’exécution permet d’optimiser les performances du rendu en
spécifiant qu’un clip statique (une image d’arrière-plan, par exemple) ou un symbole de bouton doit être mis
en cache sous forme de bitmap lors de l’exécution. Par défaut, les éléments vectoriels sont redessinés dans
chaque image. La mise en cache d’un clip ou d’un symbole de bouton en tant que bitmap empêche le
navigateur d’avoir à redessiner continuellement l’élément, car l’image est un bitmap et sa position ne change
pas. Ceci améliore considérablement les performances de rendu du contenu WebGL.
Lorsque vous créez une animation dont l’arrière-plan est complexe, par exemple, regroupez tous les
éléments de l’arrière-plan dans un clip. Sélectionnez ensuite Mettre en cache en tant que bitmap pour le clip
dans l’inspecteur des propriétés. A la lecture, l’arrière-plan est rendu sous forme d’un bitmap stocké à la
profondeur d’écran actuelle. Le navigateur dessine rapidement, une seule fois, le bitmap sur la scène, d’où
une lecture plus rapide et fluide.
La mise en cache d’un clip sous forme de bitmap permet de figer ce clip en place automatiquement. En cas
de modification d’une zone, les données vectorielles mettent à jour le cache de bitmaps. Le nombre de
retraçages que le navigateur doit effectuer en est donc réduit, ce qui permet des performances de rendu plus
fluides et plus rapides.
Pour activer la propriété Cache en tant que bitmap pour un symbole de clip, sélectionnez l’instance de clip
et sélectionnez Cache en tant que bitmap dans le menu déroulant Inspecteur de propriétés (Fenêtre >
Propriétés).
Considérations liées à l’utilisation de Cache en tant que bitmap
358
Lors de l’utilisation de la propriété Cache en tant que bitmap sur du contenu WebGL, tenez compte des
points suivants :
La taille maximale du symbole de clip est limitée à 2 048 x 2 048. Notez que les limites
actuelles de l’instance de clip qui peuvent être masquées sont inférieures à
2 048 x 2 048, WebGL réservant certains pixels.
S’il existe plusieurs instances du même clip, Animate génère le cache avec la taille de la
première instance rencontrée. Toutefois, le cache n’est pas généré à nouveau et la
propriété Cache en tant que bitmap n’est pas ignorée, même si la transformation du clip
change dans une large mesure. Par conséquent, si le symbole de clip augmente
considérablement au cours de l’animation, il se peut que cette dernière semble pixellisée.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
359
Utilisation de calques de masque dans
Adobe Animate CC
À propos des calques de masque
Utilisation des calques de masque
Haut de la page
À propos des calques de masque
Pour les effets de projecteur et les transitions, vous pouvez utiliser un calque de masque pour créer un trou
qui laisse apparaître le contenu d’un ou de plusieurs calques situés en dessous. Un élément de masque peut
être une forme remplie, un texte, une occurrence de symbole graphique ou un clip. Vous pouvez grouper
plusieurs calques sous un calque de masque unique pour créer des effets élaborés.
Vous pouvez animer un calque de masque pour créer des effets dynamiques. Dans le cas d’une forme
remplie utilisée comme masque, vous utiliserez une interpolation de forme. Pour un texte, une occurrence de
graphique ou un clip, il s’agira d’une interpolation de mouvement. Si vous utilisez une occurrence de clip
comme masque, vous pouvez animer le masque sur une trajectoire.
Pour créer un calque de masque, vous placez un élément de masque sur le calque que vous souhaitez
utiliser comme masque. Au lieu de contenir un remplissage ou un trait, l’élément de masque fait office de
fenêtre qui révèle la zone des calques liés qui se trouvent en dessous. Le reste du calque de masque cache
tous les autres éléments, à l’exception de ceux qui sont visibles à travers le masque. Un calque de masque
ne peut contenir qu’un élément de masque. Il est impossible de placer un calque de masque dans un bouton
ou d’appliquer un masque à un autre masque.
Vous pouvez utiliser du code ActionScript pour créer un calque de masque à partir d’un clip. Un calque de
masque créé avec ActionScript ne peut être appliqué qu’à un autre clip.
Remarque : les outils 3D ne fonctionnent pas sur des objets placés sur des calques de masque et les
calques contenant des objets 3D ne peuvent pas être utilisés en tant que calques de masque. Pour plus
d’informations sur les outils 3D, voir Graphiques 3D.
Haut de la page
Utilisation des calques de masque
Vous pouvez utiliser des calques de masque pour révéler des parties d’image ou de graphique dans le
calque en dessous. Pour créer un masque, vous pouvez spécifier qu’un calque est un calque de masque et
dessiner ou placer une forme remplie sur ce calque. Vous pouvez utiliser comme masque toute forme
remplie, y compris des groupes, du texte et des symboles. Le calque de masque révèle la zone de calques
liés qui se trouvent en dessous de la forme remplie.
Création d’un calque de masque
1. Sélectionnez ou créez un calque contenant les objets qui figureront dans le masque.
2. Choisissez Insertion > Scénario > Calque pour créer un calque par-dessus. Un calque
de masque cache toujours le calque qui se trouve immédiatement en dessous de lui. Par
conséquent, veillez à créer le calque au bon emplacement.
3. Placez une forme remplie, du texte ou une occurrence de symbole sur le calque de
360
masque. Animate ignore les bitmaps, les dégradés, la transparence, les couleurs et les
styles de trait dans un calque de masque. Toute zone remplie devient complètement
transparente dans le masque, les zones non remplies étant opaques.
4. Cliquez avec le bouton droit de la souris (Windows) ou en appuyant sur la touche
Contrôle (Macintosh) sur le nom du calque de masque dans le scénario, puis
sélectionnez Masque. Une icône de calque de masque signale le calque de masque. Le
calque situé immédiatement au-dessous est lié au calque de masque et son contenu
affiché à travers la zone remplie sur le masque. Le nom du calque masqué apparaît en
retrait et son icône est remplacée par une icône de calque masqué.
5. Pour afficher l’effet de masque dans Animate, verrouillez le calque de masque et le
calque masqué.
Masquage d’autres calques après avoir créé un calque de masque
Effectuez l’une des opérations suivantes :
Faites glisser un calque existant directement en dessous du calque de masque.
Créez un calque n’importe où en dessous du calque de masque.
Sélectionnez Modification > Scénario > Propriétés du calque, puis sélectionnez
Masqué.
Dissociation des calques d’un calque de masque
Sélectionnez le calque à dissocier, puis procédez de l’une des façons suivantes :
Faites glisser le calque au-dessus du calque de masque.
Sélectionnez Modification > Scénario > Propriétés du calque, puis sélectionnez
Normal.
Animation d’une forme remplie, de texte ou d’une occurrence de symbole
graphique sur un calque de masque
1. Sélectionnez le calque de masque dans le scénario.
2. Cliquez dans la colonne de verrouillage pour déverrouiller le calque de masque.
3. Effectuez l’une des opérations suivantes :
Si l’objet de masque est une forme remplie, appliquez une interpolation de forme à
l’objet.
Si l’objet de masque est du texte ou une occurrence de symbole graphique,
appliquez une interpolation de mouvement à l’objet.
4. Lorsque vous avez terminé l’animation, cliquez dans la colonne de verrouillage du calque
de masque de manière à le verrouiller de nouveau.
Animation d’un clip sur un calque de masque
1. Sélectionnez le calque de masque dans le scénario.
2. Double-cliquez sur le clip sur la scène afin de le manipuler à son emplacement et
d’afficher son scénario.
3. Appliquez une interpolation de mouvement au clip.
4. Lorsque vous avez terminé la procédure d’animation, cliquez sur le bouton de retour afin
de revenir au mode d’édition du document.
361
5. Cliquez dans la colonne de verrouillage du calque de masque afin de le verrouiller à
nouveau.
Adobe recommande également :
Interpolations de mouvement
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
362
Multimédia et vidéo
363
Exportation de fichiers SVG
Qu’est-ce que SVG ?
Processus d’exportation SVG dans Animate CC
Exportation d’illustrations au format SVG
Échange des fichiers SVG avec Adobe Illustrator
Haut de la page
Qu’est-ce que SVG ?
SVG (Scalable Vector Graphics) est un langage de balisage XML pour la description des images
bidimensionnelles. Les fichiers SVG fournissent dans un format compact des graphiques HiDPI indépendants
de la résolution sur le Web, pour l’impression et les périphériques mobiles. Vous pouvez styliser un fichier
SVG avec du code CSS. La prise en charge des scripts et de l’animation intègre parfaitement le langage SVG
à la plateforme Web.
Certains formats d’image courants du Web (GIF, JPEG et PNG, entre autres) sont peu pratiques et
généralement de basse résolution. Le format SVG est très utile car il permet de décrire les images en termes
de formes vectorielles, de texte et d’effets de filtre. Les fichiers SVG sont compacts et fournissent des
graphiques de grande qualité sur le Web et sur les périphériques mobiles, limités par des contraintes de
ressources. Vous pouvez agrandir l’affichage d’une image SVG à l’écran sans sacrifier la netteté, le détail ou
la clarté. De plus, le format SVG offre une prise en charge supérieure du texte et des couleurs, garantissant
l’affichage des images telles qu’elles apparaissent sur la scène. Le format SVG est entièrement basé sur le
langage XML et offre de nombreux avantages aux développeurs et aux utilisateurs.
Haut de la page
Processus d’exportation SVG dans Animate CC
Animate CC permet d’exporter des fichiers au format SVG, version 1.1. Vous pouvez créer des illustrations
visuellement riches à l’aide des puissants outils de conception d’Animate, puis les exporter facilement au
format SVG.
Dans Animate CC, vous pouvez exporter les images et images clés sélectionnées d’une animation.
L’illustration exportée étant un vecteur, la résolution de l’image reste élevée même en cas de mise à l’échelle
en d’autres tailles.
La fonction d’exportation SVG remplace l’ancienne fonction d’exportation FXG (retirée d’Animate CC
(juin 2013)). Les performances et la qualité de rendu de la fonction d’exportation SVG sont nettement
supérieures. En outre, par rapport au format FXG, la perte de contenu au format SVG est minime.
Illustration avec des effets de filtre
Avec le format SVG, il se peut que les effets de filtre ne s’affichent pas exactement comme dans Animate,
car il n’y a aucun mappage linéaire entre les filtres disponibles dans Animate et SVG. Toutefois, Animate Pro
exploite les combinaisons de différents filtres primitifs disponibles dans SVG pour simuler un effet similaire.
364
Gestion des symboles multiples
L’exportation SVG gère les symboles multiples de manière homogène, sans perte de contenu. La sortie
ressemble fortement à l’illustration sur la scène dans Animate.
Haut de la page
Exportation d’illustrations au format SVG
1. Dans Animate CC, faites défiler ou déplacez la tête de lecture vers l’image appropriée.
2. Sélectionnez Fichier > Exporter > Exporter l’image. ou sélectionnez Fichier > Paramètres
de publication (sélectionnez l’option Image SVG dans la section Autres formats.)
3. Recherchez le dossier où se trouve le fichier SVG. Veillez à sélectionner le format SVG
pour l’option Enregistrer sous.
4. Cliquez sur OK.
5. Dans la boîte de dialogue d’exportation du fichier SVG, choisissez d’incorporer le fichier
SVG ou de créer un lien vers ce fichier.
Inclure les calques masqués : exporte tous les calques masqués du document
Animate. Si vous désactivez l’option Exporter calques masqués, vous empêchez tous
les calques (y compris ceux imbriqués dans les clips) signalés comme masqués
d’être exportés dans le fichier SVG résultant. Vous pouvez ainsi tester différentes
versions de documents Animate en rendant des calques invisibles.
Incorporer : incorpore un bitmap dans le fichier SVG. Utilisez cette option pour
incorporer directement des bitmaps dans le fichier SVG.
Lien : fournit un lien d’accès aux fichiers bitmap. Utilisez cette option lorsque vous ne
souhaitez pas incorporer les bitmaps, mais souhaitez créer un lien vers eux à partir
du fichier SVG. Si vous choisissez l’option Copier les images dans un dossier, les
bitmaps seront enregistrés dans le dossier images créé à l’emplacement où est
exporté le fichier SVG. Si l’option Copier les images dans un dossier n’est pas
sélectionnée, les bitmaps seront référencés dans le fichier SVG à partir de
l’emplacement source d’origine. Si l’emplacement source des bitmaps est
indisponible, les bitmaps sont incorporés dans le fichier SVG.
Copier les images dans le dossier /Images : permet de copier le bitmap dans le
dossier /Images. Le dossier /Images, s’il n’existe pas déjà, est créé à
l’emplacement d’exportation du fichier SVG.
6. Cliquez sur OK.
365
Remarque : certaines fonctions d’Animate ne sont pas prises en charge par le format SVG. Lors de
l’exportation, le contenu créé à l’aide de ces fonctions est supprimé ou défini par défaut sur une fonction prise
en charge. Pour plus d'informations, lisez cet article.
Vous pouvez également utiliser la boîte de dialogue Paramètres de publication pour exporter des
fichiers SVG à partir d’Animate CC (Fichier > Paramètres de publication). Sélectionnez l’option SVG dans
la section Autres formats pour exporter des fichiers SVG.
Remarque : Il est recommandé d’afficher les fichiers SVG uniquement dans des navigateurs modernes à
jour. En effet, certains filtres graphiques et effets de couleur peuvent ne pas être correctement rendus dans
les anciennes versions de navigateurs, telles qu’Internet Explorer 9.
Haut de la page
Échange des fichiers SVG avec Adobe Illustrator
Animate CC permet d’échanger du contenu avec Adobe Illustrator. Ce flux de travail remplace la fonction
d’exportation FXG qui a été abandonnée avec Animate CC (13.0). Vous pouvez exporter des fichiers SVG
dans Animate, puis les importer dans Adobe Illustrator. Pour plus d’informations sur l’utilisation des fichiers
SVG dans Adobe Illustrator, consultez cette rubrique d’aide.
Utilisez ce flux de travail pour apporter des modifications détaillées à l’illustration et y ajouter des détails
précis. Vous pouvez également utiliser Illustrator pour ajouter des effets à l’illustration (une ombre portée, par
exemple).
Pour modifier des fichiers SVG dans Adobe Illustrator et utiliser le contenu modifié dans Animate, procédez
comme suit :
1. Dans Animate CC, effectuez une exportation au format SVG.
2. Modifiez l’illustration en ouvrant le fichier SVG dans Adobe Illustrator.
3. Enregistrez le fichier SVG au format .ai, puis importez-le dans Animate. Pour plus
d’informations sur l’utilisation de fichiers Illustrator dans Animate.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
366
Utilisation du son dans Adobe Animate
À propos des sons et d’Animate CC
Importation de sons
Formats audio pris en charge
Ajout d’un son sur le scénario directement depuis votre ordinateur
Ajout d’un son sur le scénario depuis la bibliothèque
Suppression du son du scénario
Ajout de sons à un bouton
Synchronisation d’un son avec une animation
Modification d’un son dans Animate
Fractionnement d’un son sur le scénario
Lecture en boucle d’un son dans le scénario
Modification d’un son dans Soundbooth
Utilisation des sons dans Flash Lite
Haut de la page
À propos des sons et d’Animate CC
Adobe Animate propose plusieurs méthodes pour utiliser le son. Vous pouvez créer des sons lus en flux
continu, des sons indépendants du scénario ou utiliser le scénario pour synchroniser une animation avec une
piste audio. Vous pouvez associer des sons à des boutons pour les rendre plus interactifs et faire apparaître
et disparaître des sons en fondu pour obtenir une piste audio impeccable.
Il existe deux types de sons dans Animate : les sons d’événement et les sons en flux continu. Un son
d’événement doit être téléchargé intégralement avant de pouvoir être lu et se poursuit tant qu’il n’a pas été
arrêté explicitement. La lecture d’un son en flux continu commence dès qu’une quantité suffisante de
données correspondant aux toutes premières images a été téléchargée ; le son est synchronisé avec le
scénario pour être lu sur un site web.
Si vous créez du contenu Animate pour des appareils mobiles, Animate vous permet également d’inclure des
sons de périphérique dans votre fichier SWF publié. Les sons du périphérique mobile sont codés dans le
format audio natif de ce périphérique, par exemple MIDI, MFi ou SMAF.
Vous pouvez utiliser des bibliothèques partagées pour associer un son à plusieurs documents. Vous pouvez
également utiliser l’événement ActionScript® 2.0 onSoundComplete ou l’événement ActionScript® 3.0
soundComplete permettant de déclencher un événement lors de l’exécution d’un son.
Vous pouvez utiliser les comportements ou les composants de support préécrits pour charger et contrôler la
lecture des sons. Les composants fournissent un contrôleur pour l’arrêt, la pause, le rembobinage, etc. Vous
pouvez également utiliser ActionScript 2.0 ou 3.0 pour charger des sons de manière dynamique.
Pour plus d’informations, voir attachSound (méthode Sound.attachSound) et loadSound (méthode
Sound.loadSound) dans le Guide de référence du langage ActionScript 2.0 ou Classe Sound dans le
Guide de référence du langage et des composants ActionScript 3.0.
Remarque : ActionScript 2.0 et ActionScript 1.0 ne sont pas pris en charge dans Animate CC.
Haut de la page
Importation de sons
367
Vous placez des fichiers son dans Animate en les important dans la bibliothèque ou directement sur la scène.
L’option Fichier > Importer > Importer dans la bibliothèque importe l’audio uniquement dans la bibliothèque,
et non sur la scène.
Si vous importez un fichier audio à l’aide de l’option Fichier > Importer > Importer dans la scène ou en faisant
glisser le fichier audio directement sur le scénario, le son est importé dans l’image active du calque actif. Si
vous faites glisser plusieurs fichiers audio, un seul fichier audio est importé, car une image ne peut contenir
qu’une seule piste audio.
Pour importer des données audio, utilisez l’une des méthodes suivantes :
Pour importer un fichier audio dans la bibliothèque, sélectionnez Fichier > Importer >
Importer dans la bibliothèque et sélectionnez le fichier audio à importer.
Pour importer un fichier audio sur la scène, sélectionnez Fichier > Importer > Importer
dans la scène et sélectionnez ensuite le fichier audio à importer.
Faites glisser le fichier audio directement sur la scène.
Remarque : vous pouvez également déplacer un son depuis une bibliothèque commune jusqu’à la
bibliothèque du document actif.
Animate stocke les sons dans la bibliothèque avec des bitmaps et des symboles. Tout comme pour les
symboles graphiques, vous n’avez besoin que d’un seul exemplaire d’un fichier audio pour l’utiliser de
diverses façons dans votre document.
Si vous souhaitez partager des sons entre des documents Animate, vous pouvez les inclure dans des
bibliothèques partagées.
Animate inclut une bibliothèque Sons qui contient de nombreux extraits sonores utilisables pour les effets
spéciaux. Pour ouvrir la bibliothèque Sons, choisissez Fenêtre > Bibliothèques communes > Sons. Pour
importer un son dans votre fichier Animate depuis la bibliothèque Sons, faites-le glisser de la bibliothèque
vers le panneau Bibliothèque du fichier en question. Vous pouvez également faire glisser des sons de la
bibliothèque Sons vers d’autres bibliothèques partagées.
Les sons nécessitent généralement une grande quantité d’espace disque et de mémoire vive. Cependant, les
données audio MP3 sont compressées et leur taille est inférieure à celles des données audio WAV ou AIFF.
En règle générale, lorsque vous utilisez des fichiers WAV ou AIFF, il est préférable d’utiliser des sons mono
de 16 à 22 kHz (un son stéréo nécessite deux fois plus d’informations qu’un son mono). Cependant, Animate
accepte l’importation de sons 8 bits ou 16 bits, avec une fréquence d’échantillonnage de 11, 22 ou 44 kHz.
Les sons enregistrés dans des formats qui ne sont pas des multiples de 11 kHz (tels que 8, 32 ou 96 kHz)
sont rééchantillonnés lors de leur importation dans Animate. À l’exportation, Animate peut convertir un son à
une fréquence d’échantillonnage inférieure.
Si vous souhaitez ajouter des effets sonores dans Animate, il est préférable d’importer des sons 16 bits. Si
vous disposez d’une mémoire vive limitée, utilisez des clips audio brefs et préférez des sons 8 bits aux sons
16 bits.
Remarque : (Animate CC uniquement) Pour importer ou lire des sons dans Animate, il n’est pas nécessaire
d’installer au préalable QuickTime ou iTunes.
Haut de la page
Formats audio pris en charge
Vous pouvez importer dans Animate des sons aux formats suivants :
Adobe Sound (.asnd). Il s’agit du format audio natif d’Adobe® Soundbooth™.
Wave (.wav)
AIFF (.aif, .aifc)
mp3
Vous pouvez importer les formats de fichier son supplémentaires suivants :
368
Sound Designer® II (.sd2)
Sun AU (.au, .snd)
FLAC (.flac)
Ogg Vorbis (.ogg, .oga)
Remarque : le format ASND est un format de fichier audio non destructeur, natif à Adobe
Soundbooth. Les fichiers ASND peuvent contenir des données audio avec des effets qui
peuvent être modifiés ultérieurement, des sessions Soundbooth multipistes et des
instantanés qui permettent de rétablir l’état original d’un fichier ASND.
Les documents du type WebGL et HTML5 Canvas prennent uniquement en charge les
formats MP3 et WAV.
Haut de la page
Ajout d’un son sur le scénario directement depuis votre ordinateur
Vous pouvez importer dans le scénario des données audio directement depuis votre ordinateur en utilisant
l’une des méthodes suivantes :
Cliquez sur Fichier > Importer > Importer dans la scène et sélectionnez le fichier audio à
importer.
Faites glisser le fichier audio sur la scène ou le scénario.
Remarque : Vous ne pouvez ajouter qu’un seul fichier audio à la fois. Si vous faites glisser et déposez
plusieurs fichiers audio, un seul fichier est déposé dans le scénario.
Haut de la page
Ajout d’un son sur le scénario depuis la bibliothèque
Vous pouvez ajouter un son à un document à partir de la bibliothèque ou charger un son dans un fichier SWF
à l’exécution avec la méthode loadSound de l’objet Sound. Pour plus d’informations, voir Sound Class
dans le Guide de référence du langage ActionScript 3.0.
1. Importez le son dans la bibliothèque, s’il n’a pas encore été importé.
2. Choisissez Insertion > Scénario > Calque.
3. Avec le nouveau calque audio sélectionné, faites glisser le son depuis le panneau
Bibliothèque jusqu’à la scène. Le son est ajouté au calque courant.
Vous pouvez placer plusieurs sons dans un même calque ou dans des calques
contenant d’autres objets. Cependant, il est conseillé de placer chaque son dans un
calque distinct. Chaque calque se comporte comme une piste audio distincte. Les sons
de l’ensemble des calques sont combinés à la lecture du fichier SWF.
4. Sélectionnez, dans le scénario, la première image contenant le fichier son.
5. Choisissez Fenêtre > Propriétés, puis cliquez sur la flèche dans le coin inférieur droit
pour développer l’inspecteur des propriétés.
6. Dans l’inspecteur des propriétés, choisissez un fichier audio dans le menu déroulant
Son.
7. Choisissez un effet dans le menu déroulant Effets :
Aucun Signifie qu’aucun effet n’est appliqué au fichier audio. Sélectionnez cette option
pour supprimer des effets audio préalablement définis.
Canal gauche/Canal droit Signifient que le son ne sera diffusé que dans le canal
gauche ou droit.
369
Fondu de gauche à droite/Fondu de droite à gauche Permettent de basculer d’un
canal à l’autre.
Fondu à l’ouverture Augmente progressivement le volume du son.
Fondu Diminue progressivement le volume du son.
Personnalisée Permet de créer vos propres points d’entrée et de sortie du son dans la
boîte de dialogue Modifier l’enveloppe.
Remarque : Les effets ne sont pas pris en charge dans les documents de canevas
HTML5 et WebGL.
8. Choisissez une option de synchronisation dans le menu déroulant Sync :
Evénement Synchronise le son et l’occurrence d’un événement. La lecture du son d’un
événement commence lorsque son image-clé de départ s’affiche et est lue dans sa
totalité, quelle que soit la tête de lecture dans le scénario, même si la lecture du fichier
SWF s’arrête. Les sons d’événement sont mélangés lorsque vous lancez la lecture de
votre fichier SWF publié.
Si le son d’un événement est lu et si le son est à nouveau instancié (notamment lorsque
l’utilisateur clique à nouveau sur un bouton ou si la tête de lecture transmet l’image-clé
de départ du son), la lecture de la première occurrence du son continue et la lecture
d’une autre occurrence du même son commence simultanément. Gardez cela à l’esprit
lors de l’utilisation de sons plus longs, car ils risquent de se chevaucher et de provoquer
des effets audio indésirables.
Commencer Cette option est identique à l’option Evénement, si ce n’est que, lorsque le
son est en cours de lecture, aucune nouvelle occurrence du son n’est lue.
Arrêter Entraîne l’interruption du son spécifié.
Flux Synchronise le son en vue d’une lecture sur un site web. Animate force l’animation
à suivre le rythme des sons en flux continu. Si Animate ne peut afficher les images de
l’animation suffisamment vite, il les ignore. Contrairement aux sons d’événement, les
sons en flux continu s’arrêtent si la lecture du fichier SWF s’interrompt. De même, un
son en flux continu ne peut jamais excéder la longueur des images auxquelles il
correspond. Les sons en flux continu sont mixés à la publication du fichier SWF.
La voix d’un personnage dans une animation qui se déroule sur plusieurs images est un
exemple de son en flux continu.
Remarque : Si le son en flux continu que vous utilisez est au format MP3, vous devrez le
recompresser en vue de l’exportation. Vous pouvez choisir d’exporter le son au format
MP3, avec les mêmes paramètres de compression que ceux de l’importation.
Animate mémorise les options de synchronisation audio dans l’inspecteur des propriétés.
Si un son est sélectionné dans la section Son de l’inspecteur des propriétés, lorsque
vous tentez de définir un autre son sur une nouvelle image-clé de l’inspecteur des
propriétés, Animate mémorise les options de synchronisation « En continu » ou
« Événement » du son précédent.
Remarque : Les paramètres de flux ne sont pas pris en charge dans les documents
HTML5 Canvas et WebGL.
9. Saisissez une valeur dans le champ Répéter afin de définir le nombre de répétitions
dans la lecture en boucle du son ou choisissez Boucle pour répéter le son en continu.
Pour une lecture continue, entrez un nombre suffisamment élevé pour que la lecture du
son dure longtemps. Par exemple, pour lire un son de 15 secondes en boucle pendant
15 minutes, entrez 60. La lecture en boucle de sons en flux continu est déconseillée. Si
vous lisez un son en flux continu en boucle, des images sont ajoutées à l’animation et la
370
taille du fichier est multipliée par le nombre de fois que le son est lu en boucle.
10. Pour faire un test du son, faites glisser la tête de lecture sur les images contenant le son
ou utilisez les commandes du contrôleur ou du menu Contrôle.
Vidéo : Paramètres de synchronisation des données audio dans Animate CC
De Train Simple (www.trainsimple.com)
Haut de la page
Suppression du son du scénario
1. Dans le calque Scénario contenant le son, sélectionnez une image contenant également
le son.
2. Dans l’inspecteur des propriétés, accédez à la section Son et sélectionnez Aucun dans le
menu Nom.
Animate supprime le son du calque Scénario.
Haut de la page
Ajout de sons à un bouton
Vous pouvez associer des sons aux différents états d’un symbole de bouton. Les sons étant enregistrés avec
le symbole, ils fonctionnent pour toutes les occurrences du symbole.
1. Sélectionnez le bouton dans le panneau Bibliothèque.
2. Choisissez Modification dans le menu d’options (coin supérieur droit du panneau).
3. Ajoutez un calque audio dans le scénario du bouton (Insertion > Scénario > Calque).
4. Dans le calque audio, créez une image-clé normale ou vide correspondant à l’état du
bouton pour lequel vous souhaitez définir un son (Insertion > Scénario > Image-clé ou
Insertion > Scénario > Image-clé vide).
Par exemple, pour ajouter un son lu à chaque fois que l’utilisateur clique sur le bouton,
créez une image-clé dans l’image de l’état Abaissé.
5. Cliquez sur l’image-clé que vous venez de créer.
6. Sélectionnez Fenêtre > Propriétés.
7. Dans l’inspecteur des propriétés, choisissez un fichier audio dans le menu déroulant
Son.
8. Choisissez Evénement dans le menu déroulant Synchronisation.
Pour associer un son différent à chacune des images-clés du bouton, créez une imageclé vide et ajoutez un fichier audio différent pour chaque image-clé. Vous pouvez aussi
utiliser le même fichier audio et appliquer un effet audio distinct pour chaque image-clé
du bouton.
Haut de la page
Synchronisation d’un son avec une animation
Pour synchroniser un son avec une animation, vous utilisez des images-clés pour faire démarrer et arrêter le
son.
1. Ajoutez un son au scénario dans son propre calque (voir les instructions ci-dessus).
2. Pour synchroniser ce son avec un événement dans la séquence, créez une image-clé de
371
départ pour le son correspondant à l’image-clé de l’événement dans la séquence qui doit
déclencher le son. Vous pouvez sélectionner l’une des options de synchronisation
décrites ci-dessus (voir Ajout d’un son au scénario).
3. Créez une image-clé dans le scénario du calque audio sur l’image où vous souhaitez
que le son s’arrête. Une représentation du fichier audio apparaît dans le scénario.
4. Choisissez Fenêtre > Propriétés, puis cliquez sur la flèche dans le coin inférieur droit
pour développer l’inspecteur des propriétés.
5. Dans l’inspecteur des propriétés, choisissez le même son dans le menu déroulant Son.
6. Toujours dans l’inspecteur des propriétés, sélectionnez Arrêter dans le menu contextuel
de synchronisation.
Lors de la lecture du fichier SWF, le son s’interrompt lorsqu’il atteint l’image-clé de fin.
7. Pour lire le son, déplacez la tête de lecture dans le scénario.
Haut de la page
Modification d’un son dans Animate
Dans Animate, vous pouvez définir le point de départ d’un son et contrôler son volume lors de sa lecture.
Flash peut changer le point de départ et le point d’arrêt d’un son. Cette option est très pratique pour réduire
la taille d’un fichier audio en supprimant les sections non utilisées.
1. Ajoutez un son à une image ou sélectionnez une image qui contient déjà un son.
2. Sélectionnez Fenêtre > Propriétés.
3. Cliquez sur le bouton Modifier affiché du côté droit de l’inspecteur des propriétés.
4. Effectuez l’une des opérations suivantes :
Pour modifier le point de départ et le point d’arrêt d’un son, faites glisser les contrôles
Départ et Fin de Modifier l’enveloppe.
Pour changer l’enveloppe du son, faites glisser les poignées d’enveloppe pour
changer de niveau à différents points du son. Les lignes d’enveloppe indiquent le
volume sonore en cours de lecture. Pour créer d’autres poignées d’enveloppe (huit
maximum), cliquez sur les lignes. Pour supprimer une poignée d’enveloppe, faites-la
glisser hors de la fenêtre.
Pour visualiser une part plus ou moins grande de la courbe sonore dans la fenêtre,
cliquez sur les boutons Zoom avant et Zoom arrière.
Pour basculer entre les unités de temps secondes et images, cliquez sur les boutons
Secondes et Images.
5. Pour écouter le son modifié, cliquez sur le bouton Lire.
Haut de la page
Fractionnement d’un son sur le scénario
Fractionnez les données audio en continu incorporées au scénario à l’aide du menu contextuel Fractionner
l’audio. Cette option permet de suspendre la lecture audio lorsque cela est nécessaire, puis de la reprendre à
partir du point où elle a été arrêtée à une image plus loin dans le scénario.
Pour fractionner un clip audio sur le scénario, procédez comme suit :
1. Sélectionnez Fichier > Importer > Importer dans la bibliothèque.
2. Sélectionnez le clip audio et importez-le dans la bibliothèque.
3. Créez un calque dans le scénario et ajoutez-y le clip.
4. Sous Propriétés > Son, sélectionnez le type de synchronisation Lecture en continu.
372
5. Cliquez avec le bouton droit de la souris sur l’image à laquelle fractionner l’audio, puis
cliquez sur Fractionner l’audio.
Haut de la page
Lecture en boucle d’un son dans le scénario
La mise en boucle signifie répéter une petite partie d’un son en continu sur un certain nombre d’images de
votre scénario. Lorsque l’option « Boucle » est activée dans le scénario, vous pouvez lire en boucle du son
en continu sur une plage d’images avec d’autres animations.
Pour créer une boucle, il vous suffit d’activer l’option de boucle dans votre scénario. Pour ce faire, procédez
comme suit :
Bouton de lecture audio en boucle dans le scénario
Haut de la page
Modification d’un son dans Soundbooth
Si Adobe Soundbooth est installé sur votre ordinateur, vous pouvez l’utiliser pour modifier les sons que vous
avez importés dans votre fichier Animate. Après avoir effectué des modifications dans Soundbooth, lorsque
vous enregistrez le fichier et écrasez l’original, les changements sont automatiquement pris en compte dans
le fichier Animate.
373
Si vous changez le nom de fichier ou le format du son après sa modification, vous devrez le réimporter dans
Animate.
Remarque : Soundbooth ne fonctionne que sur les ordinateurs Windows et sur les ordinateurs Macintosh à
base de processeur Intel®.®
Pour modifier un son importé dans Soundbooth :
1. Cliquez avec le bouton droit de la souris (Windows) ou avec la touche Ctrl (Macintosh)
sur le son dans le panneau Bibliothèque.
2. Choisissez Modifier dans Soundbooth dans le menu contextuel. Le fichier s’ouvre dans
Soundbooth.
3. Modifiez le fichier dans Soundbooth.
4. Lorsque vous avez terminé, enregistrez le fichier. Pour enregistrer les modifications dans
un format non destructeur, choisissez le format ASND.
Si vous enregistrez le fichier audio dans un format autre que l’original, vous devrez
recommencer son importation dans Animate.
5. Revenez dans Animate pour voir la version modifiée du fichier son dans le panneau
Bibliothèque.
Remarque : vous ne pouvez pas modifier les sons de la bibliothèque Son (Fenêtre > Bibliothèques
communes > Sons) avec la commande Modifications dans Soundbooth. Pour modifier ces sons dans
Soundbooth, ouvrez Soundbooth et sélectionnez le son dans le panneau Resource Central. Modifiez le son,
puis importez-le dans Animate.
Haut de la page
Utilisation des sons dans Flash Lite
Adobe® Flash® Lite prend en charge deux types de sons : les sons Animate standard, tels que ceux utilisés
dans les applications de bureau Animate, et les sons de périphérique. Flash Lite 1.0 prend uniquement en
charge les sons de périphériques, alors que Flash Lite 1.1 et 2.x prennent en charge à la fois les sons
standard et les sons de périphériques.
Les sons de périphériques sont stockés dans le fichier SWF publié au format audio natif (tel que MIDI ou
MFi) ; lors de la lecture, Flash Lite transmet les données audio au périphérique qui décode et lit le son. Étant
donné que vous ne pouvez pas importer la plupart des formats audio de périphériques dans Animate, vous
devez importer un fichier audio de proxy dans un format pris en charge (tel que MP3 ou AIFF), remplacé par
un son de périphérique externe que vous spécifiez.
Vous pouvez utiliser les sons de périphériques en tant que sons d’événement uniquement : vous ne pouvez
pas les synchroniser avec le scénario alors que le pouvez avec des sons standard.
Flash Lite 1.0 et 1.1 ne prennent pas en charge les fonctionnalités suivantes disponibles dans la version pour
ordinateurs de bureau de Flash® Player :
L’objet Sound ActionScript
Chargement des fichiers MP3 externes
L’option de compression audio Discours
Pour plus d’informations, voir « Utilisation du son, de vidéo et d’images » dans Développement d’applications
Flash Lite 2.x ou « Utilisation du son » dans Développement d’applications Flash Lite 1.x.
Voir aussi
Partage des ressources de bibliothèque
Son dans ActionScript
Utilisation de bibliothèques communes
Exportation de sons
374
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
375
Création de fichiers vidéo en vue de les utiliser dans Animate CC
Contrôle de la lecture vidéo
Assistant Importer de la vidéo
Formats vidéo et Animate
Tutoriels et exemples
Adobe Animate peut incorporer de la vidéo numérique dans des présentations Web. Grâce à leurs atouts en
matière de technologie et de créativité, les formats vidéo FLV et F4V (H.264) permettent de créer des
documents dans lesquels la vidéo se fond avec les données, les graphismes, le son et l’interactivité. La vidéo
FLV et F4V permet d’insérer facilement de la vidéo dans une page web, dans un format lisible par
pratiquement tous les internautes.
Le mode de déploiement de votre vidéo détermine la manière dont vous créez votre contenu vidéo et
comment vous l’intégrez à Animate. Vous pouvez intégrer de la vidéo dans Animate de l’une des manières
suivantes :
Diffusion vidéo continue avec Adobe Media Server Vous pouvez héberger du contenu vidéo sur
Adobe® Media Server, solution serveur optimisée pour délivrer du contenu multimédia en temps réel.
Adobe Media Server utilise le protocole RTMP (Real-Time Messaging Protocol), conçu pour les applications
de serveur en temps réel, telles que la diffusion en continu (streaming) du contenu audio et vidéo. Vous
pouvez héberger votre propre serveur Adobe Media Server ou utiliser un service FVSS (Flash® Video®
Streaming Service) hébergé. Adobe s’est associé à plusieurs fournisseurs de réseaux de diffusion de contenu
(CDN) pour proposer, sur des réseaux fiables et de haute performance, des services hébergés de diffusion
de vidéo FLV ou F4V à la demande. Développé avec Adobe Media Server et directement intégré à la
structure de diffusion, suivi et rapports du réseau CDN, le service FVSS offre la meilleure façon de diffuser
des fichiers FLV ou F4V au plus grand nombre de personnes possible sans avoir à mettre en place et gérer
votre propre réseau et votre propre serveur de diffusion.
Pour contrôler la lecture vidéo et fournir des commandes intuitives aux utilisateurs afin qu’ils puissent interagir
avec la vidéo en cours de diffusion, utilisez le composant FLVPlayback, Adobe® ActionScript® ou /Open
Source Media Framework (OSMF). Pour plus d’informations sur l’utilisation d’OSMF, consultez la
documentation d’OSMF.
Téléchargement progressif d’une vidéo à partir d’un serveur web Si vous n’avez pas accès à
Adobe Media Server ni au service FVSS, ou si les besoins de votre vidéo sont destinés à un site web de bas
volume avec seulement une quantité limitée de contenu vidéo, envisagez le téléchargement progressif. Le
téléchargement progressif d’un clip vidéo à partir d’un serveur web n’offre pas les performances en temps
réel d’Adobe Media Server. Cependant, vous pouvez utiliser des clips vidéo relativement volumineux et
limiter la taille des fichiers SWF publiés.
Vous pouvez utiliser le composant FLVPlayback ou du code ActionScript pour contrôler la lecture vidéo et
proposer aux utilisateurs des commandes intuitives pour interagir avec la vidéo.
Intégration de vidéo dans un document Animate Vous pouvez intégrer un petit fichier vidéo de courte
durée directement dans le document Animate, puis le publier comme une partie du fichier SWF. L’intégration
de contenu vidéo directement dans le fichier SWF Animate augmente sensiblement la taille du fichier publié
et ne convient que pour les petits fichiers vidéo (dont la longueur est généralement inférieure à 10 secondes).
De plus, la synchronisation audio/vidéo (également appelée synchro audio/vidéo) peut se désynchroniser
lorsque des clips vidéo plus longs sont intégrés dans le document Animate. L’intégration de vidéo dans le
fichier SWF comporte un autre inconvénient : vous ne pouvez pas mettre la vidéo à jour sans republier le
fichier SWF.
Remarque : Lorsque vous tentez de publier un fichier FLA avec le contenu vidéo H.264 sur un calque qui
n’est ni un calque de guide ni un calque masqué, un message d’avertissement s’affiche vous indiquant que la
376
plate-forme sur laquelle vous publiez ne prend pas en charge les vidéos H.264 incorporées.
Haut de la page
Contrôle de la lecture vidéo
Vous pouvez contrôler la lecture d’une vidéo dans Animate avec le composant FLVPlayback, en écrivant du
code ActionScript personnalisé pour lire un flux vidéo externe ou en écrivant du code ActionScript
personnalisé pour contrôler la lecture de la vidéo dans le scénario pour la vidéo intégrée.
Composant FLVPlayback Il vous permet d’ajouter rapidement une commande de lecture complète des
fichiers FLV ou F4V à votre document Animate et de prendre en charge le téléchargement progressif et la
diffusion en continu des fichiers FLV. FLVPlayback vous permet de créer facilement des commandes vidéo
intuitives pour aider les utilisateurs à contrôler la lecture, d’appliquer des enveloppes prédéfinies ou vos
propres enveloppes personnalisées à l’interface vidéo. Pour plus d’informations, voir le composant
FLVPlayback.
Open Source Media Framework (OSMF) OSMF permet aux développeurs de sélectionner et de combiner
facilement des composants enfichables en vue de créer des expériences de lecture intégrales de grande
qualité. Pour plus d’informations, consultez la documentation OSMF.
Contrôle de vidéo externe avec ActionScript Vous pouvez lire les fichiers FLV ou F4V externes dans un
document Animate au moment de l’exécution à l’aide des objets ActionScript NetConnection et
NetStream. Pour plus d’informations, voir Contrôle de la lecture vidéo externe à l’aide d’ActionScript.
Vous pouvez utiliser des comportements vidéo (scripts ActionScript prêts à l’emploi) pour contrôler la lecture
de la vidéo.
Contrôle d’une vidéo intégrée au scénario Pour contrôler la lecture de fichiers vidéo intégrés, vous devez
écrire du code ActionScript pour contrôler le scénario qui contient la vidéo. Pour plus d’informations, voir
Contrôle de la lecture vidéo à l’aide du scénario.
Haut de la page
Assistant Importer de la vidéo
L’Assistant Importer de la vidéo simplifie l’importation d’une vidéo dans un document Animate en vous
guidant tout au long de la procédure : sélection du fichier vidéo et importation pour son utilisation dans l’un
des trois scénarios de lecture. L’Assistant Importer de la vidéo fournit un niveau de configuration de base
pour la méthode d’importation et de lecture que vous avez choisie, et que vous pourrez modifier
ultérieurement pour tout besoin spécifique.
La boîte de dialogue Importer une vidéo fournit les options d’importation suivantes :
Charger la vidéo externe avec le composant de lecture Importe la vidéo et crée une occurrence du
composant FLVPlayback pour contrôler la lecture. Lorsque vous êtes prêt à publier votre document Animate
sous forme de fichier SWF et à le charger sur votre serveur Web, vous devez également charger le fichier
vidéo dans un serveur Web ou dans Adobe Media Server et configurer le composant FLVPlayback avec
l’emplacement du fichier vidéo chargé.
Incorporer le fichier FLV dans SWF et le diffuser dans le scénario Intègre le contenu FLV au document
Animate. Lorsque vous importez une vidéo de cette manière, elle est placée dans le scénario, où vous
pouvez voir séparément les images vidéo individuelles représentées dans les images du scénario. Le fichier
vidéo FLV intégré devient partie intégrante du document Animate.
Remarque : L’intégration de contenu vidéo directement dans le fichier SWF Animate augmente sensiblement
la taille du fichier publié et ne convient que pour les petits fichiers vidéo. De plus, la synchronisation
audio/vidéo (également appelée synchro audio/vidéo) peut se désynchroniser lorsque des clips vidéo plus
longs sont intégrés dans le document Animate.
377
Incorporer la vidéo H.264 au scénario Intègre les vidéos H.264 dans le document Animate.Lorsque vous
importez une vidéo à l’aide de cette option, elle peut être placée sur la scène pour être utilisée comme guide
pour votre animation au moment de la conception. Les images issues de la vidéo seront rendues sur la scène
lorsque vous faites défiler ou lisez le scénario. L’audio correspondant aux images est également lu.
Remarque :
Lorsque vous tentez de publier un fichier FLA avec le contenu vidéo H264 sur un calque
qui n’est ni un calque de guide ni un calque masqué, un message d’avertissement
s’affiche vous indiquant que la plate-forme sur laquelle vous publiez ne prend pas en
charge les vidéos H.264 incorporées.
Haut de la page
Formats vidéo et Animate
Pour importer du contenu vidéo dans Animate, vous devez utiliser un fichier codé au format FLV ou H.264.
L’Assistant d’importation vidéo (Fichier > Importer > Importer une vidéo) vérifie les fichiers vidéo que vous
sélectionnez pour l’importation et vous alerte s’ils se présentent dans un format non lisible par Animate. Si la
vidéo n’est pas au format FLV ou F4V, vous pouvez utiliser Adobe® Media® Encoder pour la coder au format
approprié.
Adobe Media Encoder
Adobe® Media® Encoder est une application de codage autonome utilisée par des programmes comme
Adobe® Premiere® Pro, Adobe® Soundbooth® et Animate pour une sortie dans certains formats
multimédias. Selon le programme, Adobe Media Encoder fournit une boîte de dialogue Réglages
d’exportation spécialisés proposant les nombreux paramètres associés à certains formats d’exportation, par
exemple, Adobe Flash Video et H.264. Pour chaque format, la boîte de dialogue Réglages d’exportation inclut
un certain nombre de présélections adaptées à des supports de diffusion spécifiques. Vous pouvez
également enregistrer des présélections personnalisées que vous pouvez partager avec d’autres ou
recharger lorsque vous en avez besoin.
Pour plus d’informations sur le codage de la vidéo au format H.264 ou F4V à l’aide d’Adobe Media Encoder,
voir Utilisation d’Adobe Media Encoder.
Codecs vidéo H.264, On2 VP6 et Sorenson Spark
Lorsque vous codez un fichier vidéo avec Adobe Media Encoder, vous avez le choix entre trois codecs vidéo
différents pour coder le contenu de votre vidéo pour une utilisation avec Animate :
H.264 La prise en charge du codec vidéo H.264 est intégrée dans Flash Player depuis la version 9.0.r115.
Le format vidéo F4V qui utilise ce codec améliore significativement le rapport qualité/débit par rapport aux
anciens codecs vidéo Flash. Toutefois, il consomme plus de ressources de calcul que les codecs Sorenson
Spark et On2 VP6 intégrés dans Flash Player 7 et 8.
Remarque : Si vous devez utiliser la vidéo avec prise en charge du canal alpha pour la composition
d’images, utilisez le codec vidéo On2 VP6 ; le format F4V ne prend pas en charge les canaux vidéo alpha.
On2 VP6 On2 VP6 est le codec vidéo à utiliser par défaut pour créer des fichiers FLV destinés à Flash
Player 8 et supérieur. Le codec On2 VP6 présente les avantages suivants :
Une vidéo de qualité supérieure par rapport au codec Sorenson Spark codé au même
débit de données
Prise en charge de l’utilisation d’un canal alpha 8 bits sur la vidéo composite
Afin de prendre en charge une vidéo de meilleure qualité au même débit de données, le
codec On2 VP6 exige un codage plus lent et un processeur plus puissant sur l’ordinateur
client pour le décodage et la lecture. Par conséquent, vous devez réellement prendre en
considération le plus petit dénominateur commun de l’ordinateur que le public que vous
378
ciblez utilisera lorsqu’il accédera à votre contenu vidéo FLV.
Sorenson Spark Introduit avec Flash Player 6, le codec vidéo Sorenson Spark doit être utilisé lorsque vous
prévoyez de publier des documents Animate nécessitant une rétrocompatibilité avec Flash Player 6 et 7. Si
vous prévoyez de nombreux utilisateurs d’anciens ordinateurs, prévoyez des fichiers FLV codés avec le
codec Sorenson Spark car il est bien moins gourmand en calculs que les codecs On2 VP6 ou H.264.
Si votre contenu Animate charge de façon dynamique des fichiers vidéo Flash Professional (en
téléchargement progressif ou avec Adobe Media Server), vous pouvez utiliser les vidéos On2 VP6 sans avoir
à republier votre fichier SWF créé pour Flash Player 6 ou 7, tant que les utilisateurs exécutent Flash Player 8
ou supérieur pour afficher votre contenu. En diffusant en flux continu ou en téléchargeant la vidéo On2 VP6
en Animate SWF version 6 ou 7 et en lisant le contenu dans Flash Player 8, vous n’avez pas à recréer vos
fichiers SWF pour les utiliser dans Flash Player 8 et versions ultérieures.
Remarque : seuls Flash Player 8 et 9 prennent en charge la publication et la lecture des vidéos On2 VP6.
Codec
Version SWF (version
publiée)
Version Flash Player (nécessaire pour la
lecture)
Sorenson
Spark
6
6, 7, 8
7
7, 8, 9, 10
On2 VP6
6, 7, 8
8, 9, 10
H.264
9.2 ou plus récente
9.2 ou plus récente
Conseils de création de vidéos Adobe FLV et F4V
Suivez ces conseils pour diffuser la meilleure vidéo FLV ou F4V possible :
Utilisez une vidéo dans le format d’origine de votre projet jusqu’au résultat final
Si vous convertissez un format vidéo numérique précompressé en un autre format, comme le format FLV ou
F4V, l’encodeur précédent peut entraîner un bruit vidéo. Le signal vidéo d’origine applique déjà un algorithme
de codage, occasionnant une perte de qualité, de taille d’image et de débit. Cette compression peut aussi
avoir entraîné des parasites ou des bruits numériques. Ce bruit supplémentaire affecte alors le processus
d’encodage final et peut nécessiter un débit plus élevé pour coder un fichier de bonne qualité.
Visez la simplicité
Évitez les transitions trop compliquées, qui ne peuvent pas être correctement compressées, ni correctement
affichées dans votre animation. Les coupures nettes (par opposition aux fondus) sont souvent préférables.
Les séquences vidéo, comme par exemple avec un zoom arrière depuis la première piste, qui contiennent un
effet de page qui tourne ou de balle qui s’envole hors de l’écran, sont peut-être du plus bel effet mais elles
ne sont pas aussi bien compressées et doivent être utilisées avec modération.
Soyez conscient du débit disponible pour votre public
Pour diffuser des vidéos sur Internet, il est judicieux de créer des fichiers répondant aux débits les plus bas.
Les utilisateurs équipés de connexions Internet rapides peuvent voir les fichiers instantanément ou après très
peu d’attente pour le chargement, alors que ceux qui sont équipés d’un accès par modem RTC doivent
379
attendre longuement la fin du chargement des fichiers. Réduisez la longueur des vidéos pour faire que les
temps de téléchargement restent dans des limites acceptables pour les utilisateurs équipés d’un accès par
ligne commutée.
Sélectionnez la cadence appropriée
La cadence est le nombre d’images lues par seconde (ips). Si vous avez un clip à débit de données élevé, la
réduction de la cadence peut permettre d’améliorer la lecture sur les bandes passantes limitées. Par exemple,
si vous compressez un clip vidéo avec peu de mouvements, la division de la cadence par deux permettra
probablement de réduire de 20 % le débit de données. Cependant, si vous compressez une vidéo contenant
de nombreux mouvements, la réduction de la cadence a beaucoup plus d’impact sur le débit des données.
La qualité des images vidéo étant nettement meilleure à leur cadence d’origine, gardez une cadence élevée
si les canaux de transmission et les plates-formes de lecture le permettent. Pour la diffusion sur le web, vous
pouvez obtenir ces informations auprès de votre service d’hébergement. Pour les périphériques mobiles,
utilisez les paramètres prédéfinis d’encodage spécifiques au périphérique, ainsi que l’émulateur du
périphérique disponible par l’intermédiaire d’Adobe Media Encoder dans Adobe Premiere Pro. Si vous devez
réduire la cadence, vous obtiendrez de meilleurs résultats en la divisant par des nombres entiers.
Sélectionnez une taille d’image qui corresponde au rapport entre le débit de données et l’aspect des
images
Pour tout débit de données (vitesse de connexion), l’augmentation de la taille des images fait diminuer la
qualité vidéo. Lorsque vous sélectionnez la taille des images pour les paramètres de codage, vous devez
également considérer la cadence, le matériau d’origine et vos préférences personnelles. Afin d’éviter les
barres noires de chaque côté de l’image, il est important de choisir la taille des images suivant le même
rapport d’aspect que celui des métrages d’origine. Par exemple, l’encodage d’un métrage NTSC en taille
d’image PAL entraîne des barres noires de chaque côté de l’image.
Adobe Media Encoder rend plusieurs vidéos Adobe FLV ou F4V disponibles. Ces paramètres comprennent
les tailles et les cadences d’images prédéfinies pour les différents standards de télévision à différentes débits
de données. Utilisez la liste ci-dessous de tailles d’image communes (en pixels), ou testez les différents
paramètres prédéfinis Adobe Media Encoder afin de trouver ceux qui correspondent le mieux à votre projet.
Modem commuté NTSC 4 x 3 162 x 120
Modem commuté PAL 4 x 3 160 x 120
T1/DSL/câble NTSC 4 x 3 648 x 480
T1/DSL/câble PAL 4 x 3 768 x 576
Utilisez un flux continu pour de meilleures performances
Pour réduire les temps de téléchargement, proposer une réelle interactivité et des possibilités de navigation
ou contrôler la qualité du service, diffusez les fichiers vidéo FLV ou F4V en flux continu (streaming) avec
Adobe Media Server ou utilisez le service hébergé de l’un des partenaires Flash Video Streaming Service
d’Adobe, disponible par l’intermédiaire du site web d’Adobe. Pour plus de détails sur la différence entre le
téléchargement progressif et le flux continu avec Adobe Media Server, voir « Diffusion de contenus vidéo
Flash : Mieux comprendre les différences entre le téléchargement progressif et la vidéo en flux continu » sur
le site web du Pôle de développement Flash.
Tenez compte de la durée du téléchargement
Vous devez connaître le temps du téléchargement de votre vidéo afin qu’elle soit lue jusqu’à la fin sans avoir
à s’arrêter pour terminer le téléchargement. Pendant le téléchargement de la première partie de la vidéo,
vous pouvez vouloir afficher un autre contenu afin de masquer le téléchargement. Utilisez la formule suivante
380
pour des clips de courte durée : Pause = durée de téléchargement - durée de lecture + 10 % de la durée de
lecture. Par exemple, si votre clip dure 30 secondes et que son téléchargement dure une minute, utilisez un
tampon de 33 secondes (60 secondes – 30 secondes + 3 secondes = 33 secondes).
Supprimez les bruits et l’entrelacement
Pour obtenir le meilleur codage possible, vous pouvez avoir besoin de supprimer les bruits et les
entrelacements.
La qualité de l’animation finale est proportionnelle à la qualité de la vidéo d’origine. Bien que la cadence et la
taille des images de vidéo sur Internet soient en général inférieures à celles utilisées pour la télévision, les
écrans d’ordinateur ont des caractéristiques de fidélité des couleurs, de saturation, de définition et de
résolution nettement supérieures à celles des écrans de télévision conventionnels. Même avec une petite
fenêtre, la qualité des images est en général plus importante pour les vidéos numériques que pour la
télévision analogique standard. Les anomalies et le bruit, qui passent presque inaperçus sur l’écran d’un
téléviseur, peuvent devenir terriblement évidents sur celui d’un ordinateur.
Adobe Animate est conçu pour un affichage progressif sur les écrans d’ordinateur et les autres périphériques,
plutôt que pour un affichage entrelacé, comme sur un téléviseur. Le métrage entrelacé affiché
progressivement peut montrer des lignes verticales dans les zones contenant de nombreux mouvements.
Ainsi, Adobe Media Encoder supprime l’entrelacement de tous les métrages vidéo qu’il traite.
Procédez de même pour le son
Les mêmes considérations s’appliquent à la production audio comme à la production vidéo. Pour pouvoir
obtenir une bonne compression audio, vous devez utiliser un support audio de qualité. Si vous codez le
contenu d’un CD, essayez d’enregistrer le fichier par un transfert numérique direct en évitant de passer par
une entrée analogique de votre carte son. La carte son introduit une conversion numérique à analogique et
analogique à numérique superflue qui risque d’ajouter des bruits à vos matériaux source audio. Des outils de
transfert numérique direct sont disponibles pour les plates-formes Windows et Macintosh. Si vous devez
effectuer l’enregistrement à partir d’une source analogique, veillez à utiliser une carte son de la meilleure
qualité possible.
Remarque : si votre fichier audio source est en mono, nous vous recommandons de coder le fichier en
mono pour une utilisation avec Animate. Si vous codez votre fichier avec Adobe Media Encoder et que vous
utilisez des encodages prédéfinis, vérifiez si cet encodage code en stéréo ou en mono, et sélectionnez mono
le cas échéant.
Haut de la page
Tutoriels et exemples
Les tutoriels vidéo et articles suivants fournissent des instructions détaillées sur la création et la préparation
de vidéos en vue de les utiliser dans Animate. Certains sont basés sur CS3 ou CS4, mais s’appliquent
également à CS5.
Vidéo : Creating FLV and F4V files (4:23) (Adobe.com, disponible en anglais uniquement)
Vidéo : Animate 411 - Video encoding basics (15:16) (Adobe.com, disponible en anglais
uniquement)
Vidéo : Batch encoding with Adobe Media Encoder (5:45) (Adobe.com, disponible en
anglais uniquement)
Article : Utilisation d’Adobe Media Encoder (Adobe.com)
Article : H.264 for the rest of us (Adobe.com, disponible en anglais uniquement)
Adobe recommande également :
Ajout de vidéo à Animate
Le composant FLVPlayback
Contrôle de la lecture vidéo externe à l’aide d’ActionScript
381
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
382
Ajout d’une vidéo dans un document Animate
Avant de commencer
Méthodes d’utilisation de la vidéo dans Animate
Téléchargement progressif d’une vidéo à l’aide d’un serveur web
Diffusion vidéo continue avec Adobe Media Server
Intégration d’un fichier vidéo dans un fichier Animate
Animate propose plusieurs méthodes pour incorporer du contenu vidéo dans votre document et le lire pour
les utilisateurs.
Haut de la page
Avant de commencer
Avant d’utiliser le contenu vidéo dans Animate, il est important de bien comprendre les points suivants :
Animate peut uniquement lire certains formats vidéo.
Il s’agit, entre autres, des formats FLV, F4V et MPEG. Pour plus d’informations sur la
conversion de vos vidéos dans d’autres formats, voir Création de vidéos en vue de les
utiliser dans Animate.
Utilisez l’application autonome Adobe Media Encoder (fournie avec Animate) pour
convertir d’autres formats vidéo en F4V. Pour plus d’informations, voir Création de vidéos
en vue de les utiliser dans Animate.
Il existe différentes méthodes pour ajouter du contenu vidéo à Animate. Chacune d’elles
présente des avantages en fonction de la situation. Vous trouverez ci-dessous une liste
de ces méthodes.
L’Assistant Importation vidéo d’Animate s’ouvre lorsque vous sélectionnez Fichier >
Importer > Importer de la vidéo.
La méthode la plus simple pour lire rapidement le contenu vidéo d’un fichier Animate
consiste à utiliser le composant FLVPlayback.
Pour plus d’informations, voir Téléchargement progressif d’une vidéo à l’aide d’un serveur
Web.
Haut de la page
Méthodes d’utilisation de la vidéo dans Animate
Vous pouvez utiliser le contenu vidéo dans Animate de plusieurs façons :
Téléchargement progressif depuis un serveur Web
Grâce à cette méthode, le fichier vidéo reste extérieur au fichier Animate et au fichier
SWF résultant. Cela n’augmente pas la taille du fichier SWF. Il s’agit de la méthode la
plus courante pour utiliser le contenu vidéo dans Animate.
Diffusion vidéo continue avec Adobe Media Server
383
Le fichier vidéo reste extérieur à votre fichier Animate. Adobe Media Streaming Server
protège efficacement votre contenu vidéo et permet une lecture en flux continu
harmonieuse.
Intégration de données vidéo directement dans un fichier Animate
Cette méthode produit des fichiers Animate très volumineux et n’est recommandée que
pour des clips courts. Pour plus d’informations, voir Intégration de vidéo dans un fichier
Animate.
Haut de la page
Téléchargement progressif d’une vidéo à l’aide d’un serveur web
Le téléchargement progressif permet d’utiliser le composant FLVPlayback ou du code ActionScript pour
charger des fichiers FLV ou F4V externes dans un fichier SWF, et les lire au moment de l’exécution.
Étant donné que le fichier vidéo est maintenu à l’extérieur de l’autre contenu Animate, il est relativement
facile de mettre à jour le contenu vidéo sans devoir publier à nouveau le fichier SWF.
Le téléchargement progressif présente les avantages suivants par rapport à l’intégration de la vidéo au
scénario :
Durant la création, il suffit de publier l’interface du fichier SWF pour visionner ou tester le
contenu Animate, en tout ou en partie. Les délais d’affichage et, dans le cas de tests à
répétition, les délais de production en sont donc réduits d’autant.
Lors de la diffusion, la lecture de la vidéo débute dès que le premier segment a été
téléchargé et mis en cache sur le disque dur local.
Lors de l’exécution, les fichiers vidéo sont ensuite chargés dans le fichier SWF depuis le
disque dur par Flash Player, sans limite de taille ou de durée. Cette méthode évite les
problèmes de synchronisation audio et les restrictions liées à la mémoire vive disponible.
La cadence du fichier vidéo peut différer de celle du fichier SWF, ce qui offre plus de
souplesse dans la création d’un contenu Animate.
Importation de vidéo en vue d’un téléchargement progressif
Vous pouvez importer un fichier vidéo stocké localement sur votre ordinateur dans le fichier FLA, puis le
télécharger vers un serveur. Dans Animate, lorsque vous importez une vidéo pour un téléchargement
progressif, vous n’ajoutez en fait qu’une référence au fichier vidéo. Animate utilise cette référence pour
rechercher le fichier vidéo sur votre ordinateur local ou sur un serveur Web.
Vous pouvez également importer un fichier vidéo qui a déjà été téléchargé vers un serveur web standard,
Adobe Media Server (AMS) ou le service FVSS (Flash Video Streaming Service).
1. Pour importer le clip vidéo dans le document Animate actif, sélectionnez Fichier >
Importer > Importer une vidéo.
2. Sélectionnez le clip vidéo à importer. Vous pouvez sélectionner un clip vidéo stocké
dans votre ordinateur local ou entrer l’URL d’une vidéo déjà téléchargée vers un serveur
Web ou Adobe Media Server.
Pour importer la vidéo stockée dans votre ordinateur local, sélectionnez Charger la
vidéo externe avec un composant de lecture.
Pour importer une vidéo déjà déployée sur un serveur Web, Adobe Media Server ou
le service FVSS, sélectionnez Déjà déployée sur un serveur Web, Diffusion en
continu avec le service FVSS ou Diffusion en continu à partir d’Adobe Media Server,
puis entrez l’URL du clip vidéo.
Remarque : L’URL d’un clip vidéo situé sur un serveur web utilise le protocole de
communication http. L’URL d’un clip vidéo situé sur Adobe Media Server ou sur un
service FVSS utilise le protocole de communication RTMP.
384
3. Sélectionnez une enveloppe pour le clip. Vous avez le choix entre les options suivantes :
Ne pas utiliser d’enveloppe avec le composant FLVPlayback en sélectionnant
Aucune.
Sélectionner l’une des enveloppes prédéfinies pour le composant FLVPlayback.
Animate copie l’enveloppe dans le même dossier que le fichier FLA.
Remarque : Les enveloppes du composant FLVPlayback diffèrent légèrement selon
que vous créez un document Animate de type AS2 ou AS3.
Sélectionner votre propre enveloppe personnalisée en saisissant son URL sur le
serveur Web.
Remarque : Si vous décidez d’utiliser une enveloppe personnalisée invoquée depuis
un emplacement distant, l’aperçu en direct n’est pas disponible pour la vidéo sur la
scène.
4. L’Assistant Importer de la vidéo crée un composant vidéo FLVPlayback sur la scène que
vous pouvez utiliser pour tester la vidéo localement. Lorsque vous avez terminé la
création de votre document Animate et que vous souhaitez déployer le fichier SWF et le
clip vidéo, chargez les ressources suivantes sur le serveur Web ou sur le serveur
Adobe Media Server hébergeant votre vidéo :
Si vous utilisez une copie locale du clip vidéo, chargez ce dernier (stocké dans le
même dossier que le clip vidéo source que vous avez sélectionné avec une
extension .flv).
Remarque : Animate utilise un chemin relatif pour désigner le fichier FLV ou F4V
(relatif au fichier SWF), ce qui vous permet d’utiliser localement la même structure de
répertoires que sur le serveur. Si la vidéo que vous utilisez a déjà été déployée sur
votre FMS ou FVSS hébergeant votre vidéo, vous pouvez ignorer cette étape.
L’enveloppe vidéo (si vous choisissez d’utiliser une enveloppe)
Si vous choisissez d’utiliser une enveloppe prédéfinie, Animate la copie dans le
même dossier que le fichier FLA.
Le composant FLVPlayback
Pour changer l’URL du composant FLVPlayback et la remplacer par celle du serveur
web ou du serveur Adobe Media Server sur lequel vous avez chargé la vidéo, utilisez
l’Inspecteur des composants (Fenêtres > Inspecteur des composants) pour modifier
le paramètre contentPath.
Haut de la page
Diffusion vidéo continue avec Adobe Media Server
Adobe Media Server diffuse les données multimédias en temps réel vers Flash Player et AIR.
Adobe Media Server utilise la détection de la bande passante, ce qui permet de transmettre des fichiers vidéo
ou audio de taille adaptée à la connexion de l’utilisateur.
La vidéo en flux continu avec Adobe Media Server présente les avantages suivants par rapport à la vidéo
intégrée ou téléchargée progressivement :
L’affichage de la vidéo débute plus rapidement qu’avec les autres méthodes.
Le flux continu utilise moins de mémoire et d’espace disque client, étant donné que les
clients n’ont pas besoin de télécharger la totalité du fichier.
Les ressources du réseau sont utilisées de manière plus efficace, étant donné que seules
les parties de la vidéo qui sont diffusées sont envoyées au client.
La diffusion des supports est plus sécurisée, étant donné que les supports ne sont pas
enregistrés dans la mémoire cache du client lorsqu’ils sont diffusés en continu.
La diffusion vidéo en flux continu offre davantage de possibilités de suivi, rapports et
385
journalisation.
Le flux continu vous permet de diffuser des présentations audio et vidéo en direct, ou de
capturer la vidéo à partir d’une Webcam ou d’une caméra vidéo numérique.
Adobe Media Server permet d’établir des flux multidirectionnels et multi-utilisateurs pour
créer des applications de conversation vidéo, de vidéomessagerie et de vidéoconférence.
En contrôlant de manière programmée les flux vidéo et audio (à l’aide d’exécution de
scripts côté serveur), vous pouvez créer des listes de lecture côté serveur, des flux
synchronisés et des options de diffusion plus intelligentes basées sur la vitesse de
connexion du client.
Pour en savoir plus sur Adobe Media Server, voir www.adobe.com/go/flash_media_server_fr.
Pour en savoir plus sur Flash Video Streaming Service (FVSS), voir www.adobe.com/go/learn_fvss_en.
Haut de la page
Intégration d’un fichier vidéo dans un fichier Animate
Lorsque vous intégrez un fichier vidéo, toutes ses données sont ajoutées au fichier Animate. Le fichier
Animate et le fichier SWF ultérieur sont donc beaucoup plus volumineux. La vidéo est placée dans le
scénario, où vous pouvez voir séparément les images vidéo représentées dans les images du scénario.
Chaque image de la vidéo étant représentée par une image dans le scénario, les cadences d’images du clip
et du fichier SWF doivent être identiques. Si vous utilisez des cadences d’images différentes pour le fichier
SWF et le clip vidéo intégré, la lecture sera incohérente.
Remarque : Si vous devez utiliser des cadences différentes, diffusez la vidéo par un téléchargement
progressif ou par Adobe Media Server. Lorsque vous importez des fichiers vidéo selon l’une de ces
méthodes, les fichiers FLV ou F4V sont autonomes et exécutés à une cadence différente de toutes les autres
cadences du scénario incluses dans le fichier SWF.
Il est conseillé de réserver la vidéo intégrée à des clips de petite taille, avec un temps de lecture inférieur à
10 secondes. Si vous utilisez des clips d’un temps de lecture supérieur, il est préférable de recourir à la vidéo
en téléchargement progressif ou à la diffusion en flux continu avec Adobe Media Server.
Les limites de la vidéo intégrée sont les suivantes :
Au cours de l’intégration de fichiers vidéo, vous risquez d’éprouver des difficultés si les
fichiers SWF obtenus sont trop volumineux. Flash Player consacre une grande partie de
la mémoire au téléchargement et aux essais de lecture des fichiers SWF volumineux
avec vidéo intégrée, et ceci peut entraîner le dysfonctionnement de Flash Player.
Des fichiers vidéo plus longs (plus de 10 secondes) entraînent souvent des problèmes de
synchronisation entre les parties vidéo et audio d’un clip vidéo. Au fil du temps, la lecture
de la piste audio commence en dehors de la séquence vidéo, ce qui entraîne un affichage
non souhaité.
Pour lire une vidéo intégrée à un fichier SWF, la totalité du fichier vidéo doit être
téléchargée avant le début de la lecture de la vidéo. Si vous incorporez un clip vidéo trop
volumineux, le téléchargement intégral du fichier SWF et le début de la lecture peuvent
prendre du temps.
Une fois un clip vidéo importé, il ne peut plus être modifié. Vous devez alors le modifier à
nouveau, puis le réimporter.
Lorsque vous publiez votre fichier SWF sur le Web, la totalité de la vidéo doit être
téléchargée sur l’ordinateur de l’utilisateur avant de commencer la lecture.
À l’exécution, toute la vidéo doit tenir dans la mémoire locale de l’ordinateur qui la lit.
La longueur d’un fichier vidéo importé ne doit pas dépasser les 16 000 images.
La cadence de la vidéo et celle du scénario Animate doivent être identiques. Définissez la
cadence de votre fichier Animate pour qu’elle corresponde à celle de la vidéo intégrée.
386
Vous pouvez afficher un aperçu des images d’une vidéo importée en faisant glisser la tête de lecture le long
du scénario (modulation). Notez que la piste audio de la vidéo n’est pas lue pendant la modulation. Pour
afficher un aperçu de la vidéo avec le son, utilisez la commande Tester l’animation.
Intégration d’une vidéo dans un fichier Animate
1. Pour importer le clip vidéo dans le document Animate actif, sélectionnez Fichier >
Importer > Importer une vidéo.
2. Sélectionnez l’une des options suivantes :
Charger la vidéo externe avec un composant de lecture : importe la vidéo et crée une
occurrence du composant FLVPlayback pour contrôler la lecture.
Incorporer le fichier FLV dans SWF et le diffuser dans le scénario : incorpore le
fichier FLV dans le document Animate et le place dans le scénario.
Incorporer la vidéo H.264 au scénario : incorpore les vidéos H.264 dans le document
Animate. Lorsque vous importez une vidéo à l’aide de cette option, elle peut être placée
sur la scène pour être utilisée comme guide pour votre animation au moment de la
conception. Les images issues de la vidéo seront rendues sur la scène lorsque vous
faites défiler ou lisez le scénario. L’audio correspondant aux images est également lu.
Remarque :
Lorsque vous tentez de publier un fichier avec le contenu vidéo H264 sur un calque
qui n’est ni un calque de guide ni un calque masqué, un avertissement s’affiche vous
indiquant que la plate-forme sur laquelle vous publiez ne prend pas en charge les
vidéos H.264 incorporées.
3. Cliquez sur Parcourir et sélectionnez le fichier vidéo sur l’ordinateur, puis cliquez sur
Suivant.
Facultatif : si Adobe Media Encoder est installé sur l’ordinateur et que vous souhaitez
convertir une vidéo dans un autre format à l’aide d’AME, cliquez sur Convertir la vidéo.
4. Choisissez le type de symbole avec lequel la vidéo sera intégrée.
Vidéo intégrée Si vous utilisez le clip vidéo pour une lecture linéaire dans le scénario,
l’importation de la vidéo dans le scénario est la méthode la plus appropriée.
Clip La meilleure pratique consiste à placer ces données dans une occurrence de clip :
vous bénéficiez ainsi d’un meilleur contrôle sur le contenu. Le scénario vidéo est
indépendant du scénario principal. Il n’est pas nécessaire d’étendre le scénario principal
avec de nombreuses images pour recevoir les données vidéo, car ceci risquerait de
rendre l’utilisation du fichier FLA difficile.
Graphique L’intégration d’un clip vidéo en tant que symbole graphique signifie que vous
ne pouvez pas interagir avec la vidéo en utilisant ActionScript (vous utilisez,
généralement, des symboles graphiques pour les images statiques et pour créer des
éléments d’animation réutilisables liées au scénario principal).
5. Importez directement le clip vidéo sur la scène (et le scénario) ou en tant qu’élément de
la bibliothèque.
Par défaut, Animate place la vidéo que vous importez sur la scène. Pour importer la
vidéo uniquement dans la bibliothèque, désactivez Placer l’occurrence sur la scène.
Si vous créez une simple présentation vidéo avec narration linéaire et peu voire pas
d’interaction, acceptez le paramètre par défaut et importez la vidéo sur la scène.
Cependant, si vous souhaitez créer une présentation plus dynamique, travaillez avec
plusieurs clips vidéo ou envisagez d’ajouter des transitions dynamiques ou d’autres
éléments en utilisant ActionScript, importez la vidéo dans la bibliothèque. Une fois que le
clip vidéo est dans la bibliothèque, vous pouvez le personnaliser en le convertissant en
un objet MovieClip qui peut être plus facilement contrôlé en utilisant ActionScript.
387
Par défaut, Animate agrandit le scénario pour l’adapter à la durée de lecture du clip vidéo
que vous intégrez.
Si le fichier vidéo contient des données audio que vous ne souhaitez pas importer,
désélectionnez l’option Inclure l’audio.
6. Cliquez sur Suivant. Vérifiez les messages de confirmation, puis cliquez sur Terminer.
L’Assistant Importer une vidéo intègre la vidéo dans le fichier SWF. La vidéo s’affiche sur
la scène ou dans la bibliothèque en fonction des options d’intégration que vous
sélectionnez.
7. Dans l’inspecteur des propriétés (Fenêtre > Propriétés), donnez un nom d’occurrence au
clip vidéo et apportez les modifications nécessaires aux propriétés du clip vidéo.
Importation de fichiers vidéo dans la bibliothèque
Pour importer des vidéos FLV, F4V ou H.264, sélectionnez Importer > Importer la vidéo ou Importer dans la
bibliothèque.
Si vous souhaitez créer votre propre lecteur vidéo, qui chargera dynamiquement les fichiers FLV ou F4V à
partir d’une source externe, vous devez placer votre vidéo à l’intérieur d’un symbole de clip. Lorsque vous
chargez des fichiers FLV ou F4V dynamiquement, ajustez les dimensions du clip pour qu’elles correspondent
à celles du fichier vidéo et mettez la vidéo à l’échelle en mettant le clip à l’échelle.
Remarque : la meilleure pratique consiste à placer ces données dans une occurrence de clip. Vous
bénéficiez ainsi d’un meilleur contrôle sur le contenu. Le scénario vidéo est indépendant du scénario
principal. Il n’est pas nécessaire d’étendre le scénario principal avec de nombreuses images pour recevoir les
données vidéo, car ceci risquerait de rendre l’utilisation du fichier FLA difficile.
Pour importer un fichier vidéo FLV, SWF ou H.264 dans la bibliothèque, effectuez l’une
des opérations suivantes :
Sélectionnez Fichier > Importer > Importer dans la bibliothèque.
Sélectionnez un clip vidéo existant dans le panneau Bibliothèque et choisissez
Propriétés dans le menu Panneau de la bibliothèque. Cliquez sur Importer.
Recherchez le fichier à importer, puis cliquez sur Ouvrir.
Modification des propriétés d’un clip vidéo
Dans l’inspecteur des propriétés, vous pouvez modifier les propriétés d’une occurrence d’un clip vidéo intégré
sur la scène, affecter un nom à l’occurrence et en modifier la largeur, la hauteur et la position sur la scène.
Vous pouvez également permuter l’occurrence d’un clip vidéo, c’est-à-dire affecter un symbole différent à
l’occurrence d’un clip vidéo. L’affectation d’un symbole différent à une occurrence permet d’afficher une
occurrence différente sur la scène tout en conservant toutes les autres propriétés de l’occurrence (telles que
les dimensions et le point d’alignement).
Dans la boîte de dialogue Propriétés de vidéo, effectuez les opérations suivantes :
Affichez les informations sur un clip importé, y compris son nom, son chemin, sa date de
création, ses dimensions en pixels, sa durée et sa taille de fichier.
Modifiez le nom du clip.
Mettez à jour le clip si vous le modifiez dans un éditeur externe.
Importez un fichier FLV ou F4V pour remplacer le clip sélectionné.
Exportez un clip vidéo sous forme de fichier FLV ou F4V.
Modification des propriétés d’une occurrence de vidéo dans l’inspecteur des
propriétés
388
1. Sélectionnez une occurrence de clip vidéo intégré ou lié sur la scène.
2. Sélectionnez Fenêtre > Propriétés et effectuez l’une des opérations suivantes :
Saisissez un nom d’occurrence dans le champ Nom, sur le côté gauche de
l’inspecteur des propriétés.
Saisissez les valeurs de L et H afin de modifier les dimensions de l’occurrence de la
vidéo.
Saisissez les valeurs de X et Y afin de modifier la position du coin supérieur gauche
de l’occurrence sur la scène.
Cliquez sur Permuter. Sélectionnez un clip par lequel vous souhaitez remplacer celui
actuellement affecté à l’occurrence.
Remarque : Vous ne pouvez permuter un clip vidéo intégré qu’avec un autre clip
vidéo intégré et un clip vidéo lié qu’avec un autre clip vidéo lié.
Affichage des propriétés d’un clip dans la boîte de dialogue Propriétés de vidéo
1. Sélectionnez un clip vidéo dans le panneau Bibliothèque.
2. Sélectionnez Propriétés dans le menu Panneau de bibliothèque, ou cliquez sur le bouton
Propriétés situé au bas du panneau Bibliothèque. La boîte de dialogue Propriétés de la
vidéo s’affiche.
Attribution d’un nouveau nom, mise à jour ou remplacement d’une vidéo
1. Sélectionnez un clip vidéo existant dans le panneau Bibliothèque et choisissez
Propriétés dans le menu Panneau de la bibliothèque.
2. Effectuez l’une des opérations suivantes :
Pour affecter un nouveau nom à un clip, saisissez le nom dans le champ Nom.
Pour mettre à jour une vidéo, recherchez son fichier mis à jour, puis cliquez sur
Ouvrir.
Pour remplacer une vidéo, cliquez sur Importer, recherchez le fichier FLV, F4V ou
H.264 pour remplacer l’élément actif, puis cliquez sur Ouvrir.
Contrôle de la lecture vidéo avec le scénario
Vous pouvez contrôler la lecture d’un fichier vidéo intégré en contrôlant le scénario qui contient la vidéo. Par
exemple, pour mettre la lecture d’une vidéo en pause sur le scénario principal, vous pouvez appeler une
action stop() ciblant ce scénario. De la même manière, vous pouvez contrôler un objet vidéo dans un
symbole de clip en contrôlant la lecture du scénario de ce symbole.
Vous pouvez appliquer les actions suivantes aux objets vidéo importés dans les clips : goTo, play, stop,
toggleHighQuality, stopAllSounds, getURL, FScommand, loadMovie, unloadMovie,
ifFrameLoaded et onMouseEvent. Pour pouvoir appliquer des actions à un objet vidéo, vous devez
d’abord le convertir en clip.
Vous pouvez également utiliser ActionScript pour afficher un flux vidéo en direct provenant d’une caméra.
Sélectionnez d’abord Nouvelle vidéo dans le panneau Bibliothèque pour placer un objet Video sur la scène.
Choisissez ensuite Video.attachVideo pour associer le flux vidéo à l’objet Video.
Voir également Video et attachVideo (méthode Video.attachVideo) dans le Guide de référence du langage
ActionScript 2.0 et fl.video dans Référence du langage ActionScript 3.0.
Mise à jour d’une vidéo intégrée après modification du fichier source
correspondant
389
1. Sélectionnez le clip vidéo dans le panneau Bibliothèque.
2. Sélectionnez Propriétés, puis cliquez sur Mettre à jour.
Le clip vidéo intégré est mis à jour avec le fichier modifié. Les paramètres de
compression choisis lors de la première importation de la vidéo sont de nouveau
appliqués au clip mis à jour.
Adobe recommande également :
Spécification du paramètre contentPath ou source
Le composant FLVPlayback
Le composant FLVPlayback
Formats vidéo et Animate
Test des performances du téléchargement des documents
À propos des symboles
Lecture dynamique de fichiers FLV ou F4V externes
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
390
Utilisation des points de repère vidéo
Remarque : (Animate CC uniquement) La fonction Points de repère des vidéos a été abandonnée et n’est
pas disponible dans Animate CC.
Utilisez des points de repère vidéo pour permettre le déclenchement d’événements à des moments
spécifiques dans la vidéo. Il existe deux sortes de points de repère dans Flash :
Points de repères codés. Il s’agit de points de repère que vous ajoutez lorsque vous
codez une vidéo avec Adobe Media Encoder. Pour plus d’informations sur l’ajout de
points de repère dans Adobe Media Encoder, voir Utilisation d’Adobe Media Encoder. Il
est possible d’accéder aux points de repère codés via d’autres applications qu’Animate.
Points de repère ActionScript. Il s’agit de points de repère que vous ajoutez à une vidéo
avec l’inspecteur des propriétés dans Animate. Les points de repère ActionScript sont
accessibles uniquement dans Animate et Flash Player. Pour plus d’informations sur les
points de repère ActionScript, voir Présentation des points de repère dans le Guide du
développeur d’ActionScript 3.0.
Lorsque vous sélectionnez une occurrence du composant FLVPlayback sur la scène, la liste des points de
repère vidéo s’affiche dans l’inspecteur des propriétés. Vous pouvez également prévisualiser l’intégralité de la
vidéo sur la scène et ajouter des points de repère ActionScript à l’aide de l’inspecteur des propriétés tout en
affichant l’aperçu d’une vidéo, notamment d’une vidéo traitée par Adobe Media Server.
Pour utiliser les points de repère dans l’inspecteur des propriétés :
1. Importez une vidéo en téléchargement progressif ou placez le composant FLVPlayback
sur la scène et spécifiez la vidéo source. Vous pouvez spécifier la vidéo source dans
l’inspecteur des propriétés.
2. Dans l’inspecteur des propriétés, cliquez sur Points de repère pour développer la section,
si elle n’est pas déjà ouverte.
3. Cliquez sur le bouton Ajouter (+) pour ajouter un point de repère ActionScript et sur le
bouton Supprimer (-) pour supprimer un point de repère existant. Vous pouvez spécifier
la durée en faisant glisser la souris vers la droite ou vers la gauche pour augmenter ou
diminuer la valeur du code temporel, ou en saisissant une valeur.
4. Pour ajouter un paramètre à un point de repère, sélectionnez le point de repère
ActionScript et cliquez sur le bouton Ajouter (+) situé dans la partie inférieure de la
section Paramètres.
5. Vous pouvez renommer les points de repère ActionScript et les paramètres en cliquant
sur le champ de nom et en modifiant le nom.
Vous pouvez importer et exporter des listes de points de repère depuis l’inspecteur des propriétés. Seuls les
points de repère ActionScript peuvent être importés pour éviter un conflit avec les points de repère déjà
intégrés dans la vidéo lors du codage.
Les boutons d’importation et d’exportation situés dans la partie supérieure de la section Points de repère
permettent d’importer ou d’exporter des listes de points de repère au format XML. Lors de l’exportation, outre
les points de repère ActionScript que vous avez ajoutés, la liste inclut tous les points de repère de navigation
et d’événement intégrés à la vidéo. Lors de l’importation, une boîte de dialogue indiquant le nombre de points
de repère ActionScript importés s’affiche.
391
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
392
Transformation et combinaison d’objets graphiques dans Animate
CC
Transformation des objets
Combinaison d’objets
Haut de la page
Transformation des objets
Vous pouvez transformer les objets graphiques, les groupes, les blocs de texte et les occurrences avec l’outil
Transformation libre ou des options du menu Modification > Transformer. Selon le type d’élément
sélectionné, vous pouvez le transformer, le faire pivoter, l’incliner, le redimensionner ou le déformer. Les
sélections peuvent être modifiées ou complétées au cours des procédures de transformation.
Lorsque vous transformez un objet, un groupe, un bloc de texte ou une occurrence, l’inspecteur des
propriétés correspondant à l’élément en question affiche toutes les modifications apportées à ses dimensions
ou à sa position.
Un cadre de sélection apparaît lorsque la procédure de transformation implique un déplacement. Le cadre de
sélection est rectangulaire (à moins qu’il n’ait été modifié à l’aide de la commande Déformer ou du
modificateur Enveloppe) et ses bords sont initialement parallèles à ceux de la scène. Des poignées de
transformations sont situées à chaque angle et au milieu de chaque côté. Le cadre de sélection affiche un
aperçu des transformations pendant que vous déplacez la souris.
Déplacement, réalignement, modification et suivi du point de transformation
Un point de transformation apparaît au centre de l’élément sélectionné au cours d’une transformation. Ce
point de transformation est initialement aligné sur le point central de l’objet. Vous pouvez déplacer le point de
transformation, puis le ramener à son emplacement par défaut et déplacer le point d’origine par défaut.
Dans le cas du redimensionnement, de l’inclinaison ou de la rotation d’objets graphiques, de groupes ou de
blocs de texte, le point opposé à celui que vous faites glisser est le point d’origine par défaut. Pour les
occurrences, le point de transformation est le point d’origine par défaut. Vous pouvez déplacer le point
d’origine par défaut pour une transformation.
1. Sélectionnez l’outil Transformation libre
Transformer.
ou l’une des commandes Modification >
Après avoir commencé une transformation, vous pouvez observer l’emplacement du
point de transformation dans le panneau Info et dans l’inspecteur des propriétés.
2. Effectuez l’une des opérations suivantes :
Faites glisser le point de transformation de l’intérieur de l’objet graphique sélectionné
pour le déplacer.
Pour réaligner le point de transformation sur le point central de l’élément, doublecliquez sur le point de transformation.
Pour permuter le point d’origine en vue d’une transformation par redimensionnement
ou inclinaison, faites glisser la souris en maintenant la touche Alt (Windows) ou
Option (Macintosh) enfoncée au cours de la transformation.
Dans le panneau Infos, vous pouvez activer ou désactiver l’affichage des points
393
d’alignement et de transformation. Ce bouton s’affiche comme
pour indiquer que
les coordonnées du point d’alignement sont en cours d’affichage. En cliquant sur le
pour indiquer que les coordonnées du point
même bouton, son apparence change
de transformation sont en cours d’affichage.
Grille des coordonnées : panneau Infos avec bouton Point d’alignement/transformation en
mode transformation et avec affichage des coordonnées x et y du point de transformation
de la sélection
Utilisation de l’outil Transformation libre
Vous pouvez effectuer des transformations individuelles ou combiner plusieurs d’entre elles (telles que le
déplacement, la rotation, le redimensionnement, l’inclinaison et la distorsion).
Remarque : L’outil Transformation libre ne permet pas de transformer les symboles, bitmaps, objets vidéo,
sons, dégradés ou le texte. Si une sélection multiple contient certains de ces éléments, seuls les objets
formes seront déformés. Pour transformer un bloc de texte, convertissez d’abord les caractères en objets
formes.
1. Sélectionnez un graphique, une occurrence, un groupe ou un bloc de texte sur la scène.
2. Cliquez sur l’outil Transformation libre
.
Le déplacement du pointeur au-dessus et autour de la sélection entraîne le changement
du pointeur pour indiquer la fonction de transformation disponible.
3. Faites glisser les poignées pour transformer la sélection comme suit :
Pour déplacer la sélection, placez le pointeur au-dessus de l’objet dans le cadre de
sélection et faites-le glisser jusqu’au nouvel emplacement. Ne faites pas glisser le
point de transformation.
Pour définir le centre de pivotement ou de redimensionnement, faites glisser le point
de transformation vers un nouvel emplacement.
Pour faire pivoter la sélection, positionnez le pointeur juste à côté d’une poignée
d’angle, puis faites-la glisser. La sélection pivote autour du point de transformation.
Faites glisser la souris tout en maintenant la touche Maj enfoncée pour faire pivoter
l’élément par incréments de 45°.
Faites glisser la souris tout en maintenant la touche Alt enfoncée (Windows) ou
Option (Macintosh) enfoncée pour effectuer la rotation autour de l’angle opposé.
Pour redimensionner la sélection sur ses deux dimensions, faites glisser une poignée
d’angle en diagonale. Faites glisser la souris tout en maintenant la touche Maj
enfoncée pour obtenir un redimensionnement proportionnel.
Pour la redimensionner à l’horizontale ou à la verticale, faites glisser une poignée
d’angle dans l’une ou l’autre direction.
Pour incliner la sélection, positionnez le pointeur sur une ligne de contour reliant
deux poignées de transformation et faites-la glisser.
Pour déformer des formes, appuyez sur Contrôle (Windows) ou Commande
(Macintosh), puis faites glisser une poignée d’angle ou une poignée latérale.
Faites glisser une poignée d’angle tout en maintenant les touches Maj et Ctrl
(Windows) ou Maj et Commande (Macintosh) enfoncées pour biseauter l’objet, c’està-dire pour déplacer l’angle sélectionné et son angle adjacent d’une distance égale
394
de leur origine.
4. Pour terminer la transformation, cliquez à l’extérieur de l’objet sélectionné.
Distorsion d’objets
Lorsque vous appliquez une transformation de déformation à un objet sélectionné, le fait de faire glisser une
poignée d’angle ou une poignée latérale du cadre de sélection permet de déplacer l’angle ou le bord et de
réaligner les bords adjacents. Faites glisser un point d’angle tout en maintenant la touche Maj enfoncée pour
biseauter l’objet, c’est-à-dire déplacer cet angle et son angle adjacent d’une distance égale de leur origine et
en direction opposée l’un de l’autre. L’angle adjacent est l’angle de l’axe de la direction dans laquelle vous
faites glisser. Faites glisser le point situé au milieu d’un bord tout en maintenant la touche Contrôle
(Windows) ou Commande (Macintosh) enfoncée pour déplacer librement tout ce bord.
Vous pouvez déformer les objets graphiques à l’aide de la commande Déformer. Vous pouvez également
déformer des objets lors de leur transformation libre.
Remarque : La commande Déformer ne permet pas de transformer les symboles, formes primitives, bitmaps,
objets vidéo, sons, dégradés, groupes d’objets ou le texte. Si une sélection multiple contient certains de ces
éléments, seuls les objets formes seront déformés. Pour modifier le texte, convertissez d’abord les caractères
en objets formes.
1. Sélectionnez un ou plusieurs objets graphiques sur la scène.
2. Sélectionnez Modification > Transformer > Déformer.
3. Placez le pointeur sur l’une des poignées de transformation et faites-la glisser.
4. Pour terminer la transformation, cliquez à l’extérieur de l’objet ou des objets sélectionnés.
Modification des formes avec le modificateur Enveloppe
Le modificateur Enveloppe permet de déformer les objets. Les enveloppes sont des cadres de sélection
contenant au moins un objet. Les modifications apportées à la forme d’une enveloppe affectent la forme des
objets qu’elle contient. Vous modifiez la forme d’une enveloppe en ajustant ses poignées de tangente et ses
points.
Remarque : le modificateur Enveloppe ne permet pas de transformer les symboles, bitmaps, objets vidéo,
sons, dégradés, groupes d’objets ou le texte. Si une sélection multiple contient certains de ces éléments,
seuls les objets formes seront déformés. Pour modifier le texte, convertissez d’abord les caractères en objets
formes.
1. Sélectionnez une forme sur la scène.
2. Sélectionnez Modification > Transformer > Enveloppe.
3. Faites glisser les points et les poignées de tangente pour modifier l’enveloppe.
Mise à l’échelle d’objets
Le redimensionnement d’un objet agrandit ou réduit l’objet horizontalement ou verticalement, ou les deux à la
fois.
1. Sélectionnez un ou plusieurs objets graphiques sur la scène.
2. Sélectionnez Modification > Transformer > Redimensionner.
3. Effectuez l’une des opérations suivantes :
Pour redimensionner l’objet à la fois horizontalement et verticalement, faites glisser
l’une des poignées d’angle. Les proportions sont conservées pendant le
395
redimensionnement. Faites glisser la souris tout en maintenant la touche Maj
enfoncée pour obtenir un redimensionnement non-uniforme.
Pour redimensionner l’objet horizontalement ou verticalement, faites glisser une
poignée centrale.
4. Pour terminer la transformation, cliquez à l’extérieur de l’objet ou des objets sélectionnés.
Remarque : lorsque vous augmentez la dimension de plusieurs éléments, ceux qui se
trouvent près des bords du cadre de sélection peuvent se trouver en dehors de la scène.
Si cela se produit, choisissez Affichage > Zone de travail pour voir les éléments situés
au-delà des bords de la scène.
Rotation et inclinaison des objets
La rotation d’un objet le fait tourner autour de son point de transformation. Le point de transformation est
aligné sur le point d’alignement, qui est situé par défaut au centre de l’objet, mais que vous pouvez déplacer
en le faisant glisser.
Les méthodes suivantes permettent de faire pivoter un objet :
Faites-le glisser avec l’outil Transformation libre
(vous pouvez également l’incliner et
le redimensionner dans le cours de cette opération).
Vous pouvez le faire pivoter à l’aide du panneau Transformer (vous pouvez
redimensionner l’objet simultanément).
Rotation et inclinaison des objets par glissement
1. Sélectionnez un ou plusieurs objets sur la scène.
2. Sélectionnez Modification > Transformer > Pivoter et incliner.
3. Effectuez l’une des opérations suivantes :
Faites glisser une poignée d’angle pour faire pivoter l’objet.
Faites glisser une poignée centrale pour incliner l’objet.
4. Pour terminer la transformation, cliquez à l’extérieur de l’objet ou des objets sélectionnés.
Rotation des objets de 90°
1. Sélectionnez un ou plusieurs objets.
2. Choisissez Modification > Transformer > Faire pivoter de 90° à droite pour faire pivoter
396
l’objet à droite ou Faire pivoter de 90° à gauche pour faire pivoter l’objet à gauche.
Inclinaison des objets
L’inclinaison d’un objet consiste à le transformer en le penchant suivant un ou deux axes. Vous pouvez
incliner un objet en faisant glisser le curseur ou en tapant une valeur dans le panneau Transformer.
1. Sélectionnez un ou plusieurs objets.
2. Sélectionnez Fenêtre > Transformer.
3. Cliquez sur Incliner.
4. Indiquez la valeur des angles horizontal et vertical.
Renversement des objets
Vous pouvez renverser des objets sur leur axe vertical ou horizontal sans déplacer leur position relative sur
la scène.
1. Sélectionnez l’objet.
2. Sélectionnez Modification > Transformer > Renverser verticalement ou Renverser
horizontalement.
Rétablissement d’objets transformés
Lorsque vous redimensionnez, faites pivoter et inclinez des occurrences, des groupes et du texte à l’aide de
l’outil Transformer librement ou du panneau Transformer, Animate enregistre les valeurs initiales de
dimension et de rotation avec l’objet. Vous pouvez ainsi supprimer les transformations appliquées et rétablir
les valeurs d’origine.
Lorsque vous sélectionnez Modifier > Annuler, vous ne pouvez annuler que les transformations les plus
récentes. Vous pouvez supprimer toutes les transformations en cliquant sur le bouton Supprimer la
transformation dans le panneau avant de désélectionner l’objet. Une fois l’objet désélectionné, les valeurs
d’origine sont perdues et il est impossible de supprimer la transformation.
Rétablissement d’un objet transformé à son état d’origine
1. Assurez-vous que l’objet transformé est toujours sélectionné.
2. Effectuez l’une des opérations suivantes :
Cliquez sur le bouton Supprimer la transformation
dans le panneau Transformer.
Sélectionnez Modification > Transformer > Supprimer la transformation.
Haut de la page
Combinaison d’objets
Vous pouvez utiliser les commandes Combiner les objets du menu Modification (Modification > Combiner les
objets) pour créer de nouvelles formes en combinant ou modifiant des objets existants. Dans certains cas,
l’ordre d’empilement des objets sélectionnés définit le fonctionnement de l’opération.
Chaque commande s’applique aux types spécifiques des objets graphiques, qui sont mentionnés ci-dessous.
Une forme fusion est une forme dessinée avec un outil en Mode de fusion de dessins. Un objet dessin est
397
une forme dessinée avec un outil en Mode de dessin d’objet.
Les commandes Combiner les objets sont les suivantes :
Union Relie plusieurs formes fusion ou objets dessin. Il en résulte une forme unique du mode objet,
composée de toutes les parties visibles des formes avant leur unification. Les parties invisibles et
superposées des formes sont supprimées.
Remarque : Contrairement à l’utilisation de la commande Grouper (Modification > Grouper), vous ne pouvez
pas séparer des formes reliées à l’aide de la commande Union.
Intersection Crée un objet à partir de l’intersection de plusieurs objets dessin. Il en résulte une forme de
dessin d’objet composée des parties superposées de la combinaison des formes. Toute partie de la forme qui
ne chevauche pas est éliminée. La forme obtenue utilise le remplissage et le trait de la forme située tout en
haut de la pile.
Poinçon Supprime les parties d’un objet dessin sélectionné, tel que défini par les parties superposées d’un
autre objet dessin sélectionné et disposé devant lui. Toute partie d’un objet dessin qui est chevauchée par
l’objet en haut de la pile est supprimée, ainsi que l’objet situé en haut de la pile. Les objets obtenues restent
séparés et ne sont pas combinés en un objet unique (ce qui n’est pas le cas des commandes Union et
Intersection qui relient les objets entre eux).
Recadrer Utilise le contour d’un objet dessin pour recadrer un autre objet dessin. L’objet situé au premier
plan ou dans la partie la plus haute définit la forme de la zone recadrée. Toute partie d’un objet dessin sousjacent qui chevauche l’objet en haut de la pile subsiste tandis que toutes les autres parties des objets sousjacents sont supprimées, ainsi que la totalité de l’objet situé en haut de la pile. Les objets obtenus restent
séparés et ne sont pas combinés en un objet unique (ce qui n’est pas le cas des commandes Union et
Intersection qui relient les objets entre eux).
Adobe recommande également :
À propos de la mise à l’échelle à 9 découpes et des symboles de clip
Modification de symboles de clip à l’aide de la mise à l’échelle à 9 découpes
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
398
Utilisation et création d’occurrences de symboles dans Animate CC
Création d’occurrences
Modification des propriétés des occurrences
Définition de la visibilité d’une occurrence
Modification de la couleur et de la transparence d’une occurrence
Permutation des occurrences
Changement du type d’une occurrence
Définition de la lecture en boucle pour les occurrences graphiques
Séparation d’une occurrence de symbole
Obtention d’informations sur les occurrences sur la scène
Haut de la page
Création d’occurrences
Une fois que vous avez créé un symbole, vous pouvez créer des occurrences de ce symbole aux
emplacements de votre choix dans votre document, voire dans d’autres symboles. Lorsque vous modifiez le
symbole, Animate CC (anciennement Flash Professional CC) met automatiquement à jour toutes ses
occurrences.
Les noms d’occurrences des objets se créent dans l’inspecteur des propriétés. Le nom ainsi attribué permet
de désigner les occurrences d’un même symbole dans ActionScript. Pour pouvoir contrôler les occurrences
avec ActionScript®, il est impératif que leur nom soit unique. Pour en savoir plus, voir Gestion des
événements dans le guide du développeur d’ActionScript 3.0.
Vous pouvez spécifier des effets de couleur, affecter des actions, définir un mode d’affichage graphique et
changer le comportement de nouvelles occurrences dans l’inspecteur des propriétés. Le comportement de
l’occurrence est, sauf indication contraire, identique au comportement du symbole. Toute modification
effectuée affecte uniquement l’occurrence, pas le symbole.
Création d’une occurrence de symbole
1. Sélectionnez un calque dans le scénario. Animate peut placer des occurrences dans les
images-clés uniquement, toujours sur le calque courant. Si vous ne sélectionnez pas
d’image-clé, l’occurrence sera ajoutée par Animate à la première image-clé située à
gauche de l’image en cours.
Remarque : une image-clé est une image dans laquelle vous définissez les
changements d’un effet d’animation. Pour plus d’informations, voir Insertion d’images
dans le scénario.
2. Sélectionnez Fenêtre > Bibliothèque.
3. Faites glisser le symbole de la bibliothèque jusqu’à la scène.
4. Si vous avez créé une occurrence d’un symbole graphique, sélectionnez Insertion >
Scénario > Image pour ajouter le nombre d’images contenant le symbole graphique.
Affectation d’un nom à une occurrence
1. Sélectionnez l’occurrence sur la scène.
2. Sélectionnez Fenêtre > Propriétés et saisissez un nom dans le champ Nom de
399
l’occurrence.
Haut de la page
Modification des propriétés des occurrences
Chaque occurrence de symbole possède ses propres propriétés, distinctes de celles du symbole. Vous
pouvez modifier la teinte, la transparence et la luminosité d’une occurrence, redéfinir son comportement
(convertir, par exemple, un graphique en clip) et indiquer le mode de lecture de l’animation dans une
occurrence de graphique. Vous pouvez également incliner, faire pivoter ou redimensionner une occurrence
sans affecter le symbole.
Vous pouvez en outre nommer une occurrence de clip ou de bouton pour permettre la modification de ses
propriétés avec ActionScript. Pour en savoir plus, voir Objets et classes dans Formation à ActionScript 3.0.
Pour modifier les propriétés d’une occurrence, utilisez l’inspecteur des propriétés (Fenêtre > Propriétés).
Les propriétés d’une occurrence sont enregistrées avec cette dernière. Si vous modifiez un symbole ou reliez
une occurrence à un autre symbole, les propriétés que vous avez modifiées s’appliquent toujours à
l’occurrence.
Haut de la page
Définition de la visibilité d’une occurrence
Vous pouvez rendre invisible une occurrence de symbole sur la scène en désactivant la propriété Visible.
Pour de meilleures performances de rendu, utilisez la propriété Visible au lieu de définir la propriété Alpha du
symbole sur 0.
Pour utiliser la propriété Visible, vous devez définir le lecteur sur Flash Player 10.2 ou une version ultérieure.
Par ailleurs, cette propriété est uniquement compatible avec les occurrences de clip, de bouton et de
composant.
1. Sélectionnez l’occurrence sur la scène.
2. Dans la section Affichage du panneau Propriétés, désactivez la propriété Visible.
Haut de la page
Modification de la couleur et de la transparence d’une occurrence
Chaque occurrence d’un symbole peut avoir son propre effet de couleur. Pour définir les options de couleur
et de transparence des occurrences, vous utiliserez l’inspecteur des propriétés. Les paramètres de
l’inspecteur des propriétés s’appliquent également aux bitmaps placés dans les symboles.
Lorsque vous modifiez la couleur et la transparence d’une occurrence dans une image donnée, Animate
effectue la modification dès qu’il affiche cette image. Pour effectuer des modifications de couleur
progressives, vous devez appliquer une interpolation de mouvement. Lors de l’interpolation des couleurs,
vous entrez différents paramètres d’effet dans les images-clés de début et de fin d’une occurrence, puis
interpolez les paramètres pour faire évoluer les couleurs de l’occurrence au fil du temps.
400
L’interpolation modifie progressivement la couleur ou la transparence d’une occurrence.
Remarque : si vous appliquez un effet de couleur à un symbole de clip contenant plusieurs images, Animate
applique l’effet à chaque image du symbole.
1. Sélectionnez l’occurrence sur la scène, puis choisissez Fenêtre > Propriétés.
2. Dans l’inspecteur des propriétés, sélectionnez l’une des options suivantes dans le menu
Style de la section Effets de couleur :
Luminosité Règle l’aspect clair ou sombre relatif de l’image, mesuré sur une échelle
allant du noir (–100 %) au blanc (100 %). Pour régler la luminosité, cliquez sur le triangle
et faites glisser le curseur de défilement ou saisissez une valeur dans la zone de texte.
Teinte Colore l’occurrence avec la même nuance. Utilisez le curseur Teinte de
l’inspecteur des propriétés pour sélectionner le pourcentage de teinte qui va de
transparent (0 %) à entièrement saturé (100 %). Pour régler la teinte, cliquez sur le
triangle et faites glisser le curseur de défilement ou saisissez une valeur dans la zone de
texte. Pour sélectionner une couleur, saisissez les valeurs de rouge, de vert et de bleu
dans les champs respectifs. Vous pouvez également cliquer sur la puce de couleur et
sélectionner l’une des couleurs dans le Sélecteur de couleur.
Alpha Ajuste la transparence de l’occurrence, de transparente (0 %) à complètement
saturée (100 %). Pour définir la valeur alpha, cliquez sur le triangle et faites glisser le
curseur de défilement ou saisissez une valeur dans la zone de texte.
Avancé Permet d’ajuster séparément les valeurs de rouge, vert et bleu, ainsi que la
transparence d’une occurrence. Cela est très utile lorsque vous voulez créer et animer
des effets de couleur subtils dans des objets tels que les bitmaps. Les commandes
situées à gauche permettent de réduire les valeurs de couleur ou de transparence d’un
pourcentage spécifique. Les commandes de droite permettent de réduire ou d’augmenter
les valeurs de couleur ou de transparence d’une valeur constante.
Les valeurs de couleur rouge, vert, bleu et alpha en cours sont multipliées par les
valeurs de pourcentage, puis ajoutées aux valeurs constantes dans la colonne de droite
pour obtenir les nouvelles valeurs de couleur. Par exemple, si la valeur de rouge actuelle
est égale à 100, le réglage du curseur de gauche à 50 % et du curseur de droite à 100
% donne une nouvelle valeur de rouge égale à 150 ([100 x 0,5] + 100 = 150).
Remarque : Les paramètres avancés du panneau Effet implémentent la fonction (a * y+
b)= x, où a est le pourcentage spécifié dans l’ensemble de champs de gauche, y est la
couleur du bitmap d’origine, b est la valeur spécifiée dans l’ensemble des champs de
droite et x est l’effet obtenu (entre 0 et 255 pour RVB et entre 0 et 100 pour la
transparence alpha).
Vous pouvez aussi modifier la couleur d’une occurrence à l’aide de l’objet
ColorTransform d’ActionScript. Pour des informations détaillées sur l’objet Color, voir
ColorTransform dans le Guide de référence du langage ActionScript 2.0 ou dans le
Guide de référence du langage et des composants ActionScript 3.0.
Haut de la page
Permutation des occurrences
401
Vous pouvez affecter un symbole différent à une occurrence pour afficher une occurrence qui, tout en
préservant les propriétés d’origine de l’occurrence (effets de couleur, actions des boutons, etc.), sera
différente.
Par exemple, imaginons que vous créez un dessin animé avec un symbole de rat comme personnage, mais
que vous décidez de remplacer le personnage par un chat. Vous pouvez remplacer le symbole de rat par
celui du chat et afficher le personnage mis à jour approximativement au même endroit dans toutes les
images.
Affectation d’un symbole différent à une occurrence
1. Sélectionnez l’occurrence sur la scène, puis choisissez Fenêtre > Propriétés.
2. Cliquez sur le bouton Échanger dans l’inspecteur des propriétés.
3. Sélectionnez le symbole par lequel vous souhaitez remplacer celui actuellement affecté à
l’occurrence. Pour dupliquer un symbole sélectionné, cliquez sur Dupliquer le symbole,
puis sur OK.
La duplication vous permet de créer un nouveau symbole à partir d’un symbole existant
dans la bibliothèque et réduit les opérations de copie si vous créez plusieurs symboles
qui ont très peu de différences.
Remplacement de toutes les occurrences d’un symbole
Faites glisser un symbole ayant le même nom que celui devant être remplacé d’un
panneau Bibliothèque dans celui du fichier FLA que vous êtes en train de modifier, puis
cliquez sur Remplacer. Si vous avez des dossiers dans la bibliothèque, vous devez faire
glisser le nouveau symbole dans le même dossier que celui qui contient le symbole que
vous remplacez.
Haut de la page
Changement du type d’une occurrence
Vous pouvez changer le type d’une occurrence afin d’en redéfinir le comportement dans une application
Animate. Par exemple, si une occurrence graphique contient un effet d’animation que vous souhaitez
exécuter indépendamment du scénario de l’animation principale, vous pouvez redéfinir cette occurrence en
tant qu’occurrence de clip.
1. Sélectionnez l’occurrence sur la scène, puis choisissez Fenêtre > Propriétés.
2. Sélectionnez Graphique, Bouton ou Clip dans le menu de l’inspecteur des propriétés.
Haut de la page
Définition de la lecture en boucle pour les occurrences graphiques
Vous pouvez déterminer l’exécution des séquences de l’animation à l’intérieur d’une occurrence graphique
dans l’application Animate en définissant des options dans l’inspecteur des propriétés.
Un symbole graphique animé est lié au scénario du document dans lequel il est placé. En revanche, un
symbole de clip possède son propre scénario indépendant. L’animation des symboles graphiques animés, qui
utilisent le même scénario que le document principal, est affichée en mode d’édition d’animation. Les
symboles de clip s’affichent sous la forme d’objets statiques sur la scène et non sous la forme d’animations
dans l’environnement de création d’Animate.
1. Sélectionnez une occurrence de graphique sur la scène, puis choisissez Fenêtre >
Propriétés.
2. Sélectionnez une option d’animation dans le menu Options de la section Boucle de
l’inspecteur des propriétés :
402
Boucle Lit en boucle toutes les séquences de l’animation contenues dans l’occurrence
en cours, selon le nombre d’images occupées par l’occurrence.
Lire une seule fois Lit la séquence d’animation à partir de l’image que vous spécifiez et
jusqu’à la fin de l’animation, puis s’arrête.
Image unique Affiche une image de la séquence d’animation. Spécifiez l’image que
vous souhaitez afficher.
3. Pour spécifier la première image du symbole graphique à afficher lors de la boucle,
entrez un numéro d’image dans le champ de texte Première. L’option Une seule image
utilise également le numéro d’image spécifié ici.
Sélecteur d’image
Utilisez le sélecteur d’image pour prévisualiser et choisir la première image d’un symbole graphique. Dans les
versions précédentes, vous ne pouviez pas prévisualiser les images sans modifier le symbole en mode
Édition. Cette fonction améliore l’environnement des utilisateurs qui travaillent sur des animations du type
Synchronisation des lèvres.
Remarque : Le panneau Sélecteur d’image fonctionne uniquement avec des symboles graphiques ; il est
désactivé pour les clips ou les symboles de type bouton.
1. Sélectionnez un symbole graphique > Panneau des propriétés > Lecture en
boucle > Utiliser le sélecteur d’image pour afficher le panneau Sélecteur d’image ou
sélectionnez Fenêtre > Sélecteur d’image.
Sélecteur d’image
2. Dans le panneau Sélecteur d’image, sélectionnez le mode Liste ou Vignette pour
afficher tous les aperçus d’image du symbole sélectionné. Les numéros d’image et leurs
étiquettes s’affichent également.
Liste : affiche les images dans une liste verticale.
Vignette : affiche les images en mode grille et les réajuste lorsque le panneau est
redimensionné.
403
3. Utilisez les boutons Curseur ou Zoom pour régler l’aperçu ou la taille des vignettes.
Réglez le curseur vers le coin supérieur gauche du panneau pour afficher d’autres
images dans la vue. Si vous déplacez le curseur vers le coin droit, vous pouvez afficher
des aperçus plus grands.
4. Cliquez sur n’importe quelle image pour la définir comme première image pour le
symbole sélectionné.
Vue Liste
Vue Vignettes
Haut de la page
Séparation d’une occurrence de symbole
Pour rompre le lien entre une occurrence et un symbole et transformer cette dernière en une collection de
formes et de lignes dissociées, vous devez dissocier l’occurrence. Cela est particulièrement utile lorsque vous
souhaitez effectuer des modifications importantes sur l’occurrence sans affecter d’autres occurrences.
Les modifications apportées au symbole source d’une occurrence n’ont aucune incidence sur l’occurrence
après que celle-ci ait été séparée.
1. Sélectionnez l’occurrence sur la scène.
2. Sélectionnez Modification > Séparer. L’occurrence est divisée en ses divers éléments
graphiques.
3. Utilisez les outils de peinture et de dessin pour modifier ces éléments selon vos
préférences.
Haut de la page
Obtention d’informations sur les occurrences sur la scène
L’inspecteur des propriétés et le panneau Info affichent les informations suivantes sur les occurrences sur la
scène :
L’inspecteur des propriétés permet d’afficher le comportement et les paramètres d’une
occurrence : pour tous les types d’occurrences, les paramètres de couleur, l’emplacement
et la taille ; pour les graphiques, le mode de boucle et la première image contenant le
graphique ; pour les boutons, le nom de l’occurrence (s’il a été affecté) et l’option de
suivi ; pour les clips, le nom d’occurrence (s’il a été affecté). Pour l’emplacement,
l’inspecteur des propriétés affiche les coordonnées x et y du point d’alignement du
symbole.
Dans le panneau Info, vous pouvez afficher l’emplacement et la taille de l’occurrence
sélectionnée, l’emplacement de son point d’alignement, les valeurs de rouge (R), de vert
(V), de bleu (B) et alpha (A) affectées (si le remplissage de l’occurrence est uni) et
404
l’emplacement du pointeur. La section Position et taille de l’inspecteur des propriétés
affiche les coordonnées x et y du point d’alignement ou de transformation du symbole.
Vous pouvez basculer entre l’affichage des coordonnées du point d’alignement ou de
transformation.
Dans l’explorateur d’animations, vous pouvez afficher le contenu du document en cours, y
compris les occurrences et les symboles.
Vous pouvez afficher dans le panneau Actions toute action affectée à un bouton ou un
clip.
Obtention d’informations sur une occurrence
1. Sélectionnez l’occurrence sur la scène.
2. Affichez l’inspecteur des propriétés (Windows > Propriétés) ou le panneau que vous
souhaitez utiliser :
Pour afficher le panneau Info, sélectionnez Fenêtre > Info.
Pour afficher l’explorateur d’animations, sélectionnez Fenêtre > Explorateur
d’animations.
Pour afficher le panneau Actions, sélectionnez Fenêtre > Actions.
Affichage de la définition du symbole sélectionné dans l’explorateur d’animations
1. Cliquez sur le bouton Afficher les boutons, les clips et les graphiques en haut de
l’explorateur d’animations.
2. Cliquez avec le bouton droit de la souris de la souris (Windows) ou appuyez sur la
touche Contrôle (Macintosh), puis sélectionnez Afficher les occurrences de symboles et
Atteindre la définition de symbole. Vous pouvez également sélectionner ces options dans
le menu de l’explorateur d’animations (coin supérieur droit).
Atteinte de la séquence contenant les occurrences d’un symbole sélectionné
1. Affichez les définitions du symbole
2. Cliquez avec le bouton droit de la souris de la souris (Windows) ou appuyez sur la
touche Contrôle (Macintosh), puis sélectionnez Afficher les éléments de l’animation et
Atteindre la définition de symbole. Vous pouvez également sélectionner ces options dans
le menu de l’explorateur d’animations (coin supérieur droit).
Adobe recommande également :
Ajout d’une interpolation classique à des occurrences, des groupes ou un type
Création de boutons
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
405
Dessin et création d’objets avec Animate CC
À propos du dessin
Modes de tracé et objets graphiques
Haut de la page
À propos du dessin
Les outils de dessin d’Adobe Animate CC permettent de créer et de modifier des lignes et des formes pour
les illustrations de vos documents. Toutes les lignes et formes que vous créez dans Animate sont des images
vectorielles légères, qui se traduisent par des fichiers FLA de petite taille.
Avant de dessiner et de peindre dans Animate, il est important de comprendre comment Animate crée des
illustrations et comment le dessin, la peinture et la modification des formes peuvent affecter d’autres formes
placées sur le même calque.
Graphiques vectoriels et bitmap
Les ordinateurs affichent des graphiques au format vectoriel ou bitmap. Il est important de bien comprendre la
différence entre ces deux formats pour les utiliser de manière plus efficace. Animate vous permet de créer et
d’animer des graphiques vectoriels compacts. Animate permet également d’importer et de manipuler des
graphiques vectoriels et bitmap créés dans d’autres applications.
Graphiques vectoriels
Les graphiques vectoriels décrivent les images à l’aide de lignes et de courbes, appelées vecteurs qui
comprennent également les propriétés de couleur et de position. Par exemple, l’image d’une feuille est
formée par des points reliés entre eux, formant ainsi le contour de la feuille. La couleur de la feuille est définie
par la couleur du contour et la couleur de la région qu’il définit.
Lignes dans les graphiques vectoriels.
Lorsque vous manipulez un graphique vectoriel, vous modifiez les propriétés des lignes et des courbes qui en
décrivent la forme. Vous pouvez déplacer, redimensionner, remodeler et changer la couleur d’un graphique
vectoriel sans affecter la qualité de son apparence. Les graphiques vectoriels ne dépendent pas de la
résolution ; ils peuvent donc être affichés sur des périphériques de résolution différente sans perdre leur
qualité.
Graphiques bitmap
406
Les graphiques bitmap décrivent des images à l’aide de points de couleur, appelés pixels, organisés sur une
grille. Par exemple, l’image d’une feuille est décrite par l’emplacement et la valeur de couleur spécifiques de
chaque pixel de la grille, créant une image assez semblable à une mosaïque.
Les pixels dans les graphiques bitmap.
Lorsque vous modifiez un graphique bitmap, la modification porte sur les pixels et non sur les lignes et les
courbes. Les graphiques bitmap dépendent de la résolution, les données décrivant l’image étant définies pour
une grille de dimension particulière. La manipulation d’un graphique bitmap peut affecter la qualité de son
apparence. En particulier, le redimensionnement d’un graphique bitmap peut donner un effet d’escalier aux
bords de l’image lorsque les pixels sont redistribués dans la grille. L’affichage d’un graphique bitmap sur un
périphérique de sortie de résolution inférieure à celle de l’image entraîne également une altération de la
qualité.
Tracés
Lorsque vous dessinez une ligne ou une forme dans Animate, vous créez en fait une ligne appelée tracé. Un
tracé est composé d’un ou de plusieurs segments droits ou incurvés. Le début et la fin de chaque segment
sont indiqués par des points d’ancrage qui fonctionnent à la manière d’épingles maintenant un fil en place.
Un tracé peut être fermé (un cercle, par exemple) ou ouvert, s’il comporte des extrémités distinctes (une
ligne onduleuse, par exemple).
Pour modifier la forme d’un tracé, vous pouvez faire glisser ses points d’ancrage, les points directeurs à
l’extrémité des lignes directrices qui apparaissent aux points d’ancrage ou le segment du tracé lui-même.
Composants d’un élément
A. Extrémité de tracé sélectionnée (pleine) B. Point d’ancrage sélectionné C. Point d’ancrage non
sélectionné D. Segment de tracé incurvé E. Point directeur F. Ligne directrice.
Les tracés peuvent avoir deux types de points d’ancrage : des points d’angle et des points d’inflexion. À un
point d’angle, un tracé change brusquement de direction. À un point d’inflexion, les segments du tracé sont
raccordés en une courbe continue. Lorsque vous dessinez un tracé, vous pouvez mélanger à votre guise les
sommets et les points d’inflexion. Vous pouvez toujours transformer un sommet en point d’inflexion, et
inversement.
407
Points d’un tracé
A. Quatre sommets B. Quatre points d’inflexion C. Combinaison de sommets et de points d’inflexion.
Un sommet peut relier deux segments rectilignes ou courbes, tandis qu’un point d’inflexion raccorde toujours
deux segments courbes.
Un sommet peut relier des segments rectilignes et des segments courbes.
Remarque : vous ne devez pas confondre les points d’angle et d’inflexion avec les segments rectilignes et
incurvés.
Le contour d’un tracé est appelé trait. Une couleur ou un dégradé appliqué à la zone interne d’un tracé ouvert
ou fermé s’appelle remplissage. Un trait peut être doté d’une épaisseur, d’une couleur et d’un motif en
pointillé. Une fois que vous avez créé un tracé ou une forme, vous pouvez modifier ses caractéristiques de
contour et de fond.
Lignes directrices et points directeurs
Lorsque vous sélectionnez un point d’ancrage qui raccorde des segments incurvés (ou sélectionnez le
segment lui-même), les points d’ancrage des segments raccordés affichent des poignées directrices qui sont
composées de lignes directrices dont les extrémités sont des points directeurs. L’angle et la taille des lignes
directrices déterminent la forme et la taille des segments incurvés. Le déplacement des points directeurs
modifie la forme de la courbe. Les lignes directrices n’apparaissent pas dans le produit final.
Un point d’inflexion présente toujours deux lignes directrices solidaires. Lorsque vous déplacez une ligne
directrice sur un point d’inflexion, les segments incurvés de part et d’autre du point sont ajustés
simultanément de sorte que vous avez en permanence une courbe continue à ce point d’ancrage.
Un sommet peut quant à lui avoir une, deux ou aucune lignes directrices, selon qu’il relie respectivement un,
deux ou aucun segments courbes. Les lignes directrices d’un sommet conservent le sommet en utilisant
différents angles. Par contre, lorsque vous placez une ligne directrice sur un point d’angle, seule la courbe
située du même côté du point que la ligne directrice est ajustée.
Une fois que vous avez sélectionné un point d’ancrage (à gauche), les lignes directrices apparaissent sur
toutes les courbes reliées par ce point d’ancrage (à droite).
408
Réglage des lignes directrices d’un point d’inflexion (à gauche) et d’un sommet (à droite).
Les lignes directrices sont toujours tangentes (perpendiculaires au rayon) à la courbe au niveau des points
d’ancrage. L’inclinaison de chaque ligne directrice détermine celle de la courbe. De même, la longueur de
chaque ligne directrice détermine la hauteur ou l’incurvation de la courbe.
Le déplacement et le redimensionnement des lignes directrices modifient l’inclinaison des courbes.
Haut de la page
Modes de tracé et objets graphiques
Dans Animate, vous pouvez créer différents types d’objets graphiques à l’aide d’autres modes et outils de
dessin. Chacun d’eux a ses propres avantages et inconvénients. Vous pouvez choisir les types d’objets
graphiques à adopter pour votre travail dès le moment où vous comprenez les fonctionnalités de chacun
d’eux.
Remarque : dans Animate, les objets graphiques sont des éléments présents sur la scène. Animate vous
permet de déplacer, copier, supprimer, transformer, empiler, aligner et grouper des objets graphiques. Dans
Animate, les « objets graphiques » sont différents des « objets ActionScript », qui font partie du langage de
programmation ActionScript®. Veillez à ne pas confondre les deux sens du terme « objets ». Pour plus
d’informations sur les objets du langage de programmation, voir Présentation des types de données dans
Formation à ActionScript 2.0 dans Adobe Animate ou Types de données dans le Guide du développeur
d’ActionScript 3.0.
Mode de fusion de dessins
Ce mode de dessin par défaut fusionne automatiquement les formes que vous dessinez lorsqu’elles se
chevauchent. Lorsque vous dessinez des formes qui se chevauchent dans le même calque, la forme au haut
de la pile enlève la partie de la forme qu’elle recouvre au-dessous d’elle. Ainsi, le dessin de formes est un
mode de dessin destructif. Par exemple, si vous tracez un cercle, puis un cercle plus petit par dessus, et si
vous sélectionnez et déplacez ensuite ce dernier, la partie du second cercle qui était chevauchée par le
premier est supprimée.
Lorsqu’une forme contient un trait et un remplissage, ceux-ci sont considérés comme des éléments
graphiques distincts qui peuvent être sélectionnés et déplacés indépendamment l’un de l’autre.
409
Les formes créées par le modèle de fusion de dessins fusionnent quand elles se chevauchent. Si vous
sélectionnez une forme et que vous la déplacez, la forme chevauchée est modifiée.
Activation du mode de fusion de dessins
1. Sélectionnez l’option Fusion de dessins dans le panneau Outils.
2. Sélectionnez un outil de dessin dans le panneau Outils, puis dessinez sur la scène.
Remarque : par défaut, Animate utilise le mode de fusion de dessins.
Mode Dessin d’objet
Crée des formes référencées sous forme d’objets de dessin. Les objets de dessin sont des objets graphiques
distincts qui ne fusionnent pas automatiquement lorsqu’ils se chevauchent. Vous pouvez ainsi faire se
chevaucher des formes sans modifier leur apparence si vous déplacez ou modifiez l’une d’entre elles.
Animate crée chaque forme comme un objet distinct que vous pouvez modifier séparément.
Lorsqu’un outil de dessin est en mode de dessin d’objet, les formes qu’il vous permet de créer sont
indépendantes. Le trait et le remplissage d’une forme ne sont pas des éléments distincts et les formes qui se
chevauchent ne se modifient pas mutuellement. Si vous sélectionnez une forme créée avec le mode de
dessin d’objet, Animate entoure cette forme d’un cadre de sélection rectangulaire pour l’identifier.
Remarque : lorsque vous sélectionnez des formes créées avec le mode de dessin d’objet, vous pouvez
définir les préférences de sensibilité au contact.
Les formes créées avec le mode de dessin d’objet restent des objets distincts que vous pouvez manipuler
individuellement.
Activation du mode de dessin d’objet
Pour dessiner des formes avec le mode de dessin d’objet, vous devez l’activez explicitement.
1. Sélectionnez un outil de dessin qui prend en charge le mode de dessin d’objet (les outils
Crayon, Ligne, Plume, Pinceau, Ovale, Rectangle et Polygone).
dans la catégorie Options du panneau Outils
2. Sélectionnez le bouton Dessin d’objet
ou appuyez sur la touche J pour basculer entre les modes Fusion et Objet. Ce même
bouton permet d’activer tour à tour les modes Fusion et Objet. Lorsque vous
sélectionnez des formes créées avec le mode Objet, vous pouvez définir les préférences
de sensibilité au contact.
410
3. Dessinez sur la scène.
Conversion d’une forme créée à l’aide du mode fusion en mode objet
1. Sélectionnez une forme sur la scène.
2. Pour convertir la forme en une forme du mode objet dessin, sélectionnez Modification >
Combiner les objets > Union. Après la conversion, la forme est traitée comme un objet de
dessin à base vectorielle qui ne se déforme pas dans une interaction avec d’autres
formes.
Remarque : vous pouvez également utiliser la commande Union pour réunir deux formes ou plus afin de
constituer une forme unique à base d’objets.
Objets primitifs
Les objets primitifs sont des formes qui vous permettent d’ajuster leurs caractéristiques dans l’inspecteur des
propriétés. Ceci vous permet de contrôler avec précision la taille, le rayon de l’angle, ainsi que d’autres
propriétés de la forme, à tout moment après sa création, sans avoir à repartir de zéro.
Deux types de primitives sont disponibles : des rectangles et des ovales.
1. Sélectionnez l’outil Rectangle primitif
Outils.
ou l’outil Ovale primitif
dans le panneau
2. Dessinez sur la scène.
Chevauchement de formes
Lorsque vous tracez une ligne en travers d’une autre ligne ou d’une forme peinte en mode de fusion de
dessins, les lignes qui se chevauchent sont divisées en segments au niveau des points d’intersection. Vous
pouvez utiliser l’outil de sélection pour sélectionner, déplacer et remodeler chaque segment individuellement.
Un remplissage, le remplissage traversé par une ligne et les trois segments de ligne créés par la
segmentation.
Lorsque vous peignez par-dessus des formes et des lignes, la partie qui se trouve en dessous est remplacée
par ce qui se trouve au-dessus. Les peintures de même couleur se mélangent. Les peintures de couleurs
différentes restent distinctes. Vous pouvez utiliser ces fonctions pour créer des masques, des découpes ou
autres images en négatif. Par exemple, la découpe illustrée ci-dessous a été réalisée en déplaçant l’image
non groupée du cerf-volant sur la forme verte, en désélectionnant le cerf-volant, puis en éloignant les parties
remplies du cerf-volant de la forme verte.
411
Réalisation d’une découpe avec l’image du cerf-volant.
Pour éviter toute modification accidentelle des formes et des lignes en les chevauchant, vous pouvez grouper
les formes ou utiliser des calques pour les séparer.
Adobe recommande également :
Regroupement d’objets
Création et organisation des calques
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
412
Couleur
Panneau Couleur
Panneau Nuanciers
Palettes de couleurs
Création ou modification d’une couleur unie
Duplication et suppression de couleurs
Les couleurs que nous voyons et manipulons dans les graphiques numériques sont décrites dans des
modèles colorimétriques. Chaque modèle de couleur, RVB, CMJN ou TSL, représente une méthode différente
de description et de classification des couleurs. Les modèles colorimétriques utilisent des valeurs numériques
pour décrire le spectre des couleurs visibles. Un espace colorimétrique est une variante d’un modèle de
couleur caractérisée par sa propre gamme des couleurs. Par exemple, dans le modèle RVB figurent un
certain nombre d’espaces colorimétriques : RVB Adobe®, sRVB et RVB Apple®. Ces espaces
colorimétriques décrivent les couleurs à l’aide des trois mêmes axes (R, V et B), mais dans des gammes
différentes.
Lorsque vous manipulez les couleurs d’un graphique, vous modifiez en fait certaines valeurs numériques
dans le fichier. Il paraît simple d’imaginer qu’à chaque couleur correspond un nombre, mais, en réalité, ces
valeurs numériques ne sont pas des définitions absolues de couleurs : elles n’ont de signification que dans
l’espace colorimétrique du périphérique qui produit la couleur.
Comme chaque périphérique possède son propre espace colorimétrique, il peut seulement reproduire les
couleurs comprises dans sa gamme de couleurs. Lorsqu’une image passe d’un périphérique à un autre, ses
couleurs peuvent varier, car chaque périphérique interprète les valeurs RVB ou TSL selon son propre espace
colorimétrique. Par exemple, il n’est pas possible de reproduire à l’identique toutes les couleurs affichées sur
un moniteur avec une imprimante de bureau. Une imprimante utilise l’espace colorimétrique CMJN, tandis
qu’un moniteur utilise l’espace colorimétrique RVB. Leurs gammes de couleurs sont différentes. Les encres
produisent certaines couleurs qu’un moniteur ne peut pas reproduire et, inversement, les moniteurs affichent
des couleurs que les encres d’imprimante ne peuvent pas reproduire sur le papier.
Lorsque vous créez des couleurs pour des documents Animate, n’oubliez pas que s’il est impossible de les
reproduire exactement toutes sur les différents périphériques, vous pouvez obtenir de bons résultats en
tenant compte des capacités d’affichage graphique des périphériques utilisés par le public visé.
Adobe Animate CC vous permet d’appliquer, de créer et de modifier les couleurs à l’aide des modèles de
couleurs RVB ou TSL. La palette par défaut ou une palette que vous avez créée vous permettront de
sélectionner des couleurs à appliquer au trait ou au remplissage d’un objet que vous allez créer ou qui se
trouve déjà sur la scène.
L’application d’une couleur de trait à une forme peut se faire de l’une des manières suivantes :
Pour le remplissage d’une forme, vous pouvez appliquer une couleur unie, un dégradé ou
un bitmap. Pour appliquer un remplissage bitmap à une forme, vous devez l’importer
dans le fichier en cours. Vous pouvez sélectionner n’importe quelle couleur, unie ou
dégradée, ainsi que le style et l’épaisseur du trait.
Vous pouvez également créer une forme avec contour sans remplissage à l’aide de
l’option Aucune couleur pour le remplissage.
Vous pouvez également créer une forme remplie sans contour à l’aide de l’option Aucune
couleur pour le contour.
Vous pouvez appliquer un remplissage de couleur unie au texte.
Le panneau Couleur vous permet de créer et de modifier des remplissages avec couleurs unies ou
dégradées en mode RVB ou TSL.
413
Pour accéder au sélecteur de couleurs du système, sélectionnez l’icône du sélecteur de couleurs
dans la
commande Couleur du trait ou Couleur de remplissage du panneau Couleur, du panneau Outils ou de
l’inspecteur des propriétés de la forme.
Haut de la page
Panneau Couleur
Le panneau Couleur permet de modifier la palette de couleurs d’un fichier FLA et de modifier la couleur des
traits et des remplissages. Notamment :
Vous pouvez importer, exporter, supprimer et modifier la palette de couleurs d’un fichier
FLA avec le panneau Nuanciers.
Vous pouvez sélectionner les couleurs en mode hexadécimal.
Vous pouvez créer des dégradés multicolores..
Les dégradés permettent de produire un grand nombre d’effets, par exemple pour donner
l’illusion de la profondeur à un objet en deux dimensions.
Le panneau Couleur contient les commandes suivantes :
Couleur de trait modifie la couleur du trait ou de la bordure d’un objet graphique.
Fond modifie la couleur du remplissage. Le remplissage est la zone de couleur qui remplit la forme.
Menu Type de couleur modifie le style de remplissage :
Aucun Supprime le remplissage
Couleur unie Permet d’obtenir une couleur unique.
Dégradé linéaire Produit un dégradé dont le changement de couleur s’effectue sur un axe linéaire.
Dégradé radial produit un dégradé dont le changement de couleur s’effectue sur un axe circulaire
vers l’extérieur à partir d’un point focal central.
Remplissage bitmap Permet de placer l’image bitmap choisie dans la zone de remplissage
sélectionnée en mosaïque. Lorsque vous choisissez Bitmap, un boîte de dialogue vous permettant de
sélectionner une image bitmap sur votre ordinateur local et de l’ajouter dans la bibliothèque s’ouvre.
Vous pouvez appliquer cette image bitmap en tant que remplissage. L’apparence s’apparente à celle
d’un motif en forme de mosaïque : l’image est reproduite dans la forme.
TSL Permet de modifier la teinte, la saturation et la luminosité des couleurs d'un remplissage.
RVB Permet de modifier la densité des couleurs rouge, vert et bleu (RVB) d’un remplissage.
Alpha Permet de définir l’opacité d’un remplissage uni ou de régler le curseur d’un remplissage en dégradé.
Une valeur alpha de 0 % crée un remplissage invisible (ou transparent) ; une valeur alpha de 100 % crée un
remplissage opaque.
Nuancier actuel Affiche la couleur actuellement sélectionnée. Si vous sélectionnez un type de remplissage
dégradé (linéaire ou radial) dans le menu local Type de remplissage, le nuancier actuel affiche les transitions
de couleurs du dégradé.
414
Sélecteur de couleur du système Permet de sélectionner une couleur visuellement. Cliquez sur le
sélecteur de couleur du système et faites glisser le pointeur en croix autour de la zone jusqu’à ce que vous
trouviez la couleur voulue.
Valeur hexadécimale affiche la valeur hexadécimale de la couleur actuelle. Pour changer la couleur à l’aide
de la valeur hexadécimale, saisissez une nouvelle valeur. Les valeurs de couleur hexadécimales (également
appelées valeurs hexa) sont des combinaisons alphanumériques à 6 chiffres représentant une couleur.
Flux Permet de contrôler les couleurs appliquées au-delà des limites d’un dégradé linéaire ou radial.
Couleur agrandie (Par défaut) Applique les couleurs spécifiées au-delà de la fin du dégradé.
Refléter la couleur Oblige les couleurs dégradées à remplir la forme en appliquant un effet miroir
réfléchissant. Les dégradés que vous spécifiez sont répétés dans un motif du début à la fin du
dégradé, puis répétés dans la séquence opposée de la fin au début du dégradé, puis de nouveau du
début à la fin du dégradé jusqu’à ce que la forme sélectionnée soit remplie.
Répéter la couleur Reproduit le dégradé du début à la fin jusqu’à ce que la forme sélectionnée soit
remplie.
Remarque : Les modes Débordement sont uniquement pris en charge dans Adobe Flash Player 8 (et
versions ultérieures).
RVB linéaire Crée un dégradé linéaire ou radial compatible SVG (Scalable Vector Graphics).
Haut de la page
Panneau Nuanciers
Les nuanciers permettent de réutiliser et de mettre à jour facilement des couleurs entre divers documents.
Vous pouvez désormais créer des nuanciers balisés en sélectionnant une couleur dans vos nuanciers. Une
fois que vous avez créé un nuancier balisé, et l’avez appliqué à des formes et des tracés de votre contenu
Animate, le fait de modifier la couleur dans le nuancier balisé met automatiquement à jour tout le contenu qui
l’utilise.
1. Cliquez sur Fenêtre > Couleur.
2. Sur l’onglet Nuanciers du panneau Couleurs, sélectionnez la couleur à convertir en
nuancier balisé et cliquez ensuite sur le bouton Convertir en nuancier balisé dans la
partie inférieure du panneau.
3. Dans la boîte de dialogue Définition de couleur balisée, renseignez les informations
suivantes :
Nom du nouveau nuancier
Couleur unie, Dégradé linéaire ou Dégradé radial
Une couleur en indiquant les valeurs TSL (Teinte, Saturation et Luminosité) ou RVB
415
(Rouge, Vert et Bleu)
Boîte de dialogue Définition de couleur balisée
Le nouveau nuancier balisé s’affiche dans les onglets Couleurs et Nuanciers du panneau
Couleurs, ainsi que dans le panneau Outils.
Nouveau nuancier balisé dans les panneaux Couleur, Nuancier et Outils
4. Lorsque vous ouvrez le panneau couleur après avoir sélectionné l’objet qui utilise le
nuancier balisé, vous avez accès aux options de modification des propriétés de couleur.
Si vous modifiez les propriétés de couleur, les changements sont automatiquement
répercutés sur tous les éléments de la scène qui utilisent le nuancier balisé.
416
5. Vous pouvez soit double-cliquer sur un nuancier, soit en sélectionner un et cliquer
ensuite sur Modifier pour ouvrir la boîte de dialogue Définition de couleur balisée et
apporter des modifications à la couleur dans le nuancier.
6. Pour dissocier une forme qui utilise un échantillon de la couleur du nuancier,
sélectionnez-la, puis cliquez sur le bouton Rompre le lien. Vous pouvez choisir une
nouvelle couleur dans le panneau Couleurs de la forme.
Option Rompre le lien
Sélection d’une couleur pour la forme dans le panneau des couleurs
Haut de la page
417
Palettes de couleurs
Chaque fichier Animate CC contient sa propre palette de couleurs enregistrée dans le document Animate.
Animate CC affiche la palette d’un fichier sous forme de nuanciers dans les commandes Couleur de trait et
Couleur de remplissage, ainsi que dans le panneau Nuanciers. La palette de 216 couleurs prévue pour le
web est la palette par défaut. Vous pouvez ajouter des couleurs à la palette active à l’aide du panneau
Couleur. Vous pouvez importer et exporter des palettes de couleurs unies et dégradées entre des fichiers
Animate, ainsi qu’entre Animate CC et d’autres applications.
Palette par défaut et palette prévue pour le Web
Vous pouvez enregistrer la palette active comme palette par défaut, remplacer la palette active par la palette
par défaut définie pour le fichier ou charger la palette prévue pour le web pour remplacer la palette active.
Pour charger ou enregistrer la palette par défaut, dans le panneau Nuanciers
sélectionnez l’une des commandes suivantes dans le menu situé dans le coin supérieur
droit :
Charger les couleurs par défaut:
permet de remplacer la palette courante par la palette par défaut..
Enregistrer comme défaut:
enregistre la palette de couleur courante comme palette par défaut. La nouvelle palette
par défaut est utilisée lorsque vous créez des fichiers.
Pour charger la palette 216 couleurs prévue pour le Web, dans le panneau Nuanciers,
sélectionnez Web 216 dans le menu situé dans le coin supérieur droit..
Dans le panneau Nuanciers, sélectionnez Trier par couleur dans le menu situé dans le
coin supérieur droit.
Organisation et réutilisation des couleurs
Dans le panneau Nuanciers, vous pouvez classer les couleurs et les palettes de couleurs dans une structure
hiérarchique à l’aide des Dossiers et des Palettes de couleurs.
Création d’un dossier
Par défaut, toutes les couleurs sont classées dans le dossier Nuanciers par défaut. Vous pouvez classer les
couleurs existantes dans les dossiers à l’aide du panneau Nuanciers. Pour créer un dossier, procédez
comme suit :
1. Dans Animate CC, sélectionnez Fenêtre > Nuanciers.
2. Dans le panneau Nuanciers, cliquez sur le bouton
.
3. Nommez le dossier de nuanciers de manière significative.
Vous pouvez également créer un dossier en sélectionnant un dossier, une palette de couleurs ou un nuancier
et en sélectionnant l’option Dupliquer comme dossier dans le menu volant.
Création d’une palette de couleurs (groupe de nuanciers)
418
La palette de couleurs est un groupe de nuanciers (couleurs) qui détermine le thème de couleur de votre
contenu. Vous pouvez créer des palettes de couleurs dans les dossiers et y ajouter des nuanciers. Pour créer
une palette de couleurs, procédez comme suit :
1. Dans Animate CC, sélectionnez Fenêtre > Nuanciers.
2. Dans le panneau Nuanciers, sélectionnez un dossier et cliquez sur le bouton
créer une palette vide.
3. Vous pouvez faire glisser une couleur existante ou cliquer sur le bouton
des nuanciers à la palette de couleurs.
pour
pour ajouter
Vous pouvez également créer une palette de couleurs en sélectionnant un dossier, une palette de couleurs
ou un nuancier et en sélectionnant l’option Dupliquer comme palette dans le menu volant.
Création ou ajout de couleurs à une palette de couleurs
Vous pouvez créer des nuanciers ou ajouter des nuanciers existants aux palettes de couleurs. Pour créer un
nuancier, procédez comme suit :
1. Dans Animate CC, sélectionnez Fenêtre > Nuanciers.
2. Dans le panneau Nuanciers, sélectionnez une palette de couleurs dans un dossier, puis
pour créer un nuancier. Un nouveau nuancier est créé à partir
cliquez sur le bouton
de la couleur de remplissage sélectionnée dans le panneau Couleurs. Vous pouvez
également sélectionner un nuancier existant et cliquer sur le bouton
pour dupliquer le
nuancier dans la palette.
Vous pouvez également créer un nuancier en sélectionnant un dossier, une palette de couleurs ou un
nuancier et en sélectionnant l’option Dupliquer comme nuancier dans le menu volant.
1. Dans le panneau Nuanciers, sélectionnez l’une des commandes suivantes dans le menu
situé dans le coin supérieur droit :
Pour ajouter des couleurs importées à la palette courante, sélectionnez Ajouter des
couleurs.
Pour remplacer la palette courante par les couleurs importées, sélectionnez
Remplacer des couleurs.
2. Naviguez jusqu’au fichier souhaité pour le sélectionner et cliquez sur OK.
1. Dans le panneau Nuanciers, sélectionnez Enregistrer les couleurs dans le menu situé
dans le coin supérieur droit et saisissez le nom que vous souhaitez donner à la palette
de couleurs.
2. Dans le champ Type (Windows) ou Format (Macintosh), sélectionnez Jeu de couleurs
Animate ou Table de couleurs. Cliquez sur Enregistrer.
Haut de la page
Création ou modification d’une couleur unie
Le panneau Couleur vous permet de créer n’importe quelle la couleur. Si un objet est sélectionné sur la
scène, les modifications de couleur que vous effectuez dans le panneau Couleur sont appliquées à la
sélection. Vous pouvez sélectionner les couleurs en mode RVB ou TSL ou développer le panneau pour
utiliser le mode hexadécimal. La valeur alpha permet de définir le degré de transparence d’une couleur. De
plus, vous pouvez sélectionner l’une des couleurs de la palette de couleurs existante.
Vous pouvez développer le panneau Couleur pour afficher un plus grand espace chromatique à la place de la
barre de couleurs, un nuancier de couleurs scindé affichant la couleur actuelle et les couleurs précédentes et
un curseur de brillance permettant de modifier la brillance dans tous les modes de couleur.
419
1. Pour appliquer la couleur à une illustration existante, sélectionnez un ou plusieurs objets
sur la scène et sélectionnez Fenêtre > Couleur.
2. Cliquez sur l’icône Couleur de trait ou Couleur de remplissage pour indiquer l’attribut à
modifier.
Remarque : cliquez bien sur l’icône, et non sur le contrôle de couleurs, afin d’éviter que
le sélecteur de couleurs n’apparaisse.
3. Si vous avez sélectionné l’icône Couleur de remplissage à l’étape 3, vérifiez que l’option
Uni est sélectionnée dans le menu Type.
4. Si un objet est sélectionné sur la scène, les modifications de couleur que vous effectuez
dans le panneau Couleur sont appliquées à la sélection. Effectuez l’une des opérations
suivantes :
Cliquez sur l’espace chromatique du panneau Couleur pour sélectionner une couleur.
Faites glisser le contrôle de la brillance pour ajuster la brillance de la couleur.
Remarque : Pour créer des couleurs autres que le noir ou le blanc, vérifiez que le
contrôle de la brillance n’est pas paramétré sur la valeur minimale ou maximale.
Saisissez des valeurs dans les zones correspondantes : les valeurs rouge, vert et
bleu pour l’affichage RVB ; la teinte, la saturation et la brillance pour l’affichage TSL ;
ou les valeurs hexadécimales pour l’affichage hexadécimal. Saisissez une valeur
alpha pour indiquer le degré de transparence, de 0 pour une transparence totale à
100 pour une opacité totale.
Pour revenir aux paramètres de couleur par défaut, noir et blanc (trait noir et
remplissage blanc), cliquez sur le bouton Noir et blanc .
Cliquez sur le bouton Permuter les couleurs
de remplissage.
Cliquez sur le bouton Aucune couleur
transparent.
. pour permuter les couleurs de trait et
pour appliquer un trait ou un remplissage
Remarque : Les options de trait et de remplissage ne peuvent pas être définies sur
Aucune couleur pour les objets existants. Pour cela, sélectionnez le trait ou le
remplissage existant et supprimez-le.
Cliquez sur la puce de couleur de trait ou de remplissage, puis sélectionnez une
couleur.
5. Pour ajouter la nouvelle couleur aux nuanciers du document actif, sélectionnez Ajouter
un échantillon dans le menu situé dans le coin supérieur droit.
Haut de la page
Duplication et suppression de couleurs
Vous pouvez dupliquer des couleurs de la palette, supprimer quelques couleurs ou supprimer toutes les
couleurs d’une palette.
Pour dupliquer ou supprimer une couleur, sélectionnez Fenêtre > Nuanciers, cliquez sur
la couleur à dupliquer ou à supprimer et sélectionnez Dupliquer Nuancier ou Supprimer
Nuancier dans le menu du panneau. Au cours de la duplication, le pot de peinture
apparaît. Vous pouvez cliquer dans la zone vierge du panneau Nuanciers avec le pot de
peinture pour faire une copie de la couleur sélectionnée.
Pour supprimer toutes les couleurs de la palette de couleurs, dans le panneau Nuanciers
sélectionnez Effacer les couleurs dans le menu du panneau. Toutes les couleurs sont
supprimées de la palette à l’exception du noir et du blanc.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
420
Traits, remplissages et dégradés avec Animate CC
Création ou modification d’un remplissage dégradé
Ajustement du trait et de la couleur de remplissage
Modification des zones déjà peintes
Transformation des remplissages dégradés et de bitmap
Verrouillage d’un dégradé ou d’un bitmap pour remplir la scène
Haut de la page
Création ou modification d’un remplissage dégradé
Un dégradé est un remplissage multicolore dans lequel une couleur se transforme progressivement en une
autre couleur. Animate CC (anciennement Flash Professional CC) vous permet d’appliquer jusqu’à
15 transitions de couleur à un dégradé. Cette méthode permet de créer une graduation de couleurs régulière
sur un ou plusieurs objets sans les modifier. Vous pouvez enregistrer un dégradé en tant que nuance afin de
rendre plus facile l’application de ce dégradé à une série d’objets. Il est possible de créer deux types de
dégradés dans Animate :
Les dégradés linéaires permettent de modifier la couleur sur un seul axe (horizontal ou vertical).
Les dégradés radiaux permettent de modifier la couleur à partir d’un point focal central pour s’étendre vers
l’extérieur. Vous pouvez ajuster la direction d’un dégradé, ses couleurs, l’emplacement du point focal et bon
nombre de propriétés du dégradé.
Animate CC offre des fonctionnalités de contrôle supplémentaires sur les dégradés linéaires et radiaux à
utiliser avec Flash Player. Ces commandes, appelées modes de débordement, vous permettent de spécifier
le mode d’application des couleurs au-delà du dégradé.
1. Pour appliquer un remplissage dégradé à une illustration existante, sélectionnez un ou
plusieurs objets sur la scène.
2. Si le panneau Couleur n’est pas visible, sélectionnez Fenêtre > Couleur.
3. Pour sélectionner un mode de couleurs, sélectionnez RVB (paramètre par défaut) ou
TSL dans le menu du panneau.
4. Sélectionnez un type de dégradé dans le menu Type :
Linéaire permet de créer un dégradé qui s’étend du point de départ au point d’arrivée
de façon linéaire.
Radial Produit un dégradé dont le changement de couleur s’effectue sur un axe
circulaire vers l’extérieur à partir d’un point focal central.
Remarque : Lorsque vous sélectionnez un dégradé linéaire ou radial, le panneau
Couleur inclut également deux autres options si vous procédez à une publication pour
Flash Player 8 ou pour une version ultérieure. En premier lieu, le menu Débordement est
activé sous le menu Type. Le menu Débordement permet de contrôler les couleurs
appliquées au-delà des limites du dégradé. En deuxième lieu, la barre de définition du
dégradé apparaît, avec les pointeurs situés sous la barre indiquant les couleurs du
dégradé.
5. (Facultatif) Dans le menu Débordement, choisissez un mode de débordement à
appliquer au dégradé : Extension (mode par défaut), Réflexion ou Répétition.
421
6. (Facultatif) Cochez la case RVB linéaire pour créer un dégradé linéaire ou radial
compatible SVG (Scalable Vector Graphics). Si la taille est modifiée après la première
application, le dégradé semblera alors lisse.
7. Pour modifier la couleur du dégradé, sélectionnez l’un des pointeurs de couleur situés
sous la barre de définition du dégradé (le triangle placé au-dessus du pointeur de
couleur sélectionné devient noir). Cliquez ensuite sur l’espace chromatique qui apparaît
au-dessus de la barre de définition du dégradé. Faites glisser le curseur de la brillance
pour régler la brillance de la couleur.
8. Pour ajouter un pointeur au dégradé, cliquez sur ou sous la barre de définition du
dégradé. Sélectionnez la couleur du nouveau pointeur, comme décrit à l’étape
précédente.
Vous pouvez ajouter jusqu’à 15 pointeurs de couleur, ce qui vous permet de créer un
dégradé de 15 transitions de couleurs.
9. Pour repositionner un pointeur sur le dégradé, faites-le glisser le long de la barre de
définition du dégradé. Faites glisser un pointeur vers le bas, puis éloignez-le de la barre
pour le supprimer.
10. Pour enregistrer le dégradé, cliquez sur le triangle dans le coin supérieur droit du
panneau Couleur, puis sélectionnez Ajouter un échantillon dans le menu.
Le dégradé est ajouté au panneau Nuanciers pour le document courant.
11. Pour modifier le dégradé, par exemple pour remplacer un dégradé horizontal par un
dégradé vertical, utilisez l’outil Transformation de dégradé. Pour plus d’informations, voir
Transformation des remplissages dégradés et de bitmap.
Haut de la page
Ajustement du trait et de la couleur de remplissage
Pour spécifier la couleur du trait et du remplissage des objets graphiques et des formes, vous pouvez utiliser
les commandes Couleur de trait et Couleur de remplissage du panneau Outils ou de l’inspecteur des
propriétés.
La section Couleur de trait et Couleur de remplissage du panneau Outils contient des commandes qui
permettent d’activer les puces de Couleur de trait et Couleur de remplissage, qui déterminent à leur tour si
les traits ou les remplissages des objets sélectionnés sont affectés par les choix de couleurs. De même, les
commandes de la section Couleur permettent de rétablir rapidement les couleurs par défaut, de définir les
paramètres de couleurs de trait et de remplissage sur Aucune, et de permuter les couleurs de trait et de
remplissage.
De son côté, l’inspecteur des propriétés vous permet non seulement de sélectionner une couleur de trait ou
de remplissage pour un objet graphique ou une forme, mais également de définir la largeur et le style du trait.
Vous devez d’abord sélectionner les objets sur la scène pour utiliser ces commandes afin de modifier les
attributs de peinture d’objets existants.
Voir aussi : Aperçu en direct des couleurs.
Réglage de la couleur du trait et du remplissage avec le panneau Outils
Les commandes Couleur de trait et Couleur de remplissage du panneau Outils permettent de définir les
attributs de peinture des objets que vous créez à l’aide des outils de dessin et de peinture. Vous devez
d’abord sélectionner les objets sur la scène pour utiliser ces commandes afin de modifier les attributs de
peinture d’objets existants.
Cliquez sur la puce de couleur de trait ou de remplissage, puis sélectionnez une nuance.
Cliquez sur le bouton du Sélecteur de couleur dans la fenêtre qui apparaît, puis
sélectionnez une couleur. Vous pourriez également placer le curseur de la souris sur
plusieurs couleurs pour afficher un aperçu de l’effet de la couleur sur la forme.
422
Tapez la valeur hexadécimale d’une couleur dans le champ.
Cliquez sur le bouton Noir et blanc du panneau Outils pour revenir aux paramètres de
couleur par défaut (remplissage blanc et trait noir).
Cliquez sur le bouton Aucune couleur pour supprimer la couleur de trait ou de
remplissage.
Remarque : Le bouton Aucune couleur n’apparaît que lorsque vous créez un nouvel
ovale ou un nouveau rectangle. Vous pouvez créer un nouvel objet sans trait ni
remplissage, mais ne pouvez pas utiliser le bouton Aucune couleur avec un objet
existant. Pour cela, sélectionnez le trait ou le remplissage existant et supprimez-le.
Pour passer des couleurs de trait aux couleurs de remplissage et inversement, cliquez
sur le bouton de permutation des couleurs dans le panneau Outils.
Animate CC vous permet d’afficher un aperçu en direct des couleurs du trait et du remplissage lorsque vous
les modifiez dans le nuancier. Pour plus d’informations, voirAperçu en direct des couleurs.
Application d’un remplissage de couleur unie dans l’inspecteur des
propriétés
1. Sélectionnez un ou plusieurs objets fermés sur la scène.
2. Sélectionnez Fenêtre > Propriétés.
3. Pour sélectionner une couleur, cliquez sur la commande Couleur de remplissage et
effectuez l’une des opérations suivantes :
Sélectionnez une nuance dans la palette.
Tapez la valeur hexadécimale d’une couleur dans le champ.
Sélection d’une couleur, d’un style et d’une épaisseur de trait dans
l’inspecteur des propriétés
Vous pouvez changer la couleur, le style et l’épaisseur du trait d’un objet sélectionné en utilisant la
commande Couleur de trait de l’inspecteur des propriétés. Vous pouvez choisir parmi des styles de traits
préchargés avec Animate ou créer un style personnalisé. Pour sélectionner un remplissage de couleur unie,
vous pouvez utiliser la commande Couleur de remplissage de l’inspecteur des propriétés.
1. Sélectionnez un ou plusieurs objets sur la scène (pour les symboles, vous devez d’abord
cliquer deux fois afin de passer en mode d’édition de symbole).
2. Sélectionnez Fenêtre > Propriétés.
3. Pour sélectionner un style de trait, cliquez sur le menu Style et sélectionnez une option.
Pour créer un style personnalisé, cliquez sur Personnaliser dans l’inspecteur des
propriétés, sélectionnez des options dans la boîte de dialogue Style de trait, puis cliquez
sur OK.
Remarque : la sélection d’un style de trait autre que Uni peut augmenter la taille du
fichier.
4. Pour sélectionner une épaisseur de trait, faites glisser le curseur de trait ou saisissez une
valeur dans le champ de texte.
5. Pour activer les repères de trait, cochez la case Repère du trait. Cette option ajuste les
points d’ancrage des lignes et des courbes sur des pixels entiers, afin d’éviter de
produire des lignes verticales ou horizontales floues.
6. Pour définir le style d’une extrémité de tracé, choisissez une option Cap :
Aucun Laisse l’extrémité du tracé au niveau de celui-ci.
423
Arrondi Ajoute un embout arrondi qui dépasse l’extrémité du tracé d’une valeur
correspondant à la moitié de l’épaisseur du trait.
Carré Ajoute une extrémité carrée qui s’étend au-delà du tracé d’une valeur
correspondant à la moitié de l’épaisseur du trait.
7. (Facultatif) Si vous tracez des traits à l’aide de l’outil Crayon ou Pinceau en mode de
dessin Lisse, vous pouvez préciser le degré de lissage des lignes par Animate à l’aide du
curseur Lissage.
Par défaut, la valeur de Lissage est fixée à 50, mais vous pouvez spécifier une valeur
comprise entre 0 et 100. Plus la valeur de lissage est élevée, plus le lissage de la ligne
obtenue est prononcé.
Remarque : en mode de dessin Redresser ou Encre, le curseur Lissage est désactivé.
8. Choisissez une option de jointure pour définir l’aspect de la rencontre de deux segments.
Pour modifier les angles d’un tracé ouvert ou fermé, choisissez un tracé et une autre
option de jointure.
Jointures en pointes, arrondis et biseautées.
9. Pour éviter de biseauter une jointure pointue, indiquez une limite de pointe.
Les lignes dont la longueur dépasse cette valeur auront une extrémité carrée, et non en
pointe. Par exemple, une limite de pointe de 2 pour un trait à 3 points signifie qu’Animate
supprime le point limite lorsque la valeur de la longueur du point représente le double de
celle de l’épaisseur du trait.
Application d’une limite de pointe.
Réglage des traits de plusieurs lignes ou formes
Pour changer la couleur du trait, l’épaisseur et le style des lignes ou les contours d’une forme, utilisez l’outil
Encrier. Vous ne pouvez appliquer que des couleurs unies aux lignes ou aux contours d’une forme et non
des dégradés ou des bitmaps.
L’utilisation de l’outil Encrier, plutôt que la sélection de lignes distinctes, permet de modifier les attributs de
trait de plusieurs objets à la fois.
1. Sélectionnez l’outil Encrier dans le panneau Outils.
2. Sélectionnez une couleur de trait.
3. Sélectionnez un style et une épaisseur de trait dans l’inspecteur des propriétés.
4. Cliquez sur un objet sur la scène pour appliquer les modifications du trait.
Copie de traits et de remplissages
424
Vous pouvez utiliser l’outil Pipette pour copier les attributs de remplissage et de trait d’un objet et les
appliquer immédiatement à un autre objet. L’outil Pipette vous permet également de prélever l’image d’un
bitmap et de l’utiliser comme remplissage.
1. Pour utiliser l’outil Pipette afin d’appliquer des attributs de trait ou de remplissage,
sélectionnez l’outil Pipette et cliquez sur le trait ou la zone remplie dont vous voulez
appliquer les attributs à un autre trait ou zone remplie.
Lorsque vous cliquez sur un trait, l’outil devient automatiquement l’outil Encrier. Lorsque
vous cliquez sur une zone remplie, l’outil devient automatiquement l’outil Pot de peinture
et le modificateur Verrouiller le remplissage est activé.
2. Cliquez sur un autre trait ou sur une autre zone remplie pour appliquer les nouveaux
attributs.
Haut de la page
Modification des zones déjà peintes
L’outil Pot de peinture permet de colorer les zones fermées. Cet outil vous permet d’effectuer les opérations
suivantes :
Vous pouvez remplir les zones vides et changer la couleur des zones déjà peintes.
Vous pouvez peindre à l’aide de couleurs unies, de remplissages dégradés et de bitmap.
Vous pouvez utiliser l’outil Pot de peinture pour remplir les zones qui ne sont pas
totalement fermées.
Vous pouvez configurer Animate de manière à fermer les espaces des contours de la
forme lorsque vous utilisez cet outil.
1. Sélectionnez l’outil Pot de peinture dans le panneau Outils.
2. Sélectionnez une couleur de remplissage et un style.
3. Cliquez sur le modificateur Taille de l’espace qui figure en bas du panneau Outils et
sélectionnez une des options proposées :
Sélectionnez Ne ferme pas les espaces si vous voulez fermer les espaces
manuellement avant de remplir la forme. La fermeture manuelle des espaces peut
être plus rapide pour les dessins complexes.
Sélectionnez une option de fermeture pour qu’Animate remplisse les formes
contenant des espaces.
Remarque : si les espaces sont trop grands, vous devrez peut-être les fermer
manuellement.
4. Cliquez sur la forme ou la zone fermée à remplir.
Haut de la page
Transformation des remplissages dégradés et de bitmap
Vous pouvez transformer un remplissage dégradé ou bitmap en ajustant sa taille, sa direction ou son centre.
1. Sélectionnez l’outil Transformer le dégradé
dans le panneau Outils. S’il ne figure pas
dans le panneau Outils, cliquez sur l’outil Transformation libre et maintenez le bouton de
la souris enfoncé, puis choisissez Transformer le dégradé dans le menu qui s’affiche.
2. Cliquez sur une zone remplie avec un dégradé ou un bitmap. Un cadre de sélection
incluant des poignées de modification s’affiche. Lorsque le pointeur se trouve sur l’une de
425
ces poignées, il change pour indiquer la fonction de la poignée.
Point central L’icône de survol de la poignée du point central est une quadruple flèche.
Point focal La poignée du point focal s’affiche uniquement lorsque vous sélectionnez un
dégradé radial. L’icône de survol de la poignée du point focal est un triangle inversé.
Taille L’icône de survol de la poignée de dimensionnement (icône de la poignée du
milieu au bord du cadre de sélection) est un cercle intégrant une flèche.
Rotation Ajuste la rotation du dégradé. L’icône de survol de la poignée de rotation
(l’icône de la poignée du bas au bord du cadre de sélection) est une quadruple flèche en
forme de cercle.
Épaisseur Ajuste la largeur du dégradé. L’icône de survol de la poignée de la largeur (la
poignée carrée) est une flèche à deux extrémités.
Appuyez sur la touche Maj pour contraindre la direction d’un remplissage dégradé
linéaire à des multiples de 45°.
Contrôles du dégradé radial
A. Point central B. Épaisseur C. Rotation D. Taille E. Point focal.
3. Remodelez le dégradé ou remplissage de l’une des façons suivantes :
Pour repositionner le centre du remplissage dégradé ou bitmap, faites glisser le point
central.
Pour changer la largeur du remplissage dégradé ou bitmap, faites glisser la poignée
carrée sur le côté du cadre de sélection. Cette option ne redimensionne que le
remplissage, mais pas l’objet le contenant.
Pour changer la hauteur du remplissage dégradé ou bitmap, faites glisser la poignée
carrée en bas du cadre de sélection.
426
Pour faire pivoter le remplissage dégradé ou bitmap, faites glisser la poignée
circulaire de rotation dans le coin. Vous pouvez également faire glisser la poignée
inférieure du cercle de délimitation d’un remplissage ou dégradé circulaire.
Pour redimensionner un dégradé linéaire ou un remplissage, faites glisser la poignée
carrée au centre du cadre de sélection.
Pour modifier le point focal d’un dégradé circulaire, faites glisser la poignée circulaire
du milieu du cercle de délimitation.
Pour incliner un remplissage dans une forme, faites glisser l’une des poignées
circulaires sur le côté supérieur ou droit du cadre de sélection.
Pour placer un bitmap en mosaïque dans une forme, redimensionnez le remplissage.
427
Remarque : pour afficher toutes les poignées lorsque vous utilisez des remplissages
importants ou proches du bord de la scène, sélectionnez Affichage > Zone de travail.
Haut de la page
Verrouillage d’un dégradé ou d’un bitmap pour remplir la scène
Vous pouvez verrouiller un remplissage dégradé ou bitmap pour qu’il s’étende sur toute la scène et que les
objets peints avec le remplissage deviennent des masques révélant le dégradé ou le bitmap sous-jacent.
Lorsque vous sélectionnez le modificateur Verrouiller le remplissage avec l’outil Pinceau ou Pot de peinture et
peignez avec l’outil, le remplissage bitmap ou dégradé s’étend sur les objets que vous peignez sur la scène.
Le modificateur Verrouiller le remplissage permet de créer l’apparence d’un seul remplissage dégradé ou
bitmap appliqué à des objets distincts sur la scène.
Utilisation d’un remplissage dégradé verrouillé
1. Sélectionnez l’outil Pinceau ou Pot de peinture et choisissez un dégradé ou un bitmap
comme remplissage.
2. Sélectionnez Linéaire ou Radial dans le menu Type du panneau Couleur.
3. Cliquez sur le modificateur Verrouiller le remplissage
.
4. Peignez d’abord les zones dans lesquelles vous voulez placer le centre du remplissage,
puis passez aux autres zones.
Utilisation d’un remplissage bitmap verrouillé
1. Sélectionnez le bitmap que vous voulez utiliser.
2. Sélectionnez Bitmap dans le menu Type du panneau Couleur.
3. Sélectionnez l’outil Pinceau ou Pot de peinture.
4. Cliquez sur le modificateur Verrouiller le remplissage
.
5. Peignez d’abord les zones dans lesquelles vous voulez placer le centre du remplissage,
puis passez aux autres zones.
Séparation de groupes et d’objets
Utilisation des images bitmap importées
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
428
Dessin de traits et de formes avec Adobe Animate
Dessin de lignes droites à l’aide de l’outil Trait
Dessin de rectangles et d’ovales
Dessin de rectangles primitifs
Dessin d’ovales primitifs
Dessin de rectangles et d’ovales
Dessin de polygones et de formes étoilées
Mode Dessin d’objet
Dessin avec l’outil Crayon
Peinture à l’aide de l’outil Pinceau
Aperçu et sortie du dessin
Création de pinceaux personnalisés
Bibliothèque de pinceaux
Modification des pinceaux
Amélioration des traits et des formes à l’aide de l’outil Épaisseur variable
Ajout d’une épaisseur variable à un trait à l’aide de l’outil Largeur
Déplacement ou copie de l’épaisseur variable appliquée à un trait
Modification de l’épaisseur variable d’un trait
Suppression de l’épaisseur variable d’un trait
Enregistrement des profils d’épaisseur
(Animate CC uniquement) Aperçu en direct des couleurs
Haut de la page
Dessin de lignes droites à l’aide de l’outil Trait
Vous pouvez utiliser l’outil Ligne pour dessiner un segment à la fois.
1. Sélectionnez l’outil Ligne
.
2. Choisissez Fenêtre > Propriétés et sélectionnez les attributs de trait.
Remarque : vous ne pouvez pas définir d’attributs de remplissage pour l’outil Ligne.
3. Cliquez sur le bouton Dessin d’objet
dans la section Options du panneau Outils pour
sélectionner le mode Fusion ou Objet. Lorsque vous appuyez sur le bouton Dessin
d’objet, l’outil Ligne est en mode de dessin d’objet.
4. Placez le pointeur au début du tracé de la ligne, puis faites-le glisser jusqu’à
l’emplacement de votre choix. Pour contraindre le mouvement des objets aux multiples
de 45°, appuyez sur Maj pendant que vous faites glisser le curseur.
Haut de la page
Dessin de rectangles et d’ovales
Les outils Ovale et Rectangle vous permettent de créer ces formes géométriques de base, de leur appliquer
des traits et des remplissages et de spécifier des coins arrondis. Outre les modes Fusion et Objet, les outils
Ovale et Rectangle fournissent également le mode de dessin Objet primitif.
429
Lorsque vous créez des rectangles ou des ovales à l’aide des outils Rectangle primitif et Ovale primitif,
Animate dessine les formes en tant qu’objets distincts. Ces formes sont différentes de celles que vous créez
en mode Dessin d’objet. Les outils de forme primitive permettent de spécifier le rayon d’arrondi des
rectangles à l’aide des commandes de l’inspecteur des propriétés. Ils permettent par ailleurs de définir l’angle
de début et l’angle de fin, ainsi que le rayon interne des ovales. Après avoir créé une forme primitive, vous
pouvez modifier son rayon et ses dimensions en la sélectionnant sur la scène et en réglant les contrôles dans
l’inspecteur des propriétés.
Remarque : Lorsque l’un des outils de dessin d’objet primitif est sélectionné, l’inspecteur des propriétés
conserve les valeurs du dernier objet primitif que vous avez modifié. Par exemple, si vous modifiez un
rectangle et en dessinez ensuite un autre.
Remarque : Pour dessiner à partir du centre de la scène, maintenez enfoncée la touche Alt lorsque vous
dessinez une forme.
Dessin de rectangles primitifs
1. Pour sélectionner l’outil Rectangle primitif, cliquez et maintenez le bouton de la souris
et sélectionnez l’outil Rectangle primitif
dans le menu
enfoncé sur l’outil Rectangle
contextuel.
2. Pour créer un rectangle primitif, faites glisser l’outil Rectangle primitif sur la scène.
Remarque : pour modifier le rayon d’arrondi tout en faisant glisser l’outil Rectangle
primitif, appuyez sur la flèche Haut ou Bas. Relâchez la touche lorsque vous avez atteint
le rayon d’arrondi souhaité.
3. Le rectangle primitif étant sélectionné, vous pouvez utiliser les contrôles de l’inspecteur
des propriétés pour modifier la forme davantage ou pour spécifier les couleurs du
remplissage ou du trait.
Propriétés d’un rectangle primitif
Ces contrôles de l’inspecteur des propriétés sont spécifiques à l’outil Rectangle primitif :
430
Contrôles du rayon de l’angle du rectangle Permettent de spécifier les rayons du
rectangle. Dans chaque zone de texte, vous pouvez entrer une valeur numérique pour le
rayon interne. Si vous saisissez une valeur négative, un rayon inversé sera créé. Vous
pouvez également désactiver l’icône de rayon d’angle forcé et régler chaque rayon
d’angle individuellement.
Rétablir Réinitialise tous les contrôles de l’outil Rectangle primitif et rétablit la forme de
rectangle primitif tracée sur la scène à sa taille et sa forme initiales.
4. Dans l’inspecteur des propriétés, désactivez l’icône de verrouillage qui se trouve dans la
section Options du rectangle pour spécifier un rayon d’angle différent pour chaque angle.
Lorsque le verrouillage est activé, les contrôles de rayon sont bridés de sorte que
chaque angle ait le même rayon.
5. Cliquez sur le bouton Rétablir de l’inspecteur des propriétés pour réinitialiser les rayons
des angles.
Dessin d’ovales primitifs
1. Cliquez et maintenez le bouton de la souris appuyé sur l’outil Rectangle
sélectionnez l’outil Rectangle primitif .
et
2. Faites glisser l’outil Ovale primitif sur la scène pour créer un ovale primitif. Pour forcer le
tracé d’un cercle, appuyez sur Maj pendant que vous faites glisser le curseur.
3. L’ovale primitif étant sélectionné sur la scène, vous pouvez utiliser les contrôles de
l’inspecteur des propriétés pour modifier la forme davantage ou pour spécifier les
couleurs du remplissage ou du trait.
Propriétés d’un ovale primitif
Ces contrôles de l’inspecteur des propriétés sont spécifiques à l’outil Ovale primitif :
Angle de départ/Angle de fin Angle des points de départ et de fin de l’ovale. À l’aide de
ces contrôles, vous pouvez modifier aisément la forme des ovales et des cercles en
431
secteurs, demi-cercles et autres formes de votre choix.
Rayon interne Rayon interne (ou ovale) dans les limites de l’ovale. Vous pouvez saisir la
valeur numérique du rayon interne dans le champ ou cliquer sur le curseur pour régler
interactivement sa taille. Vous pouvez entrer des valeurs comprises entre 0 et 99,
représentant le pourcentage de remplissage supprimé.
Fermer le tracé Détermine si le tracé (ou les tracés si vous spécifiez un rayon intérieur)
de l’ovale est fermé. Si vous spécifiez un tracé ouvert, aucun remplissage n’est appliqué
à la forme obtenue, seul le trait est dessiné. Fermer le tracé est sélectionné par défaut.
Rétablir Réinitialise tous les contrôles des outils Ovale primitif et rétablit la forme d’ovale
primitif tracée sur la scène à sa taille et sa forme initiales.
Dessin de rectangles et d’ovales
Les outils Rectangle et Ovale créent ces formes géométriques de base.
ou l’outil Ovale , cliquez avec le bouton de la
1. Pour sélectionner l’outil Rectangle
souris sur l’outil Rectangle et maintenez-le enfoncé tout en faisant glisser la souris.
2. Faites glisser l’outil Rectangle ou l’outil Ovale sur la scène pour créer un rectangle ou un
ovale.
3. Pour l’outil Rectangle, indiquez que les angles doivent être arrondis en cliquant sur le
modificateur de rectangle arrondi, puis en spécifiant la valeur du rayon des angles. Une
valeur nulle (0) crée des angles droits.
4. Faites glisser le pointeur sur la scène. Si vous utilisez l’outil Rectangle, appuyez sur les
flèches Haut et Bas tout en dessinant pour ajuster le rayon des angles arrondis.
Pour les outils Ovale et Rectangle, faites glisser le pointeur tout en maintenant la touche
Maj enfoncée pour forcer le tracé de cercles et de carrés.
5. Pour spécifier la taille spécifique d’un ovale ou d’un rectangle, sélectionnez l’outil Ovale
ou Rectangle et appuyez sur la touche Alt (Windows) ou sur la touche Option
(Macintosh). Cliquez ensuite sur la scène pour afficher la boîte de dialogue des
paramètres du rectangle et de l’ovale.
Pour les ovales, vous pouvez spécifier la largeur et la hauteur en pixels, et indiquer si
l’ovale doit être tracé à partir du centre.
Pour les rectangles, vous pouvez spécifier la largeur et la hauteur en pixels, le rayon
des coins arrondis et indiquer si le rectangle doit être tracé à partir du centre.
Voir aussi : Aperçu en direct des couleurs.
Haut de la page
Dessin de polygones et de formes étoilées
1. Sélectionnez l’outil Polygone
en cliquant sur l’outil Rectangle et en laissant le bouton
de la souris enfoncé jusqu’à ce qu’un menu déroulant apparaisse.
2. Choisissez Fenêtre > Propriétés et sélectionnez les attributs de trait et de remplissage.
3. Cliquez sur Options et procédez comme suit :
Dans le champ Style, sélectionnez Polygone ou Etoile.
Dans le champ Nombre de côtés, saisissez un chiffre compris entre 3 et 32.
Dans le champ Taille des branches de l’étoile, indiquez la largeur des branches de
l’étoile en saisissant un chiffre compris entre 0 et 1. Plus le chiffre indiqué est proche
de 0 plus les branches sont fines (en forme d’aiguilles). Si vous dessinez un
432
polygone, il n’est pas nécessaire de modifier ce paramètre : il n’a aucune incidence
sur la forme du polygone.
4. Cliquez sur OK.
5. Faites glisser le pointeur sur la scène.
Voir aussi : Aperçu en direct des couleurs.
Haut de la page
Mode Dessin d’objet
Lorsque vous sélectionnez et dessinez des objets, le mode de dessin d’objet affiche un fin contour le long
des formes en fonction de la couleur du calque. Les petits cercles indiquent les points d’ancrage. Ils ne sont
pas interactifs et ne peuvent pas être modifiés à l’aide de l’outil de sélection. Lorsque vous dessinez en mode
Objet, les traits et les formes ne sont plus sélectionnés par défaut.
Contours autour d’une forme
Haut de la page
Dessin avec l’outil Crayon
L’outil Crayon permet de dessiner des lignes et des formes pratiquement comme si vous les dessiniez avec
un crayon normal. Vous devez sélectionner un mode de dessin pour l’outil Crayon pour lisser ou redresser
les lignes et les formes pendant que vous dessinez.
1. Sélectionnez l’outil Crayon
.
2. Choisissez Fenêtre > Propriétés et sélectionnez une couleur, une épaisseur et un style
de trait.
3. Sélectionnez un mode de dessin dans la section Options du panneau Outils :
Sélectionnez Redresser pour dessiner des lignes droites et convertir des triangles,
ovales, cercles, rectangles et carrés approximatifs en formes géométriques précises.
Sélectionnez Lisser
pour créer des lignes incurvées lisses.
Sélectionnez Encre
modification.
pour dessiner des lignes à main levée sans apporter aucune
433
Lignes tracées en mode Redresser, Lisser et Encre, respectivement
4. Pour dessiner avec l’outil Crayon, cliquez sur la scène et faites glisser le curseur tout en
maintenant la touche Maj enfoncée pour forcer le tracé de lignes verticales ou
horizontales.
Haut de la page
Peinture à l’aide de l’outil Pinceau
L’outil Pinceau
trace des traits ressemblant à des coups de pinceau. Il permet de créer des effets
spéciaux, tels que des effets calligraphiques. Vous pouvez sélectionner une taille et une forme de pinceau à
l’aide des modificateurs de cet outil.
Animate redimensionne la taille du pinceau proportionnellement au niveau de zoom variable de la scène.
Vous pouvez ainsi dessiner simplement à n’importe quel niveau de zoom et prévisualiser votre travail au fur
et à mesure que vous le dessinez. Si vous souhaitez rétablir le comportement de pinceau par défaut
antérieur, qui préserve une taille de pixels constante quel que soit le niveau de zoom, désactivez la case à
cocher Taille de zoom avec la scène dans l’inspecteur des propriétés du pinceau.
Si vous désactivez la case à cocher du niveau de zoom de la scène, la taille de pinceau demeure constante
pour les nouveaux traits et ce, même lorsque vous modifiez le facteur de zoom utilisé pour la scène. Par
conséquent, la même taille de pinceau semble plus grande lorsque le facteur de zoom est inférieur. Par
exemple, supposons que vous avez zoomé à 100 % sur la scène et que vous utilisez la plus petite taille de
pinceau pour peindre. Supposons maintenant que vous réglez le zoom sur 50 % et recommencez à peindre
avec la même taille de pinceau. Le nouveau trait que vous tracez semble 50 % plus épais, uniforme et précis
sans aucune extrémité non effilée par rapport au trait précédent (le fait de modifier l’agrandissement de la
scène ne change pas la taille des traits de pinceau existants).
Vous pouvez utiliser un bitmap importé comme remplissage lorsque vous peignez avec l’outil Pinceau. Voir
Séparation de groupes et d’objets.
Si vous avez raccordé à votre ordinateur une tablette Wacom sensible à la pression, variez la largeur et
l’angle du trait de pinceau. Pour cela, utilisez les modificateurs de pression et d’inclinaison de l’outil Pinceau
et modifiez la pression du stylet.
Le modificateur de pression permet de régler l’épaisseur du trait de pinceau en fonction de la pression
exercée sur le stylet. Le modificateur d’inclinaison permet de régler l’angle du trait de pinceau en fonction de
l’angle appliqué au stylet sur la tablette. Le modificateur d’inclinaison mesure l’angle entre l’extrémité
supérieure (gomme) du stylet et le bord supérieur (nord) de la tablette. Par exemple, si vous tenez le stylet
en position verticale sur la tablette, l’inclinaison est de 90. Les modificateurs de pression et d’inclinaison
prennent tous deux en charge la fonction gomme du stylet.
Remarque : Sur une tablette, les options Inclinaison et Pression de l’Outil Pinceau sont disponibles
uniquement lors de l’utilisation du mode Plume. La souris n’active pas ces options.
Un trait de pinceau d’épaisseur variable tracé avec un stylet.
1. Sélectionnez l’outil Pinceau
.
2. Choisissez Fenêtre > Propriétés, puis sélectionnez une couleur de remplissage.
3. Cliquez sur le modificateur Mode du pinceau, puis sélectionnez un mode de peinture :
Peint normalement Peint sur les lignes et les remplissages d’un même calque.
434
Fonds Peint les remplissages et les zones vides, sans toucher aux lignes.
Peint derrière Peint les parties vides de la scène sur un même calque, sans toucher
aux lignes ou aux remplissages.
Peint la sélection Applique un nouveau remplissage à la sélection lorsque vous
sélectionnez un remplissage dans le modificateur de remplissage ou l’option Couleur de
remplissage de l’inspecteur des propriétés. Cette option revient à sélectionner une zone
remplie et à appliquer un nouveau remplissage.
Peint à l’intérieur Peint le remplissage dans lequel vous avez dessiné le premier trait
de pinceau mais ne peint jamais les lignes. Si vous commencez à peindre dans une
zone vide, le remplissage n’affecte aucune des zones déjà remplies.
4. Sélectionnez une taille et une forme de pinceau dans les modificateurs de l’outil Pinceau.
5. Tandis que vous dessinez, pour effectuer un zoom sur le pinceau proportionnellement au
niveau de zoom de la scène, cochez la case Taille de zoom avec la scène. Vous pouvez
ainsi dessiner simplement à n’importe quel niveau de zoom et prévisualiser votre travail
au fur et à mesure que vous le dessinez.
6. Si vous utilisez une tablette graphique à pression Wacom, vous pouvez modifier les traits
de pinceaux en sélectionnant le modificateur de pression, le modificateur d’inclinaison ou
les deux.
Sélectionnez le modificateur de pression pour faire varier l’épaisseur de vos traits de
pinceau en fonction de la pression exercée sur le stylet.
Sélectionnez le modificateur d’inclinaison pour faire varier l’angle de vos traits de
pinceau en fonction de l’angle appliqué au stylet sur la tablette graphique à pression
Wacom.
7. Faites glisser le pointeur sur la scène. Faites glisser le pointeur tout en maintenant la
touche Maj enfoncée pour tracer des traits de pinceau horizontaux et verticaux.
Aperçu et sortie du dessin
Les outils Pinceau traditionnel
et Pinceau
ont été améliorés dans la version CC 2015.1. Ils vous
garantissent désormais une souplesse de dessin accrue et une meilleure fluidité. Le contour final généré est
maintenant très proche de l’aperçu en direct. Cela permet d’éviter l’affichage de tout amincissement ou
épaississement imprévu des traits de pinceau. Même les courbes les plus fines dessinées à l’aide de l’outil
Pinceau n’affichent aucune cassure, ni espace.
Création de pinceaux personnalisés
L’outil Pinceau peut être personnalisé en définissant des paramètres tels que la forme et l’angle. Cela vous
permet de créer des illustrations naturelles dans vos projets en personnalisant l’outil Pinceau en fonction de
vos besoins de dessin. Vous pouvez sélectionner, modifier et créer un pinceau personnalisé dans Animate
par le biais de l’Inspecteur des propriétés, lorsque l’outil Pinceau est sélectionné dans la boîte à outils. Pour
savoir comment créer, modifier et supprimer des pinceaux personnalisés, reportez-vous à la section Pinceaux
personnalisés.
Haut de la page
Bibliothèque de pinceaux
435
Animate CC intègre une bibliothèque globale de pinceaux vectoriels comprenant une vaste collection de
pinceaux artistiques et de motif. Pour ouvrir le panneau Bibliothèque de pinceaux, cliquez sur Fenêtre >
Bibliothèque de pinceaux ou cliquez sur l’icône de pinceau dans l’inspecteur des propriétés. Avant d’utiliser
un pinceau, double-cliquez dessus pour l’ajouter à votre document actif.
Importation de nouveaux pinceaux artistiques depuis les bibliothèques CC
Vous pouvez importer de nouveaux pinceaux artistiques et de motif dans votre document Animate à l’aide
des bibliothèques CC, en plus des présélections de pinceau disponibles par défaut. Pour ajouter un pinceau
artistique ou de motif, ouvrez le panneau des bibliothèques CC et cliquez simplement sur l’un des pinceaux
pris en charge. (Pour le moment, Animate ne prend en charge que les pinceaux Illustrator des bibliothèques
CC.) Pour ajouter de nouveaux pinceaux à votre bibliothèque CC, vous pouvez utiliser l’application Pinceau
pour Android et iOS. Lorsque vous cliquez sur un pinceau dans une bibliothèque CC, il est ajouté à la fois au
panneau Bibliothèque de pinceaux général et au document en cours.
Chaque pinceau peut être utilisé comme un pinceau Artistique ou Motif. Par défaut, les pinceaux sont ajoutés
comme des pinceaux artistiques. Pour le convertir en pinceau de motif, sous l’option Modifier le pinceau,
sélectionnez le type Pinceau Motif.
Haut de la page
Modification des pinceaux
L’icône Modifier le pinceau ouvre la boîte de dialogue de modification du pinceau sélectionné. Si vous
sélectionnez un pinceau artistique pour le modifier, la boîte de dialogue Options de pinceau artistique
s’affiche. Vous pouvez y modifier les propriétés telles que l’orientation du pinceau ou les préférences de mise
à l’échelle et de chevauchement, puis appliquer ces modifications à tous les traits existants.
Pour plus d’informations, voir Utilisation du pinceau.
Options de pinceau artistique
436
Haut de la page
Amélioration des traits et des formes à l’aide de l’outil Épaisseur
variable
L’outil Largeur permet d’embellir un trait en en variant l’épaisseur. L’épaisseur variable peut ensuite être
enregistrée en tant que Profils d’épaisseur qui seront appliqués à d’autres traits. Sélectionnez l’outil Largeur
dans le panneau Outils ou utilisez le raccourci clavier (U).
Lorsque vous passez la souris sur un trait avec l’outil Largeur sélectionné, les points (point d’épaisseur)
s’affichent sur le trait avec des poignées (poignée d’épaisseur). Vous pouvez régler l’épaisseur du trait et
déplacer, copier et supprimer le point d’épaisseur. Les informations d’épaisseur s’affichent dans le panneau
Informations lorsque vous modifiez l’épaisseur d’un trait.
Vous pouvez également sélectionner plusieurs points d’épaisseur, puis effectuer l’une des actions (déplacer,
copier ou supprimer) mentionnées précédemment.
Si plusieurs traits apparaissent, seul le trait actif est ajusté. Pour ajuster un trait, placez la souris dessus avec
l’outil Largeur.
Remarque : les traits d’épaisseur variable sont convertis en traits uniformes, si un fichier contenant un trait
d’épaisseur variable est ouvert dans une ancienne version d’Animate.
Ajout d’une épaisseur variable à un trait à l’aide de l’outil Largeur
Pour ajouter l’épaisseur à un trait, procédez comme suit :
1. Tracez un trait ou une forme avec l’un des outils. Par exemple, l’outil Ligne.
Trait créé à l’aide de l’outil Ligne avec une épaisseur du trait de 88, un style uni et avec le profil d’épaisseur
1.
2. Sélectionnez l’outil Largeur
dans le panneau Outils.
3. Une fois l’outil Largeur sélectionné, passez la souris sur le trait. Les points et poignées
de largeur potentiels s’affichent. L’outil se transforme également en , ce qui indique
que l’outil Largeur est actif et que l’épaisseur variable peut être appliquée au trait.
437
(A) Point de largeur (B) Poignée de largeur
4. Sélectionnez le point avec l’outil Largeur, puis faites glisser la poignée d’épaisseur vers
l’extérieur.
Remarque : la taille d’épaisseur est limitée à 100 pixels des deux côtés du point d’épaisseur.
Ajout d’épaisseur en faisant glisser vers l’extérieur
5. Vous pouvez constater que le trait est agrémenté d’une épaisseur variable. Sélectionnez
l’outil Largeur et passez la souris sur le trait pour afficher les nouveaux point et poignée
d’épaisseur.
438
L’épaisseur variable est ajoutée au trait avec le point et la poignée d’épaisseur en surbrillance.
Déplacement ou copie de l’épaisseur variable appliquée à un trait
Vous pouvez déplacer ou copier les points d’épaisseur créés pour un trait, ce qui a pour effet de déplacer ou
de copier l’épaisseur variable appliquée au trait. Pour déplacer un point d’épaisseur, procédez comme suit :
1. Sélectionnez l’outil Largeur
dans le panneau Outils.
2. Passez la souris sur le trait pour afficher les points d’épaisseur existants, puis
sélectionnez le point d’épaisseur à déplacer.
3. Faites glisser le point d’épaisseur le long du trait.
Remarque : le déplacement du point d’épaisseur est limité par le prochain point d’épaisseur d’un des côtés.
Déplacement d’un point d’épaisseur
4. Le point d’épaisseur est déplacé vers son nouvel emplacement, ce qui modifie
également le trait.
Le point d’épaisseur est déplacé vers son nouvel emplacement.
Pour copier un point d’épaisseur, procédez comme suit :
1. Sélectionnez l’outil Largeur
dans le panneau Outils.
439
2. Passez la souris sur le trait pour afficher les points d’épaisseur existants, puis
sélectionnez le point à copier.
3. Maintenez la touche Alt (Option sur Mac) enfoncée et faites glisser le point d’épaisseur
le long du trait pour copier le point d’épaisseur sélectionné.
Remarque : le déplacement du point est limité par le prochain point d’épaisseur d’un des côtés.
Copie d’un point d’épaisseur
4. Le point d’épaisseur est copié. Le trait est aussi modifié.
Le point d’épaisseur est copié
Modification de l’épaisseur variable d’un trait
Le fait de modifier l’épaisseur variable d’un trait à un point d’épaisseur donné développe ou réduit de manière
équiproportionnelle le trait de l’un des côtés du point d’épaisseur. Si, toutefois, vous souhaitez modifier
l’épaisseur d’un côté du point, procédez comme suit :
1. Sélectionnez l’outil Largeur
dans le panneau Outils.
2. Passez la souris sur le trait pour afficher les points d’épaisseur existants, puis
sélectionnez le point d’épaisseur de l’une des extrémités de la poignée d’épaisseur que
vous souhaitez modifier.
3. Maintenez la touche Alt (Option sur Mac) enfoncée et faites glisser la poignée
d’épaisseur vers l’extérieur pour modifier le point d’épaisseur sélectionné.
440
Modification de l’épaisseur d’un trait
4. Le point d’épaisseur est déplacé et le trait est modifié en conséquence.
Le point d’épaisseur est déplacé de manière asymétrique et le trait est modifié en conséquence.
Suppression de l’épaisseur variable d’un trait
Pour supprimer un point d’épaisseur, procédez comme suit :
1. Passez la souris et sélectionnez le point d’épaisseur à supprimer.
2. Appuyez sur la touche Retour arrière ou Suppression pour supprimer le point
sélectionné.
441
Le point d’épaisseur est supprimé et le trait est modifié en conséquence.
Commandes de l’outil Épaisseur
Le tableau suivant répertorie les raccourcis clavier de l’outil Épaisseur :
Tâches de contrôle de
l’épaisseur
Raccourcis clavier
Créer des épaisseurs non
uniformes
Alt+faire glisser (Windows) ou Option+faire glisser (Mac
OS)
Créer une copie du point
d’épaisseur
Alt + faire glisser le point d’épaisseur (Windows) ou
Option+faire glisser le point d’épaisseur (Mac OS)
Copier et déplacer tous les
points d’épaisseur sur le tracé
Alt+Maj+faire glisser (Windows) ou Option+Maj+faire
glisser (Mac OS)
Sélectionner plusieurs points
d’épaisseur et les faire glisser
Maj + clic + faire glisser
Supprimer les points
d’épaisseur sélectionnés
Supprimer
Enregistrement des profils d’épaisseur
Après avoir défini l’épaisseur du trait, vous pouvez enregistrer le profil d’épaisseur variable au moyen de
l’Inspecteur des propriétés.
1. Sélectionnez le trait auquel vous avez ajouté l’épaisseur variable.
2. Cliquez sur le bouton + à droite de la liste déroulante Largeur dans l’Inspecteur des
propriétés.
3. Dans la boîte de dialogue Profil d’épaisseur variable, entrez un Nom de profil.
4. Cliquez sur OK.
442
A) Icône Enregistrer le profil d’épaisseur B) Icône Supprimer le profil d’épaisseur C) Icône Réinitialiser le profil
d’épaisseur
Il est ensuite possible d’appliquer les profils d’épaisseur aux tracés sélectionnés en les choisissant dans la
liste déroulante Profil d’épaisseur du panneau Propriétés. Lorsqu’un trait sans épaisseur variable est
sélectionné, la liste affiche l’option Uniforme. Pour rétablir le profil d’épaisseur par défaut, cliquez sur le
bouton Réinitialiser les profils.
L’option Enregistrer le profil d’épaisseur est disponible uniquement lorsque vous sélectionnez sur la scène
une épaisseur variable qui ne se trouve pas dans les profils d’épaisseur par défaut. Vous pouvez créer vos
propres profils de trait à l’aide de l’outil Épaisseur et les enregistrer. De la même manière, l’icône Supprimer
le profil d’épaisseur est disponible lorsque vous sélectionnez un profil d’épaisseur personnalisé dans la liste
déroulante. Utilisez cette option pour supprimer un profil personnalisé.
Remarque : rétablir le profil d’épaisseur par défaut défini supprime tous les profils personnalisés enregistrés.
Vous pouvez également synchroniser les profils personnalisés enregistrés sur le Cloud.
Haut de la page
(Animate CC uniquement) Aperçu en direct des couleurs
La fonction Aperçu en direct des couleurs affiche simultanément les couleurs du trait et du remplissage lors
de la création d’une forme sur la scène. Elle permet de visualiser l’aspect final d’une forme lorsque vous la
dessinez. Cette fonction est activée pour tous les outils disponibles dans Animate.
La fonction Aperçu en direct des couleurs est également activée pour les nuanciers dans Animate. Vous
pouvez donc afficher l’aperçu des changements de couleurs de trait ou de remplissage d’une forme
sélectionnée sur la scène. Placez le curseur de la souris sur la couleur de votre choix pour afficher le
changement de couleur.
L’aperçu couleur en direct est activé pour les nuanciers des panneaux suivants :
Panneau Outils
Inspecteur des propriétés
Inspecteur des propriétés de la scène
Inspecteur des propriétés du texte
Grille
Repères
443
Liens connexes
Ajustement du trait et de la couleur de remplissage
Modes de tracé et objets graphiques
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
444
Disposition d’objets
Empilement d’objets
Alignement d’objets
Regroupement d’objets
Modification d’un groupe ou d’un objet à l’intérieur d’un groupe
Séparation de groupes et d’objets
Haut de la page
Empilement d’objets
Dans un calque, Animate présente les objets en fonction de l’ordre de leur création, en plaçant les plus
récemment créés en haut de la pile. L’ordre d’empilement des objets détermine celui de leur apparition
lorsqu’ils se chevauchent. Vous pouvez changer l’ordre d’empilement des objets à tout moment.
Les lignes et les formes dessinées apparaissent toujours au-dessous des groupes et des symboles. Pour les
déplacer à une position supérieure, vous devrez les grouper ou les transformer en symboles.
Les calques affectent également l’ordre d’empilement. Tous les éléments du calque 2 apparaissent audessus des éléments du calque1, et ainsi de suite. Pour changer l’ordre d’empilement des calques, faites
glisser leur nom dans le scénario jusqu’au nouvel emplacement.
1. Sélectionnez l’objet.
2. Effectuez l’une des opérations suivantes :
Choisissez Modification > Réorganisation > Mettre au premier plan ou Mettre à
l’arrière-plan pour déplacer l’objet ou le groupe au début ou à la fin dans l’ordre
d’empilement.
Choisissez Modification > Réorganisation > Vers l’avant ou Vers l’arrière pour
déplacer l’objet ou le groupe d’une position vers le haut ou le bas dans l’ordre
d’empilement.
Si plusieurs groupes sont sélectionnés, ils passent devant ou derrière tous les groupes non sélectionnés, tout
en conservant leur position les uns par rapport aux autres.
Haut de la page
Alignement d’objets
Le panneau Aligner vous permet d’aligner les objets sélectionnés sur l’axe horizontal ou vertical. Vous pouvez
aligner des objets verticalement sur les bords droit ou gauche, ou sur le centre, ou horizontalement, sur les
bords supérieur ou inférieur, ou sur le centre.
Pour consulter un tutoriel sur les outils de présentation dans Animate, voir « Utilisation des outils de
présentation » sur la page Tutoriels Animate.
1. Sélectionnez les objets à aligner.
2. Sélectionnez Fenêtre > Aligner.
3. Dans le panneau Aligner, sélectionnez Vers la scène pour appliquer les modifications
d’alignement par rapport aux dimensions de la scène.
445
4. Cliquez sur les boutons d’alignement pour modifier les objets sélectionnés.
Haut de la page
Regroupement d’objets
Pour manipuler des éléments en tant qu’objet unique, vous devrez les grouper. Par exemple, après avoir
créé un dessin tel qu’un arbre ou une fleur, vous pouvez grouper les éléments du dessin pour pouvoir
sélectionner et déplacer facilement le dessin dans son ensemble.
Lorsque vous sélectionnez un groupe, l’inspecteur des propriétés affiche ses coordonnées x et y, ainsi que
ses dimensions en pixels.
Vous pouvez modifier des groupes sans les dissocier. Vous pouvez également sélectionner un objet isolé
d’un groupe en vue d’une modification, sans dissocier les objets.
Sélectionnez les objets à associer. Vous pouvez sélectionner des formes, d’autres
groupes, des symboles, du texte, etc.
Pour créer un groupe, sélectionnez Modification > Associer ou appuyez sur Ctrl+G
(Windows) ou Commande+G (Macintosh).
Pour dissocier un groupe, sélectionnez Modification > Dissocier ou appuyez sur
Ctrl+Maj+G (Windows) ou Commande+Maj+G (Macintosh).
Haut de la page
Modification d’un groupe ou d’un objet à l’intérieur d’un groupe
1. Le groupe étant sélectionné, choisissez Modifier > Modifier la sélection ou cliquez deux
fois sur le groupe avec l’outil Sélection.
Tous les éléments de la page qui ne font pas partie du groupe sont estompés, ce qui
signifie qu’ils sont inaccessibles.
2. Modifiez les éléments souhaités du groupe.
3. Choisissez Modifier > Tout modifier ou cliquez deux fois sur un espace vierge de la
scène avec l’outil Sélection.
Animate rend au groupe son état d’entité unique et vous pouvez travailler avec d’autres
éléments de la scène.
Haut de la page
Séparation de groupes et d’objets
Vous pouvez séparer des groupes, des occurrences et des bitmaps en éléments dissociés et modifiables.
Cette séparation réduit de manière significative la taille de fichier des graphiques importés.
Bien que vous puissiez choisir Modifier > Annuler immédiatement après avoir séparé un groupe ou un objet,
cette action n’est pas entièrement réversible. Elle affecte les objets de la façon suivante :
Elle coupe le lien de l’occurrence d’un symbole avec son symbole maître.
Elle élimine tout, sauf l’image en cours, dans un symbole animé.
Elle convertit un bitmap en remplissage.
Elle place chaque caractère dans un bloc de texte séparé lorsqu’elle est appliquée à des
blocs de texte.
Elle convertit les caractères en contours lorsqu’elle est appliquée à un seul caractère.
Veillez à ne pas confondre la commande Séparer avec la commande Dissocier. La
commande Dissocier sépare les objets groupés, en restaurant les éléments groupés à
446
leur état d’origine, avant le groupement. Elle ne sépare pas les bitmaps, les occurrences
ou les caractères, ni ne convertit les caractères en contours.
1. Sélectionnez le groupe, bitmap ou symbole que vous souhaitez séparer.
2. Sélectionnez Modification > Séparer.
Remarque : la séparation de symboles animés ou de groupes d’une animation interpolée n’est pas
recommandée et pourrait avoir des résultats imprévisibles. La séparation de symboles complexes et de blocs
de texte de grande taille peut prendre un certain temps. Vous devrez augmenter l’allocation mémoire de
l’application pour séparer convenablement des objets complexes.
Adobe recommande également :
Création et organisation des calques
Séparation du texte TLF
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
447
Automatisation des tâches à l’aide du menu Commandes
Création et gestion des commandes
Commandes d’exécution
Obtention de commandes supplémentaires
Étapes ne pouvant être enregistrées comme commandes
Haut de la page
Création et gestion des commandes
Pour réexécuter la même tâche, créez une commande dans le menu Commandes à partir d’étapes dans le
panneau Historique et réutilisez la commande. Les opérations sont alors réexécutées à l’identique. Vous ne
pouvez pas modifier les étapes lors de leur réexécution.
Vous pouvez créer et enregistrer une commande afin d’utiliser les étapes la prochaine fois que vous lancez
Animate. Les commandes enregistrées sont conservées de façon définitive (à moins que vous ne les
supprimiez). Les opérations copiées à l’aide de la commande Copier les étapes du panneau Historique sont
effacées lorsque vous copiez d’autres éléments.
Vous pouvez créer une commande à partir des étapes sélectionnées dans le panneau Historique. Renommez
ou supprimez des commandes dans la boîte de dialogue Gérer les commandes enregistrées.
Création d’une commande
1. Sélectionnez une ou plusieurs opérations dans le panneau Historique.
2. Sélectionnez Enregistrer comme commande dans le menu d’options du panneau
Historique.
3. Entrez le nom de la commande et cliquez sur OK. La commande apparaît dans le menu
Commandes.
Remarque : la commande est enregistrée en tant que fichier JavaScript (portant
l’extension .jsfl) dans votre dossier Commandes. Vous trouverez ce dossier aux
emplacements suivants : Windows XP : lecteur de démarrage\Documents and
Settings\<utilisateur>\Local Settings\Application
Data\Adobe\Flash CS5\<langue>\Configuration\Commands ; Mac OS® X : Macintosh
HD/Utilisateurs/<nom d’utilisateur>/Bibliothèque/Application
Support/Adobe/Flash CS5/<langue>/Configuration/Commands.
Modification des noms de commandes dans le menu Commandes
1. Sélectionnez Commandes > Gérer les commandes enregistrées.
2. Sélectionnez la commande que vous souhaitez renommer.
3. Cliquez sur le bouton Renommer.
4. Entrez le nouveau nom, puis cliquez sur OK.
Suppression d’un nom du menu Commandes
448
1. Sélectionnez Commande > Gérer les commandes enregistrées et sélectionnez une
commande.
2. Cliquez sur Supprimer, cliquez sur Oui dans la boîte de dialogue d’avertissement, puis
cliquez sur OK.
Haut de la page
Commandes d’exécution
Sélectionnez la commande du menu Commandes pour utiliser une commande
enregistrée.
Pour exécuter une commande JavaScript ou Animate JavaScript, sélectionnez
Commandes > Exécuter la commande, accédez au script à exécuter, puis cliquez sur
Ouvrir.
Haut de la page
Obtention de commandes supplémentaires
Vous pouvez utiliser l’option Obtenir d’autres commandes du menu Commandes pour accéder au site Web
Adobe Add-ons et télécharger des commandes mises à votre disposition par d’autres utilisateurs d’Animate.
Pour plus d’informations sur les commandes disponibles à cette adresse, voir le site Web
d’Animate Exchange.
1. Assurez-vous d’être connecté à Internet.
2. Sélectionnez Commandes > Obtenir d’autres commandes.
Haut de la page
Étapes ne pouvant être enregistrées comme commandes
Certaines tâches ne peuvent pas être enregistrées comme commandes, ni être répétées à l’aide de l’élément
du menu Modifier > Répéter. Ces opérations peuvent être annulées et rétablies, mais il est impossible de les
répéter.
Ainsi, la sélection d’une image et la modification de la taille d’un document ne peuvent ni être enregistrées
comme commandes, ni être répétées. Si vous essayez d’enregistrer une action qui ne peut être répétée
comme commande, elle ne sera pas enregistrée.
Adobe recommande également :
Copie et collage des étapes entre les documents
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
449
Application de motifs avec l’outil Pinceau pulvérisateur
Options de l’outil Pinceau pulvérisateur
L’outil Pinceau pulvérisateur est obsolète dans Animate CC.
Le Pinceau pulvérisateur agit comme un pistolet de particules qui vous permet de « vaporiser » un motif de
formes sur la scène en une seule opération. Par défaut, il mitraille des points de particule à l’aide de la
couleur de remplissage actuellement sélectionnée. Toutefois, vous pouvez utiliser le Pinceau pulvérisateur
pour appliquer un clip ou un symbole graphique sous forme de motif.
1. Sélectionnez l’outil Pinceau pulvérisateur.
2. Dans l’outil Pinceau pulvérisateur, sélectionnez une couleur de remplissage pour les
gouttes par défaut. Ou, cliquez sur Modifier pour sélectionner un symbole personnalisé
dans la Bibliothèque.
Vous pouvez utiliser tout clip ou symbole graphique de la bibliothèque en tant que
« particule ». Ces particules à base de symboles laissent libre court à votre créativité
dans Animate.
3. Cliquez sur la scène à l’endroit où le motif doit apparaître.
Haut de la page
Options de l’outil Pinceau pulvérisateur
Les options de l’outil Pinceau pulvérisateur apparaissent dans l’inspecteur des propriétés lorsque vous
sélectionnez Pinceau pulvérisateur dans le panneau Outils.
Modifier Ouvre la boîte de dialogue Sélectionner un symbole, qui vous permet de choisir le clip ou le
symbole graphique qui servira de motif de particules. Lorsqu’un symbole est sélectionné dans la Bibliothèque,
son nom apparaît à côté du bouton d’édition.
Sélecteur de couleur Permet de choisir la couleur du remplissage des particules pulvérisées par défaut. Le
sélecteur de couleur est désactivé lorsque vous utilisez un symbole de la Bibliothèque comme particule
pulvérisée.
Échelle Cette propriété est disponible uniquement si aucun symbole de la bibliothèque n’est utilisé comme
particule. Mettez à l’échelle le symbole utilisé comme particule pulvérisée. Par exemple, une valeur de 10 %
réduit le symbole de 10 %. Une valeur de 200 % agrandit le symbole de 200 %.
Largeur de l’échelle Cette propriété est disponible uniquement lors de l’utilisation d’un symbole comme
particule. Met à l’échelle la largeur d’un symbole utilisé comme particule pulvérisée. Par exemple, une valeur
de 10 % réduit le symbole de 10 %. Une valeur de 200 % élargit le symbole de 200 %.
Hauteur de l’échelle Cette propriété est disponible uniquement lors de l’utilisation d’un symbole comme
particule. Met à l’échelle la hauteur d’un symbole utilisé comme particule pulvérisée. Par exemple, une valeur
de 10 % raccourcit le symbole de 10 %. Une valeur de 200 % agrandit le symbole de 200 %.
450
Mise à l’échelle aléatoire Spécifie que chaque particule pulvérisée à base de symbole est placée sur la
scène selon une échelle aléatoire, en altérant la taille de chaque particule. Cette option est désactivée
lorsque vous utilisez les points pulvérisés par défaut.
Rotation de symbole Cette propriété est disponible uniquement lors de l’utilisation d’un symbole comme
particule. Fait pivoter la particule pulvérisée à base de symbole autour d’un point central.
Rotation aléatoire Cette propriété est disponible uniquement lors de l’utilisation d’un symbole comme
particule. Spécifie que chaque particule pulvérisée à base de symbole est placée sur la scène selon un degré
aléatoire de rotation. Cette option est désactivée lorsque vous utilisez les points pulvérisés par défaut.
Épaisseur Épaisseur de la particule pulvérisée lorsqu’aucun symbole de la bibliothèque n’est utilisé.
Hauteur Hauteur de la particule pulvérisée lorsqu’aucun symbole de la bibliothèque n’est utilisé.
Angle du pinceau Taux de rotation vers la droite à appliquer à la particule pulvérisée lorsqu’aucun symbole
de la bibliothèque n’est utilisé.
Adobe recommande également :
Création de symboles
Utilisation de la bibliothèque
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
451
Application de modes de fusion
À propos des modes de fusion
Exemples de mode de fusion
Application d’un mode de fusion
Haut de la page
À propos des modes de fusion
Les modes de fusion vous permettent de créer des images composites. La Composition d’images est une
technique consistant à faire varier la transparence ou l’interaction des couleurs de deux ou trois objets qui se
chevauchent. La fusion vous permet de créer des effets uniques en mélangeant les couleurs dans les clips
se chevauchant.
Un mode de fusion contient les éléments suivants :
Couleur de fusion Couleur appliquée au mode de fusion.
Opacité Degré de transparence appliqué au mode de fusion.
Couleur de base Couleur des pixels sous la couleur de fusion.
Couleur obtenue Résultat de l’effet du mélange sur la couleur de base.
Les modes de fusion dépendent à la fois de la couleur de l’objet sur lequel vous appliquez le mélange et de
la couleur sous-jacente. Adobe® vous recommande d’essayer les différents modes de fusion pour obtenir
l’effet souhaité.
Normal Applique normalement une couleur, sans interaction avec les couleurs de base.
Calque Permet d’empiler les clips l’un sur l’autre sans affecter leur couleur.
Obscurcir Remplace uniquement les zones plus claires que la couleur de fusion. Les zones plus foncées
que la couleur de fusion ne changent pas.
Produit Multiplie la couleur de base par la couleur de fusion et crée des couleurs plus foncées.
Éclaircir Remplace uniquement les pixels plus foncés que la couleur de fusion. Les zones plus claires que
la couleur de fusion ne changent pas.
Écran Multiplie l’inverse de la couleur de fusion par la couleur de base, ce qui crée un effet de blanchiment.
Superposition Multiplie ou trame les couleurs, en fonction des couleurs de base.
452
Lumière crue Multiplie ou trame les couleurs, en fonction de la couleur du mode de fusion. L’effet est
similaire à l’éclairage de l’objet par un projecteur.
Différence Soustrait la couleur de dégradé de la couleur de départ ou la couleur de départ de la couleur de
dégradé, selon la couleur ayant une luminosité supérieure. L’effet est analogue à une couleur négative.
Ajout S’utilise couramment pour créer un effet de dissolution animée entre deux images en éclaircissant
progressivement leurs couleurs.
Soustraire S’utilise couramment pour créer un effet de dissolution animée entre deux images en
obscurcissant progressivement leurs couleurs.
Inverser Inverse la couleur de base.
Alpha Applique un masque alpha.
Effacer Supprime tous les pixels de la couleur de base, y compris ceux de l’image d’arrière-plan.
Remarque : Les modes de fusion Effacer et Alpha nécessitent qu’un mode de fusion Calque soit appliqué au
clip parent. Vous ne pouvez pas remplacer le clip d’arrière-plan par Effacer et l’appliquer étant donné que
l’objet serait invisible.
Haut de la page
Exemples de mode de fusion
Les exemples suivants illustrent l’effet de différents modes de fusion sur une image. Soyez conscient que
l’effet obtenu d’un mode de fusion peut être très différent, en fonction de la couleur de l’image sous-jacente
et du type de mode de fusion appliqué.
Calque
Obscurcir
Image d'origine
Éclaircir
Écran
Produit
Lumière crue
Ajout
453
Incrustation
Différence
Inverser
Soustraction
Haut de la page
Application d’un mode de fusion
Vous pouvez utiliser l’inspecteur des propriétés pour appliquer des fusions aux clips sélectionnés.
Remarque : vous ne pouvez pas appliquer plusieurs modes de fusion à des symboles graphiques différents
car les symboles graphiques multiples sont fusionnés en une seule forme lorsque vous publiez le
fichier SWF.
1. Sélectionnez l’occurrence de clip (sur la scène) à laquelle vous souhaitez appliquer un
mode de fusion.
2. Réglez la couleur et la transparence de cette occurrence de clip à l’aide du menu
contextuel Couleur dans le panneau Propriétés.
3. Sélectionnez un mode de fusion pour les clips dans le menu contextuel Mélange de
l’inspecteur des propriétés dans le panneau Propriétés. Le mode de fusion est appliqué à
l’occurrence de clip sélectionnée.
4. Vérifiez que le mode de fusion sélectionné est approprié à l’effet recherché.
Vous devrez peut-être faire des essais avec les paramètres de couleur et de
transparence du clip ainsi qu’avec les différents modes de fusion pour obtenir l’effet
souhaité.
Adobe recommande également :
Modification de la couleur et de la transparence d’une occurrence
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
454
Graphiques 3D
À propos des graphiques 3D dans Animate
Déplacement d’objets dans un espace 3D
Rotation d’objets dans un espace 3D
Réglage de l’angle de perspective
Réglage du point de fuite
Haut de la page
À propos des graphiques 3D dans Animate
Animate CC (anciennement Flash Professional CC) vous permet de créer des effets 3D en déplaçant et en
faisant pivoter des clips dans un espace 3D sur la scène. Animate représente un espace 3D en incluant un
axe z dans les propriétés de chaque occurrence de clip. Pour ajouter des effets de perspective 3D à des
occurrences de clip, déplacez celles-ci le long de leur axe x ou faites-les pivoter autour de leur axe x ou y à
l’aide des outils Translation 3D et Rotation 3D. Dans la terminologie 3D, le déplacement d’un objet dans un
espace 3D est appelé translation et sa rotation est appelée transformation. Dès que vous avez appliqué l’un
de ces effets à un clip, Animate le considère comme un clip 3D et un indicateur des axes coloré apparaît sur
le clip dès qu’il est sélectionné.
Pour qu’un objet semble proche ou éloigné de l’observateur, déplacez-le le long de son axe z avec l’outil
Translation 3D ou l’inspecteur des propriétés. Pour donner l’impression qu’un objet est à un angle par rapport
à l’observateur, faites pivoter le clip autour de son axe z avec l’outil Rotation 3D. L’utilisation combinée de
ces outils vous permet de créer des effets de perspective très réalistes.
Les outils Translation 3D et Rotation 3D vous permettent tous deux de manipuler les objets dans un espace
3D global ou local. L’espace 3D global est l’espace de la scène. Les translations et les transformations
globales se font par rapport à la scène. L’espace 3D local est l’espace du clip. Les translations et les
transformations locales se font par rapport à l’espace du clip. Par exemple si l’un de vos clips contient
plusieurs clips imbriqués, les transformations 3D locales de ces derniers s’effectuent par rapport à la zone de
dessin à l’intérieur du clip conteneur. Le mode par défaut des outils Translation et Rotation 3D est global.
Pour les utiliser en mode local, cliquez sur le bouton bascule Global dans la section Options du panneau
Outils.
L’utilisation des propriétés 3D des occurrences de clip dans votre fichier FLA vous permet de créer un large
éventail d’effets graphiques sans dupliquer les clips dans la bibliothèque. Toutefois, lorsque vous modifiez un
clip de la bibliothèque, les transformations et les translations 3D qui ont été appliquées ne sont pas visibles.
Lorsque vous modifiez le contenu d’un clip, seules les transformations 3D des clips imbriqués sont visibles.
Scène avec un clip qui pivote dans un espace 3D global
455
Scène avec un clip contenant un clip imbriqué qui pivote dans un espace 3D local
Remarque : dès qu’une transformation 3D est ajoutée à l’occurrence d’un clip, le symbole de son clip parent
ne peut plus être modifié en mode Modifier en place.
Si la scène contient des objets 3D, vous pouvez ajouter certains effets 3D à l’ensemble de ces objets en tant
que groupe en ajustant les propriétés Angle de perspective et Point de fuite de votre fichier FLA. La propriété
Angle de perspective introduit un effet de zoom sur la vue de la scène. La propriété Point de fuite donne un
effet panoramique aux objets 3D de la scène. Ces paramètres affectent uniquement l’apparence des clips
auxquels une transformation ou une translation 3D est appliquée.
L’outil de création Animate ne permet de contrôler qu’un seul point de vue ou caméra. La vue caméra de
votre fichier FLA correspond à la vue de la scène. Chaque fichier FLA ne possède qu’un paramètre Angle de
perspective et Point de fuite.
Pour utiliser les capacités 3D d’Animate, les Paramètres de publication de votre fichier FLA doivent être
définis sur Flash Player 10 et ActionScript 3.0. Les rotations et les translations le long de l’axe z ne peuvent
être appliquées qu’aux occurrences de clips. Certaines fonctionnalités 3D disponibles via ActionScript ne sont
pas directement disponibles dans l’interface utilisateur d’Animate ; par exemple, les points de fuite multiples
et les caméras distinctes pour chaque clip. A l’aide d’ActionScript 3.0, vous pouvez appliquer des propriétés
3D aux objets, tels que du texte, des composants FLV Playback et des boutons, en plus des clips.
Remarque : les outils 3D ne fonctionnent pas sur des objets placés sur des calques de masque et les
calques contenant des objets 3D ne peuvent pas être utilisés en tant que calques de masque. Pour plus
d’informations sur les calques de masque, voir Utilisation des calques de masque.
Ressources supplémentaires
Mariko Ogawa a écrit un article détaillé intitulé Exploring the new 3D features in Animate
sur le Pôle de développement Adobe Animate (disponible en anglais uniquement). Cet
article explique comment utiliser les outils 3D et les propriétés d’animation 3D, et
comment travailler en 3D dans ActionScript 3.0.
Haut de la page
Déplacement d’objets dans un espace 3D
Pour déplacer les occurrences de clip dans un espace 3D, vous devez utiliser l’outil Translation 3D .
Lorsque vous sélectionnez un clip avec l’outil, ses trois axes X, Y et Z apparaissent sur la scène au-dessus
de l’objet. L’axe x est rouge, l’axe y est vert et l’axe z est bleu.
Le mode par défaut de l’outil Translation 3D est global. Déplacer un objet dans un espace 3D global revient à
le déplacer par rapport à la scène. Déplacer un objet dans un espace 3D local revient à le déplacer par
456
rapport à son clip parent s’il en a un. Pour faire passer l’outil Translation 3D du mode global au mode local et
inversement, cliquez sur le bouton bascule Global de la section Options du panneau Outils lorsque l’outil
Translation 3D est sélectionné. Vous pouvez basculer temporairement du mode global au mode local en
appuyant sur la touche D tout en effectuant un glissement avec l’outil Translation 3D.
Les outils Translation et Rotation 3D occupent le même espace dans le panneau Outils. Cliquez en
maintenant le bouton enfoncé sur l’icône de l’outil 3D actif dans le panneau Outils pour sélectionner l’outil 3D
actuellement inactif.
Par défaut, les objets sélectionnés auxquels une translation 3D a été appliquée s’affichent avec une
superposition d’axe 3D sur la scène. Vous pouvez désactiver cette superposition dans la section Général des
préférences d’Animate.
Superposition de l’outil Translation 3D
Remarque : si vous modifiez la position de l’axe des z d’un clip 3D, les positions x et y de ce dernier
changent également. Ceci se produit car le mouvement le long de l’axe des z suit les lignes de perspective
invisibles qui rayonnent à partir du point de fuite 3D (défini dans l’inspecteur des propriétés de l’occurrence
du symbole) vers les bords de la scène.
Déplacement d’un seul objet dans un espace 3D
1. Sélectionnez l’outil Translation 3D
G pour le sélectionner).
dans le panneau Outils (ou appuyez sur la touche
2. Définissez l’outil en mode Local ou Global.
Assurez-vous que l’outil est dans le mode désiré en vérifiant le bouton bascule Global de
la section Options du panneau Outils. Cliquez sur le bouton ou appuyez sur la touche D
pour changer de mode.
3. Sélectionnez un clip avec l’outil Translation 3D
.
4. Pour déplacer l’objet en le faisant glisser avec l’outil, déplacez le pointeur sur les
contrôles des axes x, y ou z. Le pointeur se transforme lorsqu’il survole l’un des
contrôles.
Les contrôles des axes x et y sont les pointes des flèches placées sur chaque axe.
Faites glisser l’un de ces contrôles dans le sens de sa flèche pour déplacer l’objet le long
de l’axe sélectionné. Le contrôle de l’axe Z est le point noir placé au centre du clip.
Faites glisser le contrôle z vers le haut ou vers le bas pour déplacer l’objet sur l’axe z.
5. Pour déplacer l’objet avec l’inspecteur des propriétés, entrez une valeur x, y ou z dans la
section Position 3D et Vue de l’inspecteur des propriétés.
Lorsque vous déplacez un objet sur l’axe z, sa taille apparente change. Dans l’inspecteur
des propriétés, la taille apparente s’affiche sous la forme des valeurs Largeur et Hauteur
dans la section Position 3D et Vue. Ces valeurs sont en lecture seule.
Déplacement d’une sélection de plusieurs objets dans un espace 3D
Lorsque vous sélectionnez plusieurs clips, vous pouvez déplacer l’un des objets sélectionnés avec l’outil
457
Translation 3D
pour que les autres se déplacent de la même façon.
Pour déplacer chaque objet du groupe de la même façon qu’en espace 3D global,
définissez l’outil Translation 3D en mode global, puis faites glisser l’un des objets avec les
contrôles de l’axe. Double-cliquez sur l’un des objets sélectionnés tout en maintenant la
touche Maj enfoncée pour déplacer les contrôles de l’axe vers cet objet.
Pour déplacer chaque objet du groupe de la même façon qu’en espace 3D local,
définissez l’outil Translation 3D en mode local, puis faites glisser l’un des objets avec les
contrôles de l’axe. Double-cliquez sur l’un des objets sélectionnés tout en maintenant la
touche Maj enfoncée pour déplacer les contrôles de l’axe vers cet objet.
Vous pouvez également déplacer des contrôles de l’axe vers le centre de la sélection multiple en doublecliquant sur le contrôle de l’axe Z. Double-cliquez sur l’un des objets sélectionnés tout en maintenant la
touche Maj enfoncée pour déplacer les contrôles de l’axe vers cet objet.
Haut de la page
Rotation d’objets dans un espace 3D
Pour faire pivoter des occurrences de clip dans un espace 3D, vous devez utiliser l’outil Rotation 3D
. Un
contrôle de rotation 3D apparaît en haut des objets sélectionnés sur la scène. Le contrôle X est rouge, le
contrôle Y est vert et le contrôle Z est bleu. Utilisez le contrôle de rotation libre orange pour pivoter autour
des axes X et Y simultanément.
Le mode par défaut de l’outil Rotation 3D est global. Faire pivoter un objet dans un espace 3D global revient
à le déplacer par rapport à la scène. Faire pivoter un objet dans un espace 3D local revient à le déplacer par
rapport à son clip parent s’il en a un. Pour faire passer l’outil Rotation 3D du mode global au mode local et
inversement, cliquez sur le bouton bascule Global de la section Options du panneau Outils lorsque l’outil
Rotation 3D est sélectionné. Vous pouvez basculer temporairement du mode global au mode local en
appuyant sur la touche D tout en effectuant un glissement avec l’outil Rotation 3D.
Les outils Translation et Rotation 3D occupent le même espace dans le panneau Outils. Cliquez en
maintenant le bouton enfoncé sur l’icône de l’outil 3D actif dans le panneau Outils pour sélectionner l’outil 3D
actuellement inactif.
Par défaut, les objets sélectionnés auxquels une rotation 3D a été appliquée s’affichent avec une
superposition d’axe 3D sur la scène. Vous pouvez désactiver cette superposition dans la section Général des
préférences d’Animate.
Superposition de l’outil Rotation 3D global
458
Superposition de l’outil Rotation 3D local
Rotation d’un seul objet dans un espace 3D
1. Sélectionnez l’outil Rotation 3D
dans le panneau Outils (ou appuyez sur la touche W).
Assurez-vous que l’outil est dans le mode désiré en vérifiant le bouton bascule Global de
la section Options du panneau Outils. Cliquez sur le bouton ou appuyez sur la touche D
pour passer du mode local au mode global, et vice versa.
2. Sélectionnez un clip sur la scène.
Les contrôles de Rotation 3D se superposent à l’objet sélectionné. Si les contrôles
apparaissent à un autre endroit, double-cliquez sur le point central du contrôle pour le
déplacer vers l’objet sélectionné.
3. Placez le pointeur sur l’un des quatre contrôles d’axe de rotation.
Lorsqu’il survole l’un des contrôles, le pointeur se transforme.
4. Faites glisser l’un des contrôles de l’axe pour effectuer une rotation autour de cet axe, ou
le contrôle de rotation libre (cercle orange extérieur) pour effectuer une rotation X et Y
simultanément.
Faites glisser le contrôle de l’axe x vers la gauche ou vers la droite pour effectuer une
rotation autour de l’axe x. Faites glisser le contrôle de l’axe y vers le haut ou vers le bas
pour effectuer une rotation autour de l’axe y. Faites glisser le contrôle de l’axe z dans un
mouvement circulaire pour effectuer une rotation autour de l’axe z.
5. Pour relocaliser le point central de contrôle de rotation par rapport au clip, faites glisser le
point central. Pour contraindre le mouvement du point central par incréments de 45°,
appuyez sur la touche Maj pendant le glissement.
Déplacer le point central du contrôle de rotation vous permet de contrôler l’effet de
rotation sur l’objet et son apparence. Double-cliquez sur le point central pour le ramener
au centre du clip sélectionné.
L’emplacement du point central de contrôle de rotation de l’objet sélectionné apparaît
dans le panneau Transformer sous forme de propriété Point central 3D. Vous pouvez
modifier l’emplacement du point central dans le panneau Transformer.
Rotation d’une sélection de plusieurs objets dans un espace 3D
1. Sélectionnez l’outil Rotation 3D
dans le panneau Outils (ou appuyez sur la touche W).
Assurez-vous que l’outil est dans le mode désiré en vérifiant le bouton bascule Global de
la section Options du panneau Outils. Cliquez sur le bouton ou appuyez sur la touche D
pour passer du mode local au mode global, et vice versa.
2. Sélectionnez plusieurs clips sur la scène.
Les contrôles de Rotation 3D se superposent au dernier objet sélectionné.
459
3. Placez le pointeur sur l’un des quatre contrôles d’axe de rotation.
Lorsqu’il survole l’un des contrôles, le pointeur se transforme.
4. Faites glisser l’un des contrôles de l’axe pour effectuer une rotation autour de cet axe, ou
le contrôle de rotation libre (cercle orange extérieur) pour effectuer une rotation X et Y
simultanément.
Faites glisser le contrôle de l’axe x vers la gauche ou vers la droite pour effectuer une
rotation autour de l’axe x. Faites glisser le contrôle de l’axe y vers le haut ou vers le bas
pour effectuer une rotation autour de l’axe y. Faites glisser le contrôle de l’axe z dans un
mouvement circulaire pour effectuer une rotation autour de l’axe z.
Tous les clips sélectionnés pivotent autour du point central 3D, qui apparaît au centre
des contrôles de rotation.
5. Pour relocaliser le point central des contrôles de rotation 3D, effectuez l’une des
opérations suivantes :
Pour déplacer le point central vers un emplacement arbitraire, faites glisser ce point
central.
Pour déplacer le point central vers le centre de l’un des clips sélectionnés, doublecliquez sur le clip tout en maintenant la touche Maj enfoncée.
Pour déplacer le point central vers le centre du groupe de clips sélectionnés, doublecliquez sur le point central.
La modification de l’emplacement du point central de rotation 3D vous permet de
contrôler l’effet de la rotation sur les objets.
L’emplacement du point central de contrôle de rotation de l’objet sélectionné apparaît
dans le panneau Transformer sous forme de propriété Point central 3D. Vous pouvez
modifier l’emplacement du point central dans le panneau Transformer.
Rotation d’une sélection avec le panneau Transformer
1. Ouvrez le panneau Transformer (Fenêtre > Transformer).
2. Sélectionnez l’un des clips sur la scène.
3. Dans le panneau Transformer, entrez les valeurs désirées dans les champs Rotation 3D
X, Y et Z pour faire pivoter la sélection. Ces champs contenant du texte réactif, vous
pouvez faire glisser les valeurs pour les modifier.
Remarque : la rotation 3D s’effectue en espace 3D global ou local, selon le mode actif
de l’outil Rotation 3D du panneau Outils.
4. Pour déplacer le point de rotation 3D, entrez les valeurs désirées dans les champs Point
central 3D X, Y et Z.
Haut de la page
Réglage de l’angle de perspective
La propriété d’angle de perspective d’un fichier FLA contrôle l’angle de vue apparent des clips 3D sur la
scène.
L’augmentation ou la réduction de l’angle de perspective affecte la taille apparente des clips 3D et de leur
emplacement par rapport aux bords de la scène. En augmentant l’angle de perspective, les objets 3D
semblent plus proches de l’observateur. La réduction de l’angle de perspective semble éloigner encore
davantage les objets 3D. L’effet ressemble au zoom avant ou arrière d’un objectif d’appareil photo qui modifie
l’angle de vue par le biais de l’objectif.
460
Scène avec un angle de perspective de 55
Scène avec un angle de perspective de 110
La propriété d’angle de perspective affecte tous les clips auxquels une rotation ou une translation 3D est
appliquée. L’angle de perspective n’affecte pas les autres clips. L’angle de perspective par défaut est de 55°,
comme un objectif d’appareil photo normal. La plage de valeurs va de 1° à 180°.
Pour afficher ou définir l’angle de perspective dans l’inspecteur des propriétés, un clip 3D doit être
sélectionné sur la scène. Les changements d’angle de perspective apparaissent immédiatement sur la scène.
L’angle de perspective change automatiquement lorsque vous modifiez la taille de la scène pour que
l’apparence des objets 3D ne change pas. Vous pouvez désactiver ce comportement dans la boîte de
dialogue Propriétés du document.
Pour définir l’angle de perspective :
1. Sur la scène, sélectionnez une occurrence de clip à laquelle une translation ou une
rotation 3D est appliquée.
2. Dans l’inspecteur des propriétés, entrez une nouvelle valeur dans le champ Angle de
perspective ou faite glisser le texte réactif pour modifier la valeur.
Haut de la page
Réglage du point de fuite
La propriété de point de fuite d’un fichier FLA contrôle l’orientation de l’axe z des clips 3D sur la scène. Les
axes z de tous les clips 3D d’un fichier FLA reculent vers le point de fuite. En modifiant l’emplacement du
Point de fuite, vous modifiez le sens de déplacement d’un objet lors d’une translation le long de son axe z.
L’ajustement de la position du Point de fuite vous permet de contrôler précisément l’apparence des objets 3D
461
et de l’animation sur la scène.
Par exemple, si vous placez le point de fuite dans le coin supérieur gauche de la scène (0, 0), le fait
d’augmenter ensuite la valeur de la propriété z d’un clip éloigne ce dernier de l’observateur pour le
rapprocher du coin supérieur gauche de la scène.
Comme le point de fuite affecte tous les clips 3D, sa modification affecte également la position de tous les
clips auxquels une translation d’axe z est appliquée.
Le point de fuite est une propriété de document qui affecte tous les clips auxquels une translation ou une
rotation 3D d’axe z est appliquée. Le point de fuite n’affecte pas les autres clips. Par défaut, il est placé au
centre de la scène.
Pour afficher ou définir le point de fuite dans l’inspecteur des propriétés, un clip 3D doit être sélectionné sur
la scène. Les changements du point de fuite apparaissent immédiatement sur la scène.
Pour définir le point de fuite :
1. Sur la scène, sélectionnez un clip auquel une translation ou une rotation 3D est
appliquée.
2. Dans l’inspecteur des propriétés, entrez une nouvelle valeur dans le champ Point de fuite
ou faites glisser le texte réactif pour modifier la valeur. Des guides indiquant
l’emplacement du Point de fuite apparaissent sur la scène lors du glissement du texte
réactif.
3. Pour ramener le point de fuite au centre de la scène, cliquez sur le bouton Réinitialiser
dans l’inspecteur des propriétés.
Remarque : si vous redimensionnez la scène, le point de fuite n’est pas automatiquement mis à jour. Pour
conserver l’apparence 3D résultant du positionnement spécifique du point de fuite, vous devez repositionner
celui-ci par rapport à la nouvelle taille de la scène.
Adobe recommande également :
Travail en trois dimensions (3D)
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
462
Exportation de sons
A propos de la compression des sons pour l’exportation
Compression audio pour l’exportation
Instructions relatives à l’exportation de sons dans des documents Animate
Haut de la page
A propos de la compression des sons pour l’exportation
Dans Adobe Animate CC (anciennement Flash Professional CC), vous pouvez sélectionner des options de
compression pour des sons d’événement et exporter les sons avec ces paramètres. Vous pouvez également
sélectionner les options de compression pour des sons en flux continu. Tous les sons en flux continu d’une
animation sont cependant exportés dans un seul fichier dont les paramètres correspondent aux paramètres
les plus élevés appliqués aux différents sons en flux continu. Cela inclut les sons en flux continu des objets
vidéo.
Vous pouvez choisir des paramètres de compression globaux pour les sons d’événement ou les sons en flux
continu dans la boîte de dialogue Paramètres de publication. Ces paramètres sont appliqués aux différents
sons d’événement individuels ou à tous les sons en flux continu si vous ne sélectionnez pas de paramètres
de compression relatifs aux sons dans la boîte de dialogue Propriétés audio.
Vous pouvez ignorer les paramètres d’exportation spécifiés dans la boîte de dialogue Paramètres audio en
activant l’option Neutraliser les paramètres audio dans la boîte de dialogue Paramètres de publication. Cette
option est utile si vous souhaitez créer une animation audio haute-fidélité pour une utilisation locale et une
version de qualité moindre pour le web.
La fréquence d’échantillonnage et le degré de compression ont une incidence significative sur la qualité et la
taille des sons des fichiers SWF exportés. Plus un son est compressé et plus sa fréquence d’échantillonnage
est basse, plus la taille et la qualité du son sont faibles. Vous devrez faire des essais pour trouver l’équilibre
optimal entre la qualité du son et la taille du fichier.
Lorsque vous travaillez avec des fichiers MP3 importés, vous pouvez choisir d’exporter les fichiers au format
MP3 en utilisant les mêmes paramètres que ceux utilisés à l’importation.
Remarque : sous Windows, vous pouvez également exporter tous les sons d’une animation au format WAV
à l’aide de la commande Fichier > Exporter > Exporter l’animation.
Haut de la page
Compression audio pour l’exportation
1. Effectuez l’une des opérations suivantes :
Double-cliquez sur l’icône du son dans le panneau Bibliothèque.
Cliquez avec le bouton droit de la souris (Windows) ou avec la touche Contrôle
enfoncée (Macintosh) sur un fichier audio du panneau Bibliothèque et sélectionnez
Propriétés dans le menu contextuel.
Sélectionnez un son dans le panneau Bibliothèque et choisissez Propriétés dans le
menu d’options (coin supérieur droit du panneau).
Sélectionnez un son dans le panneau Bibliothèque, puis cliquez sur le bouton
Propriétés en bas du panneau.
2. Si le fichier audio a été modifié à l’extérieur de l’application, cliquez sur Mettre à jour.
3. Dans la section Compression, choisissez Par défaut, ADPCM, MP3, Brut ou Discours.
463
L’option de compression Par défaut utilise les paramètres de compression globaux
définis dans la boîte de dialogue Paramètres de publication lorsque vous exportez votre
fichier SWF. Si vous sélectionnez l’option Par défaut, aucun autre paramètre
d’exportation n’est disponible.
4. Définissez les paramètres d’exportation.
5. Cliquez sur Tester pour lire le son une fois. Cliquez sur Arrêter pour arrêter le test avant
la fin de la lecture du son.
6. Si nécessaire, réglez les paramètres d’exportation jusqu’à l’obtention de la qualité de son
recherchée, puis cliquez sur OK.
Options de compression ADPCM et Brut
La compression ADPCM définit la compression pour les données audio 8 bits ou 16 bits. Utilisez le
paramètre ADPCM pour exporter des sons d’événement brefs, tels que le clic sur un bouton.
La compression Brut permet d’exporter des sons sans les compresser.
Prétraitement Convertit les sons stéréo mixtes en son mono quand vous choisissez Convertir de stéréo en
mono (les sons en mono ne sont pas affectés par cette option).
Taux d’échantillonnage Contrôle la fidélité du son et la taille du fichier. Plus la fréquence est basse et plus
la taille du fichier diminue, ce qui peut en revanche affecter la qualité du son. Les options de taux
d’échantillonnage sont décrites dans la liste suivante :
Remarque : Animate ne peut pas augmenter le taux en kHz d’un son importé au-delà du taux auquel il a été
importé.
5 kHz correspond à une qualité à peine acceptable pour un discours.
11 kHz correspond à la qualité minimale recommandée pour un segment de musique court et
correspond à un quart du taux standard utilisé pour les CD.
22 kHz correspond au taux généralement utilisé pour la lecture Web et correspond à la moitié du
taux standard utilisé pour les CD.
44 kHz est le taux audio standard utilisé pour les CD.
Bits ADPCM (ADPCM uniquement) Spécifie la profondeur du codage de la compression audio. Plus la
profondeur est élevée, meilleure est la qualité du son.
Options de compression MP3
Compression MP3 Vous permet d’exporter des sons compressés au format MP3. Utilisez MP3 pour
exporter des sons continus et longs, tels que les pistes audio musicales.
Si vous exportez un fichier importé au format MP3, vous pouvez l’exporter en utilisant les mêmes paramètres
que lors de son importation.
Utilisation de la qualité MP3 importée (paramètre par défaut) Désactivez cette option pour sélectionner
d’autres paramètres de compression MP3. Choisissez d’exporter un fichier MP3 importé avec ses paramètres
d’origine.
464
Débit Détermine le nombre de bits par seconde du fichier audio exporté. Animate prend en charge un débit
binaire constant (CBR) de 8 à 160 Kbit/s. Lors de l’exportation de morceaux musicaux, définissez la vitesse
de transmission avec une valeur au moins égale à 16 kbit/s pour obtenir de meilleurs résultats.
Prétraitement Convertit les sons stéréo mixtes en son mono (les sons en mono ne sont pas affectés par
cette option).
Remarque : L’option Prétraitement n’est disponible que si vous sélectionnez un débit binaire égal ou
supérieur à 20 kbit/s.
Qualité Détermine la vitesse de compression et la qualité du son :
Rapide Accélère la compression mais diminue la qualité audio.
Moyenne Ralentit un peu la compression mais permet d’obtenir une meilleure qualité audio.
Supérieure Ralentit au maximum la compression mais permet d’obtenir la meilleure qualité audio.
Option de compression Discours
La compression Discours permet d’exporter les sons à l’aide d’une méthode de compression adaptée aux
discours.
Remarque : Flash Lite 1.0 et Flash Lite 1.1 ne prennent pas en charge l’option de compression Discours.
Pour du contenu destiné à ces versions du lecteur, utilisez la compression MP3, ADPCM ou Brut.
Taux d’échantillonnage Contrôle la fidélité du son et la taille du fichier. Une fréquence basse réduit la taille
du fichier, mais peut également dégrader la qualité du son. Choisissez l’une des options suivantes :
5 kHz est acceptable pour un discours.
11 kHz est recommandé pour un discours.
22 kHz est acceptable pour la plupart des types de musique sur le Web.
44 kHz est le taux audio standard utilisé pour les CD. Cependant, du fait de la compression, le son
n’aura pas la qualité CD dans le fichier SWF.
Haut de la page
Instructions relatives à l’exportation de sons dans des documents
Animate
Il existe, en plus de la fréquence d’échantillonnage et de la compression, différentes façons d’utiliser
efficacement des sons dans un document et de conserver une taille de fichier acceptable:
Définissez les points d’entrée et sortie afin que les plages silencieuses ne soient pas
enregistrées dans le fichier Animate, ce qui permet de réduire la taille des données audio
dans le fichier.
Utilisez au mieux les mêmes sons en appliquant différents effets audio (tels que les
enveloppes de volume, les boucles et les points d’entrée/sortie) à différentes images-clés.
Vous pouvez obtenir divers effets audio à l’aide d’un seul et même fichier.
Lisez les sons courts en boucle pour les musiques d’arrière-plan.
465
Ne créez pas de boucles avec des sons en flux continu.
Lors de l’exportation audio dans des clips incorporés, gardez à l’esprit que la partie audio
est exportée en utilisant les paramètres globaux de flux continu sélectionnés dans la boîte
de dialogue Paramètres de publication.
Utilisez la synchronisation de flux continu pour que l’animation et la piste audio
demeurent synchronisées lorsque vous visualisez l’animation dans l’éditeur. Si votre
ordinateur n’est pas assez rapide pour afficher les images de l’animation de sorte qu’elles
demeurent en phase avec la piste audio, Animate les ignore.
Lors de l’exportation d’animations QuickTime, utilisez autant de sons et de canaux que
vous le souhaitez, sans vous soucier de leur taille. Les sons sont regroupés en une seule
piste lors de l’exportation en fichier QuickTime. Le nombre de sons utilisés n’a aucune
incidence sur la taille finale du fichier.
Adobe recommande également :
Aperçu de la publication
Définition des paramètres de publication des fichiers SWF
Exportation depuis Animate
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
466
Utilisation de bibliothèques dans Animate CC
Utilisation des bibliothèques
Utilisation des éléments de bibliothèque
Haut de la page
Utilisation des bibliothèques
Dans un document Animate, la bibliothèque enregistre les ressources multimédias que vous créez dans
l’environnement de création Animate ou les importe pour les utiliser dans le document. Vous pouvez créer
des illustrations vectorielles ou du texte directement dans Animate, importer des illustrations vectorielles, des
bitmaps, de la vidéo et du son, et créer des symboles. Un symbole est un graphique, un bouton ou un clip
que vous créez en une fois pour l’utiliser à plusieurs reprises. Vous pouvez également utiliser ActionScript
pour ajouter dynamiquement du contenu multimédia à un document.
La bibliothèque contient également les composants que vous avez ajoutés à votre document. Les
composants peuvent être des clips compilés ou des composants basés sur MovieClip.
Vous pouvez ouvrir la bibliothèque d’un document Animate pendant que vous travaillez dans l’application,
pour rendre les éléments de la bibliothèque de ce fichier disponibles pour le document en cours. Vous
pouvez rechercher les symboles de la bibliothèque par leur nom ou leur nom de liaison ActionScript.
Vous pouvez créer des bibliothèques permanentes dans votre application Animate ; elles seront alors
disponibles à chaque lancement de l’application. Animate inclut également plusieurs exemples de
bibliothèques contenant des boutons, des graphiques, des clips et des sons.
Vous pouvez exporter les éléments d’une bibliothèque sous forme de fichier SWF vers une URL afin de créer
une bibliothèque partagée à l’exécution. Cela vous permet de créer un lien vers les ressources de la
bibliothèque à partir de documents Animate qui importent des symboles partagés à l’exécution.
Le panneau Bibliothèque affiche une liste déroulante (Fenêtre > Bibliothèque) contenant le nom de tous les
éléments de la bibliothèque, ce qui vous permet d’afficher et d’organiser ces éléments à mesure que vous
avancez dans votre travail. Une icône placée en regard du nom d’un élément dans le panneau Bibliothèque
indique le type de fichier de cet élément.
Remarque : (Animate CC et versions ultérieures uniquement) Il n’est plus possible de faire glisser des
objets de la scène vers le panneau Bibliothèque pour les convertir en symboles dans Animate CC.
Remarque : (Animate CC et versions ultérieures uniquement) Il n’est plus possible de faire glisser des objets
sur la scène dans deux documents non ancrés dans Animate CC.
Ouverture d’une bibliothèque dans un autre fichier Animate
1. Dans le document en cours, sélectionnez Fichier > Importer >Ouvrir une bibliothèque
externe.
2. Accédez au fichier Animate dont vous souhaitez ouvrir la bibliothèque, puis cliquez sur
Ouvrir.
La bibliothèque du fichier sélectionné s’ouvre dans le document actuel, son nom étant
affiché en haut du panneau Bibliothèque. Pour utiliser des éléments de la bibliothèque du
fichier sélectionné dans le document actuel, faites glisser les éléments vers la
bibliothèque du document actuel ou vers la scène.
467
Redimensionnement du panneau Bibliothèque
Effectuez l’une des opérations suivantes :
Faites glisser le coin inférieur droit du panneau.
Cliquez sur le bouton d’affichage étendu pour agrandir le panneau Bibliothèque et
afficher toutes les colonnes.
Cliquez sur le bouton d’affichage réduit pour réduire la largeur du panneau
Bibliothèque.
Modification de la largeur des colonnes
Placez le pointeur entre les en-têtes de colonnes et faites-le glisser pour les
redimensionner.
Utilisation de dossiers dans le panneau Bibliothèque
Vous pouvez organiser les éléments du panneau Bibliothèque à l’aide de dossiers. Lorsque vous créez un
symbole, ce dernier est enregistré dans le dossier sélectionné. Si aucun dossier n’est sélectionné, le symbole
est enregistré à la racine de la bibliothèque.
Animate importe également les fichiers GIF animés de manière organisée en les plaçant dans un dossier
séparé sous le dossier racine de la bibliothèque et en nommant tous les bitmaps associés selon leur
séquence.
Création d’un dossier
Cliquez sur le bouton Nouveau dossier
en bas du panneau Bibliothèque.
Ouverture ou fermeture d’un dossier
Double-cliquez sur le dossier ou bien sélectionnez le dossier et choisissez Développer le
dossier ou Réduire le dossier dans le menu Panneau du panneau Bibliothèque.
Ouverture ou fermeture de tous les dossiers
Choisissez Développer tous les dossiers ou Réduire tous les dossiers dans le menu
Panneau du panneau Bibliothèque.
Déplacement d’un élément d’un dossier à un autre
Faites glisser l’élément d’un dossier vers un autre.
Si un élément portant le même nom existe au nouvel emplacement, Animate vous
demande si vous souhaitez le remplacer par celui que vous déplacez.
Tri des éléments du panneau Bibliothèque
Pour chaque élément, les colonnes du panneau Bibliothèque indiquent le nom, le type, le nombre
d’utilisations dans le fichier, l’état et l’identifiant de liaison (si l’élément est associé à une bibliothèque
partagée ou est exporté pour ActionScript), ainsi que la date à laquelle il a été modifié pour la dernière fois.
Vous pouvez trier les éléments du panneau Bibliothèque dans l’ordre alphanumérique selon n’importe quelle
colonne. Les éléments sont triés à l’intérieur des dossiers.
La bibliothèque Animate range les fichiers GIF animés importés dans un dossier distinct sous le dossier
racine de la bibliothèque et nomme tous les bitmaps associés selon leur séquence.
468
Cliquez sur l’en-tête de colonne pour effectuer le tri selon cette colonne. Cliquez sur le
triangle du bord droit de l’en-tête des colonnes pour inverser l’ordre de tri.
Conflits entre actifs de bibliothèque
Si vous importez ou copiez un actif de bibliothèque dans un document contenant un élément différent mais
portant le même nom, vous avez le choix entre remplacer ou non l’ancien élément par le nouveau. Cette
option est disponible pour toutes les méthodes d’importation ou de copie des actifs de bibliothèque.
La boîte de dialogue Résoudre les conflits de bibliothèque apparaît lorsque vous essayez de placer des
éléments qui entrent en conflit avec des éléments existants d’un document. Un conflit est créé lorsque vous
copiez un élément du document source qui existe déjà dans le document de destination et que ces deux
éléments ont des dates de modification différentes. Pour contourner les problèmes de conflits de noms,
organisez vos éléments à l’intérieur de dossiers dans la bibliothèque de votre document. Cette boîte de
dialogue apparaît également lorsque vous collez un symbole ou un composant sur la scène de votre
document et que celle-ci contient déjà une copie de ce symbole ou de ce composant dont la date de
modification est différente.
Si vous décidez de ne pas remplacer les éléments existants, Animate essaie de les utiliser à la place des
éléments que vous collez et qui créent le conflit. Par exemple, si vous copiez un symbole nommé Symbole 1
et le collez sur la scène d’un document contenant déjà un symbole nommé Symbole 1, Animate crée
automatiquement une occurrence du Symbole 1 existant.
Si vous décidez de remplacer les éléments existants, Animate les remplace automatiquement (ainsi que
toutes leurs occurrences) par les nouveaux éléments du même nom. Si vous annulez la procédure
d’importation ou de copie, celle-ci est annulée pour tous les éléments (pas seulement ceux qui créent un
conflit dans le document de destination).
Seuls les mêmes types d’actifs de bibliothèque peuvent se remplacer mutuellement, c’est-à-dire que vous ne
pouvez pas remplacer un son nommé Test par un bitmap du même nom. Dans ces genres de situations, les
nouveaux éléments sont ajoutés à la bibliothèque avec le mot Copie en appendice.
Remarque : le remplacement de ressources de bibliothèque effectué de cette façon n’est pas réversible.
Veillez à enregistrer une copie de sauvegarde de votre fichier FLA avant de vous lancer dans des
procédures complexes de collage entraînant le remplacement d’éléments de bibliothèque conflictuels.
Si la boîte de dialogue Résoudre les conflits de bibliothèque apparaît lorsque vous importez ou copiez des
actifs de bibliothèque dans un document, vous pouvez résoudre le conflit de noms.
Résolution des conflits entre éléments de la bibliothèque
Dans la boîte de dialogue Résoudre les conflits de bibliothèque, utilisez l’une des
méthodes suivantes :
Cliquez sur Ne pas remplacer les éléments existants afin de conserver les éléments
existants du document de destination.
Cliquez sur Remplacer les éléments existants pour remplacer les éléments existants
et leurs occurrences par les nouveaux éléments portant le même nom.
Haut de la page
Utilisation des éléments de bibliothèque
Lorsque vous sélectionnez un élément dans le panneau Bibliothèque, vous en obtenez un aperçu dans une
vignette qui s’affiche dans la partie supérieure du panneau. Si l’élément sélectionné est animé ou s’il s’agit
d’un fichier audio, le bouton Lire de la fenêtre d’aperçu de la bibliothèque ou le contrôleur vous permet d’en
afficher l’aperçu.
Recherche d’éléments de bibliothèque par nom de liaison
469
Vous pouvez rechercher dans le panneau de recherche de la bibliothèque les symboles par leur nom ou leur
nom de liaison ActionScript.
Pour rechercher un élément de bibliothèque, saisissez les premières lettres du nom de
symbole ou du nom de liaison ActionScript de l’élément de bibliothèque. A mesure que
vous tapez, la liste des symboles correspondants s’affiche dans le panneau Bibliothèque.
Sélection d’un élément de la bibliothèque dans le document actif.
Faites glisser l’élément du panneau Bibliothèque vers la scène.
L’élément est ajouté au calque actif.
Conversion d’un objet sur la scène à un symbole de la bibliothèque
Sélectionnez l’objet sur la scène, cliquez dessus avec le bouton droit de la souris, puis
choisissez Convertir en symbole.
Utilisation d’un élément de bibliothèque du document en cours dans un
autre document
Faites glisser l’élément de la bibliothèque ou de la scène dans la bibliothèque ou dans la
scène d’un autre document.
Copie des éléments de la bibliothèque à partir d’un autre document
1. Sélectionnez le document contenant les éléments de bibliothèque voulus.
2. Sélectionnez les éléments de la bibliothèque dans le panneau Bibliothèque.
3. Choisissez Modifier > Copier.
4. Sélectionnez le document dans lequel vous voulez coller l’objet.
5. Sélectionnez le panneau Bibliothèque de ce document.
6. Choisissez Modifier> Coller.
Modification d’un élément de bibliothèque
1. Sélectionnez l’élément dans le panneau Bibliothèque.
2. Sélectionnez l’une des options suivantes dans le menu Panneau du panneau
Bibliothèque :
Sélectionnez Modifier pour modifier un élément dans Animate.
Sélectionnez Modifier avec et choisissez une application pour modifier l’élément dans
une application externe.
Remarque : si vous ouvrez un éditeur externe pris en charge, Animate ouvre le document importé d’origine.
Changement de nom d’un élément de bibliothèque
La modification du nom d’un élément de la bibliothèque d’un fichier importé n’entraîne pas le changement du
nom du fichier.
470
1. Effectuez l’une des opérations suivantes :
Double-cliquez sur le nom de l’élément.
Sélectionnez l’élément et choisissez Renommer dans le menu Panneau du panneau
Bibliothèque.
Cliquez avec le bouton droit de la souris (Windows) ou appuyez sur la touche
Contrôle (Macintosh) sur l’élément, puis sélectionnez Renommer dans le menu
contextuel.
2. Saisissez le nouveau nom dans le champ correspondant.
Suppression d’un élément de bibliothèque
Lorsque vous supprimez un élément de la bibliothèque, toutes ses occurrences dans le document sont
également supprimées.
Sélectionnez l’élément, puis cliquez sur l’icône Corbeille en bas du panneau Bibliothèque.
Recherche d’éléments inutilisés de la bibliothèque
Vous pouvez faciliter l’organisation de votre document en recherchant les éléments inutilisés de la
bibliothèque pour les supprimer
Remarque : il n’est pas nécessaire de supprimer les éléments inutilisés de la bibliothèque Animate pour
réduire la taille du fichier d’un document, ces éléments n’étant pas inclus dans le fichier SWF. Cependant, les
éléments liés pour l’exportation sont inclus dans le fichier SWF.
Effectuez l’une des opérations suivantes :
Choisissez Sélectionner les éléments inutilisés dans le menu Panneau du panneau
Bibliothèque.
Triez les éléments de la bibliothèque sur la colonne Compte des utilisations qui
indique si un élément est en cours d’utilisation.
Mise à jour des fichiers importés dans la bibliothèque
Si vous utilisez un éditeur externe pour modifier des fichiers importés dans Animate, tels que des bitmaps ou
des sons, vous pouvez mettre ces fichiers à jour dans Animate sans les réimporter. Vous pouvez également
mettre à jour les symboles que vous avez importés à partir de documents Animate externes. Lorsque vous
mettez à jour un fichier importé, vous remplacez son contenu par celui du fichier externe.
Remarque : Les fichiers GIF animés importés sont placés dans un dossier distinct sous le dossier racine de
la bibliothèque avec tous les bitmaps associés nommés d’après leur séquence.
1. Sélectionnez le fichier importé dans le panneau Bibliothèque.
2. Sélectionnez Mettre à jour dans le menu Panneau du panneau Bibliothèque.
Copie des éléments de bibliothèque entre les documents
Vous pouvez copier les éléments de bibliothèque d’un document source dans un document de destination de
plusieurs façons. Vous pouvez également partager les symboles entre les documents en tant qu’actifs de
bibliothèque partagés pendant la création ou à l’exécution.
Si vous essayez de copier des éléments ayant le même nom que des éléments du document de destination,
471
la boîte de dialogue Résoudre les conflits de bibliothèque vous permet d’indiquer si vous souhaitez que les
éléments existants soient écrasés ou qu’ils soient conservés (les nouveaux éléments sont alors ajoutés avec
d’autres noms que vous spécifiez). Vous pouvez organiser les éléments de la bibliothèque dans des dossiers
de manière à minimiser les conflits lorsque vous les copiez entre les documents.
Copie des éléments d’une bibliothèque par copier-coller
1. Sélectionnez l’élément sur la scène du document source.
2. Choisissez Modifier > Copier.
3. Définissez le document de destination en tant que document actif.
4. Placez le pointeur sur la scène et choisissez Modifier > Coller au milieu pour coller l’actif
au centre de la zone de travail visible. Choisissez Modifier > Coller en place pour placer
l’actif au même emplacement que dans le document source.
Copie d’un actif de bibliothèque par glissement
Le document de destination étant ouvert, sélectionnez l’actif dans le panneau
Bibliothèque du document source et faites-le glisser vers le panneau du document de
destination.
Copie d’un actif de bibliothèque en ouvrant la bibliothèque du document source dans le document de
destination
1. Le document de destination étant ouvert, sélectionnez Fichier > Importer > Ouvrir une
bibliothèque externe.
2. Sélectionnez le document source, puis cliquez sur Ouvrir.
3. Faites glisser l’élément de la bibliothèque du document source sur la scène ou dans la
bibliothèque du document de destination.
Adobe recommande également :
Utilisation du texte TLF (Text Layout Framework)
Utilisation d’illustrations importées
Son
Symboles, instances et éléments de bibliothèque
Création de boutons
Partage des ressources de bibliothèque
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
472
Incorporation de polices pour assurer la cohérence de l’apparence
du texte
Lorsque vous lisez vos fichiers SWF publiés sur des ordinateurs connectés à Internet, il est possible que les
polices que vous avez utilisées ne soient pas disponibles sur ces ordinateurs. Pour vous assurer que votre
texte conserve l’apparence que vous lui avez donnée, vous pouvez incorporer des polices complètes ou
uniquement certains jeux de caractères. Lorsque vous incorporez des caractères dans votre fichier SWF
publié, la police est automatiquement disponible dans le fichier SWF, quel que soit l’ordinateur sur lequel
vous lisez le fichier. Une fois la police incorporée, vous pouvez l’utiliser partout dans votre fichier SWF publié.
Animate incorpore automatiquement tous les caractères utilisés par les objets de texte qui contiennent du
texte. En créant vous-même un symbole de police incorporée, vous donnez à vos objets de texte la
possibilité d’utiliser des caractères supplémentaires. C’est notamment le cas lors de la prise en charge de la
saisie utilisateur à l’exécution ou lors de la modification de texte avec ActionScript. Les polices incorporées ne
sont pas nécessaires lorsque la propriété d’anticrénelage des objets de texte est définie sur Utiliser les
polices de périphérique. Spécifiez les polices que vous souhaitez incorporer dans votre fichier FLA ; Animate
les incorpore lors de la publication d’un fichier SWF.
Vous devez assurer la cohérence de l’apparence du texte (en incorporant des polices dans un fichier SWF)
dans les cas suivants :
Lors de la création d’objets de texte dans votre fichier FLA qui font partie d’une
conception nécessitant une apparence de texte cohérente.
Lors de l'utilisation d'une option d'anticrénelage autre que Utiliser les polices de
périphérique, vous devez incorporer les polices, auquel cas le texte risque de disparaître
ou de ne pas s'afficher correctement.
Lors de la création dynamique de texte avec ActionScript dans votre fichier FLA.
Lors de la création de texte dynamique avec ActionScript, vous devez spécifier dans
ActionScript la police que vous souhaitez utiliser.
Lorsque votre fichier SWF contient des objets de texte pouvant être chargés par un autre
fichier SWF qui n’a pas incorporé les polices requises.
La boîte de dialogue Incorporation de polices permet d’effectuer les opérations suivantes :
Gérer toutes les polices incorporées dans un seul emplacement.
Créer des symboles de police pour chaque police incorporée.
Sélectionner des plages personnalisées de caractères incorporés pour une police, ainsi
que des plages prédéfinies.
Utiliser du texte TLF (Text Layout Framework) ou du texte classique au sein d’un même
fichier et utiliser les polices incorporées avec chacun d’eux. Notez que le texte TLF n’est
pas disponible dans Animate CC. Pour plus d’informations, voir Ouverture d’un fichier
CS6 à l’aide d’Animate CC.
Pour incorporer des caractères à partir d’une police dans un fichier SWF :
1. Ouvrez votre fichier FLA dans Animate, puis ouvrez la boîte de dialogue Incorporation de
polices en procédant de l’une des manières suivantes :
Choisissez Texte > Incorporation de polices.
Dans le menu d’options du panneau Bibliothèque, choisissez Ajouter une police.
473
Cliquez avec le bouton droit de la souris dans un espace vide de l’arborescence du
panneau Bibliothèque, puis choisissez Nouvelle police.
Dans l’inspecteur des propriétés de texte, cliquez sur le bouton Incorporer.
2. Si votre police n’est pas déjà sélectionnée dans la boîte de dialogue Incorporation de
polices, cliquez sur le bouton Ajouter (+) pour ajouter une nouvelle police incorporée à
votre fichier FLA.
Lorsque vous ouvrez la boîte de dialogue Incorporation de polices à partir du panneau
Bibliothèque ou de l’inspecteur des propriétés de texte, une option de police s’affiche
automatiquement dans la boîte de dialogue.
3. Dans l’onglet Options, sélectionnez la famille et le style de la police que vous souhaitez
incorporer.
Si vous avez ouvert la boîte de dialogue Incorporation de polices depuis l’inspecteur des
propriétés de texte ou depuis le panneau Bibliothèque, la police utilisée par la sélection
actuelle s’affiche automatiquement dans la boîte de dialogue.
4. Dans la section Plages de caractères, sélectionnez les plages de caractères que vous
souhaitez incorporer. Plus vous incorporez de caractères, plus vos fichiers SWF publiés
seront volumineux.
5. Si vous souhaitez incorporer des caractères spécifiques, saisissez-les dans le champ
« Inclure également les caractères suivants ».
6. Pour pouvoir accéder au symbole de police incorporée via le code ActionScript,
sélectionnez Exporter pour ActionScript dans l’onglet ActionScript.
7. Si vous avez sélectionné Exporter pour ActionScript, vous devez sélectionner également
un format de contour. Pour les conteneurs de texte TLF, sélectionnez TLF (DF4) comme
format de contour. Pour les conteneurs de texte classique, sélectionnez Classique (DF3).
Vous devez créer des symboles de police incorporée distincts pour les conteneurs de
texte TLF et les conteneurs de texte classique. Le format de contour TLF (DF4) n’est pas
disponible pour les polices PostScript Type 1. TLF (DF4) requiert Flash Player 10 ou une
version ultérieure.
8. Si vous souhaitez utiliser le symbole de police comme actif partagé, sélectionnez les
options de la section Partage de l’onglet ActionScript. Pour plus d’informations sur
l’utilisation des actifs partagés, voir Partage d’actifs de bibliothèque entre des fichiers.
Pour modifier les paramètres d’un symbole de police incorporée :
1. Effectuez l’une des opérations suivantes :
Cliquez avec le bouton droit de la souris sur le symbole dans la bibliothèque, puis
choisissez Propriétés.
Sélectionnez un conteneur de texte sur la scène, puis cliquez sur le bouton
Incorporer dans la section Caractère de l’inspecteur des propriétés.
Sélectionnez le symbole de police dans la bibliothèque, puis choisissez Modifier les
propriétés dans le menu d’options du panneau.
Cliquez deux fois sur l’icône du symbole de police dans la bibliothèque.
Choisissez Texte > Incorporation de polices, puis sélectionnez le symbole de
bibliothèque que vous souhaitez modifier dans l’arborescence située à gauche de la
boîte de dialogue.
2. Effectuez les modifications dans la boîte de dialogue Incorporation de polices, puis
cliquez sur OK.
L’arborescence de la boîte de dialogue Incorporation de polices affiche tous les symboles de police du fichier
FLA actuel, organisées par famille de police. Vous pouvez modifier certaines polices ou toutes les polices
lorsque cette boîte de dialogue est ouverte ; les modifications sont appliquées lorsque vous cliquez sur le
bouton OK.
474
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
475
Préférences de dessin
Paramètres de dessin
Options de contact des outils Sélection, Sous-sélection et Lasso
Vous pouvez définir les paramètres de dessin de manière à spécifier le comportement de l’accrochage, du
lissage et du redressement. Vous pouvez modifier le paramètre Tolérance pour chaque option et l’activer ou
le désactiver. Les paramètres de tolérance sont relatifs et dépendent de la résolution de l’écran de votre
ordinateur et du facteur de zoom actuel de la séquence. Par défaut, chaque option est activée et définie sur
la tolérance normale.
Haut de la page
Paramètres de dessin
1. Sélectionnez Modifier > Préférences (Windows) ou Animate > Préférences (Macintosh),
puis cliquez sur Dessin.
2. Sous la catégorie Dessin, sélectionnez l’une des options suivantes :
Plume, outil Permet de définir les options de l’outil Plume. Sélectionnez Afficher
l’aperçu de plume pour afficher un aperçu de la ligne reliant le dernier point sur lequel
vous avez cliqué et l’emplacement actuel du pointeur. Sélectionnez Afficher les points
pleins pour afficher les points de contrôle sous forme de petits carrés remplis plutôt que
sous forme de carrés vides. Sélectionnez Afficher des curseurs précis pour qu’un curseur
en croix remplace l’icône de l’outil Plume lorsque vous utilisez cet outil. Cette option vous
permet de voir plus facilement la cible exacte des clics.
Joindre les lignes Détermine la distance à laquelle l’extrémité d’une ligne doit se
trouver par rapport à un segment existant pour que celle-ci soit accrochée au point le
plus proche de l’autre ligne. Ce paramètre contrôle également la reconnaissance des
lignes verticales et horizontales, le degré de rapprochement avec l’horizontale ou la
verticale que doit avoir une ligne que vous dessinez pour qu’Animate la rende
parfaitement horizontale ou verticale. Lorsque l’option Accrocher aux objets est activée,
ce paramètre contrôle la distance à laquelle doivent se trouver les objets les uns des
autres pour être accrochés entre eux.
Lisser les courbes Indique le degré de lissage appliqué aux courbes dessinées avec
l’outil Crayon lorsque le mode de dessin est défini sur Redresser ou Lisser. Les courbes
plus lisses sont plus faciles à remodeler, alors que les courbes plus irrégulières sont plus
fidèles aux traits d’origine.
Remarque : Vous pouvez accentuer le lissage des segments incurvés existants en
sélectionnant Modification > Forme > Lisser et Modification > Forme > Optimiser.
Reconnaître les lignes Définit le degré de rapprochement avec une ligne droite que
doit avoir un segment que vous dessinez avec l’outil Crayon pour qu’Animate le
reconnaisse en tant que tel et le rende parfaitement droit. Si l’option Reconnaître les
lignes est désactivée lorsque vous dessinez, vous pourrez redresser les lignes
ultérieurement en sélectionnant un ou plusieurs segments de ligne et en choisissant
Modification >Forme > Redresser.
476
Reconnaître les formes Contrôle la précision avec laquelle vous devez dessiner des
cercles, des ovales, des carrés, des rectangles et des arcs de 90° et 180° pour qu’ils
soient reconnus comme des formes géométriques et redessinés avec précision. Les
options disponibles sont : Désactivé(e), Précis, Normal et Approximatif. L’option
« Précis » exige que la forme dessinée soit très proche d’une ligne droite ;
« Approximatif » indique que la forme peut être quelque peu irrégulière et qu’Animate la
redessine. Si l’option Reconnaître les formes est désactivée lorsque vous dessinez, vous
pourrez redresser les lignes ultérieurement en sélectionnant une ou plusieurs formes (par
exemple, des segments de ligne connectés) et en choisissant Modification > Forme >
Redresser.
Précision du clic Indique la distance à laquelle un élément doit se trouver du pointeur
pour qu’Animate reconnaisse cet élément.
Haut de la page
Options de contact des outils Sélection, Sous-sélection et Lasso
Lorsque vous créez des formes à l’aide du mode objet, vous pouvez spécifier les options de sensibilité au
contact des outils Sélection, Sous-sélection et Lasso. Par défaut, les objets sont uniquement sélectionnés
lorsque le cadre de sélection rectangulaire de l’outil inclut entièrement l’objet. Si vous décochez cette option,
vous pouvez sélectionner des objets entiers lorsqu’ils sont partiellement inclus dans le cadre de sélection des
outils Sélection, Sous-sélection ou Lasso uniquement.
1. Sélectionnez Édition > Préférences (Windows) ou Animate > Préférences (Macintosh).
2. Dans la catégorie Général, effectuez l’une des opérations suivantes :
Décochez l’option Activer au contact outils Sélection et Lasso si vous souhaitez
uniquement sélectionner les objets et les points entièrement inclus dans le cadre de
sélection. Les points qui se trouvent au-delà de la zone de sélection seront toujours
sélectionnés.
Cochez l’option Activer au contact outils Sélection et Lasso si vous souhaitez
uniquement sélectionner les objets et les points partiellement inclus dans le cadre de
sélection.
Remarque : Les outils Sous-sélection utilisent le même paramètre Activer au contact.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.
Mentions légales | Politique de confidentialité en ligne
477
Mise à l’échelle et mise en cache des symboles
Mise à l’échelle du contenu sur la scène
À propos de la mise à l’échelle à 9 découpes et des symboles de clip
Modification de symboles de clip à l’aide de la mise à l’échelle à 9 découpes
Amélioration des performances de rendu grâce à la mise en cache sous forme de
bitmap
Définition de la mise en cache sous forme de bitmap d’une occurrence de symbole
Définition d’une couleur d’arrière-plan pour une occurrence de symbole mise en cache
uniquement
Haut de la page
Mise à l’échelle du contenu sur la scène
Vous pouvez mettre à l'échelle les éléments sur la scène en procédant de l'une des façons suivantes :
Mettez à l'échelle les occurrences de symbole individuelles à l'aide de l'outil
Transformation libre, du panneau Propriétés ou du panneau Transformer.
Mettez à l'échelle les occurrences de symbole individuelles à l'aide de la fonction de mise
à l'échelle à 9 découpes, et avec les outils et panneaux cités ci-dessus.
Mettez à l’échelle tout le contenu de la scène lors du redimensionnement de la scène.
Mise à l'échelle d'une occurrence de symbole individuelle
1. Sélectionnez l’occurrence de symbole sur la scène.
2. Effectuez l’une des opérations suivantes :
Sélectionnez l'outil Transformation libre dans le panneau Outils, puis faites glisser les
coins ou les bords de l'occurrence pour la redimensionner.
Ouvrez le panneau Propriétés (Fenêtre > Propriétés) et modifiez les propriétés
Hauteur et Largeur de l'occurrence.
Ouvrez le panneau Transformer (Fenêtre > Transformer) et modifiez les propriétés
Largeur de l'échelle et Hauteur de l'échelle de l'occurrence.
Mise à l’échelle de tout le contenu lors du redimensionnement de la scène
1. Choisissez Modification > Document.
2. Dans la boîte de dialogue Paramètres du document, entrez de nouvelles valeurs dans
les champs Dimensions (largeur) et (hauteur). Il s'agit de la taille de la scène.
3. Activez l'option Mettre à l'échelle le contenu avec la scène. Cliquez sur OK.
La mise à l'échelle s'applique à tout le contenu de toutes les images.
478
Tutoriels et vidéos
Haut de la page
À propos de la mise à l’échelle à 9 découpes et des symboles de
clip
Vous pouvez utiliser la mise à l’échelle à 9 découpes pour spécifier l’échelle de style composant les clips.
Avec la mise à l’échelle à 9 découpes, vous pouvez vous assurer que le clip aura un aspect approprié lors de
son redimensionnement. Avec la mise à l’échelle normale, Animate redimensionne uniformément tous les
éléments d’un clip, à la fois dans les dimensions horizontale et verticale. Pour de nombreux clips, ce
redimensionnement égal peut donner au graphisme un aspect étrange, plus particulièrement dans les angles
et les bords de clips rectangulaires. Cette situation survient le plus souvent avec des clips utilisés comme
éléments de l’interface utilisateur, tels que des boutons.
Le clip est alors divisé de façon visuelle en neuf sections, sur le modèle d’une grille, et chacune de ces neuf
zones est mise à l’échelle indépendamment des autres. Pour préserver l’intégrité visuelle du clip, les angles
ne s">