🔢 ArrangementView в SwiftUI: новый способ компоновки для складных устройств.

С выходом iPhone Duo компания Apple добавила не только новый форм-фактор, но и новые API для работы с двумя экранами.


Режимы совместимости:

Приложение будет работать на iPhone Duo, даже если оно не собрано с использованием iOS 27 SDK. Но в режиме совместимости от статус-бара появится черный отступ. Это значит, что интерфейс не будет занимать весь экран.

С новым SDK iOS 27.1 приложение займет все доступное пространство. Поэтому если вы планируете поддержку iPhone Duo, стоит обновиться до iOS 27.1 SDK.


Что такое ArrangementView:

ArrangementView - это контейнер, который управляет двумя частями контента: основной и дополнительной. Вы описываете их отношение, а система решает, как их расположить в зависимости от доступного пространства и конфигурации устройства.

Вместо ручного переключения layout при изменении геометрии вы описываете роли контента. SwiftUI сам определяет, как их показать.

NavigationStack {
ArrangementView {
PlayerView()
} secondary: {
UpNextView()
}
}


Стили компоновки:

Есть два встроенных стиля: split и overlay.

Split - для контента, который должен оставаться видимым независимо. Основное и дополнительное представления разделяют доступное пространство. Если контейнер широкий, SwiftUI предпочитает горизонтальное разделение, иначе - вертикальное.

ArrangementView {
PlayerView()
} secondary: {
TranscriptView()
}
.arrangementViewStyle(.split)

Можно ограничить разделение конкретной осью:

.arrangementViewStyle(
.split.axes(.horizontal)
)

Overlay - для контента с отношением «передний план - задний план». Одно представление может располагаться поверх другого.

ArrangementView {
ContentView()
} secondary: {
ControlsView()
}
.arrangementViewStyle(.overlay)

Дочернее представление может узнать, находится ли оно поверх другого, через environment-значение overlayArrangementZIndex.

struct ControlsView: View {
@Environment(\.overlayArrangementZIndex)
private var zIndex

var body: some View {
Controls(compact: zIndex > 0)
}
}


ReservedRegion:

iPhone Duo вводит ReservedRegion - области, которые представляют аппаратные части, влияющие на доступный контент. SwiftUI может запрашивать их через GeometryProxy.

GeometryReader { proxy in
let regions = proxy.reservedRegions(kind: .division)
}

Division regions разделяют доступные области, например вокруг шарнира. Occlusion regions описывают аппаратные части, которые закрывают часть дисплея.


🔗 Читать подробнее


💡 Вывод:

iPhone Duo приносит новые API для адаптивной компоновки. Режимы совместимости дают время на миграцию. ArrangementView позволяет описывать роли контента, а не жестко задавать layout.

Главная идея: перестать кодировать каждую возможную конфигурацию вручную. Вместо этого описать отношение между частями интерфейса и позволить системе выбрать подходящее представление.


Подписаться на канал:
➡️ Telegram | Max