What is the safe area, and how do you keep content clear of the notch, home indicator and keyboard?

7.7.2 · L2 · Interview

Predict first

What are the safe area insets of a view that is not in a window?

import UIKit

print(UIView().safeAreaInsets == .zero)
  • true
  • false

Mental model. The safe area is the stage inside the curtains and the lighting rig. Keep actors inside the stage, and use the keyboard guide as a moving wall that pushes the set up.

The safe area is the part of a view not covered by system chrome: the status bar, Dynamic Island or notch, home indicator, navigation bar and tab bar, plus any extra inset you add. Each view exposes safeAreaInsets and a safeAreaLayoutGuide; a view that is not in a window has zero insets. Pin content to the guide with Auto Layout and it moves out of the way automatically for every device and orientation. A container that already handles its own insets (a scroll view with contentInsetAdjustmentBehavior) takes the values and applies them as content inset. A controller can add its own using additionalSafeAreaInsets, which is how you reserve space for a custom bottom bar without hard-coding a number; the system then adds it to the top and bottom insets.

The keyboard is handled separately, but the modern answer is also a layout guide: pin the bottom of the content to view.keyboardLayoutGuide.topAnchor and it follows the keyboard, including its animation and the floating iPad keyboard, with no notification code. Older code observes UIResponder.keyboardWillChangeFrameNotification and adjusts constraints or insets with the supplied duration and curve. Scroll views and tables inside a controller also adjust automatically in many setups, so test with a field near the bottom. Always lay out against guides, never against the screen size.

Safe area is computed from the window and its containers, so a standalone view has none.

Common traps

  • Pinning to the view’s edges for controls near the bottom. The home indicator covers them. Pin to the safe area guide.
  • Reading safeAreaInsets in viewDidLoad. The view is not in a window yet, so they are zero. Use viewSafeAreaInsetsDidChange or layout time.

They might follow up with

  • How do you reserve room for a custom bottom bar? Set additionalSafeAreaInsets.bottom on the parent.
  • What is the easiest keyboard handling today? Pin to keyboardLayoutGuide.

Related questions

  • 7.7.1 What is a trait collection, and how do size classes and trait changes drive adaptive layout?
  • 7.2.2 What is the difference between frame and bounds, and what happens to them under a transform?
  • 7.3.1 What is the view controller lifecycle, and what belongs in each method?

← What is a trait collection, and how do size classes and trait changes…   How do dynamic colours, dark mode and the UIAppearance proxy work? →