Tab bars on iPadOS 18 have moved to the top of the screen. They now share space with navigation bars.
We have added calls to setTabBarHidden(_:animated:) alongside existing calls to setNavigationBarHidden(_:animated:) in pushed view controller's viewWillAppear(_:) methods to manage the appearance of the tab bar and navigation bar within navigation controllers.
This results in layout issues with the safe area and navigation bar. I've attached screenshots from an example app demonstrating the issue. How can we manage the appearance of both the navigation bar and tab bar so that they share the same space when visible, but are properly hidden and excluded from the safe area when not?
/// The root view controller shows both the navigation bar and tab bar
class ViewController: UIViewController {
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
navigationController?.setNavigationBarHidden(false, animated: animated)
tabBarController?.setTabBarHidden(false, animated: animated)
}
}
/// The second view controller hides both the navigation bar and tab bar
class ViewController2: UIViewController {
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
navigationController?.setNavigationBarHidden(true, animated: animated)
tabBarController?.setTabBarHidden(true, animated: animated)
}
@IBAction func customBackButtonTapped(_ sender: Any) {
navigationController?.popViewController(animated: true)
}
}
/// The third view controller shows the navigation bar but hides the tab bar
class ViewController3: UIViewController {
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
navigationController?.setNavigationBarHidden(false, animated: animated)
tabBarController?.setTabBarHidden(true, animated: animated)
}
}