5

I have added the option to use safe area guidelines yet when I view the app it appears to respect the safe area but theres some white space that I cant get rid of. I dont know what is causing it nor do I know how to change the color from white.

I've set the background color to what you see below. 

view.backgroundColor = UIColor(red:0.227, green:0.251, blue:0.294, alpha:1)

I've also set the white status bar style

UIApplication.shared.statusBarStyle = UIStatusBarStyle.lightContent

enter image description here

My main Storyboard

enter image description here

enter image description here enter image description here

Krunal
  • 77,632
  • 48
  • 245
  • 261
John Pollard
  • 3,729
  • 3
  • 24
  • 50
  • It's hard to know without more details, but my guess is the white area is a `UIView` that was used to color the area behind the status bar on previous iOS devices. Is there a view that's being added to that location in the storyboard or in code? – nathangitter Nov 06 '17 at 20:12
  • @nathan I think you might be right. It is part of the view, not sure how that space is being added though. Ill post more images of my main storyboard. – John Pollard Nov 06 '17 at 20:16
  • what are the constraints on your web view? – nathangitter Nov 06 '17 at 20:24
  • 2
    @nathan turned out it was the WebView.top constraint. It was set to position based on the superview. I changed it to safe guideline and then it positioned with -24 constraint. I changed that to 0. Not sure why it was 24 and I'm hoping that it will work correctly for all phone types now! – John Pollard Nov 06 '17 at 20:33

2 Answers2

2

When the view is visible onscreen, this guide reflects the portion of the view that is not covered by navigation bars, tab bars, toolbars, and other ancestor views. (In tvOS, the safe area reflects the area not covered the screen's bezel.) If the view is not currently installed in a view hierarchy, or is not yet visible onscreen, the layout guide edges are equal to the edges of the view.

You need to set constraints with safeArea Set top, bottom, leading, trailing constraints of webView with safeArea with constant 0, Hence your objects will not clip. enter image description here

Programmatically as: 

 webView.translatesAutoresizingMaskIntoConstraints = false
        if #available(iOS 11.0, *) {
            let guide = self.view.safeAreaLayoutGuide
            webView.trailingAnchor.constraint(equalTo: guide.trailingAnchor).isActive = true
            webView.leadingAnchor.constraint(equalTo: guide.leadingAnchor).isActive = true
            webView.bottomAnchor.constraint(equalTo: guide.bottomAnchor).isActive = true
            webView.topAnchor.constraint(equalTo: guide.topAnchor).isActive = true
        }

SafeAreaGuide

Jack
  • 13,571
  • 6
  • 76
  • 98
  • 1
    I believe this would have solved the issue. I think I had to also make sure the safe area constraint for the top was set to 0 as well. Even though my webview constraints were all set to 0, I had to set the wC wR field of the top alignment constraint to 0. – John Pollard Nov 09 '17 at 14:47
  • Yes! Align to safe area with `constant =0` or higher – Jack Nov 10 '17 at 03:49
1
if #available(iOS 11.0, *) {
     webView.scrollView.contentInsetAdjustmentBehavior = .never;
}
Arjun Patel
  • 1,394
  • 14
  • 23