0

This is more of a design question.

I'd like to understand how to deal with image scale when it comes to different iphone screen sizes: 3.5 and 4 inches. I have a full-screen 568pt image for the 4inch screen. Should I create a separate image for the 3.5 case or scale down the original image? And while doing this, do I need to put a bunch of if / else blocks in my code to check the device type to determine which image to use?

Is there a cleaner way to do this?

samonderous
  • 649
  • 1
  • 10
  • 22
  • You can scale down the image using 'Aspect Fit', but it will clip the image. Better to use a 3.5" compliant image. – Sreejith Apr 30 '14 at 17:57
  • For checking if the screen is 3.5" or 4" see [this answer](http://stackoverflow.com/a/12447113/849645). Use the **`widescreen`** one not the `is_iphone5` one. – Rich Apr 30 '14 at 18:45

3 Answers3

0

If you can spare the resource sizes, it would be best to have separate assets for all the relevant screen sizes. But, to each their own on that point. An easy way to load the correct asset for the job would to be write a macro for the image name and use that in every place a image is loaded like so:

// S_IMG as in sized image?
#define S_IMG(img) [img stringByAppendingString: (([[UIScreen mainScreen] bounds].size.height == 568.0)? @"-568" : @"")]

And then when it comes to loading an image you just do

[UIImage imageNamed:S_IMG(@"horse")];

Where you'll have assets for horse.png, horse@2x.png and horse-568@2x.png

alex
  • 248
  • 2
  • 12
0

I had the same questions about screen sizes. I ended up using separate resources for each device, and detecting the screen size in code to load the correct image file.

I wrote down my steps here, how I had to scale for different screen sizes, and crop them if the aspect ratio was different. Because there were so many images, I ended up making a tool to automatically resize and crop images for each screen size for me.

rosewater
  • 604
  • 2
  • 8
  • 22
0

You can write UIImage category, UIImage + 4InchDisplay.

Overloaded

+ (Nullable UIImage *) imageNamed: (NSString *) name; // load from main bundle

Analyzing function added

+ (BOOL) has4InchDisplay
{
     return ([UIScreen mainScreen] .bounds.size.height == 568);
}

Then concatenate strings, xxx-568@2x.png

GarfieldLover
  • 1
  • 2