< How to add and remove views with a transition

How to combine transitions

Paul Hudson @twostraws October 15th 2019

Fully updated for Xcode 11 GM

When adding or removing a view, SwiftUI lets you combine transitions to make new animation styles using the combined(with:) method. For example, you can make a view move (one transition) and fade (a second transition) at the same time like this:

Text("Details go here.")
    .transition(AnyTransition.opacity.combined(with: .slide))

To make combined transitions easier to use and re-use, you can create them as extensions on AnyTransition, like this:

extension AnyTransition {
    static var moveAndScale: AnyTransition {
        AnyTransition.move(edge: .bottom).combined(with: .scale)
    }
}

With that in place you can now make a text view be added or removed using just this:

Text("Details go here.")
    .transition(.moveAndScale)

How to combine transitions

Similar solutions…