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:
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.
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.
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.
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...
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.
Related
I am trying to update an old Storyboard and viewControllers. in Interface Builder, my viewControllers has the following grey bar that I do not know how and why they are appearing, they were not there previously:
These are also visible when I try to simulate my apps in the iPhone simulator as follow:
When I start my app, the views are stretched with a tiny view of this space as follow:
However, when I start navigating to other viewControllers the space is visible as shown in the previous screenshot.
Any idea of how to stretch my views all the way to cover these areas?
I am currently using swift. The navigation is being done using Storyboard Segue.
Thank you.
This is just the storyboard showing the way the screen will be presented, that grey bar represents the view that will be behind that view controller. This kind of presentation is called modal (page sheet or form sheet) the two have different effects on iPad
Code Fix
To fix this, change the modalPresentationStyle to overCurrentContext on the view controller you're going to present. So in code do viewControllerToPresent.modalPresentationStyle = .overCurrentContext
Storyboard Fix
in storyboard select the segue (the line linking the two screens) and then on the far right menu select the item 3rd in from the right, you should see a section called presentation, change it to Current Context.
I have a UISplitViewController. When run in compact mode the detail views are "pushed" onto the navigation stack like pages (with the back button in the navigation bar).
I would like to simply change the page transition animation from a push from the side, to a modal style animation: i.e., have the detail view slide in up from the bottom. But only have it animate as a modal when the UISplitViewController is in compact mode (running on smaller devices - i.e., iPhones, etc).
An image for context:
As you can see, this is a normal page transition, but I would like the detail to slide up like a "page sheet" transition if possible.
I've tried modifying the segue in Main.storyboard however that changes the transition even for regular sizes (i.e., iPads, etc) which makes an additional detail view slide over the side-by-side view that's seen on regular sized devices.
Any help is appreciated!
Although it is doable, I would highly recommend against it. If you still want to go ahead with it, the simplest way would be to create two identical viewControllers with two different segues and segue types. Then you can make a check on device idiom and call the relevant segue. Again, I would not recommend such an approach
I have an app which has a login screen and when the user logs in, a tab bar controller is pushed. I currently have some views that would benefit from the fact that apple now allows using the split view controller in all iOS devices, so I was preparing to implement this when I read that the UISplitViewController must always be the root view controller. So I was wondering if it is possible to make the view in one of the tabs become a master-detail view using a UISplitViewController or will I need to implement this manually?
In case it is not possible to show the split view as a tab, could it be pushed from the tab bar controller? (e.g. the user taps a row in a table view and the master-detail view appears).
UISplitViewController in iOS 14 gained new API including a new column style that behaves differently from the unspecified style which is the "classic" interface. Using the modern column-style API, if you try to embed a UISplitViewController in a UITabBarController, it may not behave as you'd expect. For example, at least as of iOS 15, only the secondary view controller may be visible when you'd expect the primary and secondary be shown side-by-side. The documentation does note the following:
When you build your app’s user interface, the split view controller is typically the root view controller of your app’s window. ... Although it’s possible to install a split view controller as a child in some other container view controllers, doing so is not recommended in most cases.
I have however shipped multiple apps that put a split view controller in a tab bar controller using that classic API (via storyboard and programmatically), and they continue to work as of iOS 15. But it may be wise to move away from this as it's seemingly not an officially supported configuration.
Original answer pre-iOS 14:
You can definitely embed a UISplitViewController inside a UITabBarController. I've done just that for an app I released on the App Store. It has 3 tabs and each one is a split view controller.
Just drag out a tab bar controller into your Storyboard, delete the two controllers it added, then drag out a split view controller. Control drag from the tab bar controller to the split view controller and select the "view controllers" relationship segue.
On Xcode versions less than Xcode 8, you may see black or white bars at the top and bottom of the split view controller in the Interface Builder canvas, but these will not appear when the app is run on a device.
Here is the app running to show the split view embedded inside the tab bar controller on iPhone 6s Plus:
When you put a UISplitViewController inside a UITabBarController and the tab bar is set to be opaque you have an issue where your UISplitViewController content is shifted up the size of the tab bar:
To fix this issue you have to check the Under Opaque Bars checkbox on your UISplitViewController in your storyboard:
And now the UISplitViewController view size is correctly computed:
There is also a problem using this approach in iPhone (>IOS8) where the splitviewcontroller is in collapsed mode. When we push the list view to the details view we cannot hide the tabbarcontroller using the conventional "hidesBottomBarWhenPushed". So I have added the TabBarcontroller as root viewcontroller of a navigationcontroller. Now when I push to details view, I send the message to the root navigation controller and push the view to the details view instance in collapsed mode whereas in regular mode I just push it using showDetailsViewController()
For me, this worked.
XCode 13.2.1
iOS 15.2
splitViewController.extendedLayoutIncludesOpaqueBars = true
I've got a very simple setup using segues to display a simple master/details configuration. When pushing or popping from the navigation controller, the right hand side of the navigation bar has a strange grey shadow. See this video for a demo.
If I remove all subviews from the detail controller and simply set the background as red (see video), I still get the grey artefact, and strangely, the red only appears behind the navigation bar once the entire transition has finished.
Any idea why this is happening?
Well, very strange, but simply deleting and re-creating an identical view controller in the storyboard fixed this issue.
I'm working on an iPad app with the UISplitViewController. I've managed to add a button on the detail view navigation bar to 'maximise' the detail pane in landscape mode by hiding the master view (like Dropbox does). I did this by setting the split view controller delegate to nil and then back to it's delegate in order to force 'shouldHideViewController' to fire. This works but there's no transition - it just flicks to full screen. I'd like the view to stretch across the screen in a transition (as Dropbox does).
Can anybody suggest a way to achieve this?