I have a transition between two texts I want to mimic with a SwiftUI transition. this is my reference:

in SwiftUI I have the following code:

        Text(model.title)
        .transition(.opacity.animation(.default).combined(with: .move(edge: .bottom)))
        .id("Title"   model.title)
        .animation(.default)

and this is the result:

how could I approach this? In the reference animation, by the time the text starts to slide it's already close to zero opacity and doesn't really move away from it's frame.

In swiftUI it clearly come from below the current text and moves up

CodePudding user response：

I think .offset instead of .move should do the job:

struct ContentView: View {
    
    let title = ["INITIAL ITEM", "NEW ITEM"]
    @State private var i = 0
    
    var body: some View {
        
        VStack {
            Spacer()
            
            ZStack {
                Text(title[i])
                    .font(.largeTitle)
                    .fontWeight(.bold)
                    .id(i)
                    .transition(
                        .offset(x: 0, y: 5)
                            .combined(with: .opacity)
                    )
            }
            
            Spacer()
            
            Button("Toggle") {
                withAnimation(.linear(duration: 0.5)) {
                    i = 1-i
                }
            }
        }
    }
}