0

I'm looking for some help with the new storeyboards and size classes in xcode 6. I'm looking to build a fairly simple interface with a few labels and text field, however I'm having problems making this look correct for the different devices.

As you can see from the attached image iphone 6 picks up the constraints and size set for the iphone, which looks daft (forcing the label for Score, for example, closer to the left because of the constraint) and doesn't make use of the screen size. Is there no way in xcode to build a layout and have it proportionately adjust to the screen size? Buttons and labels increase in size by x amount?

I can build completely separately for ipad and iphone and was happy to do this in previous versions of xcode but this seems to be defeating the whole point of size classes, and even if I was to do this my problem is still the iphone 6 and 6 plus which would pick up the iphone layout and look ridiculous.

I'm tearing my hair out with this so would appreciate any help.

enter image description here

user1759949
  • 189
  • 1
  • 3
  • 11

2 Answers2

0

Maybe constraint the lower elements to the bottom of the screen rather than the top. Other than that I think you don't have many options.

Sameer J
  • 226
  • 3
  • 13
0

You can change your layout for different views using compact and regular widths and heights. Click on wAnyhAny at the bottom of your screen. This will provide a grid view pop up, which lets you customize view for different screen sizes. As you select different boxes, the bottom will tell you what size the view applies to. Screenshot of XCode

You can change four things in a size class:

 1. The constant for a constraint
 2. If a constraint is installed in the view hierarchy
 3. If a view is installed in the view hierarchy 
 4. The font used for many types of views showing text

This means if you want a different label or constraint for your iPad view, you can add that constraint just for that view using size classes.

leenyburger
  • 1,198
  • 1
  • 11
  • 23
  • Hi, thanks for your response but I'm still not sure how this works for the iPhone 6 and 6 plus. The problem I have is that laying out a screen for iPhone only will include these two phones, which are larger. The issue then is that the larger iphones look silly because the contraints are better suited for the smaller phone. I can't seem to get round this. I'm fine with the difference between ipad and iphone, I can map these out completely differently. I also can't see how the font sizes work for the larger phones. Again, I can work this for the ipad but not the large iphone. – user1759949 Oct 06 '14 at 21:08
  • Do you have a "trailing edge to container" constraint for your labels? If you use a leading edge to container, pin the horizontal widths and a trailing edge to container constraint then the labels should be centered properly. Check out this answer it may help : http://stackoverflow.com/questions/25756087/detecting-iphone-6-6-screen-sizes-in-point-values – leenyburger Oct 08 '14 at 12:57
  • I think if you don't add a launch image it will automatically scale. – leenyburger Oct 08 '14 at 23:53
  • I'm not sure I understand the link. They seem to be trying to reverse the scaling that I can't seem to get in the first place. I don't have any launch images in my app. – user1759949 Oct 16 '14 at 20:33