iPhone Duo Reserved Regions: Keep Your UI Off the Fold

When iPhone Duo is partially folded, the middle of the inner display bends. Text that crosses the crease is hard to read, and a button that lands in it is hard to tap. The outer and inner cameras take space too. iPhone Duo reserved regions are how the system tells your app where those areas are, so you can keep your own UI out of them. This guide covers the SwiftUI API, when the fold counts as active, what a region contains, and what all of this means for games that play in tabletop mode.

Reserved regions are new in iOS 27.1 and available in SwiftUI and UIKit. Apple's Prepare your app for iPhone Duo talk says you need Xcode 27.1 for the full-screen iPhone Duo experience. The APIs are new, so details may change between releases. We wrote this from Apple's documentation, the Tech Talk Strike a pose with adaptive layouts on iPhone Duo, and posts by iOS developer Sarun Wongpatcharapakorn (@sarunw). We haven't measured these values on hardware ourselves.

What are reserved regions on iPhone Duo?

A reserved region is an area of your view that something else reserves, usually the device hardware. Sarun puts it simply: reserved regions tell you the area where you shouldn't put your UI.

In the Tech Talk, Apple lists three on iPhone Duo: the outer camera, the inner camera while it's active, and the fold. They come in two kinds.

The fold is a division because it divides one large area into two smaller ones. Your content isn't hidden there, but anything that crosses it is hard to use.

Most apps don't need to read these regions. Apple's documentation says framework views such as split views, tab bars, alerts, context menus, and sheets already adjust for the fold and the cameras. You need this API for custom UI: a floating control, a custom overlay, a game HUD, or anything you place with explicit frames or a custom Layout. On the developer forums, an Apple engineer gave the same advice: prefer built-in containers, use ArrangementView for custom two-view layouts, and use reserved regions for manually laid-out controls.

How do I read reserved regions in SwiftUI?

Wrap your content in a GeometryReader and call reservedRegions(kind:) on the proxy. This is the call Sarun shows:

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

The full signature on Apple's documentation page is:

func reservedRegions(
    kind: ReservedRegion.Kind,
    options: ReservedRegion.QueryOptions = [],
    layoutDirectionBehavior: LayoutDirectionBehavior = .mirrors
) -> [ReservedRegion]

It returns only the regions that overlap your view, with frames in your view's coordinate space. If a region only partly overlaps your view, its frame can start at negative coordinates or extend past your view's size.

The Tech Talk also mentions onGeometryChange as another way to get a geometry proxy. Because ReservedRegion is Equatable, you can watch the regions and store them in state. This is our sketch of that pattern, not Apple sample code:

struct GameBoard: View {
    @State private var folds: [ReservedRegion] = []

    var body: some View {
        BoardView(folds: folds)
            .onGeometryChange(for: [ReservedRegion].self) { proxy in
                proxy.reservedRegions(kind: .division)
            } action: { newValue in
                folds = newValue
            }
    }
}

In UIKit, call reservedRegions(kind:) on a UIView and read each region's frame:

let regions = view.reservedRegions(kind: .division)
let frames = regions.map(\.frame)

If you need to react to the hinge angle itself rather than the space it takes, see iPhone Duo hinge states and onHingeChange.

When is the fold's division region active?

The fold isn't always a problem. When iPhone Duo is open flat, the display is continuous and content can cross the middle. So the division region turns on and off with the pose.

Sarun notes that by default, reservedRegions returns only active regions, and the fold's division is active only when the device is folded. Apple's ReservedRegion documentation says the same: when iPhone Duo is fully open, the method returns no division regions. The inner camera works the same way as an occlusion region that's active only while the camera is in use. The outer camera is always active.

To get inactive regions too, pass .includeInactive:

GeometryReader { proxy in
    let regions = proxy.reservedRegions(
        kind: .division,
        options: .includeInactive)
    let foldIsActive = regions.contains { $0.isActive }
    Text(foldIsActive ? "Folded" : "Flat")
}

Why would you want an inactive region? Apple gives two reasons. An inactive region still has a frame, so you can leave room for it and keep your layout from jumping when someone folds the device. And you can make coarse decisions from it, like preferring an even number of grid columns whenever a division exists. The Tech Talk adds that the fold's region has zero width when the device is flat, so use inactive regions for decisions like these, not for exact spacing.

What's inside a ReservedRegion?

Each region is a small value with five properties. All of them are listed in Apple's documentation for iOS 27.1.

Three details are easy to miss. First, (0, 0) is the top-leading corner of the view you read the region from, not the screen. Read regions in the same view that positions your content, so the coordinates match. In a custom Layout, do your math from zero and add bounds.origin only when you place each subview.

Second, the frame already includes the margins, so don't add them again. Third, frames are mirrored for right-to-left languages by default. If your content doesn't flip with the layout direction, pass layoutDirectionBehavior: .fixed to get unmirrored frames.

For a sense of scale, Sarun's demo of the outer display shows two active occlusion regions: one 37 × 37 points at (399, 29), and one 84 × 170 points at (382, 0). They cover the camera and the status area beside it, in the top trailing corner. Treat them as an example from iOS 27.x, not constants. Read the frames at runtime, because they're relative to your view and can change between releases. For the safe-area side of the same problem, see iPhone Duo safe areas and content margins.

How do I keep buttons and text off the crease?

When a division is active, keep each view entirely on one side of it. Compare the frame's width and height to learn which way the fold runs, then size your panes around it. This view is adapted from Apple's documentation:

struct SplitContent: View {
    var body: some View {
        GeometryReader { proxy in
            if let fold = proxy.reservedRegions(kind: .division).first,
               fold.frame.width > fold.frame.height {
                // Folded like a laptop: stack the panes.
                VStack(spacing: 0) {
                    ScreenView()
                        .frame(height: fold.frame.minY)
                    Color.clear
                        .frame(height: fold.frame.height)
                    ControlsView()
                        .frame(height: proxy.size.height - fold.frame.maxY)
                }
            } else {
                // Flat, or folded like a book: one layout.
                SingleLayout()
            }
        }
    }
}

The clear spacer is exactly the size of the division, so nothing lands in the crease. Apple's full example also handles the vertical, book-style fold with an HStack. iPhone Duo has one fold, so reading .first is enough.

A few rules from Apple's guidance help here:

• Move only what's necessary. Controls that jump far or disappear are hard to find again. Favor small adjustments, and move related controls together.
• Let scrolling content scroll. Lists and scroll views don't split their rows around the fold by default, and the Tech Talk says scrolling content generally adapts on its own. Check the division only if a row becomes hard to read or use.
• Use even columns. In a grid, an even number of columns divides cleanly at the fold.
• Prefer a container. If your screen is two related views, ArrangementView in SwiftUI keeps them on opposite sides of the fold without reading regions yourself.

What do reserved regions mean for game design?

Games tend to draw their own UI, so the system can't move it for you. A health bar, a fire button, or a score that crosses the fold is exactly the custom content Apple says to check.

The tabletop pose, folded like a laptop and set on a table, changes the layout question. Apple's design guidance, as summarized by designer Blake Crosley, says the top region works well for content that people view from a distance, and the bottom region suits interactive controls. Apple's guidelines also ask games to fill the screen as the pose changes, to prefer changing the aspect ratio over letterboxing, and to keep text and control sizes consistent when resizing.

Several games on AppleDuo are built around that split. In Battlefleet Duo, your fleet sits on the lower screen while the enemy waters stand up, and two players can face each other across the fold. Greens: Mini-golf folds like a laptop: you putt on the lower half, and the upright half becomes a caddie camera. We describe these games from their store listings; we don't know which APIs they use internally.

For your own game, a few patterns follow from the API:

• Treat the fold as a seam in your HUD. Anchor touch controls to the flat half and status to the upright half, using the division frame as the boundary.
• Keep the playfield's important parts clear. It's fine to let background art run across the crease, but not a target, a card, or a tile someone has to tap.
• Plan both orientations. A book-style fold runs vertically, which suits a split such as two players or two boards side by side. A laptop-style fold runs horizontally.
• Avoid layout jumps. Query with .includeInactive and reserve the space early if a sudden shift would break play.

More examples are on our Built for the Fold page.

Key takeaways

• Reserved regions, new in iOS 27.1, mark areas your UI shouldn't use. On iPhone Duo they're the outer camera, the inner camera while it's active, and the fold.
• Call proxy.reservedRegions(kind: .division) for the fold or .occlusion for the cameras. UIKit has the same method on UIView.
• The fold's division is active only when iPhone Duo is partially folded. Pass .includeInactive to get it when flat, and check isActive.
• Each ReservedRegion has a frame in your view's coordinates, in points, with margins already included. Read it in the view that places your content.
• Standard containers already handle the fold. Use reserved regions for custom controls, overlays, and game HUDs, and keep anything tappable on one side of the crease.

Next, see how ArrangementView handles the fold for two-view layouts, or run through the iPhone Duo app preparation checklist.