Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Swift & Navigation : Navigation Bar changes its background color when scroll the view

I have 2 ViewControllers embedded in a Navigation Controller shown in the picture below.

enter image description here

Every time I scroll through my table item, the navigation background color keeps changing along with the status bar background color.

How do I set the backgroundColor of my navigation bar and status bar programmatically?

enter image description here enter image description here

Code:

import UIKit

class TestViewController: UIViewController, UIGestureRecognizerDelegate {

    @IBOutlet weak var tableView: UITableView!
    
    let faqList : [FAQ] = [
        FAQ(title: "Test 1", content: "Answer 1"),
        FAQ(title: "Test 2", content: "Answer 2"),
        FAQ(title: "Test 3", content: "Answer 3"),
        FAQ(title: "Test 4", content: "Answer 4"),
        FAQ(title: "Test 5", content: "Answer 5"),
        FAQ(title: "Test 6", content: "Answer 6"),
        FAQ(title: "Test 7", content: "Answer 7"),
        FAQ(title: "Test 8", content: "Answer 8"),
        FAQ(title: "Test 9", content: "Answer 9"),
        FAQ(title: "Test 10", content: "Answer 10"),
        FAQ(title: "Test 11", content: "Answer 11"),
        FAQ(title: "Test 12", content: "Answer 12"),
        FAQ(title: "Test 13", content: "Answer 13"),
        FAQ(title: "Test 14", content: "Answer 14"),
    ]
    
    override func viewDidLoad() {
        super.viewDidLoad()
        tableView.delegate = self
        tableView.dataSource = self

        tableView.backgroundColor = UIColor(named: "BackgroundColor")
        tableView.register(UINib(nibName: "ButtonTableViewCell", bundle: nil), forCellReuseIdentifier: "ButtonCell")
        self.navigationController?.navigationBar.backgroundColor = .blue
    }
}

extension TestViewController: UITableViewDelegate {
    
}

extension TestViewController: UITableViewDataSource {
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return faqList.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "ButtonCell", for: indexPath) as! ButtonTableViewCell
        let buttonCell = faqList[indexPath.row]
        cell.titleLabel.text = buttonCell.title
        cell.trailingIconBackground.isHidden = true

        cell.buttonView.backgroundColor = .brown
        cell.buttonView.layer.cornerRadius = 10
        cell.buttonView.layer.masksToBounds = true

        cell.selectionStyle = UITableViewCell.SelectionStyle.none
        
        return cell
    }
}
like image 535
Time Flies Avatar asked Sep 07 '25 13:09

Time Flies


2 Answers

Paste this to AppDelegate and if you have tab bar also then paste tabbarappearance also it will work.

if #available(iOS 15, *) {
    // MARK: Navigation bar appearance
    let navigationBarAppearance = UINavigationBarAppearance()
    navigationBarAppearance.configureWithOpaqueBackground()
    navigationBarAppearance.titleTextAttributes = [
        NSAttributedString.Key.foregroundColor : UIColor.white
    ]
    navigationBarAppearance.backgroundColor = UIColor.blue
    UINavigationBar.appearance().standardAppearance = navigationBarAppearance
    UINavigationBar.appearance().compactAppearance = navigationBarAppearance
    UINavigationBar.appearance().scrollEdgeAppearance = navigationBarAppearance
    
    // MARK: Tab bar appearance
    let tabBarAppearance = UITabBarAppearance()
    tabBarAppearance.configureWithOpaqueBackground()
    tabBarAppearance.backgroundColor = UIColor.blue
    UITabBar.appearance().scrollEdgeAppearance = tabBarAppearance
    UITabBar.appearance().standardAppearance = tabBarAppearance
}
like image 102
Bikesh Thakur Avatar answered Sep 09 '25 09:09

Bikesh Thakur


Just simply add empty image to the navigationBar background like below:

 navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
 navigationController?.navigationBar.shadowImage = UIImage()
like image 42
Rattanakoudom Sambath Avatar answered Sep 09 '25 10:09

Rattanakoudom Sambath