Transição de imagens com Action Script AS3
Vamos ver outros tipos de efeitos possíveis com ActionScript 3.0 que são as transições. O efeito Blinds mostra ou esconde o Movie Clip que está recebendo a transição aos poucos através de áreas retangulares que vão aparecendo ou desaparecendo.
1- Crie um novo arquivo.
2- Importe para o palco do Flash a imagem: transicao.jpg que esta na pasta da lição.
3- Transforme esta imagem em um Movie Clip e coloque o nome de instância da imagem de “imagem”.
4- Crie uma nova camada e no primeiro quadro desta camada abra o painel Actions e digite:
import fl.transitions.*;
import fl.transitions.easing.*;
var transicao:TransitionManager=new
TransitionManager(imagem);
Nas duas primeiras linhas importamos as classes que vamos utilizar.
Na terceira linha criamos uma instância chamada “transição” a partir da classe TransitionManager (classe que está presente somente do Action Script 3.0) que cuida dos efeitos de transição.
5- Numa nova linha digite:
transicao.startTransition({type:Blinds,
direction:Transition.IN,duration:2,easing:Strong.easeOut,
numStrips:10, dimension:1});
O parâmetro numStrips define a quantidade de retângulos e o dimension indica se o efeito será com retângulos na horizontal (valor 1) ou na vertical (valor 0).
Para a instância chamada “transicao” usamos o método starTransition que dará início a transição.
Dentro dos parênteses desse método temos (entre as chaves) os parâmetros que vão orientar a transição, o qual podemos mudar:
direction:Transition.IN que indica que o Movie Clip irá aparecer ou
direction:Transition. OUT que o mostrará se escondendo.
duration:2 é o tempo em segundos que essa transição irá durar até atingir o final.
6- Teste seu arquivo.
Os retângulos aparecem e revelam partes da imagem até mostrá-la por completo.
Temos, também, o PixelDissolve que faz o Movie Clip aparecer ou desaparecer através de um efeito em quadrados que vão aos poucos aparecendo ou desaparecendo.
7- Insira um novo quadro-chave na layer que contém a imagem e insira a imagem transicao.3.jpg que esta na pasta imagens.
8-Transforme esta imagem em um Movie Clip e coloque o nome de instância da imagem de “imagem1”.
9- Na camada das actions insira um novo quadro e digite:
var transicao1:TransitionManager=new
TransitionManager(imagem1);
10- Na próxima linha digite:
transicao1.startTransition({type:PixelDissolve,
direction:Transition.IN, duration:1,
easing:Strong.easeOut,xSections:20,ySections:0});
Temos como parâmetros adicionais xSections (quantidade de quadrados no eixo x) e ySections (quantidade de quadrados no eixo y). A Adobe aconselha valores de
no máximo 50 para estes parâmetros.
Iremos colocar uma função para controlar a passagem das imagens com as transições.
11- No primeiro quadro da layer das ações, digite:
stop();
var tempo = 10000;
function vai():void{
if(this.currentFrame != this.totalFrames)
nextFrame();
else
gotoAndStop(1);
}
setInterval(vai, tempo);
12- Teste o arquivo.
