Search code examples
iosuilabelvertical-alignmenttttattributedlabel

How to make TTTAttributedLabel vertically align center with truncated tail


I am using TTTAttributedLabel to display some text vertically centered (default in both TTTAttributedLabel and UILabel), with a single line (also default), and truncated tail line breaking.

TTTAttributedLabel *label1 = [[TTTAttributedLabel alloc] initWithFrame:CGRectMake(20.0, 40.0, 200.0, 60.0)];
label1.backgroundColor = [UIColor lightGrayColor];
label1.verticalAlignment = TTTAttributedLabelVerticalAlignmentCenter;
[self.view addSubview:label1];

TTTAttributedLabel *label2 = [[TTTAttributedLabel alloc] initWithFrame:CGRectMake(20.0, 120.0, 200.0, 60.0)];
label2.backgroundColor = [UIColor lightGrayColor];
label2.verticalAlignment = TTTAttributedLabelVerticalAlignmentCenter;
[self.view addSubview:label2];

NSString *shortString = @"This is a short string.";
NSString *longString = @"This is a somewhat longer string. In fact its really long. So long it takes up alot of space.";

NSDictionary *attributes = @{NSFontAttributeName: [UIFont systemFontOfSize:16.0]};

NSMutableAttributedString *shortAttributedString = [[NSMutableAttributedString alloc] initWithString:shortString attributes:attributes];
label1.attributedText = shortAttributedString;

NSMutableAttributedString *longAttributedString = [[NSMutableAttributedString alloc] initWithString:longString attributes:attributes];
label2.attributedText = longAttributedString;

The above code renders the following:

enter image description here

The only difference for the two labels is the string length. As you can see, the second string is not centered vertically.


Solution

  • Following from a similar question asked here, you need to set the paragraph style lineBreakMode to NSLineBreakByTruncatingTail:

    TTTAttributedLabel *label1 = [[TTTAttributedLabel alloc] initWithFrame:CGRectMake(20.0, 40.0, 200.0, 60.0)];
    label1.backgroundColor = [UIColor lightGrayColor];
    label1.verticalAlignment = TTTAttributedLabelVerticalAlignmentCenter;
    [self.view addSubview:label1];
    
    TTTAttributedLabel *label2 = [[TTTAttributedLabel alloc] initWithFrame:CGRectMake(20.0, 120.0, 200.0, 60.0)];
    label2.backgroundColor = [UIColor lightGrayColor];
    label2.verticalAlignment = TTTAttributedLabelVerticalAlignmentCenter;
    [self.view addSubview:label2];
    
    NSString *shortString = @"This is a short string.";
    NSString *longString = @"This is a somewhat longer string. In fact its really long. So long it takes up alot of space.";
    
    NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init];
    paragraphStyle.lineBreakMode = NSLineBreakByTruncatingTail;
    
    NSDictionary *attributes = @{NSFontAttributeName: [UIFont systemFontOfSize:16.0],
                                 NSParagraphStyleAttributeName: paragraphStyle};
    
    NSMutableAttributedString *shortAttributedString = [[NSMutableAttributedString alloc] initWithString:shortString attributes:attributes];
    label1.attributedText = shortAttributedString;
    
    NSMutableAttributedString *longAttributedString = [[NSMutableAttributedString alloc] initWithString:longString attributes:attributes];
    label2.attributedText = longAttributedString;