Técnicas para Animação de Imagens em Jogos 2D

Utilizando Java
Silvano Maneck Malfatti1
1
Faculdade Católica do Tocantins (FACTO)
Palmas – TO – Brasil
Malfatti@catolica-to.edu.br
Resumo. Um dos recursos que tem sido cada vez mais utilizado para criar
efeitos e dar vida aos personagens em jogos 2D é a criação de animações
através do uso de imagens. Dentre as linguagens de programação existentes,
Java é atualmente uma das mais populares para o desenvolvimento de jogos
2D. Isto se deve ao fato de que Java é portável entre diversos sistemas
operacionais e possibilita a execução de aplicações em vários ambientes
como desktop, internet e celulares. Este artigo tem por objetivo apresentar
técnicas e recursos da linguagem Java para a criação de animações
destinadas ao desenvolvimento de jogos 2D.

1. Introdução
O mercado de jogos eletrônicos está em franca ascensão, tendo superado inclusive a
bilionária indústria do cinema [Folha 2003]. No Brasil o mercado de jogos cresceu 31%
em 2008 [G1 2009], e grande parte desse sucesso deve-se ao fato de que os jogos atuais
apresentam cenários tão complexos em termos de efeitos quanto os filmes produzidos
em Hollywood. No entanto, os jogos oferecem ao participante a possibilidade de
interagir e tomar as decisões que irão definir o desfecho do enredo.
Outro fator que contribui para o sucesso dos jogos eletrônicos é o fato de que os
mesmos já não estão mais limitados a computadores pessoais ou consoles, e já podem
ser encontrados em diversas páginas da web ou em celulares. Além disso, a
popularização da Internet e dos dispositivos móveis trouxe novamente à tona o mercado
de jogos 2D que havia perdido espaço.
O mercado de jogos 2D é altamente lucrativo, sendo que o estilo de jogo mais
procurado são os “casuais”, que caracterizam-se pela simplicidade da jogabilidade e
facilidade de aprendizado. O perfil dos jogadores que se interessam por jogos casuais
também é um pouco diferente do público que prefere jogos do tipo Triple A, pois é
formado por adultos com mais de 30 anos, independentes financeiramente e que não
passam grandes intervalos de tempo jogando [Bates 2001].
Com o intuito de fomentar a pesquisa e o desenvolvimento de jogos 2D o presente
trabalho tem por objetivo apresentar os recursos gráficos oferecidos pela linguagem
Java juntamente com algumas técnicas para a implementação de animações baseadas
em imagem, recurso este que é de suma importância para criação de jogos que atraiam a
atenção do jogador.
2. Por que programar jogos em Java?
Uma das questões mais importantes a ser considerada antes de iniciar o
desenvolvimento de um jogo é a escolha pela tecnologia ou linguagem que será
utilizada para a implementação do mesmo.
Dentre as linguagens de programação existentes, Java está se tornando popular para o
desenvolvimento de jogos 2D principalmente pelo fato de ser multiplataforma, realizar
o gerenciamento automático de memória e permitir a execução de aplicações não só em
desktop, como também em páginas da web e celulares.
Outro argumento relevante para a escolha da linguagem Java é o fato de que a cada
nova versão lançada, a linguagem torna-se mais rápida e com mais recursos destinados
especificamente à programação de jogos, como renderização em fullscreen e aceleração
de algumas operações gráficas por hardware. Este fato pode ser comprovado através do
estudo comparativo realizado entre Java e C++, onde foi constatado que a primeira
versão do JDK (Java Development Kit) era até quarenta vezes mais lenta que o C++,
porém, a quinta versão do Java é apenas 1.1 vezes mais lenta [Davison 2005].
Diante de tais argumentos, a linguagem Java deixa de ser uma incerteza para a
programação de jogos e passa a ser favorita principalmente quando houver a intenção de
aumentar a visibilidade da aplicação e atingir um público maior de jogadores.

3. A Biblioteca Gráfica do Java

O principal recurso da linguagem Java para a programação de jogos é a sua biblioteca
gráfica conhecida como Java 2D. Trata-se de um conjunto de classes destinadas a
oferecer suporte para a renderização de objetos visuais, como geometrias, textos e
imagens.
O Java 2D também oferece outras funcionalidades desejáveis ao desenvolvimento de
jogos como a aplicação de efeitos em imagens, operações lógicas entre primitivas
geométricas, métodos nativos para a detecção de colisão e operações como rotação,
translação e escala [Petchel 2001].
A principal classe do Java 2D é a Graphics2D pertencente ao pacote java.awt. A
Graphics2D foi disponibilizada a partir da versão 1.2 do JDK com o intuito de oferecer
uma grande variedade de métodos para renderização de objetos visuais e transformações
geométricas.
Por tratar-se de uma classe abstrata, não é possível instanciar objetos da Graphics2D
diretamente através do operador new. Uma das formas mais comuns de obter um objeto
Graphics2D é através da criação de uma classe que estenda a classe abstrata Canvas e
sobrescreva o método paint que possui a seguinte assinatura:
public void paint(Graphics g)
A classe Canvas representa uma área de desenho que poderá ser inserida em uma janela
ou applet. Ao estender esta classe e sobrescrever o método paint o desenvolvedor
recebe como parâmetro um objeto do tipo Graphics representando a superfície de
desenho do componente Canvas e que contém os métodos necessários para a
renderização de elementos visuais sobre tal superfície. Para obter um objeto do tipo
Graphics2D basta então fazer um cast com o intuito de converter o objeto Graphics
recebido pelo método paint em um objeto do tipo Graphics2D. O fragmento de código
mostrado na Figura 1 apresenta um exemplo deste procedimento:

Figura 1 – Estendendo a classe Canvas para a obtenção de um objeto gráfico.

Outra classe importante oferecida pelo Java 2D e que complementa as funcionalidades
da Graphics2D, é a BufferedImage. Esta classe oferece métodos para o carregamento e
manipulação de imagens de diversos tipos que serão renderizadas no canvas por
intermédio do objeto Graphics.
A classe BufferedImage oferece dois recursos importantes para o desenvolvimento de
um jogo. O primeiro é realizar a leitura de uma imagem já existente em algum formato
como JPG, BMP, PCX ou PNG. O segundo recurso é permitir a renderização de
gráficos em uma imagem criada na própria aplicação e que posteriormente será
desenhada na tela. O fragmento de código apresentado na Figura 2 mostra as duas
formas de renderizar uma imagem através da classe BufferedImage.

Figura 2 – Utilizando a classe BufferedImage para a renderização de imagens.

O código apresentado na Figura 2 contém a declaração de dois objetos do tipo
BufferedImage. O primeiro, denominado imgAplicacao, armazena a referência para uma
imagem vazia de tamanho 100 x 100 criada no construtor da classe Painel. O segundo
objeto BufferedImage chamado imgArquiv,o armazena a referência para uma imagem
no formato PNG carregada do disco a partir do método read() oferecido pela classe
ImageIO. A renderização de ambas as imagens apresentadas à direita da Figura 2 é feita
no método paint() através do objeto Graphics2D. Na próxima seção serão trabalhadas
algumas técnicas que em conjunto com as classes Graphics2D e BufferedImage
permitem a implementação de animações basedas em imagens.

4. Técnicas para a Animação de Imagens com Java

As primeiras técnicas para a animação de imagens surgiram no século 19 com a
invenção de um equipamento denominado praxynoscópio cuja função era projetar em
uma tela diversas imagens desenhadas sobre uma fita transparente. A exibição de várias
imagens com pequenas alterações em um curto intervalo de tempo davam a sensação de
movimento.
Em animações computacionais baseadas em imagem o processo é praticamente o
mesmo, com a diferença de que cada imagem é representada por uma matriz de pixels e
renderizada na tela do computador.
A técnica mais simples de implementar animações em Java é através do carregamento
de diversas imagens sequenciais como mostra a Figura 3.

Figura 3 – Animação composta de várias imagens.

Para realizar a implementação de animações baseadas em múltiplas imagens utilizando
Java, basta criar um vetor de imagens do tipo BufferedImage e desenvolver um
algoritmo para controlar o índice da imagem que será renderizada após um determinado
intervalo de tempo. O fragmento de código a seguir utiliza as classes Canvas e Graphics
juntamente com o conceito de thread para implementar a técnica de animação por
imagens seqüenciais.

Figura 4 – Código Java para renderização de uma animação baseada em sequência de

imagens.
Segundo Jonathan (Harbour 2006), apesar desta técnica ser de fácil implementação, ela
apresenta algumas desvantagens, como o longo tempo de carga das imagens
correspondentes a cada quadro da animação. Outro problema com as animações
baseadas em diversas imagens é a sobrecarga criada no sistema para que seja possível
manter todas as animações na memória.
A técnica mais utilizada para a implementação de animações é baseada no conceito de
imagens do tipo tiled, onde todos os quadros da animação estão contidos na mesma
imagem. Nesta abordagem, uma imagem contém diversos quadros representando uma
ou diversas animações dispostas em linhas e colunas como mostra a Figura 5.

Figura 5 – imagem contendo oito quadros de animação dispostos em duas linhas e

quatro colunas.
Para que seja possível implementar animações baseadas em imagens tiled, a linguagem
necessita oferecer suporte a uma operação denominada blit, que é basicamente uma
operação de cópia de dados que permite ao desenvolvedor desenhar na tela apenas uma
parte da imagem original. Neste caso, é preciso implementar um algoritmo que irá
determinar qual a subárea da imagem deverá ser copiada com base no índice do qu
quadro
desejado.
A linguagem Java permite a realização do blit a partir de uma das versões do método
drawImage() pertencente a classe Graphics, o qual possui a seguinte assinatura:

Figura 6 – assinatura do método responsável pela operação blit em Java.

O primeiro parâmetro corresponde à imagem original contendo
contendo todos os quadros da
animação. Oss próximos quatro parâmetros inteiros correspondem às coordenadas da
área onde a imagem copiada será desenhada e os quatro últimos parâmetros inteiros
correspondem àss coordenadas do quadro selecionado da imagem original,, como mostra
a Figura 7.

Figura 7 – Resultado
esultado da operação blit para uma imagem do tipo tiled
tiled.
A fórmula matemática responsável pelo cálculo das coordenadas do quadro a ser
copiado a partir da imagem original é bastante simples e baseia-se
baseia se no índice do quadro
desejado, no total de colunas da imagem original, e na largura e altura do quadro a ser
desenhado, como mostra o fragmento de código da Figura 8.

Figura 8 – Implementação da operação blit em Java.

O método apresentado na Figura 8 recebe como parâmetro a imagem original, o objeto
Graphics2D representando a superfície onde o quadro selecionado será desenhado, as
coordenadas (x,y) correspondentes a posição em que o quadro será desenhado, o
número de colunas da imagem original, o índice do quadro desejado, a largura e altura
de cada quadro.
Para que todos os quadros da animação sejam renderizados basta então que o
programador crie um algoritmo para controlar o valor da variável que armazenará o
índice do próximo quadro a ser desenhado, como mostrado na figura 9.

Figura 9 – Olgoritmo utilizado para controlar o índice do quadro renderizado no

momento.
Conforme apresentado na Figura 9, o algoritmo utilizado precisa garantir que após o
último quadro ter sido apresentado na tela, o valor da variável utilizada para armazenar
o índice do quadro atual retorne a zero para que a animação possa então recomeçar.
Outro recurso importante para a programação de jogos é o espelhamento, que consiste
em inverter a ordem dos pixels do quadro gerado pela operação blit. O espelhamento
promove uma redução no número de quadros necessários para uma animação. A
implementação do espelhamento em Java é simples, basta inverter as coordenadas do
eixo X especificadas no segundo e quarto parâmetros do método drawImage() utilizado
na operação blit.
Apesar da animação por imagens do tipo tiled ser a base do desenvolvimento de jogos
2D em Java, é necessário ainda a utilização de uma técnica complementar denominada
buffer duplo. A utilização desse recurso tem por objetivo evitar que ocorram falhas na
renderização, também conhecidas como flickers [Perúcia et al 2005].
A implementação o buffer duplo consiste em utilizar uma superfície secundária para
desenhar os elementos do jogo antes de serem enviados para a visualização. Para tanto é
necessário criar uma imagem do mesmo tamanho da superfície de visualização onde os
elementos gráficos serão renderizados. Após todos os gráficos terem sido desenhados na
superfície secundária, a imagem é então aplicada na superfície principal.
No código apresentado pela Figura 10 é possível observar que o construtor da classe
Painel cria duas imagens, uma a partir de um arquivo existente e outra definida na
própria aplicação com o mesmo tamanho do canvas. No método paint(), a imagem lida
a partir do arquivo é desenhada primeiramente no buffer secundário através objeto
superficieSecundaria. O último passo consiste em aplicar a superfície secundária ao
painel principal representado pelo objeto g2d.

Figura 10 – Implementação do buffer duplo em Java.

5. Conclusões
O mercado de jogos 2D tornou-se novamente um negócio altamente lucrativo devido ao
crescimento do número de jogadores adeptos ao estilo de jogos casuais e também à
popularização da Internet e dispositivos móveis. Neste contexto, a linguagem Java é
uma das principais tecnologias destinadas à implementação de jogos, tendo em vista que
a execução de aplicações em diversas plataformas. Um dos principais recursos visuais
presentes nos jogos 2D da atualidade são as animações baseadas em imagens utilizadas
para criar efeitos e dar movimentos aos personagens. Este trabalho apresentou as
principais técnicas para a implementação de animação como tiled, espelhamento e
buffer duplo, que juntamente com os recursos da linguagem Java são a base para o
desenvolvimento de jogos eletrônicos.

Referências
Folha on-line (2003). Último acesso 31/09/2009. Disponível em
http://www1.folha.uol.com.br/folha/ilustrada/ult90u40114.shtml.
G1, Portal globo.com (2009). Último acesso em 31/09/2009. Disponível em
http://g1.globo.com/Noticias/Games/0,,MUL11979059666,00INDUSTRIA+DE+GA
MES+CRESCE+NO+BRASIL+EM.html.
Bates, B. (2001). Game Design: The Art & Business of Creating Games. Prima Tech.
Davison, A. (2005). Killer Game Programming in Java. O´Reilly.
Petchel, T. A. (2001). Java 2 Game Programming. Premier Press.
Harbour, J. S. (2006). Beginning Java 5 Game Programming. Thomson Course
Technology.
Perúcia, A. S., Berthêm, A. C., Bertschinger, G. L., Menezes, R. R. C. Desenvolvimento
de jogos eletrônicos. Novatec.