Hoje vamos abordar as animações, como criar um sprite animado para que possamos colocá-lo em jogo e como controlá-los. Então vamos começar!
Animação
Antes de começar animar o nosso jogo, vamos criar as definições: o que é animação? Animações são sequências de imagens que criam a ilusão de movimento. Cada imagem que forma a sequência é chamada de Quadro (ou Frame), tanto que uma qualidade de animação pode ser medida em FPS (Frames Per Seconds). Essa métrica indica quantos quadros são usados para gerar 1 segundo de animação. Por exemplo, muitos filmes possuem FPS de 24, ou seja, 24 imagens para gerar 1 segundo. Jogos costumam estar entre 30 e 60 FPS, porque em filmagens é possível criar efeitos de velocidade com apenas manejo da câmera (a imagem abaixo do filme Velozes e Furiosos mostra este efeito), mas o mesmo não pode ser facilmente aplicado em jogos.
- - - -
Cada imagem desta será um quadro da nossa animação. Agora vamos fazer o seguinte: alteraremos o sprite spr_flor para adicionar os quadros. Para isto, abra o spr_flor e clique em “Load Sprite”.Limitando a animação
A animação está ok, mas o problema é que ela ocorrerá somente quando a flor for atingida pela bola. Então, temos que cuidar disto. A primeira coisa que faremos é abrir o “obj_flor”, criar um evento “Create” e inserir o seguinte código:
01. destruir = false;
02. image_speed = 0;
A variável “destruir” servirá como gatilho para iniciar a animação. Já a variável “image_speed” é uma variável do sistema que indica a velocidade da animação do Sprite. Quando atribuímos 0 para a variável, a animação é suspensa. O valor 1 é a velocidade padrão e, se colocarmos 0.5, a animação terá a metade da velocidade. Se colocarmos 2, terá o dobro. Então, isto fará com que a animação seja suspensa.
Agora, vamos fazer com que a flor desapareça: este processo inicia-se com a colisão entre a flor e a bola. Portanto, vamos alterar o código responsável. Selecione o evento da colisão com a bola e vamos editar o código já existente, que é o seguinte:
01. instance_destroy();
02. score += 100;
Para:
01. destruir = true;
02. score += 100;
Aqui, substituímos a linha 01, que antes já removia a flor, para que acione a variável “destruir”.
Agora, vamos para a parte principal do código. Crie um evento “Step” no “obj_flor” e adicione o seguinte código:
01. if (destruir==true){
02. image_speed = 0.5;
03. if(image_index == image_number-1){
04. instance_destroy();
05. }
06. }
Está praticamente pronto, mas antes precisamos alterar uma coisa: a máscara de colisão. Ela determina a área da imagem em que uma colisão é válida. Atualmente a área é quadrada, o que faz com que ocorram falsos positivos, uma vez que a imagem da flor está mais para redonda. Vamos corrigir abrindo o “spr_flor” e clicando em “Modify Mask”.