Aliasing issue with GPUImageView

Question

I get weird black aliasing on a transparent text GPUImagePicture blended with a base GPUImagePicture with a GPUImageView as the final target. This is what I'm doing:

textOverlay = [[GPUImagePicture alloc] initWithImage:self.rootViewController.previewImageTextOverlay];
GPUImageAlphaBlendFilter *textBlend = [[[GPUImageAlphaBlendFilter alloc] init] autorelease];
[upstreamOutputFilter addTarget:textBlend];
[textOverlay addTarget:textBlend];
[textBlend addTarget:gpuPreviewImageView];
[textOverlay processImage];

_{(source: kevinharringtonphoto.com)}

How do I remove the aliasing?

I want this (which I get by stacking two UIImages):
_{(source: kevinharringtonphoto.com)}

Answer 1

I investigated and found this to be a bug with GPUImageAlphaBlendFilter. The problem is that the shader code doesn't take into account the pre-multiplied alpha of the second image.

Here is a quick fix:

Replace

gl_FragColor = vec4(mix(textureColor.rgb, textureColor2.rgb, 
                        textureColor2.a * mixturePercent), textureColor.a);

With:

if (textureColor2.a == 0.0) {
   gl_FragColor = textureColor;
} else {
   gl_FragColor = vec4(mix(textureColor.rgb, textureColor2.rgb / textureColor2.a,
                           mixturePercent * textureColor2.a), textureColor.a);
}

There is probably some nice way to do this with the shader that doesn't involve branching, but this works fine.