The REPLACE blend mode isn't an actual 'blend' in any normal sense, it is just a raw copy.  The resulting destination color is simply the source color.  It is (primarily) used internally to perform straight copy() -type operations of pixels.

 

The NORMAL constant isn't a blend mode, it's a texture coordinate mode.  However, (and quite fortunately), it has the same value as the blend mode constant BLEND, which has the same functional properties as the Photoshop mode named "Normal" - that is, BLEND is only an alpha blend, just as is Photoshop's "Normal" mode.

 

Though the docs for BLEND aren't quite correct - the linear interpolation would be more properly described as: C = A + (B-A) * factor

 

For example, here a pure red is mixed with a half-transparent pure green, producing an 'olive' (127,127,0), and you could easily verify Photoshop's "Normal" mode at 50% opacity would produce the same result (+/-1 potentially, due to possible rounding differences):

 

Short answer:  Processing doesn't have 'layers', or support 'layer opacity', so you have to do it all with color alpha.

 

Photoshop essentially has two alpha values:  an alpha value of the color, and an alpha value of the layer (called 'Opacity').

(plus you can have partial transparency in the mask, etc, so LOTS of alpha values...)

 

Processing has one alpha value:  the alpha value of the color.  However, for your use, it can be used the same as either ONE of Photoshop's alpha values.  That is, you can either think of it as solid colors with layer alpha, or alpha colors with no layer transparency.

 

It's hard to guess at exactly what you're trying to achieve, but for whatever effect you're after, all that's probably necessary is that you pre-multiply your two alpha values into one.  That is, let's say you're trying to do a 50% blend of a 50% transparent color.  As worded, Processing can't make any sense out of that request, because there's only one alpha value available.  But it'll be exactly the same result doing a 100% blend of a 25% transparent color (or a 25% blend of an opaque color, however you prefer to think about it), which Processing CAN handle.

 

BTW, to mimic the way Processing thinks about images, in Photoshop your bottom layer should always be the "Background", not a "Layer" - that is, the bottommost layer should be opaque.  Because having NO background, and layers with alpha colors, implies that the bottommost layer is itself first being alpha-blended with an imaginary empty image (which you could do in Processing, but it'll require two explicit, not implicit, blends:  one to blend Layer1 into an empty composite, then another to blend Layer2 into the previous result)  That might be another way to approach solving it if all of your 'layers' need alpha.

 

Thank you for your help and suggestions.

> It's hard to guess at exactly what you're trying to achieve

I am trying to figure out the algorithm for "NORMAL" blend mode when working with alpha. I think this would also be a useful thing to include in PImage.

Got some help here and converted the formula into p5 code below.  Hope it is helpful to others.

3. int c1;
4. int c2;
5. int c3;
6. 
   
7. 
   
8. void setup( )
9. {
10. c1 = color( 255, 0, 0, 128 );
11. float r1 = red(c1) / 255;
12. float g1 = green(c1) / 255;
13. float b1 = blue(c1) / 255;
14. float a1 = alpha(c1) / 255;
15. 
    
16. c2 = color( 0, 255, 0, 128 );
17. float r2 = red(c2) / 255;
18. float g2 = green(c2) / 255;
19. float b2 = blue(c2) / 255;
20. float a2 = alpha(c2) / 255;
21.   
22. float a3 = getAlphaChannel( a1, a2 );
23. float r3 = getRGBChannel( a1, a2, r1, r2 ) / a3; 
24. float g3 = getRGBChannel( a1, a2, g1, g2 ) / a3;
25. float b3 = getRGBChannel( a1, a2, b1, b2 ) / a3;
26. c3 = color( (int)(r3*255), (int)(g3*255), (int)(b3*255), (int)(a3*255) );
27. 
    
28. println( (r3*255) + ", " + (g3*255) + ", " + (b3*255) + ", " + (a3*255) );
29. 
    
30. }
31. 
    
32. void draw( )
33. {
34.   background( 255 );
35.   noStroke();
36. 
    
37.   fill( c1 );
38.   rect( 0, 0, 20, 20 );
39. 
    
40.   fill( c2 );
41.   rect( 10, 10, 20, 20 );
42. 
    
43.   fill( c3 );
44.   rect( 0, 21, 9, 9 );
45. }
46. 
    
47. private float getAlphaChannel( float a_b, float a_s )
48. {
49. return a_b + a_s - (a_b * a_s);
50. }
51. 
    
52. private float getRGBChannel( float a_b, float a_s, float rgb_b, float rgb_s )
53. {
54. return ( (1 - a_s) * a_b * rgb_b ) + ((1 - a_b) * a_s * rgb_s) + a_b * a_s * getBlend( "NORMAL", rgb_b, rgb_s );
55. }
56. 
    
57. //todo: more modes
58. private float getBlend( String type, float rgb_b, float rgb_s )
59. {
60. return rgb_s;
61. }