UILabel cuts off custom font. How do I dynamically adjust UILabel height based on custom font selected?

Question

Some of the custom fonts I've loaded onto my app are getting cut off when displayed in a UILabel. I have multiple custom fonts that I need to properly display. How can I fix this?

Foursquare

Answer 1

As stated, I had a very annoying problem where custom fonts in a UILabel would get cut off due to something. I later found out it was due to ascenders and descenders (font characteristics).

After much searching I found a solution that required you to download a program, adjust the font's ascender and descender using terminal and then test it out on your app until it's perfect.

This would be fine if I didn't have to do this for 20+ fonts. So I decided to dig around and see if I could access the a font's ascender and descender values. Turns out UIFont has those exact attributes!

With that information, I was able to subclass UILabel and adjust its frame dynamically by adding the ascender and descender values (use absolute value as it is negative) to its height.

Here's a snippet of the implementation code below, the last line is the money line:

UIFont *font = [UIFont fontWithName:nameOfFontUsed size:44.0];
NSDictionary *attrsDict = [NSDictionary dictionaryWithObject:font forKey:NSFontAttributeName];
NSMutableAttributedString *theString = [[NSMutableAttributedString alloc] initWithString:[NSString stringWithFormat:@"%@", enteredString] attributes:attrsDict];

//Add other attributes you desire

NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init];
paragraphStyle.lineBreakMode = NSLineBreakByCharWrapping;
paragraphStyle.lineHeightMultiple = 5.0;
[theString addAttribute:NSParagraphStyleAttributeName value:paragraphStyle range:NSMakeRange(0, [theString length])];

[self setAttributedText:theString];

[self sizeToFit];

[self setFrame:CGRectMake(self.frame.origin.x, self.frame.origin.y, self.frame.size.width, self.frame.size.height+font.ascender+ABS(font.descender))];

Foursquare

I understand you subclassed the UILabel. What method did you override and put the above code in? – Loculus

Answer 2

Try to override intrinsicContentSize property in UILabel.

I don't think this is the best practice, but easy to solve problem in some cases.

Example for Swift 3

class ExpandedLabel: UILabel {

  override var intrinsicContentSize: CGSize {

    let size = super.intrinsicContentSize

    // you can change 'addedHeight' into any value you want.
    let addedHeight = font.pointSize * 0.3

    return CGSize(width: size.width, height: size.height + addedHeight)
  }
}

Sluggard

As an alternative to adding a fraction of font.pointSize, I added font.ascender. – Kurdish

This solution only works if you are using auto layout for the UILabel – Curhan

Exactly what I need to avoid cut-off in a label with an "È" as special char, that is in a StackView in a TableView. I've used return CGSize(width: size.width, height: size.height + font.ascender). – Necrolatry

Answer 3

Adding this attribute to my attributed text (sized 140 with a maximum line height of 170) fixed it for me:

NSAttributedString.Key.baselineOffset: -100

Cerotype