-3

I just started learning swift so my question must seem trivial to you.

After applying Autolayout to the button by adding alignment constraints where "Horizontally in Container" and "Vertically in Container" both set to 0 , and by adding another constraints where width and height both set to 100.

After that, I removed the "Vertically in Container" constraint just to see what happen and I saw error on the height. Same is true when I removed "Horizontally in Container" only which showed error on the width. What does this error actually mean and why it shows that?

Also I never understood the phrases "Vertically in Container" & "Horizontally in Container". When I apply "Vertically in Container" only, a horizontal line appears on the storyboard which seems confusing because you would expect vertical line since the phrase has vertical in it. Why is that?

Error on height of button after removing "Vertically in Container" constraint

I can't post more pictures because I don't have more than 10 reputation points.

Farouq
  • 3
  • 1

1 Answers1

1

To render your view (in general, a rectangular shape), the system needs to know a width and a height for that view. Along with that, it also needs to know where you want to position this view/rectangle on the screen.

The term "Vertically in container" means the system will position the view at the vertical center of the screen like so -

Vertically centered on screen

The term "Horizontally in container" means the system will position the view at the horizontal center of the screen like so -

Horizontally centered on screen

Clearly, when both of these constraints are set, the system will position the view horizontally and vertically centered, like so -

Horizontally and vertically centered view

When you delete the "horizontally in container" constraint, the system has no idea where to position the view horizontally and hence you get that error. And although it has a width, it will show a red line across the X-axis (not really the width). This is a cue for you to add a horizontal constraint. To resolve this, you can either -

  • center the view horizontally (which you were originally doing)
  • specify leading and trailing constraints
  • specify left and right constraints

Similarly, when you delete the "vertically in container" constraint, the system doesn't know where to place the view vertically. To resolve this, you can -

  • center the view vertically (which you were originally doing)
  • specify top and bottom constraints

I hope this helps.

Animesh K
  • 78
  • 6