Line Spacing for UILabel with a single line of text

Question

Is it expected that a multi-line UILabel with a custom lineSpacing attribute include that line spacing even when the label's text fits on one line?

Here is my label:

let label = UILabel()
label.numberOfLines = 4
var paragraph = NSMutableParagraphStyle()
paragraph.lineSpacing = 5
paragraph.lineBreakMode = .ByTruncatingTail
label.attributedText = NSAttributedString(string: "Some short text", attributes: [NSParagraphStyleAttributeName: paragraph])

And here is how it is laid out. Note the additional spacing below the text.

For comparison:

What's strange is the lack of consistency. When the label extends to a second line, the bottom line no longer includes this additional spacing:

Is there a way to remove this line spacing when there is a single line of text? Or some other way to enforce some consistency so I can at least account for it?

Update

The baseline calculation also seems broken. When attempting to align a view (here, the red box) with the label's baseline, multi-line labels are partially covered.

Answer 1

You can calculate the number of lines and set lineSpacing to 0 if there's only one line.

But there might be a better solution.

Answer 2

Since you said you were using a custom font, my best guess based on prior experience is that the root cause of that issue that you seeing lies somewhere inside of the custom font itself. Whenever I am given a custom font by a client, 90% of the time, something is "wrong" with the actual font metrics (as interpreted by Apple's internal font rendering subsystem, even though it might render correctly somewhere else).

The good news is that this is fixable, but it requires rebuilding the font with new metrics, which is usually a trial/error affair. You might also need to check to see if the license you have for the font will allow such a thing (if it even matters).

That being said, these are some resources to questions that I keep around for this exact scenario whenever I start a new project:

Here's a similar question to yours with the assumption that this is a custom font issue: " Custom UIFont baseline shifted ". This question deals with this issue in a UIButton " UIButton custom font vertical alignment ", but both of these questions end up at the answer to this question " Custom installed font not displayed correctly in UILabel ".

I have a personal testbed app for custom fonts now that I use whenever I am first given a custom font. This allows me to test the font in isolation for each rebuild iteration to make sure it's perfectly rendering. Make sure to test your changes in various font sizes and even in additional languages (yes, lots of permutations). I have had issues specifically with Thai and Chinese when using custom fonts as their ascenders extend very close to the edge of the bounding box for a UILabel. The testbed that I've created for myself includes the font rendered in basic UILabels in various sizes and various languages in various sizes (since like I said, I've had a bad experience in the past with custom fonts in certain languages that rendered fine in Roman characters).

If someone has a better solution to this, I'd love to hear it as I run into this issue with custom fonts almost every time. This is my workflow for nipping the issue in the bud before we start compensating for the font's rendering issues during layout or using individual attributed string adjustments. I'm not font expert, I'm just a guy who likes fonts to render like the built-in fonts (especially when using auto layout).

Answer 3

paragraphStyle.lineBreakMode = NSLineBreakByCharWrapping 

can avoid this issue when text is multiline.

explicitly setting the font with with fontName [UIFont fontWithName:@"PingFangSC-Regular" size:14] , instead of using [UIFont systemFontOfSize:14] can avoid the issue when text is single line.

Hope this is helpful for you!

Answer 4

This is def. a issue for UILabel . It happens for custom as well as the system fonts.

If you can use a UITextView , go with that. The UITextView has no problems with single or multi line text line-spacing and behaves correctly (single line = no line spacing).
This way you can also avoid creating a custom line count func/ext.

Answer 5

Yes, the lineSpacing is applied regardless of how many lines are in the label. If you're using autolayout, you can work around this by constraining your label's baseline to its parent or sibling views (as appropriate), instead of the label's top edge aligned to the parent or sibling's top. (This assumes, however, that your label's background color is the same as the color of its parent view; otherwise, you'll see the extra line spacing appear in the background color.

Another thing you can do (and this is probably preferable, now that I think about it) is to set a paragraphSpacing attribute of 0 as well. That should negate the lineSpacing for the last line in the label, regardless of how many lines you have.