MBProgressHUD to show label text in more than one line

Question

Hi i have a MBProgressHUD on my iPad screen. Works perfectly fine. But i want to change the label to show in three lines.Like this

    self.hud =  [[MBProgressHUD alloc] initWithView:self.navigationController.view];  
self.hud.frame = CGRectMake(0, 0, 120, 143);

[self.navigationController.view addSubview:self.hud];
self.hud.delegate = self;
self.hud.mode = MBProgressHUDModeAnnularDeterminate;
NSString *strloadingText = [NSString stringWithFormat:@"Loading Data.\r Please Wait.\r 1-2 Minutes"];
NSLog(@"the loading text will be %@",strloadingText);
self.hud.labelText = strloadingText;
[self.hud show:YES];

So i want the label in 3 lines

Loading Data.

Please Wait

1-2 Minutes

OR can i assign an image to the HUD?

All this should be in the labeltext. But i am ending up with only one line. How can i do that? If you need more info, please ask.Thanks.

Answer 1

MBProgressHUD's detailsLabelText property is multiline but not labelText property.

So, you can try something like this

MBProgressHUD * hud =  [MBProgressHUD showHUDAddedTo:self.view animated:YES];
hud.frame = CGRectMake(0, 0, 120, 143);

hud.mode = MBProgressHUDModeAnnularDeterminate;
NSString *strloadingText = [NSString stringWithFormat:@"Loading Data."];
NSString *strloadingText2 = [NSString stringWithFormat:@" Please Wait.\r 1-2 Minutes"];

NSLog(@"the loading text will be %@",strloadingText);
hud.labelText = strloadingText;
hud.detailsLabelText=strloadingText2;

You can set detailsLabelText font by using the property detailsLabelFont.

Answer 2

The reason why labelText differs from detailsText, I imagine because it's meant to be a very similar to UIAlertView from the title/description perspective.

The differences between the two labels is quite distinct because of their purpose, for instance:

• Titles have bigger fonts, oft times bold in comparison to detail text.
• Titles are meant to be short and obvious, taken from a popular dictionary site (description speaks for itself):

Title: A descriptive name; an epithet.

I'd recommend not having a multi-line title, keeping it short, and using the description text.

The reason why multi-line titles do not work is because of the layoutSubviews implementation, the size is not being calculated. if you inspect MBProgressHud.m, within layoutSubviews,

CGFloat remainingHeight = bounds.size.height - totalSize.height - kPadding - 4 * margin; 
CGSize maxSize = CGSizeMake(maxWidth, remainingHeight);
CGSize detailsLabelSize = [detailsLabel.text sizeWithFont:detailsLabel.font 
                            constrainedToSize:maxSize lineBreakMode:detailsLabel.lineBreakMode];
totalSize.width = MAX(totalSize.width, detailsLabelSize.width);
totalSize.height += detailsLabelSize.height;
if (detailsLabelSize.height > 0.f && (indicatorF.size.height > 0.f || labelSize.height > 0.f)) {
    totalSize.height += kPadding;
}

Note the -[NSString sizeWithFont: constrainedToSize: lineBreakMode:] call for the description text; this method calculates the size required to display the text - using as many lines as necessary, whereas the -[NSString sizeWithFont:] calculates the size required to display the text, but only up to displaying one line.

I would advise against having a multi-line title, and instead provide a shorter title, with some description text to accompany it.

If you simply must have the multi-line title (all changes within MBProgressHud.m):

- (void)setupLabels {
label = [[UILabel alloc] initWithFrame:self.bounds];
label.adjustsFontSizeToFitWidth = NO;
label.textAlignment = MBLabelAlignmentCenter;
label.opaque = NO;
label.backgroundColor = [UIColor clearColor];
label.textColor = [UIColor whiteColor];
label.font = self.labelFont;
label.text = self.labelText;
>>> label.numberOfLines = 0;
[self addSubview:label];  
    ...

Replace:

CGSize labelSize = [label.text sizeWithFont:label.font];
labelSize.width = MIN(labelSize.width, maxWidth);
totalSize.width = MAX(totalSize.width, labelSize.width);
totalSize.height += labelSize.height;
if (labelSize.height > 0.f && indicatorF.size.height > 0.f) {
    totalSize.height += kPadding;
}

CGFloat remainingHeight = bounds.size.height - totalSize.height - kPadding - 4 * margin; 
CGSize maxSize = CGSizeMake(maxWidth, remainingHeight);
CGSize detailsLabelSize = [detailsLabel.text sizeWithFont:detailsLabel.font 
                            constrainedToSize:maxSize lineBreakMode:detailsLabel.lineBreakMode];

With:

CGFloat remainingHeight = bounds.size.height - totalSize.height - kPadding - 4 * margin;  
CGSize maxSize = CGSizeMake(maxWidth, remainingHeight);  

CGSize labelSize = [label.text sizeWithFont:label.font constrainedToSize:maxSize lineBreakMode:label.lineBreakMode];
totalSize.width = MAX(totalSize.width, labelSize.width);
totalSize.height += labelSize.height;

if (labelSize.height > 0.f && indicatorF.size.height > 0.f) {
    totalSize.height += kPadding;
}

remainingHeight = bounds.size.height - totalSize.height - kPadding - 4 * margin;  
CGSize detailsLabelSize = [detailsLabel.text sizeWithFont:detailsLabel.font 
                            constrainedToSize:maxSize lineBreakMode:detailsLabel.lineBreakMode];

Hope this isn't too late to help.

Answer 3

I had a question like this, too !

You can set hud.label.numberOfLines = 0;

And it works!

Answer 4

self.hud.minSize = CGSizeMake(300, 100);