0

I'm developing an app which will is only directed towards iphone 5, 6 and 6+ devices. Since all of these devices have the same dimension ratio, how do I setup auto layout to resize everything exactly the same for all the different iphone sizes - or should i not use auto layout at all?

Trying size classes "any w/any h", i am not able to get the desired result:

enter image description here

royherma
  • 4,095
  • 1
  • 31
  • 42

4 Answers4

0

You'll get a lot of different answers on this topic, but I think Autolayout is the easiest route to go. At the bottom of the Interface Builder screen, you can switch between different screen sizes. It looks this: like this.

First, you'd set up your constraints for "w: Any h: Any". If there are any "special circumstances", such as screen that are compact, you would switch that button to select the size you wish to configure constraints for and update them accordingly.

Update

If you want to keep items proportionally in the same place on different screens, you can add some UIView objects to your storyboard that will serve as spacing placeholders. There's need to specify class or anything like that for these placeholders (though you might want to change the background of them). Then, configure your constraints.

Update 2 Looking at the images you posted, it appears you might not have constraints set (correctly?) for the buttons at the bottom (cancel, connect, done). You want those buttons to display at the bottom on every screen size, right?

Adrian
  • 16,233
  • 18
  • 112
  • 180
  • It looks like you are talking about size-classes, not auto-layout specifically. Correct me if I'm wrong? – royherma Nov 16 '15 at 23:41
  • Auto layout will do the work for you when you specify the size class in interface builder. I would start with any x any and cross the issues bridge if/when you get to it. – Adrian Nov 17 '15 at 00:09
  • you can ignore the "bottom bar", mostly look at the textfields, and how in the 4 inch screen they overflow to the right side of the screen, whereas they should leave some space as in the storyboard on the left... – royherma Nov 19 '15 at 15:15
0

Did you set up any Constraints? Either you didn't set any and that's the problem, or you forgot to set some.

Here's a tutorial that might help you: http://www.raywenderlich.com/113768/adaptive-layout-tutorial-in-ios-9-getting-started

Jeremy
  • 1,461
  • 12
  • 26
0

As others have noted, autolayout is a good solution for this. You could also consider using table views with static content. iOS will automatically adjust the size of your table view and its contents to fit the available space. See this article for an example:

http://www.oliverfoggin.com/using-a-static-uitableview-as-a-layout-device/

MarkupKit is an open-source framework that can help you with either approach (I'm the project's author). It provides classes that abstract the details of autolayout so you don't need to deal with it yourself. Here's the same example as above implemented using MarkupKit:

http://gkbrown.org/2015/11/01/using-a-static-uitableview-as-a-layout-device-markupkit-edition/

Greg Brown
  • 3,168
  • 1
  • 27
  • 37
0

You can achieve this by disabling size class and using proportional width and height constraint for elements and UIView with dynamic size for the spacing between the elements. Also those dynamic UIView will be created by using proportional width and height constraints. I have made several apps which were looks exactly same in iPhone 5, 6, 6 Plus, 6S, 6S Plus simulators. I have measured by taking screenshots of simulator. The answer of this question will be too huge if i explain everything. But an not able to explain anything as i don't have any requirement mockup regarding which i can suggest you things. If you have the mockup for iPhone 5 post it here. I will create a sample Git repo and i will add constraints to elements and you will analyse that. Also most complex screens with hide show popup elements inside screens can be made dynamic size using my method. Problem is i cannot explain everything. I have answered some questions in the below links. You can watch them to get idea what i am trying to explain.

https://stackoverflow.com/a/31336272/4030971

https://stackoverflow.com/a/31156987/4030971

https://stackoverflow.com/a/31915676/4030971

https://stackoverflow.com/a/31870625/4030971

https://stackoverflow.com/a/31447103/4030971

https://stackoverflow.com/a/31431519/4030971

Community
  • 1
  • 1
Mahesh Agrawal
  • 3,348
  • 20
  • 34