Learn SwiftUI

Asymmetric transitions

Asymmetric transitions are a way of adding and removing views based on their current state without the need for additional or duplicated logic.

Let's take a look at our previous example and see how we would achieve this:

Button("Basic Transitions") {    withAnimation {        self.transition.toggle()    }}if transition {    Text("Learn SwiftUI (click me again)")        .transition(.asymmetric(insertion: .opacity, removal: .scale))}

The highlighted code in the preceding snippet is all we need to do. Our .transition modifier accepts a type of .asymmetric, which in turn asks for both insertion and removal parameters:

• insertion will be the initial transition performed when our if statement is satisfied.
• removal will occur when the state is ...