Header/Footer height of a UITableView section based on title text height

Question

I am wondering if its possible to make the height header/footer for a section of a UITableView be equal to the height of the header/footer title text. Any tips would be great!

Note: some sections of my TableView may not have a header/footer and in that case would just have the padding between sections since the "headerTitleHeight/footerTitleHeight" would be zero in this case.

-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
    return headerTitleHeight + padding;
}

-(CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section {
    return footerTitleHeight + padding;
}

Just use `NSString` methods `sizeWithAttributes` (iOS 7) or `sizeWithFont...` for (iOS < 7). Documentation link here https://developer.apple.com/library/ios/documentation/uikit/reference/NSString_UIKit_Additions/Reference/Reference.html — Rog, Jan 13 '14 at 07:13

score 12 · Accepted Answer · answered Jan 13 '14 at 07:32

-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section 
{

    NSString *myHeader = [sectionsArray objectAtIndex:section];
    CGSize maxSize = CGSizeMake(320, 999999.0);
    int height = 0;

    NSDictionary *attributesDictionary = [NSDictionary dictionaryWithObjectsAndKeys:
                                          font, NSFontAttributeName,
                                          nil];

    if (IS_IOS_6) //Macro i made for if iOS 6
    {
        CGSize size = [myHeader sizeWithFont:[UIFont fontWithName:@"HelveticaNeue-Bold" size:(15)]
                             constrainedToSize:maxSize
                                 lineBreakMode:NSLineBreakByWordWrapping];
        height = size.height;
    }
    else // IOS 7 , Attributes
    {
        CGRect frame = [myHeader boundingRectWithSize:maxSize
                                                options:NSStringDrawingUsesLineFragmentOrigin
                                             attributes:attributesDictionary
                                                context:nil];
        height = frame.size.height;
    }

    return height+5;
}

Awesome answer, this method worked perfectly.Thanks! – DBoyer Jan 13 '14 at 16:14 — DBoyer, Jan 13 '14 at 16:14

guywithmazda · Answer 2 · 2017-03-29T13:27:53.990

5

You can just

return UITableViewAutomaticDimension;

EDIT: Oops, ignore the following, see comments below.

or

return UITableViewAutomaticDimension + padding;

edited Mar 29 '17 at 13:27

answered Dec 05 '14 at 22:32

guywithmazda

757
7
10

except that `UITableViewAutomaticDimension` is `0`, and `0 + padding` will remove the auto-height feature of the footer. – Simon Mar 28 '17 at 13:07
@Simon, actually it is -1.0, but your point is valid. Edited original post. – guywithmazda Mar 29 '17 at 13:28
Right answer is https://stackoverflow.com/questions/29462331/is-it-possible-to-obtain-a-dynamic-table-view-section-header-height-using-auto-l – poGUIst Jun 27 '17 at 16:40

score 3 · Answer 3 · answered Oct 11 '17 at 09:12

You can you automatic dimensions but you have to have estimated size. It works for Footer and Header the same way.

func tableView(_ tableView: UITableView, estimatedHeightForFooterInSection section: Int) -> CGFloat {
    return 300
}

func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
    return UITableViewAutomaticDimension
}

score 1 · Answer 4 · answered Jan 13 '14 at 07:21

Calculate size of text and add padding height

-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section 
{
CGFloat headerTitleHeight = [jobTitleString sizeWithFont:[UIFont fontWithName:@"OpenSans-Light" size:20.0f] constrainedToSize:CGSizeMake(width,9999)].height;
    return headerTitleHeight + padding;
}

score 0 · Answer 5 · answered Jan 13 '14 at 07:10

You could use boundingRectWithSize method to get the height required to draw the particular NSString for the header/footer and then return the values in the UITableView delegate methods. For sections without header footer, you have to code to just return the padding.

score 0 · Answer 6 · answered Jan 13 '14 at 07:42

You can try the below..

CGSize constraint = CGSizeMake(<header/footer width>, <max header/footer height>);

CGSize size;

if([[[UIDevice currentDevice] systemVersion] floatValue] >= 7.0)
{
    NSRange range = NSMakeRange(0, [<string> length]);

    NSDictionary *attributes = [<string> attributesAtIndex:0 effectiveRange:&range];
    CGSize boundingBox = [<string> boundingRectWithSize:constraint options: NSStringDrawingUsesLineFragmentOrigin attributes:attributes context:nil].size;

    size = CGSizeMake(ceil(boundingBox.width), ceil(boundingBox.height));
}
else
{
    size = [<string> sizeWithFont:descriptionLabel.font constrainedToSize:constraint lineBreakMode:descriptionLabel.lineBreakMode];
}

return size.height + padding;

or

CGSize maximumLabelSize = CGSizeMake(<header/footer width>, <max header/footer height>);

CGSize expectedSize = [<string label> sizeThatFits:maximumLabelSize];

return expectedSize.height + padding;

Linh · Answer 7 · 2016-05-23T03:22:08.190

In viewDidLoad, heightForFooterInSection and heightForHeaderInSection

- (void)viewDidLoad {
   [super viewDidLoad];

   self.tableView.estimatedSectionFooterHeight = 50; // for footer
   self.tableView.estimatedSectionHeaderHeight = 50; // for header
}

- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{
    return UITableViewAutomaticDimension;
}

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
    return UITableViewAutomaticDimension;
}

In Footer/Header xib file
- Add BOTH constraint top and bottom to ContainerView for your UILabel
- Add UILabel constraint height then change UILabel constraint height from Equal-> Greater than or Equals
- Finaly change UILabel line to 0

Header/Footer height of a UITableView section based on title text height

7 Answers7