I want to build a swipe animation where cards slide away when you swipe left, just like those smooth transitions you see in design prototypes. Picture having multiple cards stacked on top of each other. When you swipe the top card to the left, it should smoothly slide out and show the card underneath.
I tried using PageView but it arranges things more like a horizontal list instead of a proper stack. SlideTransition seems to need route navigation which is not what I’m looking for here. I need something that works with Flutter’s Stack widget where the top layer moves away when swiped.
Does anyone know which widgets would work best for this kind of interaction? Any code examples would be really helpful too!
Dismissible is perfect for this. I built something similar last month - it handles swipe mechanics flawlessly without messy gesture detection. Just wrap each card in a Dismissible with direction: DismissDirection.startToEnd and tweak the animation duration. It automatically manages the slide-out animation and removes the widget when you complete the swipe. You can also control the dismiss threshold and add custom animations during swipes. Way cleaner than dealing with pan gestures and transforms manually.
Same problem here a few months ago! I used PanGestureRecognizer with AnimationController and it worked great. Don’t rely on built-in widgets - manage the stack positions yourself instead.
Create a custom stateful widget where each card gets its own translation offset. Track the horizontal delta when the pan starts and update the top card’s position. When swipe velocity or distance hits your threshold, trigger the animation to finish the slide-out.
The trick is using setState to rebuild just the moving card while keeping the rest of the stack static. You get full control over animation curves and timing, plus adding bounce-back effects for incomplete swipes is super easy.
totally! using GestureDetector and AnimatedContainer is the way to go. wrap your cards in that, detect swipes, and apply Transform for that smooth slide-out effect. tried it myself, so much smoother than fiddling with PageView.