CODEWITHSUNDEEP
iphoneiosuser-interface
grasp
grasp

Reputation: 79

Proper sizes for Background Image/NagivationBar Image iOS

I'm wondering what the correct sizes are for

1) setting a background image for a UIView on various iPhone devices, including Retina, 4s, 4, etc..

(does the version of iOS matter?)

2) setting a background image for the UINavigationBar, again on those various device versions/os versions

Lastly, how should one go about naming these files. I know that Apple is very strict about naming an image with a @2x.png, with specific names, etc.

If there is documentation that somebody could point to, that would be great as well. I couldn't find anything on the dev website...

Thank you in advance.

Upvotes: 2

Views: 1493

Answers (1)

user2535467
user2535467

Reputation:

iPhone and iPod Touch Screen Pixel and UI Component Dimensions

Notes:

Retina Dimensions are given in parentheses.

All pixel dimensions include highlight or stroke effects. For example, a 30-pixel high button is actually a 29-pixel high button with a 1-pixel highlight on the bottom.

iPhone screen size:

Portrait 320×480 (640×960) pixels Landscape 480×320 (960×640) pixels

iPhone Nav bar: Portrait: 44 (88) pixels high Landscape: 32 (64) pixels high

iPhone Nav bar buttons: Portrait: 30 (60) pixels high Landscape: 24 (48) pixels high

iPhone Nav bar button icons: About 20×20 (40×40) pixels (when in Landscape mode, it shrinks the 20×20 (40×40) pixel icon)

iPhone Toolbar: 44 (88) pixels high (does not change)

iPhone Toolbar button: 30 (60) pixels high (does not change)

iPhone Toolbar button icon: about 20×20 (40×40) pixels

iPhone Tab Bar: 49 (98) pixels high (does not change)

iPhone Tab Bar icon: about 30×30 (60×60) pixels

iPad Pixel Dimensions:

iPad screen size: Portrait 768×1024 (1536×2048) pixels Landscape 1024×768 (2048×1536)

iPad Navigation Bar and Tool Bars: 44 (88) pixels high

iPad Nav Bar and Tool Bar buttons: 30 (60) pixels high

iPad Nav Bar and Tool Bar button icons: about 20×20 (40×40) pixels

iPad Tab Bar: 49 (98) pixels high

iPad Tab Bar icons: about 30×30 (60×60) pixels

iPad List View: 320 (640) pixels wide.

Follow answers in this link for the basic naming standards for the newer devices. iOS version shouldn't matter, but hardware does.

EDIT Wow, literally found all dimension on this site Check it out, it has pictures!

Another useful link here.

Upvotes: 2

Related Questions