UITableView section headers overlapping UITableviewCell and have no background colour

Question

In a previous project using ObjectiveC, I had a multiple section tableView showing section headers with different background colours and with header text that dynamically updated itself dependent upon the number of items within the section. It worked perfectly. I have tried to replicate this code in a new project in which we are using Swift and it doesn't work. The header text displays correctly, but there is no background colour and most importantly, the section header overlays the top cell in each section rather than sitting above it. This is the relevant code:

    // MARK: TableView delegates

func numberOfSectionsInTableView(tableView: UITableView) -> Int {
    if let sections = fetchedResultsController!.sections {
        return sections.count
    }
    return 0
}

func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    if let sections = fetchedResultsController!.sections {
        let currentSection = sections[section]
        return currentSection.numberOfObjects
    }
    return 0
}

func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    let headerView = UIView(frame: CGRectMake(0, 0, tableView.bounds.size.width, 30))
    let textHeader = UILabel(frame: CGRectMake(11, 0, 320, 20))
    switch (section) {
    case 0:
        headerView.backgroundColor = UIColor.greenColor()
    case 1:
        headerView.backgroundColor = UIColor.blueColor()
    case 2:
        headerView.backgroundColor = UIColor.redColor()
    case 3:
        headerView.backgroundColor = UIColor.purpleColor()
    default:
        break
    }
    let hText: String = "\(fetchedResultsController!.sections![section].name)"
    let hItems: String = "\((fetchedResultsController!.sections![section].numberOfObjects) - 1)"
    let headerText: String = "\(hText) - \(hItems)items"
    textHeader.text = headerText
    textHeader.textColor = UIColor.whiteColor()
    textHeader.backgroundColor = UIColor.clearColor()
    headerView.addSubview(textHeader)
    return headerView
}

func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat? {
    return 20.0
}

Sorry, I no longer have access to that project, but it was just a full width header, 20 high, that had different colours and looked like a divider between the sections. it sat above the 1st cell in each section and never overlaid it as is happening in this new Swift code. — Rockhopper9, Apr 29 '16 at 17:40

score 3 · Answer 1 · answered Apr 29 '16 at 09:29

3

The header overlays because its height is 30, and you return only 20.0 in heightForHeaderInSection func. the background color doesn't show up because you miss a break for each "case" in the switch statements.

answered Apr 29 '16 at 09:29

MudOnTire

506
3
9

I have already tried with all header sizes up to 45 including 30 before posting and it did not solve the problem. – Rockhopper9 Apr 29 '16 at 11:05
What does the table view look like then? – MudOnTire Apr 29 '16 at 11:11

score 0 · Answer 2 · answered Apr 29 '16 at 09:34

0

Switch cases should end with break, then only it will return the backgroundcolor

Check below code

switch (section) {
case 0:
    headerView.backgroundColor = UIColor.greenColor()
    break
case 1:
    headerView.backgroundColor = UIColor.blueColor()
    break
case 2:
    headerView.backgroundColor = UIColor.redColor()
    break
case 3:
    headerView.backgroundColor = UIColor.purpleColor()
    break
default:
    break
}

answered Apr 29 '16 at 09:34

Sheereen S

1,292
10
18

1

Whilst this was correct with Objective C, in Swift you no longer include the break statement in each case, unless you want to execute no statements for a particular case. – Rockhopper9 Apr 29 '16 at 17:35

UITableView section headers overlapping UITableviewCell and have no background colour

2 Answers2