I'm trying to implement a data-driven version of the Tinder Card swipe interaction, any pointers on threshold when dragging the card? Thanks!
Jonas Treub hey mate, any pointers on this?
I'm not sure what you mean with threshold. Could you describe the problem?
Hey Jonas! Threshold is the snapping params when dragging to indicate the card has been fully swiped or not enough and returns to the current state. Make sense? In layman terms: when the top card is moved past 60% of its width then it animates out of view. If less than 60% then bounces back to position.
You probably want to take velocity into account. On drag end you can get the velocity out of the event object. If the velocity.x is smaller then a certain threshold, animate it off the screen to the left. If the velocity is small snap back to the center. Makes sense?
Here is a quick example: https://framer.cloud/zXYKU