CODEWITHSUNDEEP
uikituistackview
ximmyxiao
ximmyxiao

Reputation: 2801

UIStackView conflict strangely with Top Align in Alignment axis?

I have two top aligned HStackViews(with red & green background color) embeded in a VStackView.

If I add a label to each HStackView , the layout will got a vertical conflict like this: enter image description here enter image description here

And if I add one more label to any HStackView , the conflict will be disappear.(set the horizontal content priority with differenct value on each label) enter image description here

I have two questions here:

  1. I think the UIStackView have intrinsic vertical size as it's biggest subview. the conflict should not happen .
  2. as the conflict generated as above. Why the conflict will disappear after I adding one more label to it ?

Upvotes: -2

Views: 53

Answers (1)

DonMag
DonMag

Reputation: 77423

You get the "Missing Y Constraints" error / warning because your layout is ambiguous.

You've added a Vertical stack view and told auto-layout to arrange its subviews based on their content.

The 1st subview - the Red Horizontal stack view - has a single label with the default Vertical Content Hugging Priority: 251

The 2nd subview - the Green Horizontal stack view - also has a single label with the default Vertical Content Hugging Priority: 251

So the Vertical stack view says: "Hmmm... the designer has not told me how to distribute the two Horizontal stack view, so I'll allow the 1st (Top) stack view to stretch vertically."

That behavior is actually undefined... it may or may not actually lay out that way.

When you add a second label to either Horizontal stack view (let's use the Green one since that's the image you posted), the Vertical stack view says: "OK ... the designer has TWO subviews with Vertical Content Hugging Priority: 251 in the bottom arranged subview, and only ONE subview with Vertical Content Hugging Priority: 251 in the top arranged subview... so I'll allow the 1st (Top) stack view to stretch vertically."

If you instead added a second label to the Red Horizontal stack view, the Vertical stack view will give that arranged subview the Hugging priority and it will allow the 2nd (Bottom) stack view to stretch vertically.

It is up to you (the designer) to tell auto-layout how much Content Hugging (and Compression Resistance) each view should have.

Upvotes: 0

Related Questions