Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

iOS UILabel autoshrink so word doesn't truncate to two lines

I'm trying to have the UILabel shrink so that words don't truncate to the next line. Not just text truncating at the end of the text area.

If I have a box that is 50x100, and I want to put in something like "American" in the box at 25.0pt, I end up getting:

   50px
 -------
|Ameri- |
|can    |
|Beauty | 100px
|       |
 -------

The text shrinking doesn't seem to do anything during this situation, since it still fits in the UILabel frame. It works pretty well when the text is really long like "Willie Wonka's Chocolate Factory", but I don't want word truncation.

This is the ideal output in that scenario:

    50px
 --------
[American|
|Beauty  | 100px
|        |
|        |
|        |
 --------

Any suggestions would be super appreicated!

Edit: SOLUTION

Here is what I ended up doing thanks to the suggestion in the answer below. It works great!

- (CGFloat) calculateFromUILabel:(UILabel *)label
{
    NSString *stringToMeasure = label.text;
    NSLog(@"FontSizeMeasurement.calculateFromUILabel() %@", stringToMeasure);

    NSRange range = NSMakeRange(0, 1);
    NSAttributedString *attributedString = label.attributedText;
    NSDictionary *attributes = [attributedString attributesAtIndex:0 effectiveRange:&range];

    NSMutableCharacterSet *characterSet = [[NSCharacterSet whitespaceAndNewlineCharacterSet] mutableCopy];
    [characterSet addCharactersInString:@"-"];
    NSArray *words = [stringToMeasure componentsSeparatedByCharactersInSet:characterSet];

    CGSize maxSize = CGSizeZero;
    NSMutableAttributedString *maxWidthString = nil;
    for(int i = 0; i < words.count; i++) {
        NSString *word = words[i];
        CGSize wordSize = [word sizeWithAttributes:attributes];
        if(wordSize.width > maxSize.width) {
            maxSize = wordSize;
            maxWidthString = [[NSMutableAttributedString alloc] initWithString:word attributes:attributes];
        }
    }

    UIFont *font = [label.font copy];
    while(maxSize.width > self.maxWidth) {
        font = [font fontWithSize:(font.pointSize-0.1)];
        [maxWidthString addAttribute:NSFontAttributeName value:font range:NSMakeRange(0, maxWidthString.length)];
        maxSize = [maxWidthString size];
    }

    return font.pointSize;
}
like image 295
normmcgarry Avatar asked Apr 16 '14 22:04

normmcgarry


2 Answers

Just to add Swift 4 version + Add a guard to do it only with adjustsFontSizeToFitWidth true, as user using false won't want to fit by long word I guess.

extension UILabel {
// Adjusts the font size to avoid long word to be wrapped
func fitToAvoidWordWrapping() {
    guard adjustsFontSizeToFitWidth else {
        return // Adjust font only if width fit is needed
    }
    guard let words = text?.components(separatedBy: " ") else {
        return // Get array of words separate by spaces
    }

    // I will need to find the largest word and its width in points
    var largestWord: NSString = ""
    var largestWordWidth: CGFloat = 0

    // Iterate over the words to find the largest one
    for word in words {
        // Get the width of the word given the actual font of the label
        let wordWidth = word.size(withAttributes: [.font: font]).width

        // check if this word is the largest one
        if wordWidth > largestWordWidth {
            largestWordWidth = wordWidth
            largestWord = word as NSString
        }
    }

    // Now that I have the largest word, reduce the label's font size until it fits
    while largestWordWidth > bounds.width && font.pointSize > 1 {
        // Reduce font and update largest word's width
        font = font.withSize(font.pointSize - 1)
        largestWordWidth = largestWord.size(withAttributes: [.font: font]).width
    }
}
}
like image 71
Dam Avatar answered Nov 14 '22 23:11

Dam


I can think of nothing that's directly built in. So I'd suggest:

Split the string into components by [NSCharacterSet +whitespaceAndNewlineCharacterSet] and [NSString -componentsSeparatedByCharactersInSet:]. I considered recommending the higher-level NSLinguisticTagger to get out whole words but that wouldn't allow for things like words with a colon on the end.

Of those words, find the typographically largest using the UIKit addition NSString -sizeWithAttributes: (under iOS 7) or -sizeWithFont: (under 6 or below). You're going to make the assumption that the largest will remain the largest as you scale the font size down, which I think will always be true because Apple doesn't do aggressive font hinting.

If that word is already less wide than your view's width, you're done. Just show the string.

Otherwise use a quick binary search, repeatedly querying the size, until you find the smaller font size that you need to within whatever precision you think is appropriate (0.1 of a point sounds reasonable to me but you get the point). Then show the whole string at that size.

like image 43
Tommy Avatar answered Nov 15 '22 00:11

Tommy