ios - How can I find the 'safe region' for iPhone size if I am creating my app using iPad size? -
i creating game , want use ipad size settings (landscape: 1024x768). i've learnt, using ipad settings crop out part of height on iphone. have 2048x1536 background image ipad (1024x768) , 2208x1242 image iphone 6+ (736x414),
i. how can determine 'safe region' ipad appear on iphone 6+ both point , pixel wise?
ii. 'safe region' iphone 6+ same iphone 6 (667x375) 1334x750 image? if not, how can determined both point , pixel wise?
i assume wish create universal game runs both on ipad , iphone. if that's case, there 2 possible approaches when defining graphics assets in attributes inspector (far right on xcode interface while assets.xcassets selected). in devices section, can select among universal, iphone, ipad, apple watch, apple tv, mac , combination of those.
if select "universal" only, have make sure assets insert there both on iphone , ipad. if that's case, see below hints of how make assets safe using universally.
if select "ipad" , "iphone", have include separate assets ipad , iphone, appropriate resolutions , aspect ratios. in past experience, i've headed way. ipad (1x) have provide 1024x768 background, ipad (2x) have provide 2048x1536, unless choose "single scale" , use single vector pdf file. respectively, iphone, have provide 480x320 (1x, in case need support old devices such iphone 3g/3gs, quite unlikely given fact sprite-kit introduced ios7), 1334x750 (2x), , 2208x1242 (3x, iphone 6+, 6s+, 7+). approach don't need worry "safe" zones, graphics supply used on each device no "cutting" off edge. bear in mind iphone 4s , iphone 5/5s/se need background scaling in order fit whole 2x picture on screen. otherwise zoomed in.
if go first approach, should consider following information in order make "universal" graphics safe use devices: iphone 5/5s/se...and newer have 16:9 display aspect ratio. iphone 4s has 3:2 aspect ratio (you worry if game support ios 9). ipad screen aspect ratio 4:3.
with above in mind, there 2 paths go: 1. use 16:9 universal assets have left/right parts cut off on ipad , iphone 4s. 2. use 4:3 universal assets have upper/lower parts cut off on iphones.
the above applies 2x assets these used both retina ipads , retina iphones (4s, 5/5s, se, 6/6s/7).
1x assets used non-retina ipads (ipad 2 in case support ios 9, otherwise skip these too).
3x assets used "plus" iphone models. suggest provide these in 16:9 ratio (2208x1242) only.
so, how calculate "safe" zones. pretty straightforward:
case 1 (16:9 assets used ipad too): height 1536 (this retina ipad height in pixels, although if wish pixel-perfect on ipad pro 12.9" should increase 2048), width = 1536 * 16 / 9 = 2732 pixels wide (3640 pixels ipad pro support). note have scale down in run-time in order fit iphones. in order avoid cutting off important content background, don't put left or right of middle 2048 pixels of 2732x1536 universal image (342 pixel "danger" zones on left , right). if go 3640x2048 image (supporting ipad pro 12.9"), use middle 2732 pixels, leaving unimportant stuff in 454-pixel-wide left , right boundaries.
case 1b (same above smaller image): approach use native (iphone 6/6s/7) 1334/750 pixels image, have scale ipads, , scale down iphone 4s/5/5s/se. in case, "safe" zone 1000x750 (visible both on 4:3 ipads , 16:9 iphones).
case 2 (4:3 assets used iphones too): 2x assets use 2048x1536 pixel images. depending on how position sprite on screen there loses on upper and/or lower parts. if it's centered, "safe" zone 2048 / 16 * 9 = 1152, leads 2048x1152 in middle of 2048x1536 asset.
if need further clarification happy elaborate.
Comments
Post a Comment