1

Hello all I am building Tinder like swipe in Flutter. So far so good I have made the stack of cards together with the gesture detector when the user swipes left/right. However my issue come when I try to animate on click of a button. Under the stack of cards there are 2 buttons which you can like or dislike on button click. I would like to get an advice how I can approach the animation when the user clicks on either button. Below is my code for displaying the stack. Best wishes

Todor Kosev
  • 11
  • 1
  • 3
  • Is the animation part of a page transition or do you stay on the same screen? – Jacob Phillips Mar 27 '20 at 14:42
  • hello Jacob, I would like to apply a animation like as if the user has swiped on the card but on a button click so after he clicks on a button, animation is not part of page transition and the user should stay on the same screen. Regards – Todor Kosev Mar 27 '20 at 14:45

1 Answers1

0

There are several options to animate the card off screen. Since you're already using a Stack, AnimatedPosition is probably the best option.

You could also use Transform.translate to set the transform property of an AnimatedContainer. Or, if you want more control over the animation you could use a SlideTransition.

For a good overview of how to decide which animations you need, see this video from two days ago: https://www.youtube.com/watch?v=GXIJJkq_H8g

There's also https://pub.dev/packages/animations for more pre-packed options.

Jacob Phillips
  • 8,841
  • 3
  • 51
  • 66