htafoya
htafoya

Reputation: 19283

Interface Builder - Constraint maximum width and margins

I have a constraint error,

What I want to do is "center the view, have 20 margin on the view, and have a maximum width of 320"

So that on iPad the view is not stretched, but on smaller devices the view can be less than 320 width, and have 20 pts of margin.

However using these rules gives me an error, probably because I say that margins can be >= 20, and width <= 320, and view has no idea how to match that.

I tried using priority but I'm not sure how it works, and I couldn't get anything.

How can I achieve the desired effect using only one view and its constraints?

enter image description here

Upvotes: 7

Views: 1739

Answers (2)

Paulw11
Paulw11

Reputation: 115051

As you have deduced, autolayout needs to know which constraint it should break in the event of a conflict, and this is done by priorities. However, you have another conflict since the leading/trailing and width constraints are all relative. This means that autolayout cannot determine the view's width.

Change the leading/trailing constraints to = 20 and set their priority to 999 so they can be broken on a wider device. This will allow the width to be determined and eliminate your conflicts.

Upvotes: 14

matt
matt

Reputation: 535988

Like this:

enter image description here

Note that (1) we don't need a trailing margin constraint, as we are already horizontally centered, and (2) the width of 320 has a lowered priority, thus giving the inequality leading margin constraint something to aim at when in doubt but otherwise not interfering.

This is what it looks like on iPhone 4s in Portrait: we are restrained by the side margins:

enter image description here

This is what it looks like on an iPhone 4s in Landscape (and of course on anything wider than that): we expand our width, but only up to 320:

enter image description here

Upvotes: 2

Related Questions