How to update UITableview Header height while scrolling programatically

2.4k Views Asked by At

In My application I have top navigation bar and a tableview below the navigation bar. I have CollectionViewCell with two rows which added inside the UITableViewHeader programmatically. When ever I scroll the the TableView to top, i want the header to stop just below the navigation bar, and update the TableView Header height so I can show only one row. I just want to do an animation (like Shrinked)when the TableViewHeader sticks to the navigationbar the two collectionview rows should turn into one row by decreasing the Header Height. How can I do it programmatically

Below is my code for showing CustomHeaderView

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    let headerView = UIView.init(frame: CGRect(x: 0, y: 0, width: self.view.frame.width, height: 183))
    let headerCell = tableView.dequeueReusableCell(withIdentifier: kLastPlayedidentifier) as! LastPlayedTVC
    headerCell.frame = headerView.frame
    headerCell.category = lastPlayedData
    headerView.addSubview(headerCell)
    return headerView
}

Also i'm checking for the scroll position to set the tableview header height progmmatically which isn't successful for me.

    func scrollViewDidScroll(_ scrollView: UIScrollView) {
    print(scrollView.contentOffset)
    if scrollView.contentOffset.y > 237 //This value is to check when the header reached the top position {
//Condition to check and animate the headerview height to make collectionview cell two rows into one rows.
    }

How can I achieve the TableViewHeader height update when header sticks on top while scrolling.

Any help is appreciated.

1

There are 1 best solutions below

2
Chris On

What you are looking for is "sticky header" and you want to change the header as well.

  • Sticky part is built in automatically I think if you just use UITableViewController(style: .plain), if that doesn't work for you, you can just google sticky header and there are lots of answers.

  • the part about changing the height or animating it. you are doing it right, just do something like:

    // update your viewForHeader method to account for headerRows variable above

// update your viewForHeader method to account for headerRows variable above

// default 2, you modify this in your scroll
var headerRows = 2

    func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? { 
let height = headerRows == 2 ? 183 : 91
        let headerView = UIView.init(frame: CGRect(x: 0, y: 0, width: self.view.frame.width, height: height))
        let headerCell = tableView.dequeueReusableCell(withIdentifier: kLastPlayedidentifier) as! LastPlayedTVC
        headerCell.frame = headerView.frame
        headerCell.category = lastPlayedData
        headerView.addSubview(headerCell)
        return headerView
    }

    func scrollViewDidScroll(_ scrollView: UIScrollView) {
        print(scrollView.contentOffset)
        if scrollView.contentOffset.y > 237 {
            updatedHeader.frame.size.height = 40
            self.tableviewObj.tableHeaderView = updatedHeader
            headerRows = 1 } else {
            headerRows = 2
        }
        self.tableView.reloadSectionHeaders()
    }

If you want to do some animating instead, what you would do is store reference to your headerView in a variable of your view controller and inside your scrollViewDidScroll animate it using UIView.animate{...}

hope this helps man.