Sign up with your email address to be the first to know about new products, VIP offers, blog features & more.

Curso programación de videojuegos con SDL – Cargando imágenes con SDL

Ya hemos visto cómo cargar una ventana simple con SDL y ponerle título. No está mal para comenzar, pero estaréis deseando hacer algo más. Lo siguiente que haremos será cargar una imagen en pantalla operación que se repite multitud de veces en cualquier juego a la hora de cargar tanto fondos, como personajes.

Para carga una imagen haremos lo siguiente:

  1. Declaramos un puntero a una variable del tipo SDL_Surface: SDL_Surface *jugador;
  2. Declaramos una variable del tipo SDL_Rect:SDL_Rect posicion;
  3. Cargamos el mapa de bits: jugador=SDL_LoadBMP(“avion.bmp”);
  4. Asignamos la posición, mediante sus coordenadas X e Y:
    posicion.x=320;
    posicion.y=400;
  5. Acoplamos la imágen al “screen”: SDL_BlitSurface(jugador, NULL, screen, &posicion);
  • jugador: superficie (SDL_Surface) que queremos insertar o de orígen.
  • NULL: indica que queremos insertar toda la imagen.
  • screen: superficie dónde se va a insertar.
  • posicion: la posición dónde se colocará.

Ya tenemos la imagen cargada. El problema de cargarla de esta manera es que no tenemos transparencias y tendríamos la imagen nuestra, avión sobre fondo blanco, apareciendo sobre el fondo, azul (imitando al mar), por lo que alrededor del avión quedaría un recuadro blanco que sin duda quedaría muy mal. Para eliminar este fondo blanco y hacer que SDL lo cargue transparente hacemos lo siguiente:

  1. Definimos una máscara con el color RGB del color a hacer transparente. En este caso el blanco, RGB(255,255,255): #define MASK 255, 255, 255
  2. Hacemos transparentes los píxeles blancos: SDL_SetColorKey (jugador, SDL_SRCCOLORKEY, SDL_MapRGB (jugador->format, MASK));
  • jugador: la superficie en la que aplicar el efecto.
  • SDL_SRCCOLORKEY: Indicar hacer transparencia.
  • SDL_MapRGB jugador->format: formato de la imagen
  • SDL_MapRGB MASK: máscara, en realidad son tres parámetros, (r,g,b).

De esta manera conseguimos un resultado así:

Veamos el código al completo:

Leer entrada anterior
Egipto

Si no tenían youtube algo tendrían que hacer.

Cerrar