CODEWITHSUNDEEP
iosobjective-cipadautolayout
user717452
user717452

Reputation: 111

AutoLayout has buttons on top of each other

I have constraints on my UIButtons in iPad app so that the top row of buttons stays a certain distance from the UIImageView, and so the bottom row of buttons stays pinned fairly close to the bottom. However, when I rotate it goes all wrong. Here is the image of when in Portrait and when in Landscape. How can this be fixed, given the less amount of vertical real estate in landscape mode?

enter image description here

enter image description here

Upvotes: 0

Views: 61

Answers (1)

Stonz2
Stonz2

Reputation: 6396

You will either need to scale the size of your subviews upon rotation, or use a scroll-view.

Because you are positioning your buttons a certain distance from the bottom of the screen instead of keeping consistent spacing, they overlap when not enough space is available. (I'm assuming from your screenshots that it is breaking the constraint between the 2 rows of buttons, assuming there is one)

You can relate the available space for each row of buttons to the total vertical size of the main view. For instance, let the image be 50% of the total vertical space, and 25% to each row of buttons (I would set up a container view for each row and then add constraints to the containers). Make sure that your images/buttons properly scale and maintain their aspect ratio.

Another option could be to recognize when the view rotates, and modify all of the constraints so that your buttons all layout in a single row, but this could involve a decent amount of coding to swap/change most of your constraints.

Upvotes: 1

Related Questions