12

lets assume an alpha of 1 means fully opaque and 0 means fully transparent. lets say i have two black images which have 50% transparency (alpha = 0.5).

if they are laid on top of each other, the resulting transparency is 0.75, right?

if they would have an alpha of 0.25 , the result would be around 0.5, right?

if they would have an alpha of 0.9 , the result would be around 0.97, right?

how can you get to these numbers?

in other words i am looking for a function that gets the resulting alpha value from two other alpha value.

float alpha = f(float alphaBelow, float alphaAbove)
{
     //TODO implement
}
clamp
  • 33,000
  • 75
  • 203
  • 299
  • Conventionally, the color is opaque when alpha = 1, and fully transparent when alpha = 0. So the resulting alpha of laying a 50% on top of 50% should be 25%, not 75%. – kennytm Sep 07 '10 at 12:54
  • @KennyTM, ok, i will edit my post to work with floats from 0 to 1 – clamp Sep 07 '10 at 12:58

3 Answers3

9

This answer is mathematically the same as Jason's answer, but this is the actual formula as you'll find it in reference material.

float blend(float alphaBelow, float alphaAbove) 
{ 
    return alphaBelow + (1.0 - alphaBelow) * alphaAbove; 
}
Community
  • 1
  • 1
Mark Ransom
  • 299,747
  • 42
  • 398
  • 622
8
float blend(float alphaBelow, float alphaAbove)
{
    return alphaBelow + alphaAbove - alphaBelow * alphaAbove;
}

This function assumes both parameters are 0..1, where 0 is fully transparent and 1 is fully opaque.

Jason
  • 28,040
  • 10
  • 64
  • 64
  • thanks, it is almost like my wished result. it's just that when i compare the result with two images on top of each other in photoshop, the photoshop version seems to have a little higher alpha values. – clamp Sep 07 '10 at 13:02
4

Photoshop does the following calculation:

float blend(float alphaBelow, float alphaAbove)
{
    return min(1,alphaBelow+(1-alphaBelow)*alphaAbove);
}
CHP
  • 131
  • 1
  • 5