Search code examples
iosuser-interfaceautolayout

swift:Different alignment of views in same view controller

How can i make a view like this. I am done with first portrait mode and confuse to to achieve the landscape mode.? can anybody suggest me how to make the view in landscape mode. I have done portrait mode in AnyHeight AnyWidth format. enter image description here

Solution

  • Although the question might be a little broad, I'll try to mention a generic answer.

    Assuming that your are already familiar with Auto Layout and Size Classes, in Xcode 8, Interface Builder you can change the current view of what are you working on:

    enter image description here

    By tapping the "View as:" button, you will be able to see the desired device orientation to setup the desired layout via device configuration bar:

    enter image description here

    For example, Consider the following View:

    enter image description here

    As yo can see, both of the views have the desired constraints to be displayed in portrait mode, for now, you should add add new constraints for the landscape mode. Make sure to deinstall the constraints for portrait mode:

    enter image description here

    As you can see, some of the constraints appears faded, which means that they are uninstalled on this size class. You can determine installing the constraint by selecting it and from the attribute inspector, check the desired size class(es):

    enter image description here

    For more details about how you can achieve this, I would suggest to watch Making Apps Adaptive, Part 1 Session.

    Hope this helped.