iosswiftxcodexcode8adaptive-design

How can I set two textboxes in one line for iPad?


I use xCode 8.1. I have two textboxes in one column for iPhone (in portrait mode): xcode screenshot

How can I use adaptive design to display these textboxes in one line at iPad and at Landscape mode of iPhone?


Solution

  • Position your text boxes as you have shown for portrait

    Assuming you want Name to stay in the same place, you only need to change the constraints on Surname

    You should have a TopSpace and a Leading Space defined for Surname - select each constraint in turn, and click on the + button beside Installed - this gives you the option of introducing variations, so click Add Variation and then de-select the initial default value.

    This will mean that these two constraints only apply for iPhones in portrait mode (Compact/Regular

    The switch to landscape mode, and position Surname where you need it. Apply constraints - vertical center with Name and a Leading spacing. Select both of those constraints, and repeat the process for creating variations, but they will now be created for iPhone landscape only (Compact/Compact).

    Now switch to iPad, and repeat the process you followed for landscape, which will create the iPad constraints (Regular/Regular)

    That should be everything you need. If it doesn't work, or you see red lines in the storyboard, it most likely means you have left one of the Surname constraints active for all orientations - at the same time as having conflicting constraints for specifics - if you can't find which one, delete the constraints and start again :-)

    Here's a screenshot showing where you add the variation

    enter image description here

    and here's what it looks like after you have added a portrait-specific constraint enter image description here