54

This is a little different from all the other "How do I center the text in a UILabel" questions here...

I have a UILabel with some text in it, I want to center the text vertically in the UILabel. What's the big deal, right? That's the default. The problem comes because my text is dynamic and I have autoshrink turn on. As the text grows larger, the font size shrinks. You get this behavior.

enter image description here

Notice that the font baseline has not moved, I want it to move so the numbers are centered vertically in the UILabel's frame.

Easy, right? I just remember the frame's original center in viewDidLoad

    self.workoutTimeCenter = _workoutTimeLabel.center;

and then I call sizeToFit after I change the the text, right?

    [_workoutTimeLabel sizeToFit];
    _workoutTimeLabel.center = _workoutTimeCenter;

Well, sizeToFit did, I guess, exactly what it was supposed to do, resize the frame so the text fits without shrinking!

enter image description here

How can I vertically center the text in a UILabel while respecting baselines and autoshrink? (Note, an iOS5 and later solution is fine and I can even deal with an iOS6 and later solution.)

7
  • you create label programmatically or on the xib file.
    – Nasir
    Jul 31, 2013 at 13:42
  • I've built the label in the xib Jul 31, 2013 at 13:44
  • what about embedding your UILabel in a bigger UIView, and then center the UILabel in the UIView simpy using label.center = fatherView.center; ?
    – LombaX
    Aug 2, 2013 at 14:04
  • I'm not following that, the baseline still wouldn't be centered. Aug 2, 2013 at 14:07
  • @PaulCezanne Can you explain a bit more ? your requirement is Something like my answer or else ? I'm confused with baseline and fontsize.
    – TheTiger
    Aug 6, 2013 at 11:14

5 Answers 5

116
+50

In my experience you can just set the -[UILabel baselineAdjustment] property to UIBaselineAdjustmentAlignCenters to achieve the effect you're describing.

From the docs:

baselineAdjustment

Controls how text baselines are adjusted when text needs to shrink to fit in the label.

@property(nonatomic) UIBaselineAdjustment baselineAdjustment

Discussion

If the adjustsFontSizeToFitWidth property is set to YES, this property controls the behavior of the text baselines in situations where adjustment of the font size is required. The default value of this property is UIBaselineAdjustmentAlignBaselines. This property is effective only when the numberOfLines property is set to 1.

and

UIBaselineAdjustmentAlignCenters
Adjust text based relative to the center of its bounding box.

EDIT: adding a full view-controller that demonstrates this:

@interface TSViewController : UIViewController
@end

@implementation TSViewController

- (void) addLabelWithFrame: (CGRect) f baselineAdjustment: (UIBaselineAdjustment) bla
{
    UILabel* label = [[UILabel alloc] initWithFrame: f];
    label.baselineAdjustment = bla;
    label.adjustsFontSizeToFitWidth = YES;
    label.font = [UIFont fontWithName: @"Courier" size: 200];
    label.text = @"00";
    label.textAlignment = NSTextAlignmentCenter;
    label.backgroundColor = [UIColor lightGrayColor];
    label.userInteractionEnabled = YES;
    [self.view addSubview: label];

    UIView* centerline = [[UIView alloc] initWithFrame: CGRectMake(f.origin.x, f.origin.y+(f.size.height/2.0), f.size.width, 1)];
    centerline.backgroundColor = [UIColor redColor];
    [self.view addSubview: centerline];

    UITapGestureRecognizer* tgr = [[UITapGestureRecognizer alloc] initWithTarget: self action: @selector(onTap:)];
    [label addGestureRecognizer: tgr];
}

- (void) viewDidLoad
{
    [super viewDidLoad];

    [self addLabelWithFrame: CGRectMake(0, 0, 320, 200)
         baselineAdjustment: UIBaselineAdjustmentAlignCenters];

    [self addLabelWithFrame: CGRectMake(0, 220, 320, 200)
         baselineAdjustment: UIBaselineAdjustmentAlignBaselines];
}

- (void) onTap: (UITapGestureRecognizer*) tgr
{
    UILabel* label = (UILabel*)tgr.view;
    NSString* t = [label.text stringByAppendingString: @":00"];
    label.text = t;
}

@end
9
  • +1 This is correct way. Many answers trying to calculate the frame manually, but it's this simple. And it's available in iOS 2.0 and later.
    – Tricertops
    Aug 6, 2013 at 18:47
  • It's working in my test app. Can you create a simple test case to sleuth it out? Or I could post mine.
    – TomSwift
    Aug 7, 2013 at 18:36
  • 2
    it seems that using adjustsLetterSpacingToFitWidth breaks baselineAdjustment. I don't see this documented anywhere; probably merits filing a radar bug with Apple. I'll do that.
    – TomSwift
    Aug 7, 2013 at 19:46
  • 1
    @TomSwift I'd upvote this answer 10000 times if I could. Thanks! Mar 25, 2014 at 22:08
  • 8
    also, make sure lineBreakMode is not "Word Wrap" Nov 14, 2014 at 6:44
14

when working in IB, be sure to set align baselines to center

enter image description here

Note: line break CANNOT be word wrap for this to work, so it will NOT work multiline (good to set the line break to Truncate tail)

1
  • the Most elegant solution!
    – andrii
    Oct 8, 2019 at 3:41
2
-(void)fitVerticallyToLabel:(UILabel *)lbl
{
    CGFloat fontSize = lbl.frame.size.width / lbl.text.length;
    [lbl setFont:[UIFont fontWithName:@"Helvetica-Bold" size:fontSize]];

    CGRect rect = lbl.frame;
    rect.origin.y += rect.size.height - fontSize;
    rect.size.height = fontSize;
    [lbl setFrame:rect];
}

How to Use: Call this method after setting the text to your label.

    label.text = @"text";
    [self fitVerticallyToLabel:label];

enter image description hereenter image description here

Note: I ahev taken UILabel from xib. You can take it programmatically too in that case you will have to set its text alignment NSTextAlignMentCenter

1

Try to implement this logic:

-(void)adjustLabel1Text1:(NSString *)text1 
{
    UILabel *lbl_first = [UIFont fontWithName:@"Helvetica" size:12];



    text1 = [text1 stringByTrimmingCharactersInSet:[NSCharacterSet whitespaceAndNewlineCharacterSet]];


    float hedingLblHeight = [self calculateHeightOfTextFromWidth:text1 : [UIFont fontWithName:@"Helvetica" size:12] :118 :UILineBreakModeWordWrap];

    lbl_first.text=text1;


    [lbl_first setFrame:CGRectMake(lbl_first.frame.origin.x, lbl_first.frame.origin.y, 118, hedingLblHeight)];
    lbl_first.lineBreakMode = UILineBreakModeWordWrap;
    lbl_first.numberOfLines = 0;
    [lbl_first sizeToFit];




//////////Adjust the lable or any UIControl below this label accordingly.

    float endResultHeight=[self calculateHeightOfTextFromWidth:text2 : [UIFont fontWithName:@"Helvetica" size:15] :299 :UILineBreakModeWordWrap];

    if(hedingLblHeight>secondImgTitleHeight)
    {
    [lbl_endResult setFrame:CGRectMake(lbl_endResult.frame.origin.x, lbl_first.frame.origin.y+lbl_first.frame.size.height+5, 299, endResultHeight)];
    }
    else
    {
        [lbl_endResult setFrame:CGRectMake(lbl_endResult.frame.origin.x, lbl_first.frame.origin.y+lbl_first.frame.size.height+5, 299, endResultHeight)];

    }

    lbl_endResult.lineBreakMode=UILineBreakModeWordWrap;
    lbl_endResult.numberOfLines = 0;
    [lbl_endResult sizeToFit];



}

-(float) calculateHeightOfTextFromWidth:(NSString*)text : (UIFont*) withFont:(float)width :(UILineBreakMode)lineBreakMode
{

    CGSize suggestedSize = [text sizeWithFont:withFont constrainedToSize:CGSizeMake(width, FLT_MAX) lineBreakMode:lineBreakMode];

    return suggestedSize.height;
}

It has helped me a lot.Hope it works for you.

-5

Try

yourLabel.textAlignment = UITextAlignmentCenter;
3
  • 1
    Use 'NSTextAlignmentCenter' for targeting iOS6!
    – JFS
    Jul 31, 2013 at 13:54
  • 1
    This isn't what he was asking.
    – C0D3
    Apr 27, 2015 at 14:48
  • centers horizontally not vertically
    – narco
    Feb 13, 2017 at 11:22

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.