Conheça a iniciativa da Biblioteca dos Desenvolvedores
Índice da Biblioteca
Área dos Usuários
Fórum de Discussão
DESENHANDO IMAGENS NA TELA
O objetivo desse tutorial é ensinar a declarar as imagens e desenhá-las na tela de várias maneiras.
De uma forma geral esse capítulo é o mais importante e não tão complexo como em outras linguagens.
Como foi mencionado nos primeiros capítulos o Allegro dispõe de funções para facilitar o desenvolvimento de jogos para iniciantes.
Dentre elas, estão as funções para manipulação de imagens que veremos a seguir.
Antes de iniciarmos o entendimento das funções vou definir algumas regras para que você possa entender de forma clara os exemplos.
Certifique-se que ao testar os exemplos a configuração de vídeo e profundidade de cores no inicio do código estejam conforme abaixo.
Abaixo segue uma breve explicação dos comandos acima com base na imagem fundo.bmp.
BITMAP *fundo;
Esse comando declara um ponteiro que irá apontar para a nossa imagem na memória. O Ponteiro aponta para o tipo BITMAP.
fundo = create_bitmap(640, 480);
Esse comando define o tamanho da imagem que queremos carregar na memória através da função create_bitmap.
Essa função recebe como argumentos:
Largura da imagem: 640 pixels
Altura da imagem: 480 pixels
fundo = load_bitmap( "fundo.bmp", NULL );
O comando acima serve para carregar a imagem fundo.bmp na memória através da função load_bitmap. Essa função recebe como argumentos:
Caminho da imagem: fundo.bmp
Paleta de cores: NULL
VOCÊ PRECISA
SABER...
IMPORTANTE: Certifique-se que a imagem esteja na mesma pasta do jogo. Caso contrário o Allegro vai compilar, mas não vai conseguir carregar a imagem.
Escrevendo os comandos acima e executando o jogo você não verá absolutamente nada porque os comandos acima são apenas para declarar, definir e carregar a imagem. Até agora nós temos apenas a imagem disponível na memória para utilização no jogo.
Abaixo segue as funções responsáveis por desenhar as imagens na tela.
blit
masked_blit
draw_sprite
Todas as funções acima são responsáveis por desenhar a imagem na tela. No entanto, cada uma delas tem suas próprias especialidades.
Veremos abaixo.
void blit(BITMAP *source, BITMAP *dest, int source_x, int source_y, int dest_x, int dest_y, int width, int height);
A função acima desenha uma imagem “origem” na imagem “destino” especificando as posições tanto da imagem “origem” quanto a imagem “destino” em seguida o tamanho final. Em outras palavras podemos dizer que a função acima corta um determinado pedaço da imagem “origem” e cola na imagem “destino”.
Ela recebe como argumentos:
Imagem de origem: abc
Imagem de destino: screen
Posição x da imagem de origem: 64
Posição y da imagem de origem: 0
Posição x da imagem de destino: 200
Posição y da imagem de destino: 200
Largura final da imagem: 640
Altura final da imagem: 480
Exemplo:
Logo no inicio definimos a imagem abc.bmp no tamanho real 320x64. Agora, precisamos cortar e pegar apenas o “B” para desenhar na tela.
Para sabermos qual a largura de cada imagem devemos pegar a largura total do desenho (320) e dividir pela quantidade de desenhos na tela (5), teremos 64 pixels de largura para cada letra.
Portanto, a largura final será de 64 pixels e a altura permanece a mesma (64 pixels). Segue abaixo:
// Abaixo segue o comando para desenhar o fundo na tela: blit( fundo, screen, 0, 0, 0, 0, 640, 480 );
//Abaixo segue o comando para desenhar a letra “B” na tela. blit(abc, screen, 64, 0, 200, 200, 64, 64 );
O exemplo acima deve mostrar o fundo com a imagem fundo.bmp e a letra B na posição 200,200 na tela.
Lembre-se que, como a cada imagem tem 64 pixels, logo, a letra A está na posição x=0, a letra B está na posição x = 64, C=128, D=192, E=256 e F = 320.
O tamanho final será o tamanho do corte que eu fizer no desenho.
O mesmo procedimento se aplica para imagens desenhadas na vertical.
Ao invés de x = 64 teríamos y = 64.
Para entender melhor pratique com as outras letras.
void masked_blit(BITMAP *source, BITMAP *dest, int source_x, int source_y, int dest_x, int dest_y, int width, int height);
Essa função faz a mesma coisa que a função blit, porém, produz um resultado diferente. Se você tentar cortar a imagem ninja.bmp com a função blit como fizemos com a imagem abc.bmp você vai notar que a imagem terá um fundo lilás.
IMPORTANTE: Esse fundo lilás é uma cor que o Allegro identifica como sendo transparência da imagem. Porém, nem todas as funções exibem essa cor de forma transparente, como é o caso do blit. Para isso o Allegro possui a função masked_blit.
Exemplo:
// Abaixo segue o comando para desenhar o fundo na tela:
blit(fundo, screen, 0, 0, 0, 0, 640, 480 );
// Abaixo segue o comando para desenhar o ninja na tela: masked_blit(ninja, screen, 152, 0, 200, 200, 38, 52 ); blit(ninja, screen, 152, 0, 200, 255, 38, 52 );
Para desenhar a imagem fundo.bmp não será necessário colocar a função com transparência porque não foi utilizado a cor o lilás. O exemplo a cima deverá mostrar o 4º desenho do ninja com o fundo transparente, e logo abaixo com o fundo lilás usando a função blit para mostrar a diferença.
void draw_sprite(BITMAP *bmp, BITMAP *sprite, int x, int y);
Essa função apenas desenha a imagem em um outro bitmap especificando as coordenadas x e y. Ela recebe como argumentos:
Imagem que recebe o desenho: screen
Imagem que será desenhada: bdjogos
Posição x: 0
Posição y: 0
Exemplo:
draw_sprite(screen, bdjogos, 0, 0);
O exemplo acima desenha o logo da BDJogos no canto superior esquerdo da tela. Se o logo tivesse cor de fundo lilás essa função iria desenhar com o fundo transparente. Idêntico a função masked_blit.
A partir de um exemplo simples mostramos as 3 funções mais usadas para desenhar uma imagem na tela.
Cada uma com sua especialidade.
ARRAY DE IMAGENS
Assim como existe a necessidade de utilizar imagens para ilustração durante um desenvolvimento de jogo também existe a necessidade de usar arrays de imagens.
Para um melhor entendimento iremos utilizar o mesmo exemplo que fizemos anteriormente para cada imagem. Veja abaixo:
Após carregar o array com as imagens o comando para desenhar as imagens sofre uma alteração bem simples.
Ao informar a imagem que você quer desenhar na tela você precisa informar a posição dela no array.
A logo da BDJogos, por exemplo, está na posição 3 do array.
Portanto, o comando para desenhar a logo na tela ficaria da seguinte forma:
draw_sprite(screen, imagens[3], 0, 0);
O comando acima segue da mesma forma para todos as funções de desenho.
DESTRUINDO AS IMAGENS
VOCÊ PRECISA
SABER...
A regra é simples e muito importante.
Sempre que você for usar imagens na memória do PC lembre-se de colocar o comando para destruí-las no final do código.
Mesmo sendo apenas imagens para teste.
Dessa forma seu computador não vai ficar lento, não vai travar e o compilador não vai sofrer tanto a cada execução.
void destroy_bitmap(BITMAP *bitmap);
Essa função destrói um bitmap ou um sub-bitmap da memória assim que o jogo for finalizado.
Se você passar um ponteiro NULO para essa função ela não vai fazer nada.
O único bitmap que essa função não pode destruir é o bitmap que representa o cursor na tela. Ela recebe como argumentos:
for ( i=0; i<4; i++ )
destroy_bitmap( imagens[i] );
Assim como imagens, ponteiros também ocupam espaço na memória.
Mesmo não sendo tão grandes é necessário destruí-los para que o sistema operacional utilize-o para outros fins.
Caro leitor, chegamos ao fim do entendimento das funções de manipulação de imagens.
Qualquer dúvida entre em contato com o pessoal da BDJgos através do fórum.
01/06/2007 (C) Copyright. Todos os Direitos Reservados. Leia a política de privacidade do portal.
É proibida a cópia de conteúdo deste site de acordo com
a Lei Brasileira de Direitos Autorais.
VOCÊ PRECISA
SABER...