TableView Cells scroll over headerview in UITableViewController - swift

Question

so I currently have a TableViewController that has headerview and prototype cells. Inside the headerview, there is an image. I have programmed it to where a user scrolls down, the headerview stretches down. But I want to find a way to make that header view stick where it is at and when a user scrolls up on the table view, the cells go over the headerview instead of the headerview scrolling up with the cells which it currently is doing. Here is my code for the TableViewController:
import UIKit
class HeaderViewTableViewController: UITableViewController {
var image: UIImageView?
var image2: UIImageView?
var songNameArray = ["Intro", "The Box", "Start wit Me (feat. Gunna)", "Perfect Time", "Moonwalkin (feat. Lil Durk)", "Big Stepper", "Gods Eyes", "Peta (feat. Meek Mill)", "Boom Boom Boom", "Elyse's Skit", "High Fashion (feat. Mustard)", "Bacc Seat (feat. Ty Dolla $ign)", "Roll Dice", "Prayers to the Trap God", "Tip Toe (feat. A Boogie wi da Hoodie)", "War Baby"]
private let tableHeaderViewHeight: CGFloat = 350.0
private let tableHeaderViewCutAway: CGFloat = 0.1
var headerView: HeaderView!
var headerMaskLayer: CAShapeLayer!
override func viewDidLoad() {
super.viewDidLoad()
tableView.tableFooterView = UIView()
headerView = tableView.tableHeaderView as! HeaderView
headerView.imageView = image
tableView.tableHeaderView = nil
tableView.addSubview(headerView)
tableView.contentInset = UIEdgeInsets(top: tableHeaderViewHeight, left: 0, bottom: 0, right: 0)
tableView.contentOffset = CGPoint(x: 0, y: -tableHeaderViewHeight + 64)
//cut away header view
headerMaskLayer = CAShapeLayer()
headerMaskLayer.fillColor = UIColor.black.cgColor
headerView.layer.mask = headerMaskLayer
let effectiveHeight = tableHeaderViewHeight - tableHeaderViewCutAway/2
tableView.contentInset = UIEdgeInsets(top: effectiveHeight, left: 0, bottom: 0, right: 0)
tableView.contentOffset = CGPoint(x: 0, y: -effectiveHeight)
updateHeaderView()
}
func updateHeaderView() {
let effectiveHeight = tableHeaderViewHeight - tableHeaderViewCutAway/2
var headerRect = CGRect(x: 0, y: -effectiveHeight, width: tableView.bounds.width, height: tableHeaderViewHeight)
if tableView.contentOffset.y < -effectiveHeight {
headerRect.origin.y = tableView.contentOffset.y
headerRect.size.height = -tableView.contentOffset.y + tableHeaderViewCutAway/2
}
headerView.frame = headerRect
let path = UIBezierPath()
path.move(to: CGPoint(x: 0, y:0))
path.addLine(to: CGPoint(x: headerRect.width, y: 0))
path.addLine(to: CGPoint(x: headerRect.width, y: headerRect.height))
path.addLine(to: CGPoint(x: 0, y: headerRect.height - tableHeaderViewCutAway))
headerMaskLayer?.path = path.cgPath
}
override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {
self.tableView.decelerationRate = UIScrollView.DecelerationRate.fast
}
override func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return UITableView.automaticDimension
}
#IBAction func backButton(_ sender: Any) {
dismiss(animated: true, completion: nil)
}
}
extension HeaderViewTableViewController {
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return songNameArray.count
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "SongCell", for: indexPath) as! SongNameTableViewCell
cell.songName.text = songNameArray[indexPath.row]
return cell
}
}
extension HeaderViewTableViewController {
override func scrollViewDidScroll(_ scrollView: UIScrollView) {
updateHeaderView()
}
}
Any idea on how to achieve this? Also I have a button nested inside the headerview that I would like to stick to the top of the view controller when users scroll up. I have it nested there because I'm not sure where else it could go in a table view like a custom cell.
Heres an image of how it is setup in my storyboard and what it looks like when ran on the simulator.