CODEWITHSUNDEEP
uiimageiphone-5
edelaney05
edelaney05

Reputation: 6987

iPhone 5 - Background images

With the new screen resolution and aspect ratio of iPhone 5 it seems there are two approaches to take advantage of the new screen real estate when handling images that are full screen (or mostly full screen) images:

(There are other methods also: stretching, tiling, and / or drawing with Quartz.)

Both of these options have drawbacks:

I am particularly interested in understanding the details of the second drawback better.

I am thinking it would save the app bundle (and my designer) if I could use this consolidating images idea further...

Let's say I have an image that take up 320pt x 480pt in portrait and 480pt x 320pt in landscape (width x height).

(EDIT: Initially I hadn't considered a couple of other important tidbits. For sake of completeness, I'm including those thoughts here)

If we create a single image file at a 480pt x 480pt resolution instead of landscape and portrait files, it would prevent the app bundle from having two files that which each contain 320pt x 320pt area of duplicate image data. However, this large square image would include four 80pt x 80pt quadrants in the corners that won't be seen. All things equal, we should still have 20% less image data in the app bundle.

Having re-read Bill's "iBooks Author Experiment", the memory requirements are very easy to figure out:

The memory required to load the large square is 50% more then loading the image sized correctly for the screen. Clearly the savings in the app bundle don't measure up to this hit on resources!

But, what about extending this to a giant square that would encompass iPhone 5 and iPhone 4 - 568pt x 568pt? Instead of four files (iP4 landscape, iP4 portrait, iP5 landscape, iP5 portrait), there would be only one file in the app bundle (giant square). The savings could be about 60%.

What about the resources hit?

That's 110% more memory for iPhone 4, and 77.5% more memory for iPhone 5.

My original question was roughly two parts: 1. Do I understand this correctly and 2. is this tradeoff a wise one to make.

I hope my edits (spurred by Bill's answer) show that I do understand this stuff now. And, if the new found knowledge is correct, then #2 pretty much answers itself. :-)

Upvotes: 1

Views: 2201

Answers (1)

Bill Dudney
Bill Dudney

Reputation: 3358

Generally you get it.

Assuming that you have the big square image and it's some kind of tiled pattern (linen etc) then you could use ImageIO to load the cropped image at the size you need which would use some extra memory decompressing the image but once done it would consume only what is needed to fill the background.

I would suggest against scaling the image.

On the flip side though, shipping an app with 3 images (foo, foo@2x and foo-h568@2x) instead of 1 makes way more sense. The only way I'd say you should go with one image is if you are close to the 3G/LTE download size of (I think) 50MB.

Upvotes: 2

Related Questions