I am encounter an issue with the height of a ScrollView not rendering properly during the transition of a sheet from closed to open. This results in a gap between the bottom edge of the ScrollView and the bottom edge of the sheet during the animation. I am getting this issue when trying to use the ScrollView inside a NavigationStack and when using a PresentationDetent other than .large.
The code snippet below, for example, suffers from the issue.
ScrollView {
Button("Reveal sheet") {
isPresented = true
}
}
.frame(maxWidth: .infinity)
.background(.yellow)
.sheet(isPresented: $isPresented) {
VStack {
NavigationStack {
ScrollView {
ForEach(0..<100, id: \.self) { number in
Text("\(number)")
}
.frame(maxWidth: .infinity)
}
.background(.green)
.presentationDetents([.medium])
}
}
}
Here is what the issue looks like for this example.
The issue occurs in:
- Simulator iPhone 16 iOS 18.4
- Personal device (iPhone 16 iOS 18.4)
- Canvas preview