Manually alpha blending an RGBA pixel with an RGB pixel

mmurphy picture mmurphy · Jan 26, 2012 · Viewed 19.7k times · Source

I am trying to do an alpha blend operation of an RGBA image (foreground image), on to a RGB image (background image). However, while doing so I think I may be doing the wrong alpha blending operation or doing it wrong. For example, the pixel of my RGB image is a grayish color of (127, 127, 127). The pixel of my RGBA image for the pixel will be (0, 0, 255). After I do my blending operation, the final color will be (127, 0, 255). However, I thought that was more of an additive blend and different than the operation I am doing.

For how my values are set, take a look at this

incPixelColor[0] = 0; (red)
incPixelColor[1] = 0; (green)
incPixelColor[2] = 255; (blue)
incPixelColor[3] = 255; (alpha)

currentPixelColor[0] = 127; (red)
currentPixelColor[1] = 127; (green)
currentPixelColor[2] = 127; (blue)

For how my calculation is set, take a look at this

float incAlpha = (currentPixelColor[3]/255.0f);

float red = ((float)incPixelColor[0]/255.0f * incAlpha) + ((float)currentPixelColor[0]/255.0f);
float green = ((float)incPixelColor[1]/255.0f * incAlpha) + ((float)currentPixelColor[1]/255.0f);
float blue = ((float)incPixelColor[2]/255.0f * incAlpha) + ((float)currentPixelColor[2]/255.0f);


currentPixelColor[0] = min(red * 255, 255.0f);
currentPixelColor[1] = min(green * 255, 255.0f);
currentPixelColor[2] = min(blue * 255, 255.0f);

For pixels with no alpha, I would like for the value to be (0, 0, 255) then for images with alpha I would like for it to blend in. At the end of the operation above, it will be (127, 127, 255). Should I check to see if there is alpha for every pixel, and if so, then do the blend or is there another way to do this?

Answer

user1118321 picture user1118321 · Jan 26, 2012

A typical "Over" blend is done in the following way:

outputRed = (foregroundRed * foregroundAlpha) + (backgroundRed * (1.0 - foregroundAlpha));

And then repeating for the blue and green channels. Do this for every pixel.