lunes, 25 de febrero de 2013

Transparencias con Allegro 4

Para realizar las transparencias con allegro 4, se tiene varios comandos para conseguir el efecto deseado de transparencia. Para ver su funcionamiento pondré algunos ejemplos.

Ejemplo 1:

   drawing_mode(DRAW_MODE_TRANS, NULL, 0, 0);
   set_trans_blender(0, 0, 0, 128);
   rectfill(buffer, 0, 0, buffer->w, buffer->h, 0x0000FF);
   solid_mode();



drawing_mode(DRAW_MODE_TRANS, NULL, 0, 0);
Con este primer comando se le indica a allegro que se cambia la forma de dibujar, y que se va a utilizar el modo transparente, que viene indicado por el primer parámetro DRAW_MODE_TRANS.

set_trans_blender(0, 0, 0, 128);
Este comando establece la transparencia a la hora de pintar. De los cuatro parámetros que posee esta función,  el que interesa es el cuarto que es el canal alfa, en el se indicara el nivel de la transparencia, siendo el 0 igual a invisible y el 255 sin transparencia. En este ejemplo se pone a 128, por tanto, tiene un 50% de transparencia.

rectfill(buffer, 0, 0, buffer->w, buffer->h, 0x0000FF);
Este comando dibuja un rectángulo relleno con un color. Para este ejemplo el rectángulo coje todo el tamaño de la imagen buffer, y lo rellena con el color azul (0x0000FF).

solid_mode();
Este comando se utiliza para volver al modo normal de allegro, por tanto, desactiva el modo transparente que se puso con el comando drawing_mode.


Ejemplo 2:


   BITMAP *buffer;
   BITMAP *fondo;
   BITMAP *personaje;
   
   buffer = create_bitmap(640,480);
   fondo = load_bitmap("fondo.bmp",NULL);
   personaje = load_bitmap("chica.bmp",NULL);
   
   clear_to_color(buffer, 0xFFFFFF);
   
   blit( fondo, buffer, 0,0,200,180, 68,100);
   
   blit( personaje, buffer, 0,0,300,180, 68,100);
   
   blit( fondo, buffer, 0,0,400,180, 68,100);
   
   set_trans_blender(255, 255, 255, 128);

   draw_trans_sprite(buffer, personaje, 400, 180);   
   
   blit(buffer, screen, 0, 0, 0, 0, 640, 480); 

Con este trozo de código, se crea un personaje semi transparente sobre un fondo, tal y como se muestra en la imagen.


Se declaran las variables que se va a utilizar, en este caso se tienen tres imagenes BITMAP, que son:
  • buffer: contiene todo lo que se desea mostrar por pantalla
  • fondo: contiene el fondo del paisaje.
  • personaje: contiene la imagen de la chica.
A continuación se inicializan las variables con sus respectivos valores. Como buffer se crea mediante el comando create_bitmap, se debe inicializar su contenido, para ello se utiliza clear_to_color(buffer, 0xFFFFFF), que rellena la imagen con el color blanco.

Se colocan las imágenes sobre el buffer mediante el comando blit, primero se pinta el fondo, segundo se pinta el personaje, y tercero se vuelve a pintar el fondo.

set_trans_blender(255, 255, 255, 128);
Este comando establece el grado de transparencia, el cuarto parámetro se encarga del canal alfa que indica la transparencia, al asignar el valor 128, se esta diciendo que tiene un 50% de transparencia.

draw_trans_sprite(buffer, personaje, 400, 180);
Dibuja un sprite transparente. El primer parámetro indica donde se va a pintar, en este caso en el buffer. El segundo parámetro, es la imagen que va a pintar transparente. El tercer y cuarto parámetro se utilizan para indicarle en que posición según x,y respectivamente.

Y finalmente con  el ultimo comando, se muestra el contenido de la imagen buffer por la pantalla.


Ejemplo 3:

   BITMAP *tmp;
   tmp = load_bitmap("allegro.bmp", NULL);
   
   blit( tmp, buffer, 0,0,0,0,640,480);
   
   drawing_mode(DRAW_MODE_TRANS, NULL, 0, 0);
   set_multiply_blender(128, 128, 128, 128);
   ellipsefill( buffer, 320,425, 95, 50, 0x000000);
   
   drawing_mode(DRAW_MODE_SOLID, NULL, 0, 0);
    
   circlefill( buffer, 320,340, 110, makecol(215,0,0));
   ellipsefill( buffer, 320,320, 105,90, makecol(255,0,0));   

   blit(buffer, screen, 0, 0, 0, 0, 640, 480);

En este ejemplo dibujaremos una esfera roja y su sombra, tal y como se muestra en la imagen.

Con las tres primeras lineas, se crea un BITMAP llamado tmp, el cual almacena la imagen allegro.bmp. Y finalmente esta imagen se pone sobre el buffer.

drawing_mode(DRAW_MODE_TRANS, NULL, 0, 0);
Como se vio anteriormente, con este comando se le indica al allegro, que se desea pintar con transparencia.

set_multiply_blender(128, 128, 128, 128);
Este comando, sirve para activar un modo de multiplicar para combinar pixels. Permite combinar las imagenes de origen y destino, multiplicando los colores para producir un color mas oscuro. Si un color se multiplica por el blanco permanece sin cambios.

ellipsefill( buffer, 320,425, 95, 50, 0x000000);
Dibuja una elipse sobre la imagen buffer, segun las coordenadas x,y de 320,425. Con un radio de 95 en el eje x y un radio de 50 en el eje y. Y lo rellena con el color negro (0x000000).

drawing_mode(DRAW_MODE_SOLID, NULL, 0, 0);
Este comando con el parametro DRAW_MODE_SOLID equivale a poner solid_mode().

Finalmente en las ultimas tres lineas, pinta un circulo relleno y una elipse, de color rojo. Y se muestra el contenido de buffer por pantalla.



Y aquí tenéis un vídeo de todo lo que se ha visto en este pequeño tutorial sobre las transparencias. Si queréis descargar el código haz click aquí.




Aquí se muestra un ejemplo donde se utilizan las transparencias para crear las sombras y dar el efecto de iluminación.
En este otro video, se utilizan las transparencias para crear el efecto de sombra, agua.

4 comentarios:

  1. muy bueno pero que hay con este masked_bilt();

    ResponderEliminar
    Respuestas
    1. el comando masked_blit() se utiliza para pintar una imagen al igual que el blit con la unica diferencia que lo que esta con el color rosado ( 0xff00ff ) no se pinta.

      Eliminar
  2. Oye bro, como puedo hacer una rutina para que el personaje se mueva con las flechas?

    ResponderEliminar
    Respuestas
    1. En el primer apartado de crear tu juego RPG. Entra en el indice y alli verás todos.
      Si no pincha en el siguiente link para ir directamente.
      Crea tu juego RPG

      Eliminar

Related Posts Plugin for WordPress, Blogger...