Utilisation des panneaux de création Animate

Dernière mise à jour le 24 mai 2023

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 contextuels d’Animate à un emplacement donné de l’écran. Si vous le verrouillez, le panneau ne se déplace pas lorsque vous le faites glisser par inadvertance pendant que vous travaillez. 

Panneaux Animate avec l’option de verrouillage
Panneaux Animate avec l’option de verrouillage

Présentation de l’inspecteur des propriétés

L’inspecteur des propriétés facilite l’accès aux attributs les 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 d’un objet dans l’inspecteur des propriétés sans avoir à accéder aux menus ou aux panneaux qui déterminent ces attributs.

En fonction de la sélection, l’inspecteur des propriétés affiche les informations et les paramètres du document, du texte, du symbole, de la forme, du bitmap, de la vidéo, du groupe, de l’image ou de l’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 sur Commande+F3 (Macintosh).

La version Animate 2020 offre un inspecteur des propriétés modernisé comprenant quatre onglets, Outils, Objets, Image et Document.  Chaque onglet correspond aux propriétés de la sélection actuelle. 

Outil -  Indique l’outil actuellement sélectionné. Si un outil ne comporte pas d’inspecteur des propriétés valide, l’inspecteur des propriétés Doc s’affiche et l’onglet Inspecteur de propriété Outil est désactivé. Cet onglet fait référence aux propriétés de l'outil actuellement sélectionné.

Objet - Indique l’objet actuel sélectionné sur la scène. Si aucun objet n'est sélectionné, cet onglet est désactivé. Cet onglet fait référence aux propriétés de l'objet actuellement sélectionné.

Image - Indique l’image actuelle sélectionnée dans le scénario. Si aucune image n'est sélectionnée, cet onglet est désactivé. Cet onglet fait référence aux propriétés de l’image actuellement sélectionnée.

Document - Indique le document actuel sur lequel vous travaillez. Cet onglet décrit les propriétés spécifiques au document actuellement ouvert.

IP de document
Inspecteur de propriété de document

Inspecteur de propriété d'outil
Inspecteur de propriété d'outil

IP d’image
Inspecteur de propriété d’image

IP d’objet
Inspecteur de propriété d'objet

Propriétés supplémentaires du panneau Propriétés

Pince
Sections pouvant glisser

Sections pouvant glisser

Les sections de l'inspecteur des propriétés peuvent à présent glisser et être réarrangées. Une pince s’affiche lorsque la souris survole une section pouvant glisser.

Section Action rapide
Section Action rapide

Barre d’outils d’action rapide

Le panneau Propriété dispose d'une nouvelle section Action rapide et d'une section d'en-tête actualisée pour permettre de découvrir les modes et les fonctionnalités connexes et d’y accéder rapidement.

Section d'en-tête actualisée
Section d’en-tête actualisée pour Bitmap

Paramètres de filtre modernisés
Paramètres de filtre modernisés

Paramètres de filtre modernisés

La section Filtre a été mise à niveau pour faciliter l'application de combinaisons de filtres. En outre, l'ordre des filtres peut être modifié en faisant glisser un filtre au-dessus ou au-dessous des autres filtres.  

Couleur et style
Couleur et style

Section Remplissage et trait modernisée

  • La section Remplissage et trait s’appelle à présent Couleur et style. 
  • L'option Alpha pour les couleurs de remplissage et de trait s’ajoute immédiatement pour une accessibilité facile.
  • Pour une expérience harmonieuse, les options relativement moins utilisées dans les paramètres Trait ont été déplacées vers l'icône Ellipse pour les options Profil de style et Profil de largeur. Cliquez sur l'icône Ellipse pour sélectionner ces options.
  • Les options Extrémité et Joints sont accessibles immédiatement.
  • L'option Trait et/ou l’option Remplissage s’affiche en fonction de la partie de l'objet qui est sélectionnée. 

Option Supprimer l’interpolation

Supprimer l’interpolation
Supprimer l’interpolation

La section Interpolation offre maintenant la possibilité de supprimer l’interpolation dans l’inspecteur de propriété.

Option Faire correspondre le contenu 

Option Correspondance du contenu
Option Correspondance du contenu

L'option Ajuster au contenu est maintenant disponible en un seul clic dans la section de réglage de documents.

API de l’outil Caméra mise à jour

Options de caméra mises à jour
Options de caméra mises à jour

La caméra dispose désormais de tous les effets et filtres de couleur.

Mise à jour des propriétés des outils Polyétoile, Rectangle, Ovale, Texte et Baguette magique

Le panneau de l'inspecteur des propriétés a été modernisé pour les outils PolyEtoile, Rectangle, Ovale, Texte et Baguette magique afin de favoriser l'accessibilité et l’expérience harmonieuse de l’utilisateur.

PolyEtoile
Polystar

Texte statique
Texte statique

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. Vous pouvez également stocker des 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. Il permet également 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. Vous pouvez également définir des propriétés pour la plupart des sélections d’objets multiples.

Panneau Bibliothèque avec un clip audio sélectionné
Panneau Bibliothèque avec un clip audio sélectionné

Présentation du panneau Actions

Le panneau Actions vous permet de créer et de modifier des éléments code ActionScript pour un objet ou un bloc. Sélection d’une image, d’un bouton, ou l’occurrence de clip active le panneau Actions. Actions Les titres du panneau changent en Actions de bouton, Actions de clip ou Image Actions, selon ce qui est sélectionné.

Panneau Actions montrant une action stop() dans une image.
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. Pour plus d’informations sur le panneau Actions, voir Présentation du panneau Actions

Utilisation de l’Explorateur d’animations (obsolète dans Animate)

Le L’explorateur d’animations vous permet d’afficher et d’organiser le contenu d’un document et sélectionnez les éléments à modifier dans le document. Il contient une liste d'affichage des éléments actuellement utilisés, organisés dans un navigateur arborescence hiérarchique.

Utilisez l’explorateur d’animations pour effectuer les opérations suivantes : actions :

  • 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 Animate 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 comporte un menu Panneau et un menu contextuel avec des options pour effectuer des opérations sur les ou la modification de l’affichage de l’explorateur d’animations. Une coche avec un triangle en dessous dans le panneau Explorateur d’animations indique le panneau menu.

Annotation

L’explorateur d’animations offre des fonctionnalités légèrement différentes 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 s’affichent dans l’explorateur d’animations

  • 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.

Annotation

Les options Éléments d’animation et Définitions de symbole peuvent être sélectionnées simultanément.

Rechercher un élément à l'aide de la fonction Rechercher boîte

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 du menu du panneau Explorateur d’animations ou les commandes du menu contextuel

Effectuez l’une des opérations suivantes :
  • Pour afficher le menu Panneau, cliquez sur le panneau dans le panneau Explorateur d’animations.

  • Pour afficher le menu contextuel, faites un clic droit (Windows) ou cliquez en maintenant la touche Ctrl enfoncée (Macintosh) sur un élément dans la navigation Explorateur d’animations arbre.

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

Affiche la définition du symbole sélectionné dans la zone Eléments de l’animation de l’Explorateur d’animations. Listes de définition des symboles tous les fichiers associés au symbole. (La Boîte De Dialogue Afficher Les Définitions De Symboles doit être sélectionné. Sa définition figure dans cette liste.

Sélectionner les occurrences de symbole

Permet d’accéder à la scène contenant des instances d’un symbole qui est sélectionné dans la zone Définitions de symboles de l’explorateur d’animations. L’option Afficher les éléments d’animation doit être sélectionnée.

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é. La modification d’un élément dans la liste d’affichage modifie les élément du document.

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 de navigation qui le font ne contient pas l’élément sélectionné.

Imprimer

Imprime la liste d'affichage hiérarchique qui apparaît dans l’explorateur d’animations.

Utilisation 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 ou d’une barre de chargement. Il peut même s’agir d’un élément sans aucun graphique, tel qu’un minuteur, un utilitaire de connexion au serveur ou un analyseur XML personnalisé.

Si vous avez peu d’expérience 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. Utilisez le panneau Comportements afin de gérer leurs événements. Par exemple, vous pouvez affecter un comportement Atteindre la page web à un composant Bouton. Une adresse URL s’ouvre dans un navigateur web lorsque l’utilisateur clique sur ce bouton. sans écrire aucun code ActionScript.

Si vous êtes programmeur et que vous souhaitez créer des applications plus robustes, vous pouvez créer des composants de manière dynamique. Utilisez 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

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.

Sélectionnez Fenêtre > Panneau Composants.

Sélectionnez une instance d’un composant dans le panneau Composant, et faites-la glisser vers le panneau Scène ou Bibliothèque. Après ajoutés à la bibliothèque, vous pouvez faire glisser plusieurs instances sur la scène.

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.

Utilisation du panneau Paramètres de composant

Les concepteurs peuvent importer leurs composants externes dans Animate pour les utiliser lorsqu’ils créent des animations. Pour faciliter ce workflow, Animate propose la section des paramètres de composant sous la forme d’un panneau. Cette fonctionnalité vous permet de redimensionner ou de déplacer ce panneau dans l’environnement de scène d’Animate. Vous pouvez également verrouiller le panneau dans sa position en cliquant sur l’icône en forme de hamburger dans le coin supérieur droit du panneau. Sélectionnez l’option de verrouillage dans le menu.

Vous pouvez ouvrir ce panneau en utilisant le bouton Afficher les paramètres dans l’inspecteur des propriétés ou en sélectionnant Fenêtre > Paramètres de composant. Vous pouvez ajouter des valeurs aux paramètres dans la boîte de dialogue. 

Bouton Afficher les paramètres
Bouton Afficher les paramètres

Panneau Paramètres de composant
Panneau Paramètres de composant

En outre, les développeurs de composants personnalisés HTML5 peuvent désormais utiliser l’interface utilisateur HTML/CSS pour leurs paramètres.

Panneau Services web

(Obsolète dans Animate) Vous pouvez afficher une liste des services web, les actualiser et en ajouter ou en supprimer à l’aide du panneau Services web. Cliquez sur Fenêtre > Autres panneaux > Services web . Une fois que vous l’avez ajouté au panneau Services web, vous pouvez utiliser le service web pour toutes les applications que vous créez.

Pour actualiser tous les services web en même temps, 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, vous pouvez utiliser le panneau Services web pour gérer ces services.