CODEWITHSUNDEEP
iphoneopengl-esretina-display
Aaron
Aaron

Reputation: 1342

Retina display image quality problem

I was trying to make my OPENGL ES app to support for retina display. I've added the image with @2x extension and made the contentscale factor to 2. The high resolution image is coming in the screen correctly but it suffers great loss of quality. The edges and blurred and it doesn't have quality of image I added into the resource folder.

How can I fix this?

Upvotes: 6

Views: 2012

Answers (3)

Quintin Willison
Quintin Willison

Reputation: 630

My app is based on the default framework and I was getting this issue when running on a Retina based device. Specifically my framebuffer was being created at 320x480 rather than 640x960 as I wanted. Sorry James but this is NOT automatic because the problem is with the framebuffer created by renderBufferStorage:fromDrawable: (which calls glRenderbufferStorage on our behalf but specifies layout pixels rather than native device pixels for width and height by default).

I added the following code below line lines which set eaglLayer.drawableProperties in initWithCoder: in EAGLView.m:

UIScreen *mainScreen = [UIScreen mainScreen];
if ([mainScreen respondsToSelector:@selector(scale)])
{
    // iOS 4.0 and up (further to simeon's comment)
    const CGFloat scale = mainScreen.scale;
    self.contentScaleFactor = scale;
    eaglLayer.contentsScale = scale;
}

Thanks to David Amador's post for pointing me in the right direction. Thanks, more recently, to simeon's helpful comments.

Upvotes: 5

simeon
simeon

Reputation: 4626

In your EAGLView.m initWithCoder: method, add the following code:

if( [[UIScreen mainScreen] respondsToSelector:@selector(scale)] )
{
    self.contentScaleFactor = [[UIScreen mainScreen] scale];   
}

Upvotes: 1

James Bedford
James Bedford

Reputation: 28962

OpenGLES will be rendered at the greatest possible resolution on the retina display automatically (given you've set your viewport to the width and height of the screen, etc. etc.) so the problem comes from your OpenGL rendering.

OpenGLES doesn't care about the suffix @2X you've appended to the image (this is for Cocoa Touch frameworks). It does, however, care about the resolution of the image. For the best results, you should use square images that are a width and height that is a power of two (e.g. 1024, 2048 etc.).

You should ensure that when you're loading the texure into OpenGLES that you're using the correct image format, and that you're not compressing it in any way.

The other thing you should experiment with is the texture parameters. For example:

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);

I hope this points you in the right direction.

Upvotes: -1

Related Questions