Animações Gráficas com Linguagens de Programação

GD Star Rating
loading...
GD Star Rating
loading...

É bem provável que o primeiro contato com a informática e computação gráfica, hoje, venham dos jogos de videogame. Do primitivo PC XT até chegar as modernas estações SILICON hoje, houve um grande trabalho em todas as etapas da evolução da informática para se obter o máximo com o mínimo de evolução que se obtinha em termos gráficos. Desde os tempos dos jogos de ATARI ninguém ficou esperando muito para que algo melhor surgisse e botaram a mão na massa.

Existe quem tenha tentado fazer animações usando caracteres ASCII, usando um padrão de formatação de textos chamado ANSI. Para quem é do tempo das BBS, deve se lembrar disso. Um exemplo desse tipo de animação pode ser visto em http://www.asciimation.co.nz/.

Entretanto, um outro tipo de segmento na indústria de software, diferentemente dos “artistas” que faziam esse tipo de animação, estava interessado em usar animações em seus programas: o segmento de jogos em computador.

O desafio de se fazer animações no computador, com qualidade, sempre foi um dos mais importantes objetivos para o que hoje se chama de indústria de entretenimento eletrônico. Maior ainda para os programadores de plantão, que geralmente “estufam o peito” e fazem muitas coisas “no braço”. Hoje, jogos como Final Fantasy X (http://na.square-enix.com/games/FFX/) não são nada sem a avançada técnica da animação que o jogo possui.

Bem, sem toda a pretensão de se fazer um Final Fantasy X no seu computador apenas lendo este artigo, mostraremos como fazer uma animação extremamente simples usando a linguagem C e uma biblioteca gráfica disponível na internet.

Linguagem C e Allegro

Para executar a nossa “proeza” de fazer uma animação gráfica, usaremos a linguagem C e sua estrutura. Recomendamos o compilador GCC, disponível em versões para quem usa Linux (http://www.gnu.org/software/gcc/gcc.html), DOS através do DJGPP (http://www.delorie.com), ou Windows através do MingW (http://www.mingw.org) ou Cygwin (http://sourceware.cygnus.com/cygwin/).

O responsável pela “mágica” da animação e quem vai facilitar a nossa vida na programação é a biblioteca gráfica Allegro (http://alleg.sourceforge.net/).

A Allegro é uma biblioteca multimídia desenvolvida para a programação de jogos. Para quem estiver usando DJGPP, basta descompactar o Allegro dentro do diretório do DJGPP com os diretórios padrão e entrar no diretório “…allegro”. Digite “make”. A biblioteca irá se compilar automaticamente. Então digite “make install” para instalar a biblioteca.

A respeito do texto, apesar de utilizarmos a linguagem C como referencial, ele se destina a programadores de outras linguagens com outras bibliotecas gráficas, bastando para adaptar as técnicas apresentadas, observar o código fonte disponível aqui no site e os respectivos comentários a cada função.

Um ponto que nos motivou a utilizar a biblioteca Allegro é que ela é multiplataforma e possui versões para Windows, Macintosh, Linux e outros ambientes, podendo ser utilizada por inúmeros compiladores. Por isso, entendemos que a abrangência desse texto seria maior do que se utilizássemos Delphi ou outra linguagem/ferramenta.

Para aprender a instalar a biblioteca gráfica Allegro em diferentes plataformas, sugerimos que você leia os arquivos “*.txt”, no diretório “…allegrodocsbuild” e veja o arquivo mais apropriado a sua necessidade (DJGPP.txt, MSVC.txt, UNIX.txt, etc…).

O que é uma animação?

Animação é fazer com que coisas dêem a impressão de movimento. No computador, assemelha-se a produção de um desenho animado, onde várias figuras, levemente diferentes, serão sobrepostas a uma velocidade que você não perceba que isto está acontecendo, dando assim a impressão de movimento. Uma animação será tão mais perfeita quanto mais quadros houverem entre os estados inicial e final da animação.

Para a criação de uma animação usando uma linguagem de programação, temos duas formas a seguir, para criarmos nossos “quadros”:

  1. Criar os quadros todos na memória, utilizando-se de rotinas da biblioteca gráfica, como linhas e círculos (para saber mais sobre funções gráficas básicas de alegro, veja o nosso tutorial de allegro na seção Textos e Artigos);
  2. Utilizar imagens criadas/capturadas em outros programas, como Corel Photopaint e Adobe PhotoShop.

Cada uma dessas técnicas tem vantagens e desvantagens. No primeiro caso, conseguiremos uma boa “economia” de memória, porém, criar imagens complexas pode ser uma tarefa realmente complicada. No segundo caso, o quadros criados externamente são inseridos facilmente com as rotinas da biblioteca, entretanto, a alteração dessas imagens se torna realmente difícil por meio do código do programa, de modo que essas alterações pareçam tranparentes.

Utilizando-se estas duas técnicas, uma complementando a outra, podemos elaborar cenários complexos e flexíveis conhecendo apenas algumas poucas funções básicas da biblioteca gráfica, como veremos adiante.

EXEMPLO 1: O programa a seguir demonstra, através de comandos gráficos simples, uma animação de um círculo na tela.

#include <conio.h> /* Necessário para a função getch() */
#include <allegro.h> /* Cabeçalho da biblioteca */
int main()
{
/* Variável inteira. Importante para o laço for */
 int x;
/* Inicializa a biblioteca gráfica */
 allegro_init();
/* Autodetecta a placa de vídeo e usa resolução de 640x480 */
 set_gfx_mode(GFX_AUTODETECT,640,480,640,480);
/* instala timer. Não é importante agora, serve aqui a função rest() abaixo funcionar */
 install_timer();
/* desenha o primeiro círculo , na posição 0,100, com raio 100*/
 circlefill (screen, 0, 100, 100, 15);
/* loop para animação através da tela */
 for (x = 1; x < 320; x++) {
/* faz pequena pausa para se enxergar a animação*/
 rest (10);
/* apaga circulo anterior */
 circlefill (screen, x - 1, 100, 100, 0);
/* desenha novo circulo em nova posição */
 circlefill (screen, x, 100, 100, 15);
 }
/* Aguarda uma tecla ser presionada */
 getch();
/* Termina a biblioteca Allegro*/
 allegro_exit();
/* termina main() de forma padrão */
 return 0;
}
/* Macro do Allegro para que o programa seja compilado corretamente em plataformas diferentes do DOS */
END_OF_MAIN();

Flickering

Ao executar o programa, percebemos que existe uma tremulação no círculo. Se não ocorreu nada, experimente aumentar os valores do raio em “circlefill” (é o penúltimo parâmetro) para 150 ou mesmo 200. Se ainda assim nada aconteceu, parabéns! Você tem um supercomputador! Mas nós, meros mortais, teremos esse “problema”. O que aconteceu é o chamado efeito de flickering (tremulação, em inglês).

O efeito flickering acontece porque o desenho do círculo deve ser feito ao mesmo tempo que o monitor atualiza a tela do monitor. Quando desenhamos na memória de vídeo diretamente, como fizemos no exemplo, há uma falta de sincronia entre o que está sendo desenhado e o que se está desenhando na memória de vídeo naquele momento. É exatamente o mesmo efeito que acontece quando tentamos filmar uma televisão em uma câmera de vídeo. Ao ver o filme, percebemos uma tremulação na imagem da televisão filmada. É a falta de sincronia entre as imagens exibidas e as que estão sendo desenhadas no filme.

Double Buffering

Para solucionar o problema, existem várias técnicas de programação. A mais simples e comum consiste na técnica do double buffering. Nessa técnica criamos um buffer onde desenhamos toda a tela antes de enviarmos a tela ao vídeo. Desta forma a tela é atualizada inteiramente e de uma só vez, eliminando o problema do flickering.

O ponto forte dessa técnica é o fato de ser facilmente implementada e funcionar muito bem na grande maioria dos casos, servindo também como ponto de partida para técnicas mais avançadas, como o triple buffering, dirty rectangles, entre outros.

EXEMPLO 2 – (Exemplos - Animações Gráficas com Linguagens de Programação (487)) O exemplo 2 você poderá baixar na área de download deste site. Consiste no mesmo programa do exemplo 1, com a adição da técnica de double buffering. Adicionamos também, uma animação de uma seqüência de figuras criadas externamente exemplificando assim todas as técnicas e recursos citados acima. Leia atentamente os comentários no código do programa, pois o código mostra o que faz cada função.

É claro que este artigo não esgota de maneira alguma o que se pode falar sobre animação gráfica. Mas conseguimos explicar um pouco a respeito de um dos maiores problemas ao tentar se fazer uma animação gráfica com linguagens de programação. O programa apresentado aqui pode parecer trivial, mas é o fundamento para outras coisas mais interessantes, como programação de jogos. É claro que você pode estar vendo apenas uma bola andando na tela. Eu, ao contrário, vejo a “estrela da morte” se preparando para entrar em ação. Use você também a sua imaginação. O próximo grande jogo/animação da temporada pode ser o seu…

Até a próxima.

Animações Gráficas com Linguagens de Programação, 5.0 out of 5 based on 3 ratings

Sobre XuTi Game Development