PNG Images with alpha are pixelated on GUI image element


this is really no big deal, but I think the documentation should contain a warning that downscaled PNG images will look really ugly if they contain an alpha channel:

I spent over an hour trying to track the source of the problem. This (unsurprisingly) occurs both in image buttons (where I had the problem) and in Image objects when used directly and is obviously because alpha-testing is used instead of alpha blending. I completely understand why it’s done, but it is a bit counterintuitive.

edit: What makes this even more surprising is that with image.autoScale = true there is perfect alpha blending, just not when stretching. So alpha testing vs blending might not even be the root cause of this.


Hey this is pure html issue unfortunately :frowning:

Do you want to add a note in the doc?

1 Like

So the stretching is done through a temporary DOM element?

Everything in the (2D) GUI is done through DOM/HTML as it is using canvas.getContext(β€œ2d”) to get a context and is using it to draw things in it (for eg, pictures are blit by using the drawImage function of the context).

1 Like

Interesting! I never realized that. The performance is excellent!

1 Like

It is well optimized :stuck_out_tongue: