iPhone Duo Sheets: Platzierung und Ecken in SwiftUI und UIKit

Auf einem normalen iPhone gleitet ein Sheet von unten herein und füllt die volle Breite. Auf dem iPhone Duo funktioniert die Sheet-Präsentation anders: Auf dem großen inneren Display kann ein Sheet mittig schweben oder an der führenden bzw. nachfolgenden Kante anliegen, und seine Kontur folgt den ungleichmäßigen Ecken des Bildschirms. Dieser Leitfaden behandelt die APIs aus iOS 27, die bestimmen, wo ein Sheet erscheint, wie das System es in jeder Haltung behandelt und wie Sie Ihre eigenen abgerundeten Formen an die Hardware anpassen.

Alles hier stammt aus Apples Dokumentation, den iPhone Duo Tech Talks, Antworten von Apple-Engineers in den Developer Forums und Beiträgen des iOS-Entwicklers @sarunw. Das AppleDuo-Team hat diesen Code nicht auf echter Hardware ausgeführt. Die APIs sind mit iOS 27 und Xcode 27 erschienen, und Details können sich zwischen Releases ändern.

Wo erscheinen Sheets auf dem iPhone Duo standardmäßig?

Sheets passen sich von selbst an jede Haltung an. Im Tech Talk Prepare your app for iPhone Duo sagt Apple, dass Sheets auf dem äußeren Display ihre Bar-Buttons vertikal anordnen können und Sheets auf dem inneren Display zentriert werden. Auch Popovers, Kontextmenüs und Alerts passen sich an.

Ein Apple-DTS-Engineer ergänzte in einem Thread in den Developer Forums weitere Details: Alle Sheets wandern an die führende Kante, wenn das Gerät gefaltet ist, und erscheinen mittig, wenn das innere Display flach aufgeklappt ist.

Die Bars innerhalb eines Sheets folgen eigenen Regeln. Apples Artikel Preparing your app for iPhone Duo besagt, dass das äußere Display die Bars eines Sheets standardmäßig vertikal darstellt. Auf dem inneren Display ist die Toolbar bei zentrierten oder führenden Sheets horizontal und bei nachfolgenden (trailing) Sheets vertikal.

Wenn Sie keine vertikale Bar im Sheet möchten, deaktivieren Sie sie mit toolbarVerticalBehavior(_:) in SwiftUI oder preferredVerticalBarBehavior in UIKit. Unser Leitfaden zur vertikalen Toolbar auf dem iPhone Duo erklärt, wie diese Bars aufgebaut sind und wie Elemente überlaufen.

Wie verwende ich presentationPlacement in SwiftUI?

iOS 27 führt den Modifier presentationPlacement(_:) und den Typ PresentationPlacement ein. Sie wenden ihn auf den Inhalt des Sheets an, neben Modifiern wie presentationDetents. Dies ist das Beispiel aus Apples Dokumentation, bei dem mehr von einer Karte hinter dem Sheet sichtbar bleibt:

Map()
    .sheet(isPresented: $isPresented) {
        PlaceDetailView()
            .presentationDetents([.medium, .large])
            .presentationPlacement(.leading)
    }

PresentationPlacement hat vier statische Werte. Apple weist darauf hin, dass nur Sheet-Präsentationen sie berücksichtigen; Popovers, Alerts und Menüs ignorieren den Modifier.

Leading und Trailing sind Begriffe der Layoutrichtung, daher sollte .leading in einer rechts-nach-links-Sprache das Sheet rechts platzieren. Das unterscheidet sich von der vertikalen Bar, die laut @sarunw der Hardware folgt und nicht der Leserichtung. Testen Sie beide Richtungen, wenn Ihre App ins Arabische oder Hebräische lokalisiert ist.

Wie sieht es mit UIKit aus?

In UIKit setzen Sie die Eigenschaft preferredPlacement auf dem UISheetPresentationController des präsentierten View Controllers. Apples Artikel nennt sie als UIKit-Gegenstück zu presentationPlacement(_:), und ein Apple Technology Evangelist verwies in diesem Forum-Thread darauf als Möglichkeit, zu beeinflussen, wie sich Sheets daran anpassen, wie eine Person das iPhone Duo hält. Prüfen Sie die genauen Wertnamen in den UIKit-Headern von Xcode 27, bevor Sie den Code schreiben.

Welche Sheet-Platzierung sollte ich wählen?

Beginnen Sie mit .automatic. Das System bewegt Sheets bereits zwischen der Mitte und der führenden Kante, während das Gerät gefaltet wird, und wählt für jeden Fall die passende Ausrichtung der Bars. Überschreiben Sie die Platzierung nur, wenn Sie einen Grund dafür haben.

Gute Gründe, sich für eine Seite zu entscheiden:

• Primären Inhalt sichtbar halten. Apples eigenes Beispiel nutzt .leading für eine Ortskarte über einer Map. Nutzen Sie dieselbe Idee für ein Inspector-artiges Sheet neben einem Foto, einem Dokument oder einem Spielbrett.
• Das Sheet von der vertikalen Bar fernhalten. Das innere Display platziert Bars in manchen Haltungen entlang einer Kante. Wenn Ihre Hauptansicht diese Kante bereits nutzt, lässt ein Sheet auf der anderen Seite die Toolbar frei. Denken Sie daran, dass ein Trailing-Sheet eine eigene vertikale Toolbar erhält.
• Neben dem Inhalt bleiben, den das Sheet bearbeitet. Ein Formatierungs-Sheet neben dem Absatz, den es verändert, ist einfacher zu bedienen als eines, das ihn verdeckt.

Wählen Sie .center für fokussierte, in sich geschlossene Aufgaben wie Anmeldung, einen Teilen-Ablauf oder ein Einstellungsformular, bei denen nichts hinter dem Sheet wichtig ist.

Kann sich die Platzierung mit der Haltung ändern?

Nicht von selbst. Ein Apple-Engineer bestätigte in den Forums, dass die gesetzte Platzierung immer gilt, nicht nur im gefalteten Zustand, und dass es keine Ausweichreihenfolge wie „erst Mitte, dann Trailing“ gibt. Der vorgeschlagene Workaround: eine aktive Division-Reserved-Region erkennen und die Platzierung selbst wählen:

struct PlaceMapView: View {
    @State private var isPresented = true

    var body: some View {
        GeometryReader { proxy in
            // Aktive Division = der Falz wird genutzt (teilweise gefaltet)
            let isFolded = !proxy.reservedRegions(kind: .division).isEmpty

            Map()
                .sheet(isPresented: $isPresented) {
                    PlaceDetailView()
                        .presentationDetents([.medium, .large])
                        .presentationPlacement(isFolded ? .trailing : .automatic)
                }
        }
    }
}

Dies ist eine Skizze aus zwei dokumentierten APIs, reservedRegions(kind:) und presentationPlacement(_:), kein von Apple veröffentlichter Code. Unser Leitfaden zu Reserved Regions und dem Falz erklärt aktive und inaktive Regionen ausführlicher, und Hinge-Zustände und onHingeChange behandelt, wie Sie direkt auf Haltungsänderungen reagieren.

Warum folgt ein Sheet auf dem iPhone Duo den Bildschirmecken?

Wie @sarunw anmerkt, folgt ein Sheet auf dem iPhone Duo den ungleichmäßigen Ecken des Geräts. System-Sheets, Popovers und andere Container verwenden konzentrische Ecken: Jede innere Rundung teilt ihren Mittelpunkt mit der Rundung außen herum, sodass der Abstand zwischen beiden rundum gleich bleibt.

Apple sagt im Tech Talk, dass die in iOS 26 eingeführten Concentricity-APIs aktualisiert wurden, um mit den Bildschirmformen des iPhone Duo zu funktionieren. In SwiftUI bedeutet das ConcentricRectangle, in UIKit UICornerConfiguration. Das SwiftUI-Beispiel aus dem Tech Talk ist eine einzelne gefüllte Form:

ConcentricRectangle()
    .fill(Color.green)
    .padding(8.0)
    .ignoresSafeArea()

Wenn Sie System-Sheets und diese Formen verwenden, erhalten Sie passende Ecken automatisch. Das Problem tritt auf, wenn Sie eigene Panels mit einem fest codierten cornerRadius zeichnen, der für ein anderes iPhone abgestimmt wurde.

Wie passe ich Ecken mit concentricCornerRadii an den Bildschirm an?

iOS 27 fügt concentricCornerRadii zu GeometryProxy hinzu. Anders als ConcentricRectangle zeichnet es nichts; es liefert ein RectangleCornerRadii?, das Sie für eigenes Zeichnen, Animationen oder eigene Formen nutzen können. Eine Begleitmethode, concentricCornerRadii(in:), macht dasselbe für ein Teilrechteck der View.

Apples Dokumentation nennt die Regel: Der Radius jeder Ecke ist der Eckradius des Containers minus dem Abstand von der Ecke der View zur Ecke des Containers. Ecken, die weit von den Ecken des Containers entfernt sind, erhalten null, und das Ergebnis wird auf den größten Radius begrenzt, den die View haben kann.

@sarunw zeigt ein Rechenbeispiel: Auf dem iPhone 18 Pro beträgt die Bildschirmecke 62 Punkte, eine View mit 16 Punkten Abstand erhält also 62 − 16 = 46 Punkte. Der Wert von 62 Punkten stammt aus seinem Beitrag; Apple veröffentlicht auf den von uns geprüften Seiten keine Eckradien pro Gerät.

Die letzten beiden Zeilen wenden die dokumentierte Formel auf dieselbe Ecke an; es sind keine separaten Messungen. Auf dem iPhone Duo sind die Ecken nicht einheitlich, und genau deshalb ist es besser, den Wert auszulesen, statt ihn fest zu codieren.

Die Eigenschaft liefert nil, wenn keine Container-Form gesetzt ist oder die Form nicht genug Eckinformationen bereitstellt. Apples Beispiel setzt eine explizit mit containerShape(_:). Behandeln Sie nil immer mit einem sinnvollen Fallback:

struct FloatingPanel: View {
    private let fallback = RectangleCornerRadii(
        topLeading: 16, bottomLeading: 16,
        bottomTrailing: 16, topTrailing: 16
    )

    var body: some View {
        GeometryReader { proxy in
            UnevenRoundedRectangle(
                cornerRadii: proxy.concentricCornerRadii ?? fallback,
                style: .continuous
            )
            .fill(.thinMaterial)
        }
        .padding(16)
        .ignoresSafeArea()
    }
}

Das Panel sitzt 16 Punkte von den Kanten entfernt, fragt den Proxy nach seinen konzentrischen Radien und zeichnet sie mit UnevenRoundedRectangle. Wenn das System keine Container-Form auflösen kann, fällt das Panel auf einen gleichmäßigen Radius von 16 Punkten zurück.

Wann sollte ich UnevenRoundedRectangle verwenden?

UnevenRoundedRectangle zeichnet ein Rechteck mit unterschiedlichem Radius an jeder Ecke. Es ist nicht neu in iOS 27 (Apples Dokumentation führt es ab iOS 16), aber es ist der natürliche Partner für concentricCornerRadii, weil eine View nahe einer Bildschirmecke dort einen großen Radius braucht und überall sonst einen kleinen.

Sie können einen RectangleCornerRadii-Wert übergeben, wie oben, oder jede Ecke einzeln benennen:

UnevenRoundedRectangle(
    topLeadingRadius: 46,
    bottomLeadingRadius: 46,
    bottomTrailingRadius: 12,
    topTrailingRadius: 12,
    style: .continuous
)
.fill(.background.secondary)

Diese Form eignet sich für ein eigenes Panel, das an der führenden Kante angeheftet ist: Die beiden äußeren Ecken folgen dem Bildschirm, die beiden inneren bleiben eng. Bevorzugen Sie die berechneten Werte aus concentricCornerRadii gegenüber festen Zahlen wie 46, die nur für ein Gerät und einen Abstand gelten.

Was sind typische Fehler bei Sheets auf dem iPhone Duo?

• Platzierung überall überschreiben. Weil eine feste Platzierung in jeder Haltung gilt, kann ein Sheet, das halb gefaltet gut aussieht, flach aufgeklappt seltsam wirken. Verwenden Sie .automatic, sofern ein Screen nicht etwas anderes braucht.
• Eigene Presentation Controller. Eine selbst gebaute Präsentation erhält weder die Haltungsanpassung des Systems noch konzentrische Ecken. Bevorzugen Sie System-Sheets mit Detents.
• Fest codierte Eckradien. Ein von einem älteren iPhone übernommener Radius passt nicht zu den Ecken des iPhone Duo. Lesen Sie concentricCornerRadii aus oder verwenden Sie ConcentricRectangle.
• Ungleichmäßige Ränder im Sheet. Neben einer vertikalen Bar unterscheiden sich die Ränder je nach Seite. Unser Beitrag zu Safe Areas und Content Margins behandelt contentMargins(for:edges:).
• Beta-Toolchains. Ein Entwickler meldete einen Absturz beim Start („Symbol not found“ für PresentationPlacement.leading) auf einem Gerät mit Xcode 27 Beta 6, selbst hinter einer Verfügbarkeitsprüfung. In diesem Thread gibt es keine bestätigte Ursache; bauen Sie mit dem finalen Xcode 27 und einem passenden OS, bevor Sie es als Ihren eigenen Bug debuggen.

Prüfen Sie jedes Sheet in jeder Haltung: geschlossen, teilweise gefaltet und flach aufgeklappt, jeweils in beiden Ausrichtungen. Unsere Checkliste zur iPhone Duo Vorbereitung listet die übrigen lohnenden Prüfdurchgänge auf.

Die wichtigsten Punkte

• Auf dem iPhone Duo passen sich Sheets standardmäßig an: zentriert auf dem aufgeklappten inneren Display, an die führende Kante verschoben im gefalteten Zustand und mit vertikalen Bars auf dem äußeren Display.
• presentationPlacement(_:) (SwiftUI) und preferredPlacement (UIKit), beide neu in iOS 27, legen ein Sheet auf leading, trailing oder mittig fest. Nur Sheets berücksichtigen es, und es gilt in jeder Haltung.
• Um die Platzierung je nach Haltung zu ändern, prüfen Sie mit reservedRegions(kind:) auf eine aktive Division und wählen den Wert selbst.
• concentricCornerRadii auf GeometryProxy (iOS 27) liefert Radien, die ihren Mittelpunkt mit den Ecken des Containers teilen; behandeln Sie nil.
• Zeichnen Sie diese Radien mit UnevenRoundedRectangle, oder verwenden Sie ConcentricRectangle, wenn Sie nur die Form brauchen.

Lesen Sie als Nächstes, wie Bars an die vertikale Kante wandern, und sehen Sie sich in unserer Sammlung an, welche Spiele Entwickler für den Falz gebaut haben.