With the correct corner radius changing in iOS 26, I wondered if there is a way to get properly rounded corners inside containers like sheets without hard-coding a constant value.
Here's the results of some experiments I did, example code below.
The new in Beta 4 ConcentricRectangle seems nice. Notable here is that it doesn't pick up the larger corner radii from the device corners:
If you want all the corners rounded, the isUniform parameter of ConcentricRectangle seems helpful. It doesn't apply the corners in a View in the middle though, not sure if this is an oversight or if this has some purpose:
ContainerRelativeShape looks ... interesting ... as of Beta 4, with the larger bottom corners rounded according to the device corners, but the actual bottom corners not fitting the device corners.
With ContainerRelativeShape one can also get the middle part to have proper rounded corners in this example ... if you set the outer .containerShape(RoundedRectangle(cornerRadius: 36)) yourself. Notable here is that it then actually adapts all corners of the last card to the larger device corner radius - why it does that even with the smaller radius being explicitly set as containerShape is beyond my imagination.
ContainerRelativeShape and ConcentricRectangle both feel quite similar to me, but different in ways that are not clear to me after reading the documentation. I wouldn't know when to pick which / I am not sure if these two should really be two separate things... Any insights here?
I was also hoping to find a way to read the cornerRadius (both device corner radius and sheet container radius) for more complex custom-shaped views, but currently there seems no way to do that. The new in iOS 26 Beta 4 GeometryReader containerCornerInsets sounded a bit like it, but it seems of no use here, it's always zero. docs talk about windowing controls and values can be seen on iPad when the red/yellow/green window buttons become visible, so it seems unrelated here.
Example code AdaptiveCorners.swift
import SwiftUI
enum Experiment: String, CaseIterable, Identifiable {
case form
case concentricRect
case uniformConcentricRect
case containerRelative
case containerRelativeWithContainerShape
case containerCornerInsets
var title: String {
self.rawValue
}
var id: String {
self.rawValue
}
}
struct ContentView: View {
@State var experiment : Experiment? = .concentricRect
var body: some View {
NavigationStack {
Form {
Picker("Experiment", selection: $experiment) {
ForEach(Experiment.allCases, id: \.self) { experiment in
Text(experiment.title).tag(experiment)
}
}
.pickerStyle(.inline)
}
}
.sheet(item: $experiment) { experiment in
Group {
switch(experiment) {
case .form:
Form {
Section {
Text("Form + Section")
Text("Form + Section")
}
}
case .concentricRect:
ShapeView {
ConcentricRectangle()
}
case .uniformConcentricRect:
ShapeView {
ConcentricRectangle(corners: .concentric, isUniform: true)
}
case .containerRelative:
ShapeView {
ContainerRelativeShape()
}
case .containerRelativeWithContainerShape:
ShapeView {
ContainerRelativeShape()
}
.containerShape(RoundedRectangle(cornerRadius: 36))
case .containerCornerInsets:
GeometryReader { geometry in
Form {
Text(String(describing: geometry.containerCornerInsets))
}
}
}
}
.presentationDetents([.medium, .large])
}
}
}
struct ShapeView<S : Shape> : View {
@ViewBuilder let content: () -> S
var body: some View {
ScrollView([.vertical]) {
VStack {
HStack {
content()
.fill(Color.yellow)
.frame(height: 80)
.frame(maxWidth: .infinity)
content()
.fill(Color.orange)
.frame(height: 80)
.frame(maxWidth: .infinity)
}
content()
.fill(Color.green)
.frame(height: 80)
.frame(maxWidth: .infinity)
}
.padding()
}
}
}
#Preview {
ContentView()
}
