Contents

crossFade

A navigation transition that cross-fades between the appearing view and the disappearing view.

Declaration

static var crossFade: CrossFadeNavigationTransition { get }

Discussion

Specify this transition in a sheet to have it appear by fading in over the content, as opposed to moving upwards to cover content.

This example shows a sheet that appears with a cross-fade.

struct ContentView: View {
    @State private var showSheet = false

    var body: some View {
        VStack {
            Button("Show Sheet") {
                showSheet = true
            }
            .sheet(isPresented: $showSheet) {
                Text("Sheet Content")
                    .presentationDetents([.medium])
                    .navigationTransition(.crossFade)
            }
        }
    }
}

See Also

Getting built-in transitions