Issue when dynamically generating flippable cards

Hello,

I am working on a language-learning app that consists of a Flashcard Stack. Each card of the (Swipeable) stack has a card front (word to learn) and a card back (meanings, etc.).

For this, I have set up a Flippable card inside a Swipeable stack.
The Flippable cards are dynamically generated from a list of Firestore Documents.

Structure:
Swipeable Stack --> Generate Dynamic Children --> Display the Document content on the front/back of the Flippable card.

This works. However, when flipping a card and swiping to the next one, the card will still be displayed in the same way, showing the card back instead of the front.

As-Is:
Show Card Front --> Flip Card --> Show Card Back --> Swipe --> Show Next Card Back

To-Be:
Show Card Front --> Flip Card --> Show Card Back --> Swipe --> Show Next Card Front

Is it possible to define some kind of default state for this?

I assumed that this wasn't possible so I decided to implement my own Flippable card as a Stack of 2 Cards/Containers and Conditional Visibility. However, when changing the Boolean that decides which card is shown, the widget does not get updated.

E.g.: I have set up a boolean "showCardFront".

Even if I set the conditional visibility of my front card to "if showCardFront == True" it will still show when showCardFront is set to false.


I can check this by updating a text widget that displays the value of showCardFront.

This makes it seem like there is an issue with conditional visibility and Widgets within a Swipeable Stack.

Any ideas on how to fix this and any help are greatly appreciated.

6
3 replies