Grouped UITableView shows blank space when section is empty

Question

I have a grouped UITableView where not all sections may be displayed at once, the table is driven by some data that not every record may have. My trouble is that the records that don't have certain sections show up as blank spaces in the table. There are no footers/headers. Anything I've missed?

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
// Return the number of rows in the section.
return [self getRowCount:section];
}


// Customize the appearance of table view cells.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

static NSString *CellIdentifier = @"Cell";

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
    cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
}

cell.textLabel.text = [NSString stringWithFormat:@"section: %d row: %d",indexPath.section,indexPath.row];
// Configure the cell...

return cell;
}

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    
    float height = 0.0;
    
    if([self getRowCount:indexPath.section] != 0){
        height = kDefaultRowHeight;
    }
    
    return height;
    
}

I have a simple answer for the same issue here: https://stackoverflow.com/a/22185534/2789144 — James Nelson, Oct 15 '18 at 20:35

score 45 · Answer 1 · answered Oct 24 '10 at 05:15

I have a similar situation and my data model really works better if I can let it have empty sections.

Your problem can be solved if you set self.tableView.sectionHeaderHeight = 0; and self.tableView.sectionFooterHeight = 0; in your tableview controller. These must be 0 because the delegate methods somehow ignore a return value of 0. Then you have to override some delegate methods:

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
    if (section==0)
        return sectionGapHeight;
    if ([self tableView:tableView numberOfRowsInSection:section]==0) {
        return 0;
    }
    return sectionGapHeight;
}
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section {
    if (section==[self numberOfSectionsInTableView:tableView]-1) {
        return sectionGapHeight;
    }
    return 0;
}
- (UIView *)sectionFiller {
    static UILabel *emptyLabel = nil;
    if (!emptyLabel) {
        emptyLabel = [[UILabel alloc] initWithFrame:CGRectZero];
        emptyLabel.backgroundColor = [UIColor clearColor];
    }
    return emptyLabel;
}
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
    return [self sectionFiller];
}
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section {
    return [self sectionFiller];
}

This code will also make the gap between sections the same height as the gap before the first section and the gap below the last. That looks better in my opinion than the default where the gap between is twice as big as the ones at the top and the bottom.

The least intrusive method I've found until now is to return 1 for heightForHeaderInSection and heightForFooterInSection `if ([self tableView: tableView numberOfRowsInSection: section] == 0)` and return a view with zero size for `viewForHeaderInSection` / `viewForFooterInSection` if the row count is 0. — Steven Kramer, May 27 '11 at 12:38
Thanks! Thanks! Freaking Apple. It would be really nice if they documented things like the fact that returning 0 for heights in the delegate does not override the standard spacing. There are way too many subtle API edge cases that Apple doesn't document. — smparkes, Oct 02 '11 at 22:54
This logic does not account for situations where some of your sections have title text or footers. — Sonny Saluja, Apr 17 '12 at 20:58
self.tableView.sectionHeaderHeight = 0 && self.tableView.sectionFooterHeight = 0 have solved blank space between hidden section. Thanks — Shrawan, Oct 23 '17 at 09:11
Thanks! I was looking everywhere for a solution, as I already suspected the sectionHeader heights, but I didn't think the delegate value would be ignored... — ph1lb4, Dec 03 '21 at 12:10

Ramesh · Answer 2 · 2012-05-14T21:05:59.607

20

Here is the solution that worked for me

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
    switch (section) {  
      case 1: case 3: case 5: return 20.0f; break;
      default: return 0.01f; // for some reason 0 is not accepted - give something :)
    }
}

- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section {
    switch (section) {  
      case 1: case 3: case 5: return 20.0f; break;
      default: return 0.01f; // for some reason 0 is not accepted - give something :)
    }
}

edited May 14 '12 at 21:05

answered May 14 '12 at 20:44

Ramesh

1,703
18
13

1

I read this and thought "there's no way that it just doesn't like 0.0f". But I checked it out and as of iOS6, this is still the case. – Tin Can Jul 10 '13 at 19:46

score 6 · Accepted Answer · answered Mar 22 '10 at 21:45

In the above screenshot, is your numberOfSectionsInTableView: method returning a value of 5? And then is your getRowCount: method (called from numberOfRowsInSection:) returning a value of 0 for those "missing" sections (e.g. 1, 3 and 4)?

If you don't want gaps in between, the likely solution is to only declare the number of sections you want to be visible. In your example above, you'd only want to return value of 3 from numberOfSectionsInTableView:.

MrHus · Answer 4 · 2011-08-17T20:14:32.410

This solution is based on user362178 solution. But keeps the labels of the sections intact:

Define somewhere at the top of your code:

#define HEIGHT_FOR_HEADER_AND_FOOTER 50

Add to the view did load:

self.tableView.sectionHeaderHeight = 0;
self.tableView.sectionFooterHeight = 0;

Add these methods:

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section 
{
    // Needed because if this does not return a value, the header label of the section will
    // be at the top of the screen.
    if (section == 0)
    {
        return HEIGHT_FOR_HEADER_AND_FOOTER;
    }

    if ([self tableView:tableView numberOfRowsInSection:section] == 0) 
    {
        return 0;
    }
    else   
    {
        return HEIGHT_FOR_HEADER_AND_FOOTER;
    }
}

- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section 
{
    // if last section
    if (section == [self numberOfSectionsInTableView:tableView] - 1) 
    {
        return HEIGHT_FOR_HEADER_AND_FOOTER;
    }

    return 0;
}

score 3 · Answer 5 · edited May 23 '17 at 12:09

Here is the most elegant solution I've found based on all the answers here, plus this answer:

- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section {

    if ([tableView.dataSource tableView:tableView numberOfRowsInSection:section] == 0) {
        return nil;
    } else {
        // Return title normally
    }
}

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
    if ([self tableView: tableView numberOfRowsInSection: section] == 0) {
        return 0.01f;;
    }

    return UITableViewAutomaticDimension;
}

- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section {
    if ([self tableView: tableView numberOfRowsInSection: section] == 0) {
        return 0.01f;;
    }

    return UITableViewAutomaticDimension;
}

score 1 · Answer 6 · answered Jul 25 '14 at 09:31

I had the same problem in iOS 7 and finally I solved this checking the Height for Header and Footer sections, as Ramesh said:

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section { 
if ([[self.tableView objectAtIndex:section] count] == 0)
    return 0.01f;
else
    return 30.f;

}

- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section {
return 0.01f;

}

It's curious, but if you set 0.f as the height the sections is showed with a default size and moves down the other sections.

score 1 · Answer 7 · answered Jan 15 '20 at 14:40

There is a convenient value for this case, called CGFloat.leastNonzeroMagnitude. Use it as follows:

func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    return .leastNonzeroMagnitude
}

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

You can also use tableView.sectionHeaderHeight = 0 and tableView.sectionFooterHeight = 0, but this will be applied for all headers and footers. With the delegate solution you're still able to manipulate different headers' and footers' height, but use .leastNonzeroMagnitude as a default

score 0 · Answer 8 · answered May 28 '14 at 05:29

The key is to set the table view's sectionHeaderHeight and sectionFooterHeight to zero.

You can do this either in viewDidLoad, or in the User Defined Runtime Attributes section in your storyboard/xib. For some reason, in the Size Inspector tab, you cannot set the header or footer height below 1.

I found that once I did this, I didn't need to override any other delegate methods in a special way. I simply return 0 from numberOfRowsInSection and nil from titleForHeaderInSection for sections that are empty, and they take up no space in my table view.

Sections that do have titles are automatically given the proper header size, and the top of the table view still has the default blank space.

score 0 · Answer 9 · answered Mar 22 '10 at 21:50

I believe that with section table views, each section must exist, and each section has buffer room for a header and a footer regardless of you putting text in them. What you need to do is remove the sections that aren't being used. In your example, you would remove section 1, 3, and 4. This would mean:

"section 0" is indexPath.section == 0

"section 2" is indexPath.section == 1

"section 5" is indexPath.section == 2

If you code in this fashion, the headers and footers will be removed because the nil cell is removed.

This isn't proper coding of course but I just wanted to give you an idea of the theology. Hope this helps.

score 0 · Answer 10 · answered May 01 '19 at 12:02

I solved the issue by setting tableView's dataSource and delegate where I initialize the tableView.

Note: remember you might need to make tableView lazy to assign when initializing the tableView.

lazy var tableView: UITableView = {
        let tableView = UITableView(frame: .zero, style: .grouped)
        tableView.separatorStyle = .none
        tableView.backgroundColor = .white
        tableView.dataSource = self
        tableView.delegate = self
        return tableView
    }()

score 0 · Answer 11 · answered May 01 '19 at 12:03

I solved the issue by setting tableView's dataSource and delegate where I initialize the tableView

Remember you might need to make tableView lazy to assign when initializing the tableView

lazy var tableView: UITableView = {
        let tableView = UITableView(frame: .zero, style: .grouped)
        tableView.separatorStyle = .none
        tableView.backgroundColor = .white
        tableView.dataSource = self
        tableView.delegate = self
        return tableView
    }()

Grouped UITableView shows blank space when section is empty

11 Answers11

Linked