iOS hidesBarsOnSwipe status bar background color

Question

When I swipe and hide the navigation bar with the hidesBarsOnSwipe property the status bar has a clear background. How can I set the background of the status bar to the same color as the navigation bar? Here are a few pictures showing my problem, this is all contained in a UITableViewController.

enter image description here

Separate

enter image description here

Separate picture, looks like one big one. enter image description here

score 6 · Answer 1 · answered Apr 17 '15 at 02:51

I've come across the same issue, and was able to solve it. I'm fairly new to iOS dev, and I don't imagine this solution to be foolproof. I couldn't find any good answers elsewhere, so here's how I overcame it:

I converted from a UITableViewController over to UIViewController with a nested UITableView. Note, double check that the delegate to the child tableview is set to the UIViewController.
I Added a view with a height of 20px and a background colour that you want to set as the "background" to the status bar. Set the constraints on that view as follows:
On your table view, set the constrains to be basically full screen. One important note here, the top constraint is to "Top Layout Guide.Top" and not to "Top Layout Guide.Bottom". By default I believe this constraint ties to the bottom. Double clicking on the constraint allows you to adjust it to the top. Without this, any table header cells weren't positioned properly for me

Hope that helps.

I also thought I'd mention, the status bar style might change from light to dark on collapse. In this case, the preferredStatusBarStyle is where you can control the status theme properly. ` override func preferredStatusBarStyle() -> UIStatusBarStyle { return UIStatusBarStyle.LightContent } ` — handlebar_, Apr 17 '15 at 04:52
You don't need to specify the height of the view to be 20. Just add top constraint to Superview.top = 0, leading and trailing constraints to safeArea, and bottom constraint = 0 with the tableView.top. This way, the view will stretch itself to the required height even for iPhone X, and any other size. Even when you rotate the device. TableView should be constrainted as usual: top, leading, trailing, & bottom = 0 to safeArea, or whatever other constraint. It is important that the tableView.top is constrainted to safeArea or Superview.top, and is the first subview in the view hierarchy. — Starsky, Sep 02 '20 at 09:40

score 1 · Answer 2 · answered Jun 01 '17 at 02:07

Adding to George Huber's answer. I solved this issue programmatically by adding a 20pt height UIView as a subview of the navigationController's view property -- in viewDidLoad method.

- (void)viewDidLoad
{
  [super viewDidLoad];

  UIView *statusBarBG = [[UIView alloc] initWithFrame:CGRectMake(0, 0, CGRectGetWidth(self.view.bounds), 20)];
  statusBarBG.backgroundColor = [UIColor navBar];
  [self.navigationController.view addSubview:statusBarBG];

  // REST OF CODE
}

score 0 · Answer 3 · answered Sep 12 '21 at 05:05

Per skg's answer, I add a relative height for status bar according to iOS version.

    self.navigationController.hidesBarsOnSwipe = true;
    
    // add a UIView as subView to navigationController
    CGFloat statusBarHeight;
    
    if (@available(iOS 13, *)) {
        NSArray *windows = UIApplication.sharedApplication.windows;
        UIWindow *keyWindow = nil;
        
        for (UIWindow *window in windows) {
            if (window.isKeyWindow) {
                keyWindow = window;
                break;
            }
        }
        statusBarHeight = keyWindow.windowScene.statusBarManager.statusBarFrame.size.height;
        NSLog(@"statusBarHeight: %f", statusBarHeight);
    } else {
        statusBarHeight = UIApplication.sharedApplication.statusBarFrame.size.height;
    }
    
    UIView *statusBarBG = [[UIView alloc] initWithFrame:CGRectMake(0, 0, CGRectGetWidth(self.view.bounds), statusBarHeight)];
    statusBarBG.backgroundColor = [UIColor systemBackgroundColor];
    [self.navigationController.view addSubview:statusBarBG];

iOS hidesBarsOnSwipe status bar background color

3 Answers3

Linked