Неоднозначность размера прокручиваемого контента UIScrollView в Interface Builder: как исправить?

Почему возникает ошибка и как её исправить

Проблема в том, что UIScrollView работает не так, как обычные вью. Для него contentSize (размер прокручиваемой области) должен быть определён явно. Когда вы используете Auto Layout, система пытается вычислить contentSize на основе констрейнтов дочерних вью, но если эти констрейнты не задают полный размер (например, нет констрейнта высоты у ContentView), возникает неоднозначность. Xcode не знает, насколько большим должен быть контент.

Правильное решение — задать полный набор констрейнтов для ContentView, которые свяжут его размеры с размерами вложенных элементов, а не с ScrollView. Вот пошаговая инструкция для Interface Builder:

Шаг 1: Настройка ScrollView

Добавьте UIScrollView на сцену и закрепите его ко всем четырём сторонам Safe Area (leading, trailing, top, bottom = 0). Это задаст frame ScrollView.

Шаг 2: Добавление ContentView

Внутрь ScrollView поместите обычный UIView. Закрепите его ко всем четырём сторонам ScrollView (leading, trailing, top, bottom = 0). Важно: не задавайте ширину или высоту ContentView относительно ScrollView! Вместо этого:

• Добавьте констрейнт Equal Width между ContentView и ScrollView (это заставит ContentView быть такой же ширины, как ScrollView, что нужно для горизонтального скролла, но для вертикального скролла это тоже полезно, чтобы контент не уходил за границы).
• Не добавляйте констрейнт высоты — она будет вычислена автоматически.

Шаг 3: Вертикальное расположение элементов

Внутри ContentView разместите все ваши UI-элементы (UILabel, UITextField, UIButton и т.д.). Используйте UIStackView с осью Vertical, чтобы упростить расстановку. Важно, чтобы каждый элемент имел явные констрейнты высоты (например, через intrinsic content size или фиксированную высоту). StackView автоматически подстроится под суммарную высоту элементов.

Шаг 4: Замыкание цепочки констрейнтов

Убедитесь, что у StackView (или у самих элементов, если вы не используете StackView) есть констрейнты ко всем четырём сторонам ContentView (leading, trailing, top, bottom). Для вертикального стека достаточно задать top и bottom к ContentView (и, возможно, leading/trailing для ширины). Критически важно: последний элемент в стеке должен иметь констрейнт bottom к ContentView, чтобы ContentView мог вычислить свою высоту.

Пример кода (если делаете программно)

let scrollView = UIScrollView()
scrollView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(scrollView)

let contentView = UIView()
contentView.translatesAutoresizingMaskIntoConstraints = false
scrollView.addSubview(contentView)

// Констрейнты ScrollView к супервью
NSLayoutConstraint.activate([
    scrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
    scrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
    scrollView.topAnchor.constraint(equalTo: view.topAnchor),
    scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])

// Констрейнты ContentView к ScrollView
NSLayoutConstraint.activate([
    contentView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor),
    contentView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor),
    contentView.topAnchor.constraint(equalTo: scrollView.topAnchor),
    contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
    // Ширина ContentView = ширине ScrollView (важно!)
    contentView.widthAnchor.constraint(equalTo: scrollView.widthAnchor)
])

// Добавляем элементы в ContentView
let label = UILabel()
label.text = "Hello"
label.translatesAutoresizingMaskIntoConstraints = false
contentView.addSubview(label)

let button = UIButton(type: .system)
button.setTitle("Tap me", for: .normal)
button.translatesAutoresizingMaskIntoConstraints = false
contentView.addSubview(button)

// Констрейнты для label и button
NSLayoutConstraint.activate([
    label.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 20),
    label.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 16),
    label.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -16),

    button.topAnchor.constraint(equalTo: label.bottomAnchor, constant: 20),
    button.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 16),
    button.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -16),
    button.bottomAnchor.constraint(equalTo: contentView.bottomAnchor, constant: -20) // Замыкающий констрейнт!
])

Почему это работает?

ScrollView получает ширину от констрейнта Equal Width, а высоту — от цепочки констрейнтов от верхнего края ContentView до нижнего. Так как последний элемент (button) привязан к нижнему краю ContentView, Auto Layout может вычислить полную высоту ContentView, и ScrollView автоматически устанавливает contentSize равным размеру ContentView.

Если вы используете UIStackView, просто убедитесь, что у него есть top и bottom констрейнты к ContentView, и все элементы внутри стека имеют определённую высоту. StackView сам растянется на всю высоту.

let scrollView = UIScrollView()
scrollView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(scrollView)

let contentView = UIView()
contentView.translatesAutoresizingMaskIntoConstraints = false
scrollView.addSubview(contentView)

// Констрейнты ScrollView к супервью
NSLayoutConstraint.activate([
    scrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
    scrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
    scrollView.topAnchor.constraint(equalTo: view.topAnchor),
    scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])

// Используем contentLayoutGuide и frameLayoutGuide
NSLayoutConstraint.activate([
    contentView.leadingAnchor.constraint(equalTo: scrollView.contentLayoutGuide.leadingAnchor),
    contentView.trailingAnchor.constraint(equalTo: scrollView.contentLayoutGuide.trailingAnchor),
    contentView.topAnchor.constraint(equalTo: scrollView.contentLayoutGuide.topAnchor),
    contentView.bottomAnchor.constraint(equalTo: scrollView.contentLayoutGuide.bottomAnchor),
    // Ширина ContentView = ширине frameLayoutGuide (чтобы не было горизонтального скролла)
    contentView.widthAnchor.constraint(equalTo: scrollView.frameLayoutGuide.widthAnchor)
])