Set margin on top of a tableview in IOS

Question

I'm new to IOS development with swift and I'm having a problem. I need to create a tableview and it looks almost the way I wanted, except for the space at the top of the first section of the table. It has no name but I would like to reduce the space between the top and the first item. What I was able to do is according to the code and image below:

override func numberOfSections(in tableView: UITableView) -> Int {
    return 2
}

override func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
    switch (section) {
        case 0:
            return ""
        default:
            return self.nameSection2
    }
}

override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    let headerView = UIView()
    headerView.backgroundColor = UIColor.white
    let headerLabel = UILabel(frame: CGRect(x: 15, y: 8, width:
        tableView.bounds.size.width, height: tableView.bounds.size.height))
    headerLabel.font = UIFont(name: "Verdana", size: 16)
    headerLabel.textColor = UIColor.lightGray
    headerLabel.text = self.tableView(self.tableView, titleForHeaderInSection: section)
    headerLabel.sizeToFit()
    headerView.addSubview(headerLabel)
    return headerView
}

score 2 · Accepted Answer · edited Nov 06 '20 at 22:41

2

The 'margin' you see is because the height for both the section headers is the same. The second one looks less-empty as it actually has a title.

You can modify the height for the headers to reduce the space:

func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    switch section {
        case 0: 
            return 0
        case 1: 
            return 44 //Required height value here
        default: 
            return defaultValue //Any default value
    }
}

edited Nov 06 '20 at 22:41

idrougge

633
5
12

answered Oct 29 '17 at 03:03

Kunal Shah

1,071
9
24

Thank you very much. I got it here :D. – Thomas Marques Oct 29 '17 at 13:58

Shawn · Answer 2 · 2017-10-29T03:23:03.310

You need to implement the heightForHeaderInSection so you can collapse that header. See below:

func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    if section == 0 {
        return 1.0
    } else {
        return 32.0
    }
}

You can set the appropriate value for the else condition for your needs but this gives you the idea.

Update #1: I found this link in searching that may help as well: http://stackoverflow.com/a/23955420/3965

It recommends using GLFloat's minimum value instead:

if section == 0 {
     return CGFloat.leastNormalMagnitude
}

return tableView.sectionHeaderHeight

score 0 · Answer 3 · answered Oct 29 '17 at 03:10

Implement heightForHeaderInSection and return the height you want for the first section.

Also, you wouldn't normally implement titleForHeaderInSection and viewForHeaderInSection. Just put your switch statement in viewForHeaderInSection to set the text for your label.

And you don't need to put your UILabel into headerView, just return the label. Or instead of UIView, use UITableViewHeaderFooterView.

Set margin on top of a tableview in IOS

3 Answers3