Acho que aqui todo mundo já conhece o "efeito máscara", aquele em mostra uma determinada imagem que está por baixo de outra.

Nesse tutorial eu vou ensinar como criar uma mascara onde você pode controlar o efeito, ou seja, usar o mouse para escolher em qual parte vai ser mostrada a imagem que está por baixo.

Vamos começar.

Primeiro(e obvio) crie um documento com o seu Flash, agora nomeie a camada existente como "Fundo"(é bom sempre nomear as camadas para não se perder).



Agora você vai precisar importar uma imagem para a biblioteca, par isso vá em File>Import to Library e selecione a imagem que você achar melhor, depois arraste-a para o palco e a coloque do tamanho do documento.



Agora, transforme a imagem que você pegou em um Movie Clip, indo até Insert> Convert to Symbol> Movie Clip, ou simplesmente aperte F8.



Depois vá em Properties, preencha o campo Instance Name com o nome de Fundo1.



Insira uma nova camada e dê a ela o nme de "Máscara". Mo primeiro frame dessa camada, desenhe um círculo com a ferramenta Oval. Depois transforme esse círculo em um Movie Clip(da mesma forma que você fez com a imagem), nomeie o Movie Clip como "Mascara". Depois, na janela de Properties, preencha o campo Instance Name com o nome de Mascara1.



Selecione o primeiro frame da camada Fundo,e vá na janela Actions, e escreva o seguinte comando:

CODE
Fundo1.setMask(Mascara1)


Esse comando faz com que a instância do Movie Clip Mascara1 seja usada como máscara para a instância do Movie Clip Fundo1. Agora selecione o Movie Clip Mascara1 que é o circulo que foi desenhado, vá na janela Actions e escreva o seguinte comando(tenha certeza de que esteja digitando na janela do Movie Clip Mascara1)

CODE
on (press){
       startDrag("");
   }
   on (release){
       stopDrag();
   }


O que faz esse código??

CODE
on(press){


O flahs entende da seguinte forma:
Enquanto o usuário mantiver o botão do mouse pressionado sobre o Movie Clip

CODE
startDrag("");
   }

O Movie Clip vai segui o Ponteiro do Mouse.


CODE
on(release){

Quando o usuário soltar o botão do Mouse,

CODE
stopDrag();
   }

o Movie Clip vai para de seguir o ponteiro, ou seja, vai ficar parado onde o usuário soltar o mouse....


Agora faz um teste, aperte Ctrl+Enter e veja no que vai dar...


Qualquer duvida posta ai, se eu errei em alguma coisa, por favor me corrijam....


Abraços thumbsup.gif


bye1.gif

Você gostou? Comente no fórum!

Comentários:

megaa disse:

Fala cara blz?

Legal o tuto!
Tem uma outra forma de fazer também que eu considero a mais viavel, no primeiro frame vc pode fazer simplesmente assim:

CODE
Fundo1.setMask(Mascara1)

Mascara1.onPress = function(){
this.startDrag()
};

Mascara1.onRelease = function(){
stopDrag()
};


Porque acho mais viavel?
Sempre gosto de deixar a action toda no mesmo lugar, assim não tenho que ficar procurando onde tem action no meus arquivos, e ficando louco por não achar onde coloquei!

Mas lógico, assim como fez não deixa de estar certo, cada um faz como acha melhor forma de trabalho!

Abraços

AdrianoRJ disse:

Realmente, pensando por esse lado você está totalmente certo. clap.gif joia.gif
Mas se você já nomeia os objetos com a fução que ele vai operar, acho que não tem problema, até por que o trabalho já fica todo dividido e você sempre sabendo onde está cada coisa e o que faz, como foi o caso do Movie Clip Mascara. Ele está em uma camada chamada "Mácara" com o nome de "Mascara" para executar a funça de Máscar, ou seja, você já sabe o que vai ser feito, e se caso de algo de errado, você só vai mudar os comando em poucos lugares e não codigo inteiro. Mas ai como você falo, isso varia do modo de cada um mesmo...


Esse modo que você falo eu nunca tinha visto, por incrivel que pareça eu ainda estou aprendendo o AC, mas eu já estudei programação, quando eu tiver tempo eu vou fazer da forma como você falo...

Mesmo assim obrigado thumbsup.gif


abraços


megaa disse:

QUOTE(AdrianoRJ @ 29/11/2007 - 00:59) <{POST_SNAPBACK}>
Mas se você já nomeia os objetos com a fução que ele vai operar, acho que não tem problema, até por que o trabalho já fica todo dividido e você sempre sabendo onde está cada coisa e o que faz, como foi o caso do Movie Clip Mascara. Ele está em uma camada chamada "Mácara" com o nome de "Mascara" para executar a funça de Máscar, ou seja, você já sabe o que vai ser feito, e se caso de algo de errado, você só vai mudar os comando em poucos lugares e não codigo inteiro. Mas ai como você falo, isso varia do modo de cada um mesmo...


O problema de fazer a Action um em cada lugar é quando se trabalha com uma aplicação em Flash muito grande, ai é ruim, isso na minha opinião, cada um faz como acha melhor, lógico!

Abraços

dragun disse:

O tuto ta bem legal, e a dica do megaa é muito válida...

bem melhor para organizar a montanha de códigos...hehehhe

falow...
bom tuto..

Ver o restante dos comentários no fórum (e aproveitar pra comentar também !).

Mais recentes em Flash

Formulario em flash
Por sergiojr - Formulario em flash...
Sistema de login utilizando flash e xml
Por MahDesign - . vamos aprender como criarmos um sistema de login...
Igraf 1.0 - gerando gráficos em flash via actionscript
Por weaver - Eu que fiz hospedei em outro canto mas ajuda muito...
Remova os pontilhados de um swf no ie
Por Manito - Galera, me incomoda muito quando um site que tenha...
Filtros
Por Lucasbr - Video aula...

Ver mais Artigos de Flash.

Ver e retirar outras dúvidas no fórum Webly.

Alguns Direitos Reservados | RSS | O Fórum

Webly Portal e Fóruns - Internet + Humana | Design by ArthurHenrique.com