Animação é o processo de fazer algo se movimentar ou, também, de fazer algo mudar com o passar do tempo. A animação com script é uma parte fundamental dos jogos de vídeo e normalmente é usada para adicionar dicas úteis de interação a outros aplicativos.
A ideia básica por trás da animação por script é de que uma alteração deve ocorrer e essa alteração precisa ser dividida em incrementos com o passar do tempo. É fácil fazer algo se repetir no ActionScript, usando uma instrução de consulta comum. No entanto, uma consulta será executada em todas as iterações antes da atualização da exibição. Para criar animação com script, você precisa gravar um ActionScript que execute alguma ação repetidas vezes com o passar do tempo e também atualize a tela sempre que essa ação for executada.
Por exemplo, imagine que você quer criar uma animação simples, como uma bola que percorre a tela. O ActionScript inclui um mecanismo fácil que permite acompanhar a passagem do tempo e atualizar a tela conforme necessário, ou seja, você pode gravar o código que move a bola um pouco por vez até atingir o destino. Após cada movimentação, a tela é atualizada e o usuário pode visualizar o movimento no palco.
Do ponto de vista prático, faz sentido sincronizar a animação com script com a taxa de quadros do arquivo SWF (em outras palavras, fazer uma alteração de animação sempre que um novo quadro for exibido), pois tal procedimento define a frequência de atualização de tela do Flash Player ou do AIR. Cada objeto de exibição tem um evento
enterFrame
que é enviado de acordo com a taxa de quadros do arquivo SWF - um evento por quadro. A maioria dos desenvolvedores que cria animações com script usa o evento
enterFrame
para criar ações que se repetem com o passar do tempo. Você pode gravar um código que ouve o evento
enterFrame
, movendo a bola animada um pouco em cada quadro e, à medida que a tela é atualizada (cada quadro), a bola seria redesenhada em seu novo local, criando o movimento.
Nota:
Uma ação que se repete com o passar do tempo também pode ser criada com a classe Timer. Uma ocorrência de Timer aciona uma notificação de evento sempre que um período especificado passa. Você poderia gravar um código que executa a animação manipulando os eventos de tempo da classe Timer, definindo um intervalo de tempo pequeno (alguma fração de um segundo). Para obter mais informações sobre como usar a classe Timer, consulte
Controle de intervalos de tempo
.
No exemplo a seguir, uma ocorrência circular de Sprite, chamada
circle
, é criada no palco. Quando o usuário clica no círculo, uma sequência de animação com script é iniciada, fazendo com que o
círculo
desapareça (a propriedade
alpha
é diminuída) até ficar completamente transparente:
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
// draw a circle and add it to the display list
var circle:Sprite = new Sprite();
circle.graphics.beginFill(0x990000);
circle.graphics.drawCircle(50, 50, 50);
circle.graphics.endFill();
addChild(circle);
// When this animation starts, this function is called every frame.
// The change made by this function (updated to the screen every
// frame) is what causes the animation to occur.
function fadeCircle(event:Event):void
{
circle.alpha -= .05;
if (circle.alpha <= 0)
{
circle.removeEventListener(Event.ENTER_FRAME, fadeCircle);
}
}
function startAnimation(event:MouseEvent):void
{
circle.addEventListener(Event.ENTER_FRAME, fadeCircle);
}
circle.addEventListener(MouseEvent.CLICK, startAnimation);
Quando o usuário clica no círculo, a função
fadeCircle()
é inscrita como ouvinte do evento
enterFrame
, indicando que começará a ser chamada uma vez por quadro. Essa função desbota o
círculo
alterando sua propriedade
alpha
para que, uma vez por quadro, o
alfa
do círculo diminua 0,05 (5%) e a tela seja atualizada. Eventualmente, quando o valor de
alpha
é 0 (
círculo
completamente transparente), a função
fadeCircle()
é removida como ouvinte de eventos, encerrando a animação.
O mesmo código poderia ser usado, por exemplo, para criar um movimento animado em vez de desbotar o objeto. Substituindo uma propriedade diferente para
alpha
na função que é um ouvinte de eventos
enterFrame
, essa propriedade será animada. Por exemplo, alterar esta linha
circle.alpha -= .05;
para este código
circle.x += 5;
animará a propriedade
x
, fazendo com que o círculo se mova para a direita no palco. A condição que encerra a animação poderia ser alterada para finalizar a animação (isto é, cancelar a inscrição do ouvinte
enterFrame
) quando a coordenada x desejada for atingida.