Chapitre XVI : Alpha Blending avec SDL

Loka

- Titre : Chapitre XVI : Alpha Blending avec SDL

- Auteur : Loka

- Parution : 5 novembre 2007

- Mise à jour : 5 novembre 2007

- Licence : Ce document est issu de http://www.developpez.com et reste la propriété exclusive de son auteur. La copie, modification et/ou distribution par quelque moyen que ce soit est soumise à l'obtention préalable de l'autorisation de l'auteur.

Sommaire

- XVI. Alpha Blending

- XVI-1. Définition

- XVI-2. Programme exemple

- Remerciements

XVI - Alpha Blending

XVI-1 - Définition

L'alpha blending est une technique consistant à ajouter de la transparence à des objets dont les surfaces.
Les surfaces sont généralement caractérisées par une texture ou par une couleur. La technique d'alpha blending consiste à ajouter à la surface, dont on souhaite donner la possibilité de devenir transparente, un octet (nombre de 0 à 255) définissant le caractère translucide de la surface.

Lorsque la valeur alpha est à 255, l'objet est totalement opaque et au contraire, si la valeur alpha est à 0, l'objet est complètement invisible.

XVI-2 - Programme exemple

Vous savez déjà utiliser la transparence en utilisant le color key comme sur le Chapitre V : Transparence.

Dans ce tutoriel, nous allons poser deux surfaces dont celle de devant sera capable de s'effacer/revenir en changeant simplement sa valeur alpha. Cela aura pour effet de donner un fondu entre les deux images.

Voici une image du passage d'une image à l'autre sur notre programme :

La transparence alpha SDL est de notoriété lente car elle n'utilise aucune accélération matérielle. Quelque soit votre carte graphique, ça ne changera rien.
Si vous souhaitez avoir une accélération matérielle, il vous faudra passer par OpenGL. Sachez que SDL marche très bien en compagnie d'OpenGL.

Commençons notre programme exemple par l'initialisation de notre valeur alpha dans le main() :

initialisation valeur alpha

//La valeur alpha de la surface de devant
int alpha = SDL_ALPHA_OPAQUE;

SDL nous permet d'utiliser une variable globale nommé SDL_ALPHA_OPAQUE qui est la valeur maximale que peu prendre une valeur alpha.
Cette variable globale est définie comme suit :

SDL_ALPHA_OPAQUE

#define SDL_ALPHA_OPAQUE 255

De même, il existe une autre variable globale pour définir la valeur minimale que peut prendre la valeur alpha :

SDL_ALPHA_TRANSPARENT

#define SDL_ALPHA_TRANSPARENT 0

Ces deux variables sont définies dans le fichier SDL_video.h.

Pour gérer le passage d'une image à l'autre, nous allons utiliser les flèches haut et bas du clavier.
Lorsque la flèche haut sera pressée, nous allons augmenter la valeur alpha jusqu'à ce qu'elle atteigne son maximum. De même, lorsque la flèche bas sera pressée, nous allons baisser la valeur alpha jusqu'à son minimum.

changement de la valeur alpha

//Recuperation du keystates
Uint8 *keystates = SDL_GetKeyState( NULL );

//Si la fleche haut a ete pressee
if( keystates[ SDLK_UP ] )
{
//Si la valeur alpha n'est pas à son maximum
if( alpha < SDL_ALPHA_OPAQUE )
{
//Augmentation de la valeur alpha
alpha += 5;
}
}

//Si la fleche bas a ete pressee
if( keystates[ SDLK_DOWN ] )
{
//Si la valeur alpha n'est pas à son minimum
if( alpha > SDL_ALPHA_TRANSPARENT )
{
//Diminution de la valeur alpha
alpha -= 5;
}
}

La valeur alpha va donc de 0 à 255 (ou inversement) et l'image passe de l'opacité à la transparence complète.

Pour appliquer la valeur alpha a notre surface, il va falloir passer par la fonction SDL_SetAlpha() :

SDL_SetAlpha()

//Mise en place de la surface alpha
SDL_SetAlpha( front, SDL_SRCALPHA | SDL_RLEACCEL, alpha );

La variable alpha est donc la valeur alpha pour notre surface front. SDL_SRCALPHA doit être passé en paramètre, sinon toutes les informations alpha sont ignorées. Pour le paramètre SDL_RLEACCEL, il permet d'avoir l'accélération RLE (voir Chapitre V).

La suite, vous la connaissez, on applique les surfaces et on met à jour l'écran :

application des surfaces

//On applique la surface de derriere
apply_surface( 0, 0, back, screen );

//On applique la surface de devant
apply_surface( 0, 0, front, screen );

//Mise a jour de l'ecran
if( SDL_Flip( screen ) == -1 )
{
return 1;
}

Voila, vous devriez obtenir un beau fondu entre les deux images en appuyant sur les flèches haut et bas de votre clavier.

Télécharger les sources du chapitre XVI (110 ko)
Version pdf (85 ko - 7 pages)

Remerciements

Je remercie Aspic pour sa relecture.

<= Retour au chapitre XV : Gestion des événements avancés

-=Index Tutos SDL=-

Accéder au chapitre XVII : Création d'un Font Bitmap =>