O Adobe Animate CC (antigo Flash Professional CC) e o Flex® podem ser usados juntos de diversas formas, como a criação de gráficos e componentes personalizados no Animate para usar no Flex®. Os seguintes tutoriais demonstram algumas das formas pelas quais o Animate® e o Flex® podem ser usados juntos.

Observação: o fluxo de trabalho da Exibição de design entre o Animate e o Flash Builder foi descontinuado. Ao iniciar esse fluxo de trabalho do Flash Builder 4.6, uma exceção é acionada ao Animate.

Alguns fluxos de trabalho do Flash Builder não podem ser interoperáveis com as versões mais recentes do Animate CC (2017 e em versões posteriores). 

Edição e depuração de ActionScript com Animate e Flash Builder

Antes de começar

Para ativar esses fluxos de trabalho do Animate/Flash Builder, assegure-se de que as seguintes condições sejam verdadeiras:

  • Tanto o Flash CS5 quanto o Flash Builder 4 estão instalados.

  • Para iniciar um arquivo FLA a partir do Flash Builder, a natureza de projeto do Animate precisa ser atribuída ao seu projeto no painel Explorador de pacotes.

    Para obter mais informações sobre a atribuição de naturezas de projetos no Flash Builder, consulte a Ajuda do Flash Builder.

  • Para iniciar um arquivo FLA no Flash Builder, seu projeto precisa ter um arquivo FLA atribuído para ser usado para fins de teste e depuração nas propriedades do projeto no Animate CC.

Testar, depurar e publicar o Animate a partir do Flash Builder

Para executar o teste e a depuração no Animate com um arquivo que esteja sendo editado no Flash Builder 4:

  • Na perspectiva de desenvolvimento do Flash Builder, escolha Executar > Testar filme ou Executar > Depurar filme. Observe que cada item de menu tem um ícone do Animate seu lado. Assim que a janela do SWF ou a sessão de depuração estiver fechada, o foco retornará para o Flash Builder, a menos que haja erros de compilador nos scripts de quadros no arquivo FLA associado ao projeto. Informações sobre todos os erros são enviadas para o painel Erros no Flash Builder.

Para publicar o arquivo FLA associado ao projeto atual no Flash Builder:

  • Na perspectiva de desenvolvimento do Flash Builder, escolha Projeto > Publicar filme. Observe o ícone do Animate ao lado do comando de menu.

Edição de arquivos AS no Flash Builder a partir do Animate 

Para criar uma nova classe ou interface do ActionScript 3.0 e atribuir o Flash Builder como editor:

  1. Escolha Arquivo > Novo.

    Novo documento
    Novo documento
  2. Selecione o propósito desejado nas guias da parte superior da tela, como Animação de personagem, Social, Jogos, Ensino, Anúncios, Web e Avançado. Na caixa de diálogo Novo documento, escolha Classe do ActionScript 3.0 ou Interface do ActionScript 3.0 interface.

  3. Na caixa de diálogo Criar ActionScript 3.0, selecione o Flash Builder como o aplicativo para criação do arquivo e clique em OK. O Flash Builder é aberto.

  4. N Flash Builder, escolha um arquivo FLA ou XFL a ser associado com o arquivo ActionScript e clique em Concluir.

Para abrir e editar um arquivo AS no Flash Builder a partir do Animate:

  1. No painel Biblioteca, clique com o botão direito do mouse em um símbolo associado à classe ou interface e escolha Propriedades.

  2. Na caixa de diálogo Propriedades do símbolo, clique em Editar definição de classe.

  3. Na caixa de diálogo Editar ActionScript 3.0 exibida, verifique se o editor atribuído ao arquivo AS é o Flash Builder e clique em OK.

    Se o Flash Builder não estiver atribuído para edição do arquivo, selecione o Flash Builder como o aplicativo para edição do arquivo de classe e clique em OK.

    O Flash Builder é aberto para editar o arquivo.

Criação de componentes para o Flex

No Adobe Animate, você pode criar conteúdos para utilizar como componentes em aplicativos Adobe® Flex®. Esses conteúdos podem incluir elementos visuais e códigos do Adobe® ActionScript® 3.0.

A criação de componentes no Animate para utilizar no Flex permite-lhe aproveitar os recursos flexíveis de design gráfico do Animate enquanto ainda utiliza os recursos do Flex.

Para criar componentes Flex no Animate, é necessário instalar o Flex Component Kit para. Instale o kit de componentes utilizando o Adobe Extension Manager. Algumas versões do kit de componentes podem não oferecer suporte a todos os recursos do Adobe Animate. Portanto, baixe a versão mais recente do kit de componentes em: www.adobe.com/go/flex_ck_br.

Para obter mais informações sobre como usar o Flex e o Animate juntos, consulte a documentação do Flex no site da Adobe em www.adobe.com/go/learn_flexresources.

Para criar um componente Flex no Animate:

  1. Instale o Adobe Extension Manager. Para baixar o Extension Manager, visite a página de download do Extension Manager em www.adobe.com/go/extension_manager_dl_br.

    Por padrão, o Extension Manager é instalado com os aplicativos do Adobe Creative Suite.

  2. Baixe e instale o Flex Component Kit, disponível em www.adobe.com/go/flex_ck_br. Encerre o Animate antes de instalar o kit de componentes. Para obter mais informações sobre como instalar extensões com o Adobe Extension Manager, consulte www.adobe.com/go/learn_extension_manager_br.

  3. Inicie o Animate. Dois novos comandos serão exibidos no menu Comandos, Converter símbolo em componente Flex e Converter símbolo em recipiente Flex.

  4. No Animate, crie um símbolo de clipe de filme que contenha a arte final e o código do ActionScript 3.0 que você deseja incluir no componente do Flex. O conteúdo deve ser incluído em um símbolo de clipe de filme antes da conversão em componente Flex.

  5. Antes de converter o clipe de filme em componente Flex, verifique se ele atende aos seguintes requisitos de compatibilidade com o Flex:

    • A taxa de quadros do arquivo FLA deve ser de 24 q/s e deve coincidir com a taxa de quadros de qualquer projeto do Flex que fará uso do componente.

    • O ponto de registro deve estar localizado no ponto 0, 0 no clipe de filme.

      Observação: para garantir que todo o conteúdo do clipe de filme tenha o ponto de registro de 0, 0, clique no botão Editar múltiplos quadros, na parte inferior de Linha do tempo, selecione todos os quadros na linha do tempo do clipe de filme, selecione todo o conteúdo em todos os quadros e mova-o para 0, 0 no Inspetor de propriedades.

  6. Selecione o clipe de filme no painel Biblioteca e selecione Comandos > Converter símbolo em componente Flex.

    O Animate converte o clipe de filme em componente Flex, altera seu ícone para um ícone do Flex na Biblioteca e importa o clipe compilado da classe FlexComponentBase para a Biblioteca. O Animate incorpora o FlexComponentBase ao arquivo SCW do componente Flex criado na próxima etapa.

    Observe as mensagens de andamento exibidas no painel Saída enquanto o Animate converte o clipe de filme.

  7. Selecione Arquivo > Publicar para criar um arquivo SWC contendo o componente Flex compilado. O Animate também cria um arquivo SWF a partir do arquivo FLA principal, mas você pode ignorar o arquivo SWF se desejar. Agora o arquivo SWC do componente publicado está pronto para ser utilizado no Flex.

  8. Para utilizar o arquivo SWC no Flex, siga um destes procedimentos:

    • Copie o arquivo SWC do Animate e cole-o na pasta bin do projeto do Flex.

    • Adicione o arquivo SWC ao caminho da biblioteca do projeto do Flex. Para obter mais informações, consulte a documentação do Flex Builder em www.adobe.com/go/learn_flexresources.

Uso de metadados do Flex

Se você estiver programando o código ActionScript 3.0 a ser usado no Flex, poderá inserir metadados no código para incorporar arquivos externos em qualquer SWF publicado que inclua o código ActionScript. Normalmente, essas declarações de metadados [Embed] são utilizadas para incorporar arquivos de imagem, fontes, símbolos individuais ou outros arquivos SWF no SWF.

Lembre-se de que metadados são “dados sobre dados”. Adicione metadados ao ActionScript na linha que está logo após a linha de código à qual os metadados se aplicam. Em seguida, o compilador considera os metadados quando for compilar a linha de código que os seguem.

Por exemplo, para incorporar uma imagem chamada button_up.png que está armazenada no diretório um nível acima do arquivo ActionScript, você usaria o seguinte ActionScript:

[Embed(“../button_up.png”)]

private var buttonUpImage:Class;

A tag de metadados [Embed] informa ao compilador que ele deve incorporar o arquivo denominado button_up.png no arquivo SWF e que o arquivo deve ser associado à variável denominada buttonUpImage.

Para obter mais informações sobre como incorporar ativos com metadados no Flex, consulte Guia do desenvolvedor sobre Incorporação de ativos no Flex 3 em www.adobe.com/go/learn_flexresources.

Se você utilizar um recurso que exija o SDK do Flex, como metadados [Embed], no momento da compilação, o Animate irá solicitar que você adicione o arquivo Flex.SWC ao caminho da biblioteca de seu arquivo FLA. O arquivo Flex.SWC contém classes compiladas necessárias para dar suporte aos metadados do Flex. Clique em Atualizar caminho da biblioteca na caixa de diálogo para adicionar o arquivo Flex.SWC ao caminho da biblioteca. Você também pode adicionar o arquivo Flex.SWC ao caminho da biblioteca nas configurações de publicação do ActionScript mais tarde.

Recursos adicionais

Os recursos a seguir fornecem informações adicionais e exemplos da integração do Animate com o Flash Builder:

Esta obra está licenciada sob uma licença não adaptada da Creative Commons Attribution-Noncommercial-Share Alike 3.0  As publicações do Twitter™ e do Facebook não são cobertas pelos termos do Creative Commons.

Avisos legais   |   Política de privacidade online