Multiline label in UIStackView Multiline label in UIStackView ios ios

Multiline label in UIStackView

The correct answer is here:

  1. Embed the UILabel inside a UIView (Editor -> Embed In -> View)
  2. Use constraints to fit the UILabel to the UIView (for example, trailing space, top space, and leading space to superview constraints)

The UIStackView will stretch out the UIView to fit properly, and the UIView will constrain the UILabel to multiple lines.

For a horizontal stack view that has a UILabel as one of its views, in Interface Builder firstly set label.numberOfLines = 0. This should allow the label to have more than 1 line. This initially failed to work for me when the stack view had stackView.alignment = .fill. To make it work simply set stackView.alignment = .center. The label can now expand to multiple lines within the UIStackView.

The Apple documentation says

For all alignments except the fill alignment, the stack view uses eacharranged view’s intrinsic​Content​Size property when calculating itssize perpendicular to the stack’s axis

Note the word except here. When .fill is used, the horizontal UIStackView does NOT resize itself vertically using the arranged subviews' sizes.

  • First set the label number of lines to 0
  • The stack view still won't grow to multiLine unless you give it a fixed width. When we fix its width then it break to multiline when that width is reached as shown:

screen recording

If we don't give a fixed width to the stack view then things get ambiguous. How long will the stack view grow with the label (if the label value is dynamic)?

Hope this can fix your issue.