Search code examples
iosautolayoutconstraintsxcode8

iOS constraints - can't figure out how

So I can't figure out how to get my page to look the same on all devices (for example on an iphone 5&7).

This is my cell.xib:

enter image description here

The last one on the lower right is a label.

This is how it looks on the iphone 7 (this is how it should look):

enter image description here

and this is the iphone 5:

enter image description here

and yes I realize it seems easy, at least I feel like it seems easy, but having spent HOURS on trying all sorts of constraints combinations I'm worn out. Could someone guide me? Like litereally guide me? step by step.

Solution

  • My recommendation would be to put all your image views some stack views.

    Each row of 5 would be a horizontal stack view with 5 image views in it. Those two horizontal stack views would then be placed in a vertical stack view.

    This would have leading space to the large image view and trailing space to the label, which would in turn have trailing space to the view's trailing anchor.

    You should then be able to configure the stack views to keep their content's at a 1:1 aspect ratio.