Search code examples
iosxcodeautolayoutios-autolayout

AutoLayout problem when trying to display on iPads or smaller screens

I am trying to create an app with this UI.

enter image description here

I am facing a lot of problems because it's like a rhombus.

I tried to use a vertical stackView and these are my previews and my constrains.

enter image description here

enter image description here

I've tried to use aspect ratio(1:1.13 because they are not squares) to resize on all o the screens but on iPad its a lot bigger. Is there a way to make it smaller on iPads? I am new to auto layout so I am sorry if this question is not correct.

Solution

  • You're probably overthinking this. Instead of a stack view, create a "spacer" view and use constraints to center it and give it the correct height and width for all screen sizes. Test it. Now add the four squares, giving them correct height and width and positioning them in relation to the "spacer" view. Test that. Finally, hide the "spacer" view.