How to achieve edge-to-edge display when using Keyboard Layout Guide?

Question

If I set my ScrollView bottom constraint equals to SuperView bottom constraint, I can achieve edge-to-edge display. Please refer to the following screenshot.

However, I want to take advantage of Keyboard Layout Guide.

If I set my ScrollView bottom constraint equals to Keyboard Layout Guide top constraint, I can no longer achieve edge-to-edge display. Please refer to the following screenshot.

May I know, how I can resolve this issue?

Answer 1

You should set usesBottomSafeArea to false.

Defaults to true, indicating that the layout guide ties to the bottomAnchor of the view’s safeAreaLayoutGuide.

Set to false to tie the layout guide to the bottomAnchor of the view instead.

Example:

class MyViewController: UIViewController {
    @IBOutlet var scrollView: UIScrollView!
    
    override func viewDidLoad() {
        view.keyboardLayoutGuide.usesBottomSafeArea = false
        scrollView.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            scrollView.topAnchor.constraint(equalTo: view.topAnchor),
            scrollView.leftAnchor.constraint(equalTo: view.leftAnchor),
            scrollView.rightAnchor.constraint(equalTo: view.rightAnchor),
            scrollView.bottomAnchor.constraint(equalTo: view.keyboardLayoutGuide.topAnchor),
        ])
    }
}