I am implementing the brand new iOS 18 .navigationTransition(.zoom)
function with a grid of things that open in a full-screen cowl. Every part works nice, however I am experiencing two points after dismissing the element view:
Subject 1: Bouncy animation when scrolling
After I dismiss the element view after which scroll, the matched merchandise has an undesirable bouncy/spring animation. I would wish to take away this animation solely.
Subject 2: Including nook radius clips the view
If I add a nook radius to my grid gadgets (.cornerRadius(12)
), the view will get clipped when scrolling after dismissing the element view.
bouncy impact :
minimize impact :
In my code I exploit photos and extra advanced views, right here it is simply pink rectangles.
This is my minimal reproducible instance:
import SwiftUI
struct TestItem: Identifiable {
let id: Int
}
@Observable
closing class TestViewModel {
var selectedItem: TestItem?
var transitionID: String?
let gadgets = (0..<10).map { TestItem(id: $0) }
func selectItem(_ merchandise: TestItem) {
selectedItem = merchandise
transitionID = "item-(merchandise.id)"
}
func dismiss() {
selectedItem = nil
transitionID = nil
}
}
struct TestView: View {
@State personal var viewModel = TestViewModel()
@Namespace personal var namespace
var physique: some View {
ScrollView {
LazyVGrid(columns: [
GridItem(.flexible()),
GridItem(.flexible())
], spacing: 16) {
ForEach(viewModel.gadgets) { merchandise in
rectangleButton(for: merchandise)
// .cornerRadius(12) // ← Uncomment to see clipping difficulty
}
}
.padding()
}
.fullScreenCover(merchandise: $viewModel.selectedItem) { merchandise in
if let transitionID = viewModel.transitionID {
detailView(for: merchandise)
.navigationTransition(.zoom(sourceID: transitionID, in: namespace))
}
}
}
@ViewBuilder
personal func rectangleButton(for merchandise: TestItem) -> some View {
Button {
viewModel.selectItem(merchandise)
} label: {
Rectangle()
.fill(Shade.pink)
.body(top: 150)
}
.matchedTransitionSource(id: "item-(merchandise.id)", in: namespace)
}
personal func detailView(for merchandise: TestItem) -> some View {
ZStack {
Rectangle()
.fill(Shade.pink)
.ignoresSafeArea()
VStack {
HStack {
Spacer()
Button("Shut") {
viewModel.dismiss()
}
.padding()
}
Spacer()
}
}
}
}
Steps to breed:
- Faucet any pink rectangle
- Shut the element view
- Scroll the grid → The beforehand chosen merchandise bounces/springs
- Uncomment .cornerRadius(12) and repeat → The corners are clipped throughout scroll
Anticipated habits: No animation when scrolling after dismiss, and nook radius ought to stay intact.
Surroundings: iOS 26.0, Xcode 26.0
Has anybody encountered this? Is there a solution to disable the bouncy animation or repair the nook radius clipping?