Home > Blockchain >  UINavigationBar has a wide space on top of it
UINavigationBar has a wide space on top of it

Time:01-28

I honestly don't know how to fix this. I currently have a UITabBar and have implemented navigationBar and when I render my app in a simulator or a device there's a wide space on top of the navigation bar. How do I get rid of this unwanted space

class DashboardTabBarView: UITabBarController {
    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .blue

        let dashboard = UINavigationController(rootViewController: DashboardView())
        dashboard.tabBarItem.image = UIImage(systemName: "house")
        dashboard.title = "Home"
        tabBar.tintColor = .systemPink
        setViewControllers([dashboard], animated: true)
    }
}

class DashboardView: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .green
        configureNavBar()
    }

    private func configureNavBar(){
        var image = UIImage(named: "Bell")
        image = image?.withRenderingMode(.alwaysOriginal)
        navigationItem.leftBarButtonItem = UIBarButtonItem(image: image, style: .done, target: self, action: nil)
        let item = UIBarButtonItem(title: "Sign In", style: .plain, target: self, action: #selector(self.goToSignIn))
        let font:UIFont = UIFont(name: String.circularStdBold, size: 14) ?? UIFont()
        item.setTitleTextAttributes([NSAttributedString.Key.font: font], for: UIControl.State.normal)
        item.tintColor = .red
        navigationItem.rightBarButtonItem = item
        navigationController?.navigationBar.backgroundColor = UIColor(red: 0.985, green: 0.94, blue: 1, alpha: 1)[Navbar has a white space on top][1]
    }
}

func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
        
        guard let windowScence = (scene as? UIWindowScene) else { return }
        let navigationController = UINavigationController(rootViewController: DashboardTabBarView())
        window = UIWindow(frame: windowScence.coordinateSpace.bounds)
        window?.windowScene = windowScence
        window?.rootViewController = navigationController
        window?.makeKeyAndVisible()
    }

screenshot taken from my simulator

enter image description here

CodePudding user response:

The issue is that you are putting the tab bar controller in its own nav controller. Never do that. It's fine for each tab's view controller to be in its own nav controller but the tab bar controller itself should never be in a nav controller.

Change:

guard let windowScence = (scene as? UIWindowScene) else { return }
let navigationController = UINavigationController(rootViewController: DashboardTabBarView())
window = UIWindow(frame: windowScence.coordinateSpace.bounds)
window?.windowScene = windowScence
window?.rootViewController = navigationController

to:

guard let windowScence = (scene as? UIWindowScene) else { return }
window = UIWindow(frame: windowScence.coordinateSpace.bounds)
window?.windowScene = windowScence
window?.rootViewController = DashboardTabBarView()

This should eliminate the big gap at the top which was being caused by the nav bar of the window's root view controller.

  • Related