ios – Updating state of the present Index of an array whereas sustaining constant management circulate with animations

Good night, I’ve a view that resembles a flashcard that I’m passing an array to. I at the moment have a State variable that’s monitoring the currentIndex which I’ve set to begin at 0. I’ve buttons that show the solutions to the playing cards. What I’m aiming for is when the proper reply is chosen the cardboard flips, and the currentIndex += 1. The problem I’m dealing with appears to be that when the isFlipped State var is toggled it stays true.When the subsequent card seems with the brand new, and up to date currentIndex whenever you select the proper reply once more the cycle continues the place 1 is added to the currentIndex once more, and the view transitions out of the display, however the card now not flips earlier than transitioning out.Thanks upfront for the assistance I’m nonetheless a brilliant noob, and first venture 💪

     // **The offset under has a conditional that watches for onAppear bool to carry the view into display. Additionally you may see currentIndex is getting used within the View parameters.**
                    CardView(cardData: playing cards[currentIndex], frontDegree: $frontDegree, backDegree:  $backDegree)
                        .padding(.backside, 40)
                        .transition(.transfer(edge: .trailing))
                        .animation(Animation.spring(response: 0.6, dampingFraction: 0.5, blendDuration: 0), worth: onAppear)
                        .offset(x: onAppear ? 0 : 400)
     
// **Beneath I've the flipCard operate being triggered if the again property within the array objects matches the present one that's chosen by the consumer. I've a dispatchQueue to permit time for the animation to happen. **

 ForEach(playing cards.indices, id: .self) { backValue in
                    Button {
                        if playing cards[currentIndex].again == playing cards[backValue].again {
                            flipCard()
                            DispatchQueue.foremost.asyncAfter(deadline: .now() + .seconds(1)) {
                                currentIndex += 1
                            }
                        }
                    } label: { Textual content(playing cards[backValue].again) }
                }
            }
        }

// **This onAppear triggers the offset conditional to true**
        .onAppear {
            DispatchQueue.foremost.asyncAfter(deadline: .now() + .seconds(1)) {
                withAnimation {
                    onAppear = true
                }
            }
        }
//**When the flipCard() is triggered and currentIndex is modified the view offsets to 400, after which after delay comes again on to view when onAppear is toggled again to true with the subsequent object within the array.**
        .onChange(of: currentIndex) { _ in
            onAppear = false
            DispatchQueue.foremost.asyncAfter(deadline: .now() + .seconds(1)) {
                withAnimation(Animation.spring(response: 0.6, dampingFraction: 0.5, blendDuration: 0)) {
                    onAppear = true
                }
            }
        }
    }
    // ****Beneath the isFlipped is about from false to true, and proceeds into an animation, however stays to true...****
    func flipCard() {
        isFlipped = !isFlipped
        if isFlipped {
            withAnimation(.linear(length: durationAndDelay)) {
                backDegree = 90
            }
            
            withAnimation(.linear(length: durationAndDelay).delay(durationAndDelay)) {
                frontDegree = 0
            }
        }
    }
}