Issues with .zoom NavigationTransition to a sheet with a .medium detent

Question

Created 3d

Replies 1

Boosts 0

Participants 1

When using a .zoom navigation transition, where .matchedTransitionSource is applied to a button in a toolbar and the destination view is a sheet which is presented with PresentationDetent.medium, the transition works initially, but shortly after it completes, the sheet's background is dimmed and the text of the source button reappears abruptly.

Code and a screenshot are below, though the effect is best observed when interacting with the view.

Screenshot 2025-06-15 at 8.46.46 AM.png

// // ContentView.swift // ZoomNavigationTransitionSample // // Created by Matthew DuBois on 6/15/25. //

import SwiftUI

struct ContentView: View { @State private var isPresentingSheet = false @Namespace private var namespace var body: some View { NavigationStack { List { Text("Some content") } .navigationTitle("Sample") .toolbar { ToolbarItem(placement: .topBarTrailing) { Button("Button") { isPresentingSheet = true } .matchedTransitionSource(id: "button", in: namespace) } } .sheet(isPresented: $isPresentingSheet) { Text("Some sheet content") .navigationTransition(.zoom(sourceID: "button", in: namespace)) .presentationDetents([.medium]) } } } }

#Preview { ContentView() }

Boost

Answer 1

matthewdubois OP

3d

Apologies, I missed the code formatting in the original post; see below.

//
//  ContentView.swift
//  ZoomNavigationTransitionSample
//
//  Created by Matthew DuBois on 6/15/25.
//

import SwiftUI

struct ContentView: View {
    @State private var isPresentingSheet = false
    @Namespace private var namespace
    var body: some View {
        NavigationStack {
            List {
                Text("Some content")
            }
            .navigationTitle("Sample")
            .toolbar {
                ToolbarItem(placement: .topBarTrailing) {
                    Button("Button") {
                        isPresentingSheet = true
                    }
                    .matchedTransitionSource(id: "button", in: namespace)
                }
            }
            .sheet(isPresented: $isPresentingSheet) {
                Text("Some sheet content")
                    .navigationTransition(.zoom(sourceID: "button", in: namespace))
                    .presentationDetents([.medium])
            }
        }
    }
}

#Preview {
    ContentView()
}

0