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.

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 :
    1. Bundle ID (ID d’offre groupée) identifie l’extension de manière unique.
    2. 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.
    3. 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 :
    1. 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.
    2. Les structures (Frameworks) servent aux bibliothèques JavaScript courantes telles que jQuery.
    3. 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.

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.

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>\.staged-extension\CSXS\manifest.xml et mettre à jour la balise host pour définir la version minimale d’Animate sur 13.0.

Installation de votre extension dans 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.

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

Ce produit est distribué sous licence Creative Commons Attribution - Pas d’utilisation commerciale - Partage à l’identique 3.0 non transposé  Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.

Mentions légales   |   Politique de confidentialité en ligne