Search code examples
iosuitabbarcontrolleruisplitviewcontroller

UISplitViewController in UITabBarController - SplitView Navigation Bar Glitch / Bug or me doing something wrong?


QUESTIONS AT THE END OF THE POST

PROBLEM: I discovered a strange behavior of UISplitViewController when embedding it in a UITabBarController. The setup is quiet simple and can be reproduced without any coding. Create a StoryBoard based app and drag a UITabBarController onto the StoryBoard and make it the initial view controller. Then drag a UISplitViewController onto the board and make it an item of the UITabBarController. Embed the UISplitViewControllers detail view controller in a UINavigationController as well. Finally, set the background color of the master and detail view controllers to something noticeable.

The StoryBoard should look like this: enter image description here

Step 1: Run the application on an device which can show master and detail at the same time (e. g. iPad or big screen iPhone). You should notice that the master is not extending under the bars and instead, the background of UISplitViewController shines through. enter image description here

Step 2: Rotate the screen to portrait so the master gets collapsed. Swipe in from the side to reveal the master. At this point, both navigation bars are showing the correct background color. enter image description here

Step 3: Rotate the screen back to landscape. Now the detail has the background of the UISplitViewController and the master is showing the correct color. enter image description here

FINDINGS:

  • On start, the tableview of the master is not extending under the navigation bar.
  • When and only if revealing the master in portrait mode and then rotating back, the glich changes so that now the master extends under the bars and the detail does not anymore.
  • If not revealing the master in portrait, you can rotate as many times as you want without changing the behavior
  • It only happens on devices which can show master and detail at the same time
  • It only happens when embedding a UISplitViewController in a UITabBarController

QUESTIONS:

  • Why are master and detail not expanding correctly under their navigation bar?
  • Why does this only happen on iPad/iPhone Plus and not on regular iPhones (there everything works exactly as expected)?
  • Is there any fix I could apply to make this work on iPad?
  • Is there a better design approach than having a TabBar with a master-detail flow embedded? For me a TabBar just seems right to switch between different types of content in my app and I don't want to have a full width tableview on iPads. The SplitViewController also seems to be the right approach to display my content...

Solution

  • 5 Month later there is still no solution for this. Moreover, as I was stumbling across this issue once again while developing another app, I found this old post from 2015 having the same issue: Navigation bar for split view controller is darker when inside a tab bar controller

    So I guess Apple has no intention on fixing their own controllers and we developers are screwed. The only way we can have a UITabBar at the bottom while showing a UISplitViewController above with proper translucent UINavigationBars is to implement our own container view controllers.

    I finally solved the issue by using a plain UIViewController with a UITabBar pinned to the bottom while using the UIViewController containment API to show/hide my UISplitViewControllers.