Developer guide
How to make your app iPhone Duo ready
By SwiftSoft · Updated · Based on Apple’s developer documentation
The short answer
Rebuild your app with Xcode 27 so it uses the full screen, replace fixed screen dimensions with size classes and container-relative layout, let system navigation containers handle bars and the fold, adapt custom views to reserved regions, and test every pose: closed, open, partially folded, and rotated.
What changes on iPhone Duo
iPhone Duo is Apple’s first foldable: a compact outer display and a large inner display, each with a front camera. As people open, close, partially fold, and rotate it, your app moves between displays and has to re-layout on the fly. Apple shows six poses worth designing for: closed, folded like a tent, open wide, partially folded, open tall, and folded like a laptop.
Two things catch most apps out. First, there’s a fold running through the inner display that content shouldn’t sit on when the phone is partially folded. Second, in some poses the system moves navigation bars, toolbars, and tab bars to the side of the screen, stacked vertically.
1. Rebuild with Xcode 27
Start here, because it’s the cheapest win. Apps built with Xcode 26 or earlier don’t extend under the status bar and camera on iPhone Duo, so they never use the whole display. Rebuilding with the latest Xcode fixes that. Then run the app in the iPhone Duo simulator or on a device to see what breaks.
2. Make every layout resizable
If your app already resizes well on iPad, on Mac, or in iPhone Mirroring, you’re most of the way there. If not:
- Prefer system containers:
NavigationStack,NavigationSplitView, tab views, and split views. They already account for both displays, the fold, and the camera. - Size views relative to their container, never to fixed iPhone dimensions.
- Base layout math on your scene’s or view’s bounds, not the screen. Code that reads the screen size once and caches it is the most common breakage.
- In UIKit, use Auto Layout and react to
horizontalSizeClassandverticalSizeClasschanges with automatic trait tracking. - Don’t make layout decisions from
userInterfaceIdiomor the interface orientation. Neither tells you how much space you actually have on a foldable.
In SwiftUI, a size-class switch is usually all a screen needs:
struct OrdersScreen: View {
@Environment(\.horizontalSizeClass) private var width
var body: some View {
if width == .regular {
HStack { OrderList(); OrderDetail() } // open: show both
} else {
OrderList() // closed: one column
}
}
}3. Prepare bars for vertical presentation
On the outer display, and for some views on the inner display, iPhone Duo presents bars vertically on the side of the screen. You only get that behavior if you use the system’s bar support:
- In SwiftUI, attach toolbar items with
.toolbarto aNavigationStackorNavigationSplitView. In UIKit, set toolbar items on a view controller inside a navigation controller instead of building a custom bar. - Give every toolbar item both an icon and a title. Vertical bars show icons, so an item with only a title (or a custom view) won’t appear there.
- Keep primary navigation (Back, Close) at the top and prominent actions like Done right after. Use
topBarPinnedTrailingplacement for Done in SwiftUI, orpinnedTrailingGroupin UIKit. - Control what drops into the overflow menu with
visibilityPriority, and opt items in or out of vertical layout withaxisBehavior. - Custom views can check whether bars are vertical with the
toolbarVerticalEdgeenvironment value (SwiftUI) or theverticalBarEdgetrait (UIKit). Hero images can extend under a vertical bar withbackgroundExtensionEffect().
4. Arrange content around the fold
For screens with a main view and a supporting view (a map and its details, a player and its queue), use an arrangement view: ArrangementView in SwiftUI or UIArrangementViewController in UIKit. It places the two views around the fold for you, in one of two styles:
- Split: side by side when the space is wide, stacked when it’s tall, adjusted around the fold. The natural fit for layouts you’d otherwise build with
HStackorVStack. - Overlay: the primary view on top of the secondary while the phone is closed or fully open, then split on either side of the fold when it’s partially folded. The fit for
ZStack-style layouts.
You can limit a style to one axis, for example only splitting horizontally. Avoid nesting an arrangement view inside a split view, list, or scroll view, where part of it can become unreachable.
5. Adapt custom views to reserved regions
System containers dodge the fold and the inner camera on their own. Custom views need to ask where they are. iOS calls these reserved regions, and there are two kinds: divisions, where the fold splits a view, and occlusions, where a camera covers part of it.
- SwiftUI: inside a
GeometryReader, callreservedRegions(kind:options:layoutDirectionBehavior:)on the geometry proxy. - UIKit: call
reservedRegions(kind:options:)on the view. - Regions can be active or inactive. The fold, for instance, only matters while the phone is partially folded, so re-check when the pose changes.
6. Handle cameras that change direction
If your app captures photos or video, the active camera can end up facing the other way when someone opens, closes, or rotates the phone, because your app moves between displays. Choose cameras by the direction they face rather than assuming front means toward the user, and handle the switch mid-session.
7. Test every pose
Walk through every screen, sheet, and popover in each pose, and rotate the phone in each one. Check that:
- Views resize cleanly in every supported orientation and pose.
- Navigation bars, toolbars, and tab bars look right when the system shows them vertically.
- No sheet or popover lands awkwardly after folding or opening.
- No control sits in the fold where it’s hard to see or tap.
- Scroll position and in-progress input survive the transition.
React Native and Expo apps
Cross-platform apps still ship inside a native iOS project, so step 1 applies: rebuild that project with Xcode 27. Then make sure your layouts respond to window-size changes, for example with useWindowDimensions, instead of reading the screen size once at launch. Custom native modules that touch layout, toolbars, or the camera need the same review as a native app.
FAQ
Does my app need an update to run on iPhone Duo?+
No, existing apps run. But apps built with Xcode 26 or earlier don’t extend under the status bar and camera, so they don’t use all of the screen, and layouts built around fixed iPhone dimensions can look stretched or awkward when the phone opens or folds.
What is the fastest way to make an app iPhone Duo ready?+
Rebuild with Xcode 27, replace fixed screen sizes with size classes and container-relative layout, move bars into system navigation containers, then test every pose. Apps already built to resize on iPad or Mac are most of the way there.
How do I keep content out of the fold?+
System containers avoid it automatically. For custom views, read the reserved regions (GeometryProxy.reservedRegions in SwiftUI, UIView.reservedRegions in UIKit) and lay out around active divisions, or use an arrangement view to split content on either side of the fold.
Do React Native and Expo apps need changes for iPhone Duo?+
They run inside a native iOS project, so rebuild that project with Xcode 27, and make sure layouts react to window-size changes (for example with useWindowDimensions) instead of reading the screen size once at startup.
Source: Apple, Preparing your app for iPhone Duo.