Question

I’m trying to manually force iOS to load a 2x version of an file image file. I’m doing this to save resources – I need that graphic for the iPhone version, and I want to use it at a scale of 1:1 for the iPad version.

To do this I can’t use initWithContentsOfFile because iOS gives my the x1 version even if I add x2 onto the filename. Instead, I use this code:

NSString *filename = [myImage filenameWithSuffix:@"@2x"];
UIImage *image = [[UIImage alloc] initWithCGImage:[[UIImage imageWithData:[NSData dataWithContentsOfFile:filename]] CGImage]
                                            scale:1.0
                                      orientation:UIImageOrientationUp];

UIImageView *imageView = [[UIImageView alloc] initWithImage:image];

That works. I’m 100% sure that it’s picking up the x2 version (I changed that graphic to make sure).

However, when it’s displayed on the screen, at the correct size, it’s blurry. In fact, it looks like the x1 version blown up to 200%, so iOS is doing something odd to my image.

I have ensured that the images are being drawn on pixel boundaries.

UPDATE:

Even if I create another image file without the x2 suffix and use initWithContentsOfFile to load it, it’s still blurred. So this has nothing to do with how it’s being loaded.

Other than pixel misalignment, what can cause image degradation?

Note that I’ve taken a screenshot and compare the image to the original in Photoshop. It’s exactly the same size, so scaling isn’t the issue.

Answer 1

I’ve solved this issue, and I’m embarrassed to say that it was due to pixel alignment.

I discovered that the iOS simulator can highlight misaligned images, and that proved that the images were indeed misaligned. I then logged the position of every view from the image upwards in order to find the one that was causing the problem. This snippet proved its weight in gold several times:

    NSLog(@"View details");
    UIView *view = theImageView;
    while (view)
    {
        NSLog(@"%@", view);
        view = [view superview];
    }