Allegro.cc - Online Community

Allegro.cc Forums » Programming Questions » Blending only part of an ALLEGRO_BITMAP

This thread is locked; no one can reply to it. rss feed Print
Blending only part of an ALLEGRO_BITMAP
Cassio Renan
Member #14,189
April 2012
avatar

Hi,
I've been struggling with a problem in a GUI I'm making for a simple game(basically, a learning experience for me)

I'm trying to make windows of varied sizes using a default .png skin file(this is a crappy one quickly done just to demonstrate):

606447

It has a 16 pixels(square) sized corner, two 32x16 borders(one vertical and one horizontal) and a 32x32 sized walpaper.
To draw a window, I simply strech the walpaper to the desired size, and then add the borders and corners to it, using the flags ALLEGRO_FLIP_HORIZONTAL and ALLEGRO_FLIP_VERTICAL when necessary.

This is an example of the type of window this method produces(Not actually done ingame, but in GIMP. Did only a single corner to demonstrate the issue). A 100x100 window:

606448

A close look at the corner of the window will reveal the problem. I need the alpha channel of the outer part of the border to ovewrite the color of the walpaper completely, no to blend with it, but I need the inner part of the border to still blend with the walpaper.

thoughts?

thanks in advance.

EDIT: "procudes" ;D

SiegeLord
Member #7,827
October 2006
avatar

I need the alpha channel of the outer part of the border to ovewrite the color of the walpaper completely, no to blend with it, but I need the inner part of the border to still blend with the walpaper.

I'm confused. Why not make the outer part opaque (alpha = 255) and the inner part transparent (alpha = 0) ?

"For in much wisdom is much grief: and he that increases knowledge increases sorrow."-Ecclesiastes 1:18
[SiegeLord's Abode][Codes]:[DAllegro5]:[RustAllegro]

Cassio Renan
Member #14,189
April 2012
avatar

SiegeLord said:

Why not make the outer part opaque (alpha = 255) and the inner part transparent (alpha = 0)

I get the point, but the outer part still needs to blend with the rest of the screen, and I want to support any alpha value to increase the anti-aliasing quality(that is, to avoid rough edges on the windows).

Edgar Reynaldo
Member #8,592
May 2007
avatar

SiegeLord
Member #7,827
October 2006
avatar

I get the point, but the outer part still needs to blend with the rest of the screen, and I want to support any alpha value to increase the anti-aliasing quality(that is, to avoid rough edges on the windows).

I think I sort of get it, but I don't think you'll be able to get away without having a dedicated mask.

ALLEGRO_BITMAP* mask; //has alpha = 0 on the outside of the border and alpha = 1 on the inside
ALLEGRO_BITMAP* wallpaper; //already pre-scaled
al_set_target_bitmap(wallpaper);
al_set_separate_blender(ALLEGRO_ADD, ALLEGRO_ZERO, ALLEGRO_ONE, ALLEGRO_ADD, ALLEGRO_ONE, ALLEGRO_ZERO); //set a blender that transfers the alpha channel from one bitmap to another
al_draw_bitmap(mask, 0, 0, 0); //now wallpaper has the outer portions masked out

"For in much wisdom is much grief: and he that increases knowledge increases sorrow."-Ecclesiastes 1:18
[SiegeLord's Abode][Codes]:[DAllegro5]:[RustAllegro]

Cassio Renan
Member #14,189
April 2012
avatar

That's a really good sollution(probably the most flexible one), but having to do a mask image along with the skin image makes me feel lazy(I really have no better excuse).

For now, I'll be declaring a variable offset for streching the wallpaper(An offset of 3 will mean the wallpaper will leave a three-pixel border when streching, leaving room for the border's alpha to do its job). I'm planning on having an easily make-a-ble(sorry, my bad english can't guess a better word for this) skin file: a zip file containing the png file and a configuration value with some values(wallpaper size, corner size, and now offset)

Here is a window drawn using offset = 3:

{"name":"606449","src":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/d\/3\/d3b355e6eebd17cde8e71bff500493df.png","w":642,"h":509,"tn":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/d\/3\/d3b355e6eebd17cde8e71bff500493df"}606449

Using this skin:

606450

Go to: