Мобильный трудоголик: “🔢 ArrangementView в SwiftUI: новый способ компоновки для складных уст…”

🔢 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