iOS 11 safe area layout guide backwards compatibility

Question

Is enabling Safe Area Layout Guides compatible to iOS below 11?

Answer 1

The backwards compatibility of Safe Areas for iOS 9 & iOS 10 only works if you are using storyboards. If you are using xibs, there is no layout guide to fall back to. https://forums.developer.apple.com/thread/87329

The workarounds seem to be either

(a) migrate your xibs into storyboards, or

(b) add some additional constraints programmatically.

If (a) is not really an option, the manual approach will be something like this:

Assuming you have a view in your xib that you want to keep within the safe area (i.e. below any status bar or navigation bar).

1. Add constraints in your xib between your view and the safe area for iOS 11. Assign the top constraint to a priority of 750.

2. In your view controller, add a property:

   @property (nonatomic, strong) NSLayoutConstraint *topLayoutConstraint;
   

   And then in viewDidLayoutSubviews:

   - (void)viewDidLayoutSubviews {
       [super viewDidLayoutSubviews];
   
       if (@available(iOS 11, *)) {
           // safe area constraints already set
       }
       else {
           if (!self.topLayoutConstraint) {
               self.topLayoutConstraint = [self..topAnchor constraintEqualToAnchor:self.topLayoutGuide.bottomAnchor];
               [self.topLayoutConstraint setActive:YES];
           }
       }
   }
   

   The new constraint will only be created for iOS 9 & iOS 10, has a default priority of 1000, and overrides the one in the xib.

3. Repeat for a bottom constraint if you need to avoid the home indicator.

Swift 4 version:

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()

    if #available(iOS 11, *) {
        // safe area constraints already set
    } else {
        if topLayoutConstraint == nil {
            topLayoutConstraint = .topAnchor.constraint(equalTo: topLayoutGuide.bottomAnchor)
            topLayoutConstraint?.isActive = true
        }
    }
}