SwiftUI insertion transion is not working when view added

Question

I'm trying SwiftUI tutorial in apple developer page. now I'm following transition tutorial but my transition is not working when the view added.

here my code.

VStack(alignment: .leading) {
            
    HStack() {
            
        // title
        Text(titleText)
            .font(.headline)
            .padding()
            
        Spacer()
            
        // button
        Button(action: {
            withAnimation {    
                self.showDetail.toggle()
            }
        }) {
            Image(systemName: "chevron.right.circle")
                .imageScale(.large)
                .rotationEffect(.degrees(showDetail ? 90 : 0))
                .padding()
        }
    }
        
    // detail
    if showDetail {        
        Text(contentText)
            .transition(.slide)
            .padding()
    }
}

I think the Text that has contentText, should appear with slide transition but when I press the Button, it just pop up. but when I press button again it disappear with transition. so removal transition is work.

How can I fix this?

Answer 1

After some test I found some solution.

solution 1: It is just bug of XCode canvas. It works in the simulator or on a real machine.

solution 2. (if you really want to do in canvas)

Button (action : {
    withAnimation(.easeInOut) {    // add animation manually
        self.showDetail.toggle()
    }
}) {
    // label Image no change
}

if showDetail {
    Text(contentText)
        .transition(.slide)
        .animation(.easeInOut)    // match with withAnimation
}

Answer 2

Although I haven't done the tutorial you are talking about but I think it works pretty fine using the .move transition instead of the .slide transition. Here's my code for the detail part (the rest is unchanged). I hope my answer can help you

if showDetail {
    Text(contentText)
        .transition(.move(edge: .leading))
        .padding()
}