ios – Updating state of the present Index of an array whereas sustaining constant management stream 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 start out at 0. I’ve buttons that show the solutions to the playing cards. What I’m aiming for is when the right reply is chosen the cardboard flips, and the currentIndex += 1. The difficulty 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 once you select the right reply once more the cycle continues the place 1 is added to the currentIndex once more, and the view transitions out of the display screen, however the card not flips earlier than transitioning out.Thanks prematurely for the assistance I’m nonetheless a brilliant noob, and first venture 💪

     // **The offset under has a conditional that watches for onAppear bool to convey the view into display screen. Additionally you possibly can 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 person. 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.principal.asyncAfter(deadline: .now() + .seconds(1)) {
                                currentIndex += 1
                            }
                        }
                    } label: { Textual content(playing cards[backValue].again) }
                }
            }
        }

// **This onAppear triggers the offset conditional to true**
        .onAppear {
            DispatchQueue.principal.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.principal.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(period: durationAndDelay)) {
                backDegree = 90
            }
            
            withAnimation(.linear(period: durationAndDelay).delay(durationAndDelay)) {
                frontDegree = 0
            }
        }
    }
}