Chris Hansen
Chris Hansen

Reputation: 8687

table head view not showing the right header

I have the following code

   private func addTableHeaderView() {
        let scoreView = UIView(frame: CGRect(x: 0, y: 0, width: tableView.frame.width, height: 150))
        
        let scoreLabel = UILabel()
        scoreLabel.text = "Score: 100"
        scoreLabel.font = UIFont(name: "WorkSans-Bold", size: 20)
        scoreLabel.textAlignment = .left
        
        let scoreImageView = UIImageView()
        scoreImageView.image = UIImage(named: "score") // Replace with your image
        scoreImageView.contentMode = .scaleAspectFit
        
        let streakImageView = UIImageView()
        streakImageView.image = UIImage(named: "scorebar")
        streakImageView.contentMode = .scaleAspectFit
        
        let encouragementLabel = UILabel()
        encouragementLabel.text = "Keep it up! Learn everyday and don’t let your score reset"
        encouragementLabel.font = UIFont(name: "WorkSans-Medium", size: 14)
        encouragementLabel.textAlignment = .center
        encouragementLabel.numberOfLines = 0
        
        scoreView.backgroundColor = .white
        scoreView.layer.cornerRadius = 16
        scoreView.addSubview(scoreLabel)
        scoreView.addSubview(scoreImageView)
        scoreView.addSubview(streakImageView)
        scoreView.addSubview(encouragementLabel)
        
        scoreLabel.translatesAutoresizingMaskIntoConstraints = false
        scoreView.translatesAutoresizingMaskIntoConstraints = false
        scoreImageView.translatesAutoresizingMaskIntoConstraints = false
        encouragementLabel.translatesAutoresizingMaskIntoConstraints = false
        streakImageView.translatesAutoresizingMaskIntoConstraints = false
        
        
        NSLayoutConstraint.activate([
            // Button stack constraints
            scoreLabel.leadingAnchor.constraint(equalTo: scoreView.leadingAnchor, constant: 16),
            scoreLabel.topAnchor.constraint(equalTo: scoreView.topAnchor),
            scoreLabel.widthAnchor.constraint(equalToConstant: 200),
            scoreLabel.heightAnchor.constraint(equalToConstant: 50),
            
            scoreImageView.trailingAnchor.constraint(equalTo: scoreView.trailingAnchor, constant: -16),
            scoreImageView.topAnchor.constraint(equalTo: scoreView.topAnchor, constant: 16),
            scoreImageView.widthAnchor.constraint(equalToConstant: 36),
            scoreImageView.heightAnchor.constraint(equalToConstant: 36),
            
            streakImageView.centerXAnchor.constraint(equalTo: scoreView.centerXAnchor),
            streakImageView.topAnchor.constraint(equalTo: scoreImageView.bottomAnchor, constant: 16),
            streakImageView.widthAnchor.constraint(equalToConstant: 307),
            streakImageView.heightAnchor.constraint(equalToConstant: 30),
            
            encouragementLabel.centerXAnchor.constraint(equalTo: scoreView.centerXAnchor),
            encouragementLabel.topAnchor.constraint(equalTo: streakImageView.bottomAnchor, constant: 16),
            encouragementLabel.leadingAnchor.constraint(equalTo: scoreView.leadingAnchor, constant: 16),
            encouragementLabel.trailingAnchor.constraint(equalTo: scoreView.trailingAnchor, constant: -16),
        ])
        
        
        tableView.tableHeaderView = scoreView
    }
    

Unfortunately, it's not adding scoreView to the table view header properly. In fact, scoreView gets overlapped with the other rows in the table. So the other rows get rendered under scoreView. Can someone please help?

Upvotes: 0

Views: 19

Answers (0)

Related Questions