如何实现隐藏UITabBar以在iOS 11和iPhone X上显示UIToolbar

Question

I'm trying to do an UI similar to the Photos app, where when you enter in a selection mode that hides the tab bar to display a toolbar.

I have my view controller in a UINavigationController and the navigation controller in a UITabBarController.

I had other strategies before but I'm struggling to get this working on the iPhone X and its bottom safe margins.

Answer 1

If I'm making the correct assumptions based on your description of the Photos App, I think you may be confused as to what the app is doing behind the scenes when going from Photos App TabBar to Photos App Toolbar .

These are two different ViewControllers, the second only shows the toolbar and sets hidesBottomBarWhenPushed = true in the init. You can use the NavigationController's supplied toolbar by setting the setToolbarItems(toolbarItems: [UIBarButtonItem]?, animated: Bool) in your second ViewController. This properly sizes the toolbar in the view to account for the bottom control on the iPhoneX.

If you must manage toolbar and TabBar visibility in the same ViewController, based on my testing, you'll need to add/manage the toolbar manually within a UIView container to get the proper size on all devices. So the view hierarchy would be ViewController.view -> toolbarContainer View -> Toolbar.

Answer 2

for iPhone X, the tab bar height is different than iPhone 8, you need to track

static CGFloat tabBarMaxHeight = 0;

- (void)setToolbarHidden:(BOOL)hidden {
    [self.navigationController setToolbarHidden:hidden animated:NO];
    CGRect frame = self.tabBarController.tabBar.frame;
    tabBarMaxHeight = MAX(tabBarMaxHeight, CGRectGetHeight(frame));
    frame.size.height = hidden ? tabBarMaxHeight : 0;
    self.tabBarController.tabBar.frame = frame;
    self.tabBarController.tabBar.hidden = !hidden;

    //! reset tab bar item title to prevent text style compacted
    for (UITabBarItem *obj in self.tabBarController.tabBar.items) {
         NSString *title = obj.title;
         obj.title = @"";
         obj.title = title;
    }
 }