Resumo

Neste tutorial você vai aprender como criar um efeito, onde partes do Movieclip estão desaparecendo dentro Diferentes partes do Movieclip será mascarada e aparecem de maneira diferente. Também você pode controlar o tamanho das peças ea velocidade do desvanecimento.

Veja o efeito abaixo:


Requisitos

Flash 8, Flash CS3 ou Flash CS4.
2 imagens (neste caso 550 × 400, as imagens disponíveis no tutorial arquivo zip)

Nota: A imagem deste tutorial é feito em Flash CS3. Ele funciona exatamente o mesmo em Flash 8 e Flash CS4. Este tutorial é Actionscript 2 (embora ActionScript não é necessário).

Passo 1 - Instalar o componente do efeito

Baixe o Efeito de Transição Mask aqui. Por favor, siga as instruções de instalação e arraste o componente do painel de componentes para a biblioteca do seu arquivo FLA..

Arrastar componente em biblioteca

Passo 2 - Imagem de Importação

Importar uma imagem [pressione Ctrl-R] ou "File" -> "Import" -> "Importar on Stage ...".

Importação de imagens

Selecione a imagem deste e convertê-lo em um pressionar F8 Movieclip [] ou com o botão direito sobre o MovieClip -> "Convert to Symbol ...". Dê o movieclip o nome de "imagem".

Converter imagem para Movieclip

Nome do Movieclip

Passo 3 - Movieclip imagem do lugar e componente efeito no palco

Renomeie a camada MovieClip onde a imagem é colocada a "imagem". Criar uma nova camada, o nome de "efeito" e selecione o primeiro quadro (nomenclatura das camadas é apenas para manter as coisas em ordem, você pode deixar a camada de nomes padrão ou escolher outros nomes).

Renomeie a camada existente

Criar e nomear uma nova camada

Dê o movieclip o nome de instância "my_image" (Você pode escolher um nome diferente se você quiser. Certifique-se que o nome da instância é única). Sem um nome de instância, o componente é capaz de detectar o MovieClip.

Definir nome de instância do movieclip

Selecione o primeiro quadro da camada "efeito". Arraste o efeito de transição Máscara da sua biblioteca para o Movieclip imagem no palco. O componente snap irá automaticamente para o canto superior esquerdo do movieclip imagem.

Arrastar componente para Movieclip

Etapa 4 - Ajuste definição

Clique no componente e abra o painel inspector componente [pressione SHIFT-F7] ou "Window" -> "Component Inspector". No "Target Movieclip lista", selecione "my_image" deve ser selecionada. Todos Movieclips com nomes de instância neste quadro estão listados na seção "Target Movieclip" lista de seleção. Desde que você tem apenas um Movieclip, o componente assume que você deseja aplicar o efeito sobre o my_image Movieclip ". Por agora deixe a configuração como esta. Exportar o filme flash [pressione Ctrl-Enter] ou "comando" -> "Test Movie" e você verá que a imagem aparece.

Configurações dentro do painel inspector componente

Passo 5 - Adicionar imagem de fundo

Se você quer ter uma transição de uma imagem para o outro, você precisa colocar uma imagem no fundo. Repita o passo 2 para criar uma outra imagem Movieclip, crie uma nova camada, o nome de "fundo" e colocar o recém-criado Movieclip lá. Exportar o filme flash [pressione Ctrl-Enter] ou "comando" -> "Test Movie" e você vai ver a primeira imagem de fundo e, em seguida, a imagem está desaparecendo dentro Movieclip

Adicionar imagem de fundo

Passo 6 - Definir as variantes

O parâmetro são auto descrever, mas têm um olhar mais atento ao "Animation Mode" lista de seleção. Veja todos os modos de animação aqui. Use as configurações de tela a seguir e testar o filme.

Resultado

Brinque com as configurações. Encontre o um, que se adapta às suas demandas.

Baixar

Clique aqui para baixar o fla. Deste tutorial. Nota: O FLA. Inclui a versão de avaliação do componente de efeito, que só funciona no IDE Flash (Flash 8, Flash CS3 e Adobe Flash CS4), mas não dentro do navegador.

Você também pode fazer o download do Efeito de Transição Mask aqui.

Aqui você pode encontrar um vídeo tutorial de como implementar um efeito diferente.

  • Share / Bookmark