Auto Layout iOS 10.3, Xcode 8.3, Swift 3.1

In iOS app setting UI design have multiple option like

Frame : To lengthy

Auto Resize : Not Correct every time

Auto Layout : Constraint, but easy

This is about setting the app behaviour according to screen size class.

Auto Layout is all about constraint, every body wanted to set app in universal but sometimes for landscape and portrait the screen display is not eye catching so to make the app work tremendously use auto layout, change the constraint for different screen and for this we don’t have to do any thing just add constraint and it automatically adjust it’s preview according to screen.

Sample of simply added constraints.

And you rotate the screen it will look like this.

But it is not looking good at all so adjusting the constraints(for compact Height any Width) then the preview will look like this.

So which one is better??

whenever we set up the constraint in iOS 10.x it automatically set for all the screen size by default (select on constraints and open the attribute on right hand side .

Installed with checked it means it is set for all the size class by default.

And if you want to remove it for the particular screen size then just select the constraint and click at + sign and select size class option for which you want to remove it.

Select the size class(any Width and compact Height) and click add variation and by default it will selected.

Just uncheck it for not adding this constraint for the any Width and compact Height size class.

Now this constraint is not set for the any Width and compact Height size class (and if you don’t know about size class then google it).

And in constraint have multiple option like multiplier, content hugging priority and content compression resistance priority .

So this will help you to make adjustable layout for any mode of screen.

We are explaining below in a flow chart how to set constraint for different size classes which will be automatically compatible with iPhone and iPads.

Author: Sandeep Yadav |