Criação de extensões HTML

O Animate pode ser estendido usando extensões HTML. O Adobe Extension Builder 3 permite que você crie extensões HTML para o Animate. Antes, somente era possível fazer isso usando extensões SWF. No entanto, o Adobe Extension Builder 3 permite que você crie extensões HTML para aplicativos da Creative Cloud. Para começar, você precisa baixar e instalar o Eclipse e o Extension Builder 3.0.

Para criar uma extensão HTML, faça o seguinte.

1. Inicie o Eclipse. 
2. No assistente de Novo projeto, crie um novo Projeto de extensão de aplicativo. Forneça um nome significativo para o projeto e clique em Next (Avançar).
3. No painel Novo projeto de extensão de aplicativo Adobe, escolha Adobe Animate. Clique em Avançar.
4. Configure sua extensão usando as opções disponíveis:
   
   1. Bundle ID (ID de compactação) identifica especificamente sua extensão.
   2. Menu name (Nome do menu) é o nome de exibição de sua extensão. O Nome do menu aparece no menu Janela> Extensões no Animate.
      
   3. Detalhes da janela use essas opções para personalizar o tipo e o tamanho da janela de extensão.
      
      Clique em Avançar.
5. É possível personalizar ainda mais as bibliotecas de referência de sua extensão nas próximas telas:
   1. Biblioteca de interfaces CEP fornece funções para interagir com o aplicativo host. A opção é selecionada por padrão.
   2. Estruturas são para bibliotecas Javascript comuns, como a jQuery.
      
   3. Serviços inclui o Kit de ferramentas de comunicação de IPC da Adobe, que possibilita a comunicação entre aplicativos da Adobe, extensões e aplicativos externos. Ele fornece um protocolo para envio de mensagens pelo Gerenciador de serviços CEP, que atua como um hub para as comunicações da Creative Cloud.
      
      Clique em Concluir para criar um novo projeto do Eclipse.

Depuração de extensão no Animate 

É possível executar a extensão diretamente no Eclipse:

1. Clique com o botão direito do mouse no projeto e selecione Executar como > Adobe Flash Extension. Isso inicia o Animate.
2. No Animate, selecione o item de menu Janela > Extensões . Isso abre o painel de extensões.

Exportar sua extensão

Para distribuir sua extensão, é necessário exportá-la como um pacote ZXP. O pacote ZXP é baixado e executado pelo Adobe Extension Manager em aplicativos da Creative Cloud:

1. No Eclipse, alterne para a exibição do Script Explorer para clicar com o botão direito do mouse em seu projeto e selecionar Export (Exportar) > Adobe Extension Builder 3 > Application Extension (Extensão de aplicativo). Isso exibe o assistente de exportação.
2. É necessário ter um certificado para assinar o pacote de extensão. Navegue até um certificado existente ou clique em Create (Criar) para criar um novo.
3. Clique em Finish (Concluir).
4. Quando a exportação for concluída, você encontrará o pacote ZXP para sua extensão na pasta do projeto, pronto para a distribuição.

Observação: para efetuar a instalação, você deverá acessar o arquivo <extension>\.staged-extension\CSXS\manifest.xml e atualizar a tag do host para definir a versão mínima do Animate para 13.0.

Instalação da extensão no Animate 

Você pode instalar extensões HTML no Animate usando o Adobe Extension Manager. Extensões HTML podem ajudá-lo a ampliar as funcionalidades e os recursos do Animate.

Adição de interatividade às extensões HTML

Você pode construir uma extensão HTML para interagir com o Animate. Basta adicionar controles, definir comportamentos e obter informações sobre o ambiente (que inclui o Animate e o sistema operacional) do host. Isso pode ser feito de duas maneiras:

1. Usando a biblioteca de interfaces CEP: a biblioteca de interfaces CEP oferece APIs que ajudam a obter informações sobre o ambiente do host e fornece um script eval que permite a execução de JSFLs. Para saber mais sobre a biblioteca de interfaces CEP, vá até Ajuda > Conteúdo da ajuda > Adobe Extension Builder > Referências no Eclipse.
2. Usando o JSFL: scripts JSFL podem ser executados com uma API de script eval da biblioteca de interfaces CEP.
   
   Além de JSFLs, a infraestrutura do CEP dentro do Animate também exibe os seguintes eventos, que podem ser usados somente nos painéis HTML.
   • com.adobe.events.flash.documentChanged é disparado devido a uma alteração no documento que se encontra ativo.
   • com.adobe.events.flash.timelineChanged é disparado no momento em que é feita alguma alteração na linha do tempo do documento que se encontra ativo.
   • com.adobe.events.flash.documentSaved é disparado no momento em que o arquivo que se encontra ativo é salvo.
   • com.adobe.events.flash.documentOpened é disparado quando um novo documento é aberto.
   • com.adobe.events.flash.documentClosed é disparado ao fechar o documento que se encontra ativo.
   • com.adobe.events.flash.documentNew é disparado ao criar um novo documento.
   • com.adobe.events.flash.layerChanged é disparado quando uma nova camada é selecionada.
   • com.adobe.events.flash.frameChanged é disparado quando um novo quadro é selecionado.
   • com.adobe.events.flash.selectionChanged é disparado quando outro objeto é selecionado no palco.
   • com.adobe.events.flash.mouseMove é disparado ao mover o mouse no palco.

Exemplo

No trecho de código acima:

• csinterface: objeto da biblioteca de interfaces CEP.
• com.adobe.events.flash.selectionChanged: evento que dispara uma alteração na seleção de um objeto. Você também pode usar qualquer um dos eventos mencionados acima.
• CallbackFunction: método que detecta o evento disparado.