39
votes

I am working on a Swift project with Storyboards where I want text to wrap in a label. In the old Objective-C version where I did not use a Storyboard I used the following settings and things worked perfectly.

Objective-C without Storyboard Settings

Here are the settings for Swift

Swift with Storyboard Settings

I have been reading about the potential auto layout issues with preferred width settings. I currently have them set to auto layout and the label itself is set to a width of 560. I've added a constraint to keep the label 20 pixels from the trailing superview and while I thought this would work I still cannot get the text to wrap. The dimension settings are below.

Label Dimension and Constraints

Can someone explain how to get the text to wrap?

8
My mistake on the terminology. I meant to say Storyboards not Playgrounds.jonthornham
That's an improvement, but please note also that this has nothing to do with Swift or Objective-C. You should remove all reference to language from your question. If you previously didn't use a storyboard, then the contrast would be between code and storyboard, or between .xib file and storyboard.matt
You can also remove the bottom constraints on your UILabelvidalbenjoe

8 Answers

100
votes

First, the good news: You have set the label to 2 lines and Word Wrap. So it can wrap. Excellent.

Now you must make sure the label is tall enough. Either give it no height constraint, or give it a big enough height constraint that it can accommodate two lines.

Finally, you must limit its width. This is what causes the text to wrap. If you don't limit the label's width, it will just keep growing rightward, potentially continuing off the screen. The limit on the label's width stops this rightward growth and causes the text to wrap (and the label to grow downward instead).

You can limit width in several ways. You can have an actual width constraints. Or you can have a leading constraint and a trailing constraint, to something relatively immovable, such as the superview. And there is a third way: on the Size inspector (which you do also show, at the bottom right of your question), set the Preferred Width (it is shown at the top of the Size inspector): this is the width at which, all other things being equal, the label will stop growing to the right and wrap and grow down instead.

17
votes

Declare your UILabel programmatically and give

yourUILabel.contentMode = .scaleToFill
yourUILabel.numberOfLines = 0
yourUILabel.leadingMargin(pixel: 10)
yourUILabel.trailingMargin(pixel: 10)

This worked for me.

3
votes

Your text will wrap if you have provided lines number more than 1. However you may not be able to see it wrap if the label height is not enough to show the content. I suggest you to remove the height constraint or increase its value.

0
votes

What fixed this problem was changing the label type to "Placeholder" under Intrinsic Size in IB. When I changed this the text wrapped and the warnings went away.

0
votes

In case this helps anybody: I had followed the advice given here to fix my label not wrapping to two lines but nothing worked. What worked for me was I first deleted some of the relevant constraints in storyboard (I'm using auto layout) and saw that the label wrapped properly. I slowly added back the constraints I needed and everything still seems to work fine. So deleting and remaking your constraints may help.

0
votes

As I see you interface builder. There are two problems. First one is with your constraints, and another one is with the property.

  1. You gave it a fixed height which is wrong while line wrap. You need to make the auto-resizing label, i.e. remove height and add the bottom constraint or simple remove height depend on your situation. Your text is moving to the next line, but due to fixed constraint, you can't see it.
  2. You enable the option to clip subviews which is wrong as it cuts your view and you are unable to view wrap word.
0
votes

Add a new case: DO NOT add constraints to your label with a TEXTVIEW, or the label will expand to right without limitation.

0
votes

In my case i set my parent stackview alignment from center to fill and set UILabel to

label.textAlignment = NSTextAlignment.right