Image has white/grey edges.

By Omegas7 Date 2012-06-17 06:22

Here's a bit of an image I use in my game:

See, no outline at all. But when I put my image in my game, this happens:

The purple background is alright (just another image). What I mean is the outline that suddenly appears: some kind of grey outline.

Why is that? This isn't happening with my other images... One thing worth mentioning that *might* be causing this is that these images are big (at least larger than 1000x650).

Ruby. Gosu. Windows 7.

By lol_o2 Date 2012-06-17 09:40

Outline appears when image has decimal point in position (like when you drawing it at 25.5) or it's not tileable. So either try drawing with integer coordinates (if you don't) or initialize it with enabled tileability ( Image.new(window, path, true) ).

By jlnr (dev) Date 2012-06-17 17:18

What often happens is that PNG files have transparent areas in an undesired color, say white with alpha = 0. By themselves, all pixels with alpha = 0 naturally look the same, they're invisible.

When your image gets shrunk during rendering, though, your brown pixels will be "merged" with adjacent transparent grey pixels. The result has an alpha value that is inbetween solid and transparent, and the color will be a mix of brown and white.

If the image is not rotated or stretched and drawn at integer positions, this does not cause problems (see lol_o2's response). But the real solution is to make sure your transparent pixels have the right color. I'm not sure if other editors are better, but it's a PITA in Photoshop for complex images.

A hacky solution is often to just fill the transparent areas with #ff00ff and let Gosu load the image as BMP. Gosu replaces #ff00ff pixels in BMP files with the average color of adjacent pixels (except with alpha = 0), which looks great when stretching and rotating.

By Omegas7 Date 2012-06-18 06:35

@lol_o2:

My image was indeed being drawn with float values. I fixed it now to integer. Also set it to tileable. However, the problem persists.

@jlnr:

The .bmp solution worked. Although I would prefer to use .png files... however, lol_o2's solution doesn't seem to be working with me.