ios - 3.5" layout cutting off bottom of screen

Question

I have an app that is cutting the bottom toolbar off for a 3.5" screen (the add or update photos bar in screenshots below). For a 4" screen everything works perfectly.

This only happens when i run the app in the simulator. The preview in the storyboard looks fine both for 4" and 3.5". enter image description here

I do suspect auto-layout issues, but I really don't know how to approach the problem as it's fine in the storyboard view. What is the correct approach is using autolayout to make the tableview shrink with less vertical size?

thanks for any help!

you need to use auto-layout or constraints to over come this problem — The iOSDev, Jan 04 '14 at 04:40
I am using auto-layout... the tableview is taking up the entire bottom of the screen in 3.5". How to I make the toolbar at the bottom have precedence over the tableview? and why does it work fine in the storyboard view? — phil swenson, Jan 04 '14 at 04:50
if not just set one for it's bottom to stick with the view's bottom edge :) — The iOSDev, Jan 04 '14 at 04:57

The iOSDev · Answer 1 · 2014-01-04T05:18:20.673

9

First this is you need to Uncheck the option in storyboard which is by default enable or checked in iOS 7

Set edges of view

End then if problem is not solved you need to enable the Auto-layout in storyboard by checking the option shown in below images

select tab

&

Enable autolayout

Update 1

If you want to apply constraint follow these steps:

Step 1

Step 2

Step 3

& if it gives any warning or error add other required constraints

edited Jan 04 '14 at 05:18

answered Jan 04 '14 at 04:52

The iOSDev

5,237
7
41
78

1

*shudders* am I the only one who hates Auto Layout and its completely ridiculous complexity? – gotnull Feb 02 '15 at 22:55

digitalHound · Answer 2 · 2014-01-04T05:11:07.000

I solved that issue by doing this.

I have a series of macros (thanks to someone else's answer on stackoverflow months ago) that I use to determine which device is being used. They are:

#define IS_IPAD                 (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad)
#define IS_IPHONE               (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone)
#define IS_IPHONE_5             (IS_IPHONE && [[UIScreen mainScreen]bounds].size.height == 568.0f)

I know some people are against using macros and for good reason, but I find them useful in some cases. So, to be thorough the macros can be written as methods instead.

-(BOOL)isIpad  {return UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad ? YES : NO;}
-(BOOL)isIphone {return UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone ? YES : NO;}
-(BOOL)isIphone5  {return ([self isIphone] && [[UIScreen mainScreen]bounds].size.height == 568.0f) ? YES : NO;}

I place these in a .h file that I use specifically for macros called ResourceConstants.h. I import this file into any class I need to use them in.

Once these are defined, go to your -viewDidLoad method in the view controller and set your views frame like so:

if (IS_IPHONE)
    self.view.frame = CGRectMake(0, 0, 320, 480);

-- EDIT -- You may also need to adjust the placement/size of objects/Widgets on your screen since the whole screen is a half inch shorter. You can do it the same way as long as you have created property outlets on your view controller to reference any objects on screen that you need to resize. Like so,

 self.myobject.frame = CGRectMake(myTopLeftCornerXCoord, myTopLeftCornerYCoord, myWidth, myHeight);

Hope that helps! :)

score 0 · Answer 3 · answered Jan 04 '14 at 05:04

0

Thanks Claric, I didn't know about the simulated metrics settings. But that didn't actually solve the issue...

But I ended up solving the problem by deleting all my constraints and creating them again. Then it magically worked.

answered Jan 04 '14 at 05:04

phil swenson

8,564
20
74
99

That is the easiest way to do it :) – The iOSDev Jan 04 '14 at 05:19
Sorry about it, I just forget to tell you that first :) – The iOSDev Jan 04 '14 at 05:19

ios - 3.5" layout cutting off bottom of screen

3 Answers3