Glitch when drawing resized Image on top of OpenGL

I have a problem with drawing resized 2D images on top of an OpenGL view. Images tend to get a 1 pixel border filled with junk data of various colors. I could easily recreate the problem in the Juce Demo (OpenGLDemo.cpp) like so:


// put this class anywhere
class GlitchImage : public Component {
public:
GlitchImage(int width, int height) : im(Image::RGB, 100, 100, true) {
setSize(width, height);
Graphics g(im);
g.setColour(Colour(.5f, .5f, .5f, .5f));
g.fillRect(50, 50, 1000, 10);
}
void paint(Graphics& g) {
g.drawImageTransformed(im, AffineTransform::scale(2.0, 2.0));
}
Image im;
};

// now put these two lines at the bottom of the DemoControlsOverlay constructor:
GlitchImage *GI = new GlitchImage(500, 500); // leak...
addAndMakeVisible(GI);</pre>

The numbers don't really matter, I just put them in at random.

Here's a screenshot of what it looks like on my mac (this is retina but it's similar on my old non-retina):

Some observations:

  • The same happens for opaque images, although transparency makes it easier to spot
  • It's the same with images loaded from file
  • It tends to be bottom row and rightmost column of pixels that are tainted, although colors tend to change on each run
  • On some runs it looks fine, but most times the glitch is there
  • The same happens with rotations, skews etc.
  • It doesn't seem to happen for images with size 2^N, which leads one to think it has something to do with OpenGL textures...

Could be something to do with the driver's GL texture handling, but very hard to know without debugging it.. For us to look at it, we'd need some example code that reproduces it, I think.

Thank you for your quick response Jules. I tried to make it real easy to reproduce. The above code is annotated for how to insert it into OpenGLDemo.cpp from your demo project. However if it's easier for you to insert the entire file, here it is:

https://dl.dropboxusercontent.com/u/4360597/OpenGLDemo.cpp

you can #define JUCE_OPENGL_ALLOW_NON_POWER_OF_TWO_TEXTURES (1)

See

http://www.juce.com/forum/topic/opengl-renderer-glitch-retina

I've tried settings this flag all over my app and am still getting this issue, do I need to declare that define statement in a certain place?

 

EDIT: 

I placed it at the top of the glTexture.cpp & it worked

Just define it as a preprocessor definition in the Introjucer so it's available to all files.

ahh i see, awesome. thanks dave!

Hi,

I get report of 1px multicoloured line around my widgets with some graphic card.

Could this JUCE_OPENGL_ALLOW_NON_POWER_OF_TWO_TEXTURES
be detected at runtime ?

See

Thanks !

Nice idea, I’ve made that change here:

Thanks!

1 Like