How to fix missing/conflicting Constraints for wAny hAny when using different Size Classes

Question

What I am trying to achieve

I want to have two views of equal height arranged vertically for all Regular Heights. However, for Compact Heights I want to have the views arranged horizontally. This is illustrated in the following image:

To do this, I added general constraints in the wAny-hAny size class that apply to everything. Then I added specific constraints for the wAny-hRegular and wAny-hCompact size classes. This worked fine for wAny-hRegular and wAny-hCompact (and for testing the app in the simulator), but it left me with missing constraints in wAny-hAny. If I add those missing constraints in wAny-hAny then I get conflicting constraints in either wAny-hRegular or wAny-hCompact. I don't know how to get rid of the errors.

Below is a more detailed explanation of exactly what I did.

How I attempted to do it

I was able to get something that works in the Simulator by doing the following steps.

wAny hAny

For Any Width Any Height I set the following 4 constraints:

That is, I pinned blue to the top and left and I pinned red to the right and bottom. No matter what size class is used, these constraints are always needed.

wAny hRegular

For Any Width Regular Height I added the following 4 constraints:

That is, I pinned blue to the right and red to the left. I also pinned red's top edge to blue's bottom edge. And I made red and blue equal heights. That solves all constraint issues for Regular Height.

wAny hCompact

For Any Width Compact Height I added the following 4 constraints:

That is, I pinned blue to the bottom and red to the top. I also pinned red's right edge to blue's left edge. And I made red and blue equal widths. That takes care of all constraint issues for Compact Height.

The Problem

With the above setup everything works as it should in the Storyboard preview (see first image above) and in the simulator for all sizes that I have tested.

However, in the Interface Builder I am getting the following Missing Constraint errors for the wAny hAny Size Class:

This is a bit of a catch-22, because if I try to add the missing constraints then I create conflicting constraints with either the Regular or Compact Size Class constraints. Here is the Compact as an example:

How do I solve this problem?

Answer 1

I think you need to add specific constraints for the wAny-hCompact size classes only. And make sure the special constraints are correctly installed.

See the image below.

Answer 2

This is because there are two different kinds of constraint for single view in two different size classes. So, rather fixing problem for missing/conflicting Constraints for wAny hAny when using different Size Classes try uninstalling the additional constraint from wAny hAny size class, which were added in wAny hCompact or any other size class.

You can do it like this:

Steps:

1. If the utilities area is not open, choose View > Utilities > Show Utilities.
2. Select the view containing the constraint you want to change.
3. Select the constraint you want to install or uninstall. The Constraint inspector opens in the utilities area.
4. In the Constraint inspector, click the Add button (+) next to the Installed property and choose the size desired class from the pop-up menu.

After choosing a size class from the pop-up menu, a new entry item for that size class appears in the Constraint inspector.

Note: If there is already an existing entry item for the desired size class, skip this step.

5. Select the checkbox for for the desired entry line to install the constraint for that size class. Deselect the checkbox to uninstall the constraint.

A runtime object for an uninstalled constraint is still created. However, it is not included in the view hierarchy.

The Constraint inspector shows one or more entry items that show if the constraint is or is not installed for a size class. Each entry line for a size class starts with a Delete button (x) followed by the size class, and then a selection checkbox. The size class is shown for the width (w) and height (h). C is used for the compact size class, R for the regular size class, and Any for the any size class.

You can find detailed explanation over this apple document on installing and uninstalling constraint for size classes.