Alex
Alex

Reputation: 1233

Implementing a custom table section header via Storyboard and new Xib

Here is what I have done:

I created a custom xib file that has a small UIView used for a custom table section header. I classed the custom xib file.

I want to add this to a tableView as the header. I have looked at a few resources, but they seem to be either outdated or missing information.

Looking in the documentation, I see a reference to adding a custom header with the following instructions:

To make the table view aware of your header or footer view, you need to register it. You do this using the registerNib:forCellReuseIdentifier: or registerClass:forCellReuseIdentifier: method of UITableView.

When I added a tableView to my storyboard view, it was easy to assign it a reuse identifier within XCode. I was even able to create a custom cell xib file and it also had a spot for a reuse identifier within XCode.

When I created the custom UIView for the section header, it did not have an entry for reuse identifier. Without this, I have no idea how to use registerNib:forCellReuseIdentifier.

More information: I have a storyboard scene that has a tableView inside. The tableView is of a custom class that is linked and the tableView object has an outlet in the parent view's ViewController file.

The parent ViewController is both the UITableViewDataSourceDelegate and UITableViewDelegate. Again, I was able to implement the custom cells with no issue. I can't even modify the header in any way besides the title.

I tried calling the method [[self tableHeaderView] setBackgroundColor:[UIColor clearColor]]; from the custom tableView class and nothing happens. I tried using this method in the parent ViewController class by using the outlet name like so: [[self.tableOutlet tableHeaderView] setBackgroundColor:[UIColor clearColor]];

Any help would be greatly appreciated.

EDIT: (Can't change background to transparent)

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {

    HeaderView *headerView = [self.TableView dequeueReusableHeaderFooterViewWithIdentifier:@"tableHeader"];

    // Set Background color
    [[headerView contentView] setBackgroundColor:[UIColor clearColor]];

    // Set Text
    headerView.headerLabel.text = [self.sectionArray objectAtIndex:section];

    return headerView;
}

Upvotes: 9

Views: 15695

Answers (2)

Lord Zsolt
Lord Zsolt

Reputation: 6557

On the problem with background color (Unless you want transparent):

You can create an UIView which occupies the whole view then change the background color of that.

If you don't want others to know what's happening, you can overwrite the backgroundColor property:

//interface
@property (copy, nonatomic) UIColor *backgroundColor;


//implementation
@dynamic backgroundColor;

- (void)setBackgroundColor:(UIColor *)backgroundColor {
    //self.viewBackground is the created view
    [self.viewBackground setBackgroundColor:backgroundColor];
}

- (UIColor *)backgroundColor {
    return self.viewBackground.backgroundColor;
}

Upvotes: 0

rdelmar
rdelmar

Reputation: 104082

You don't need to set the identifier in the xib -- you just need to use the same identifier when you register, and when you dequeue the header view. In the viewDidLoad method, I registered the view like this:

[self.tableView registerNib:[UINib nibWithNibName:@"Header1" bundle:nil] forHeaderFooterViewReuseIdentifier:@"header1"];

Then, in the delegate methods:

-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
    UIView *headerView = [self.tableView dequeueReusableHeaderFooterViewWithIdentifier:@"header1"];
    return headerView;
}

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

Upvotes: 20

Related Questions