Is it possible to vertically align text inside labels with a "large" frame

Question

In my application I have multiple tableviews with custom cells. Some of the text in the cells are spread out on between 2-4 lines so the height of the label is large enough to contain the content.

However on iPad the screen is larger and I want the text to appear at the top left point of the label, not in the middle as it do when you use numberOfLines property. I know you can horizontally align the text, but it must be possible to align the text to the top left also? Or is it impossible.

Screenshot:

enter image description here

Check this page [Vertically align text within a UILabel][1]http://stackoverflow.com/questions/1054558/vertically-align-text-within-a-uilabel?rq=1 — Adison, Jul 09 '13 at 03:58

EmptyStack · Accepted Answer · 2012-07-06T13:02:32.560

20

Its impossible to align the text in UILabel vertically. But, you can dynamically change the height of the label using sizeWithFont: method of NSString, and just set its x and y as you want.

As an alternative you can use UITextField. It supports the contentVerticalAlignment peoperty as it is a subclass of UIControl. You have to set its userInteractionEnabled to NO to prevent user from typing text on it.

edited Jul 06 '12 at 13:02

answered Jul 02 '11 at 13:18

EmptyStack

51,274
23
147
178

thank you, would uitextfield lead to poorer performance or other things in tableviewcell or is it just as good? – LuckyLuke Jul 02 '11 at 13:35
@Andreas, Yes. Its fine to use UITextField inside table view cells. In my personal opinion, using UILabels and dynamically sizing it would be the correct way. Anyway, its upto you to choose. Both way are fine. ;-) – EmptyStack Jul 02 '11 at 16:21
With UITextField you got that ugly frame around the text no? – user4234 Jan 03 '13 at 08:11
@Sharen Eayrs, You can prevent that by setting textField.borderStyle = UITextBorderStyleNone. – EmptyStack Jan 03 '13 at 09:53

score 3 · Answer 2 · edited Jan 09 '16 at 12:48

3

sizeToFit does not work in UITableCellView, because the Cells are reused during scrolling.

The solution is to calculate the table cell height according to the font and font size and adjust the label height to it.

As it was quite difficult to find the solution on the web I wrote a short post about it

edited Jan 09 '16 at 12:48

chedabob

5,835
2
24
44

answered Sep 17 '12 at 20:47

Hons

3,804
3
32
50

score 3 · Answer 3 · answered Oct 17 '13 at 20:59

3

You can do it as follows

Set your label's numberOfLines property 0 from IB
Set your label's lineBreakMode as UILineBreakModeWordWrap (very very important)

now whatever you set on the label just append few @"\n" to it..... ex.-

[yourTextLabel setText:@"myLabel\n\n\n\n\n"];

answered Oct 17 '13 at 20:59

Fahim Parkar

30,974
45
160
276

If you do this, the text will always have ellipsis, won't it? – Daniel Nov 06 '14 at 12:13

score 3 · Answer 4 · answered Feb 18 '14 at 15:03

In iOS 7 sizeWithFont: is now deprecated! Several solutions like subclassing UILabel have to be adapted.

My solution for top aligned label text: In a subclass TopVerticalAlignmentLabel : UILabel override drawRect: as follows:

- (void)drawRect:(CGRect)rect
{
    CGRect labelStringRect = [self.text boundingRectWithSize:CGSizeMake(self.frame.size.width, CGFLOAT_MAX)
                                                     options:(NSStringDrawingUsesLineFragmentOrigin|NSStringDrawingUsesFontLeading)
                                                  attributes:@{ NSFontAttributeName: self.font, /* further attributes */}
                                                     context:nil];

    [super drawTextInRect:CGRectMake(0, 0, self.frame.size.width, labelStringRect.size.height)];
}

score 3 · Answer 5 · answered Feb 17 '12 at 13:07

3

I actually noticed that using

[Blue setSizeToFit]

does align vertically to the top. The default being centered.

answered Feb 17 '12 at 13:07

nembleton

2,392
1
18
20

1

The way it really work is that it is still aligned centered but now the top remain the same and the box is just "right" so it looks like it's aligned top. This serves most people's purpose. However, you can set background to a certain color and verify things your end. – user4234 Jan 03 '13 at 08:10
make sure your constraints are set correct, so that the label is allowed to shrink or grow – Carmen Apr 08 '13 at 10:05

score 2 · Answer 6 · answered Apr 08 '13 at 10:12

2

I added in viewDidLoad

self.textLabel.numberOfLines = 0;
[self.textLabel sizeToFit];

make sure your constraints are set correct, so that the label is allowed to shrink or grow. Otherwise it won't work.

answered Apr 08 '13 at 10:12

Carmen

6,177
1
35
40

score 1 · Answer 7 · edited May 23 '17 at 12:19

Here is the Same Question asked by SomeOne. you'll find more appropriate way to solve this problem.they guys did great explanation over it.

I think so, you should take a look of this.

here in that thread many answers suggest set the dynamic frame for the UILabel on the basis of text as below snippet of code described.

    CGSize theStringSize = [textToBeUsed sizeWithFont:lblTitle.font  constrainedToSize:labelSize lineBreakMode:lblTitle.lineBreakMode];
    lblTitle.frame = CGRectMake(lblTitle.frame.origin.x, lblTitle.frame.origin.y, theStringSize.width, theStringSize.height);
    lblTitle.text = theText;

   // lblTitle is the Label used for showing the Text.

you can get more precise idea rather than using textField here it is

score 0 · Answer 8 · answered Apr 01 '14 at 11:00

0

You can Simply Use A UITextView ,and Set its UserInteraction Enabled to No,And All of your problems will be solved!

answered Apr 01 '14 at 11:00

Waleed Bashir Heraj

21
8

Is it possible to vertically align text inside labels with a "large" frame

8 Answers8

Linked