Tutorial Allegro 5 #16 – Fadein e Fadeout (Alpha Blending)

Padrão

Olá leitores! Este depois de vários posts, chegamos ao fim da série sobre Allegro 5. Como devem ter percebido 0u não, não sou um profundo conhecedor da biblioteca. Apenas criei a série para compartilhar com vocês os assuntos que eu fui estudando, quase a partir do zero. Isso mostra que, sim, com um pouco de persistência, é possível se aventurar por novas ferramentas, mesmo que a documentação seja um pouco escassa. No final das contas, consegui, pelo menos, montar um pequeno guia em português pra quem quer começar a mexer com Allegro 5.

E pra encerrar, vou mostrar um uso dos conhecidos efeitos de transição fadein e fadeout. Procurei deixar as duas funções o mais genéricas possível, para que vocês possam reutilizá-las em outros projetos que vocês porventura vierem a fazer.

Como das outras vezes, vamos ver o código e em seguida comentamos seus detalhes:

#include <allegro5/allegro.h>
#include <allegro5/allegro_image.h>

#include <stdio.h>
#include <stdbool.h>

const int LARGURA_TELA = 640;
const int ALTURA_TELA = 480;

ALLEGRO_DISPLAY *janela = NULL;
ALLEGRO_BITMAP *fundo = NULL;

void fadeout(int velocidade);
void fadein(ALLEGRO_BITMAP *imagem, int velocidade);
bool inicializar();

int main()
{
    if (!inicializar())
    {
        return -1;
    }

    fadein(fundo, 1);
    al_rest(3.0);
    fadeout(1);

    return 0;
}

void fadeout(int velocidade)
{
    ALLEGRO_BITMAP *buffer = NULL;
    buffer = al_create_bitmap(LARGURA_TELA, ALTURA_TELA);
    al_set_target_bitmap(buffer);
    al_draw_bitmap(al_get_backbuffer(janela), 0, 0, 0);
    al_set_target_bitmap(al_get_backbuffer(janela));

    if (velocidade <= 0)
    {
        velocidade = 1;
    }
    else if (velocidade > 15)
    {
        velocidade = 15;
    }

    int alfa;
    for (alfa = 0; alfa <= 255; alfa += velocidade)
    {
        al_clear_to_color(al_map_rgba(0, 0, 0, 0));
        al_draw_tinted_bitmap(buffer, al_map_rgba(255 - alfa, 255 - alfa, 255 - alfa, alfa), 0, 0, 0);
        al_flip_display();
        al_rest(0.005); // Não é necessário caso haja controle de FPS
    }

    al_destroy_bitmap(buffer);
}

void fadein(ALLEGRO_BITMAP *imagem, int velocidade)
{
    if (velocidade < 0)
    {
        velocidade = 1;
    }
    else if (velocidade > 15)
    {
        velocidade = 15;
    }

    int alfa;
    for (alfa = 0; alfa <= 255; alfa += velocidade)
    {
        al_clear_to_color(al_map_rgb(0, 0, 0));
        al_draw_tinted_bitmap(imagem, al_map_rgba(alfa, alfa, alfa, alfa), 0, 0, 0);
        al_flip_display();
        al_rest(0.005); // Não é necessário caso haja controle de FPS
    }
}

bool inicializar()
{
    if (!al_init())
    {
        fprintf(stderr, "Falha ao inicializar a Allegro.\n");
        return false;
    }

    if (!al_init_image_addon())
    {
        fprintf(stderr, "Falha ao inicializar allegro_image.\n");
        return false;
    }

    janela = al_create_display(LARGURA_TELA, ALTURA_TELA);
    if (!janela)
    {
        fprintf(stderr, "Falha ao criar janela.\n");
        return false;
    }

    fundo = al_load_bitmap("background.jpg");
    if (!fundo)
    {
        fprintf(stderr, "Falha ao carregar plano de fundo.\n");
        return false;
    }

    return true;
}

Acredito que o que realmente nos interessa nesse aplicativo é o conteúdo das funções fadeout() e fadein().

A função fadeout() recebe como parâmetro um valor inteiro, indicando a velocidade do processo de transição (quanto menor o valor, mais lento). No primeiro bloco de código da função, fazemos uma cópia do conteúdo atual da tela e o colocamos na variável buffer (que utilizaremos para fazer a transparência gradual). Em seguida, validamos a velocidade (para que fique sempre entre 1 e 15). Por fim, temos um looping que faz a transição. Basicamente, limpamos a tela (fundo preto), desenhamos a cópia da tela aplicando a transparência (através da função al_draw_tinted_bitmap(), semelhante a já conhecida al_draw_bitmap(), com a diferença de alterar o valor das camadas rgba do bitmap (red, green, blue e alpha – essa última, o nosso canal de transparência). Após isso, atualizamos a tela e fazemos uma breve pausa entre um looping e outro – que não é necessário se você estiver controlando a taxa de FPS.

Já a função fadein(), recebe como parâmetros a imagem que será exibida na tela após a conclusão e a velocidade da transição. Nesta função, temos apenas a verificação da velocidade, e já fazemos a transição, aplicando a transparência gradativa na própria imagem recebida como argumento.

Na função main(), fazemos a chamada a função fadein() seguida de uma pausa de 3 segundos e finalizamos com a chamada a fadeout().

Pra compilar:

  • Windows: -lallegro-5.0.5-mt -lallegro_image-5.0.5-mt
  • Linux: -lallegro -lallegro_image

Bom pessoal, é isso aí. Espero que a série tenha sido útil, e que sirva como um primeiro passo para quem quiser começar a mexer com Gamedev. Continuem acompanhando o blog, pois tem muita coisa boa vindo por aí!

  • josé carlos pinna

    Nossa adorei! mais gostaria que tivesse continuado por exemplo vários sprite na tela como por exemplo varias bolinhas em movimento; mais valeu muito bom mesmo.

    • Então… acabei por encerrar essa parte de conceitos com 16 tutoriais, pois acredito que já sirva como base pra fazer bastante coisa. Quem sabe futuramente eu não faça alguns exemplos mais práticos? Vamos ver…

  • Juliano Costa

    Ótimos Posts, meus parabéns Rafael Toledo, e meu sincero agradecimento por compartilhar seu conhecimento !!!
    Não sabe o quanto me ajudou com estes 16 Tutoriais !!! Já que o conteúdo de Allegro 5 é muito escasso na internet…