Contents

UIOverlayArrangement

An arrangement that layers the primary view over the secondary view, or places the views side by side on a folded display.

Declaration

struct UIOverlayArrangement

Overview

An overlay arrangement view controller places a primary view controller and a secondary view controller in a stacked arrangement when the device has a flat display, or next to each other horizontally when someone is holding a folded device in landscape orientation or above and below each other when someone is holding a folded device in portrait orientation. Here’s how the overlay arrangement positions the primary and secondary views:

  • In a stacked overlay arrangement, the arrangement places the primary view above the secondary view in the z-axis.

  • When someone holds a folded iPhone Duo in landscape orientation, the arrangement places the secondary view in the leading position and the primary view in the trailing position.

  • When someone holds a folded iPhone Duo in portrait orientation, the arrangement places the secondary view in the top position and the primary view in the bottom position.

Create an overlay arrangement view controller by specifying a primary and secondary view controller, and call the updateArrangement(_:animated:) method with overlay:

let arrangementVC = UIArrangementViewController()

let primaryVC = PrimaryViewController()
arrangementVC.setViewController(primaryVC, for: .primary)

let secondaryVC = SecondaryViewController()
arrangementVC.setViewController(secondaryVC, for: .secondary)

arrangementVC.updateArrangement(.overlay)

Limit an overlay arrangement by orientation

You can limit which axes your overlay arrangement view controller supports by specifying the axes for the arrangement. The following example shows an arrangement that only functions vertically:

let arrangementVC = UIArrangementViewController()

let primaryVC = PrimaryViewController()
arrangementVC.setViewController(primaryVC, for: .primary)

let secondaryVC = SecondaryViewController()
arrangementVC.setViewController(secondaryVC, for: .secondary)

arrangementVC.updateArrangement(.overlay.axes(.vertical))

Use axes(_:) to set the axes for an overlay arrangement. For axes that you don’t include, the arrangement view only displays the primary view.

Customize a folded layout

You can adjust how the overlay arrangement positions the primary and secondary views on a folded iPhone Duo with view properties. For example, if you would prefer the primary view to appear in the leading position instead of the trailing position when someone holds a folded iPhone Duo in landscape orientation, customize the overlay arrangement with view properties.

Start by creating a UIOverlayArrangement instance and a view properties instance:

var overlayArrangement = UIOverlayArrangement.overlay
var primaryViewProperties = overlayArrangement.defaultViewProperties

Specify an edge for the edge property, and then update the overlay arrangement and arrangement view:

primaryViewProperties.edge = .leading
overlayArrangement.setViewProperties(primaryViewProperties, for: .primary)
arrangementView.updateArrangement(overlayArrangement)

Topics

Creating an overlay arrangement

Configuring the arrangement

See Also

Configuring the arrangement