CODEWITHSUNDEEP
iosautolayoutinterface-builder
propstm
propstm

Reputation: 3629

How should I build autolayout constraints varied by iPhone Devices

I am attempting to vary my auto layout constraint by iPhone version. The vary for traits allows you to differ by size classes. However all the iPhones in portrait orientation are all compact width and regular height.

Assuming I have an element that is horizontally centered but I want my distance from the top of my main view to vary based upon device size, how should I accomplish this?

Upvotes: 0

Views: 71

Answers (2)

Jen Jose
Jen Jose

Reputation: 4045

Method 1 : Programmatically changing Constraint Values

If you want to set different constant top values for iPhone variation, then create a outlet of Top Constraint and change its constant value.

_topConstraint.constant = Conditional code for each device.

Method 2 : Setting Adaptive Constraints

Eg: I have taken a view with fixed height = 100, width = 200 and centred it horizontally.

enter image description here

Now it give a proportionate top space as per the device size, please gear up for some maths.

Suppose, the top space in iPhone5 screen = 36 pt.

Total View Height = view top + view height = 36 + 100 = 136

Total Screen Height = 568 Bottom Ratio = 568/136 = 4.17

So, set a bottom layout constraint and add the multiplier as 4.17. enter image description hereenter image description here enter image description hereenter image description here enter image description here

On iPhone 7 plus and other devices, it changes the top automatically.

Upvotes: 1

DonMag
DonMag

Reputation: 77690

You cannot specify screen-sizes or device versions in auto-layout - only size classes.

If relative positioning/sizing doesn't work for you, and you want to do positioning such as 5 pts on iPhone SE and 15 pts on iPhone 6, you have to do it via code. Your options are:

  1. Don't use auto-layout...
  2. Change constraint values (constants, multipliers, priorities, etc)

If you read through Apple's docs on auto-layout, you can see it is targeted toward adaptive interface design, not alternate interface design.

Upvotes: 2

Related Questions