Weird behavior of alpha transparency

[Mederic]

Hi,

While exploring the scene module, I noticed that the transparency of SpriteNodes, using the BLEND_NORMAL mode, doesn’t behave the same way as in other apps (like Procreate).

Basically, when I use a SpriteNode with a png texture with an alpha channel going continuously from alpha=1 to alpha=0, the picture is always darkened in the intermediate values of alpha.

I took a screen capture but I don’t know how to insert it in the post.

Essentially, I took a white image with a blurry alpha contour and used it as a SpriteNode’s texture in Pythonista. The background was white as well. When I do the same thing in Procreate, the image is still completely white, but when I do it in Pythonista, there is a very noticeable seam around the alpha contour (the parts where alpha is strictly between 0 and 1).

This is strange because I thought the blending formula was (1-alpha)xbackground_color + alphaxfront_color

So if both background_color and front_color are white (=1), the result should still be 1 regardless of the value of alpha.

[cvp]

@Mederic I don't have any answer but here you have a little script to:

• pick a picture from your camera roll
• send it to imgur
• get in the clipboard the url where you can find it
  You still have to paste this url in this forum and we will see it.

import pyimgur,photos,clipboard,os,console
i=photos.pick_image()
print(i.format)
format = 'gif' if (i.format == 'GIF') else 'jpg'
i.save('img.'+format)
clipboard.set(pyimgur.Imgur("303d632d723a549").upload_image('img.'+format, title="Uploaded-Image").link)
console.hud_alert("link copied!")
os.remove('img.'+format)

[omz]

I think this may have to do with whether or not the alpha channel of your image is pre-multiplied or not, but frankly, I don't remember the details off-hand.

[Mederic]

Thank you for your answers,

@cvp I tried your script but I get the error “No module named pyimgur”

@omz I thought this as well, the thing is I exported the image out of Procreate in the .png format and also imported it in an app called “Animation and Drawing by Do Ink” and the issue wasn’t there. So the problem definitely is about how Pythonista handles the image. Maybe the solution would be that I write a custom shader.

[Mederic]

Here is my custom shader. It’s not very clean since it basically divides by alpha to cancel the premultiplication... so it lowers the image’s quality for small alphas, but it’s okay for my current purpose.

Ideally though, I would like to prevent OpenGL from premultplying by alpha in the first place.

precision highp float;
varying vec2 v_tex_coord;
// These uniforms are set automatically:
uniform sampler2D u_texture;
uniform float u_time;
uniform vec2 u_sprite_size;

void main(void) {
		vec4 tex=texture2D(u_texture,v_tex_coord);
		if(tex.a>0.05){
    	gl_FragColor = vec4(min(tex.rgb/tex.a,1.0), tex.a);
		}
		else{
			gl_FragColor = vec4(tex.rgb,0.0);
		}
}```

[cvp]

@Mederic I'm very sorry but I forgot to answer 😢
You can find pyimgur here