Specify Flip Direction

[aprct]

Love the component!

Currently the card flips to the right, then flips back to the left.

It would be extremely useful for my project (and many others, I'm sure) if we could specify which direction to flip based on which direction the user swiped.

I already have the swipe detection working and now all we need is the card flip direction implemented.

Thanks!

[moschan]

@aprct
Thank you for your issue.
I will check and reply soon.

[aprct]

Hey @moschan, any luck?

Also, what are your thoughts on adding a third-party dependency?

[moschan]

@aprct Hi, sorry I've been tied up with work.. 😱

Also, what are your thoughts on adding a third-party dependency?

That depends on the situation. But I think, our component should be simple. So I don't want to inject other untrusted/unstable dependencies.

What do you think about that and why do you ask❓

Thanks.

[aprct]

No problem! Me too. :)

I was just curious about what kind of solution you'd be interested in to detect the direction of a swipe.

The current implementation responds correctly to a right-swipe. To get the horizontal left-swipe to animate correctly, for example, we just need to push these transforms instead:

transform.push({ scaleX: -1 });

transform.push({
  rotateY: this.state.rotate.interpolate({
    inputRange: [0, 1],
    outputRange: [ '-180deg', '0deg' ]
  })
});

What's missing now is a way to detect the direction of the swipe. We can use native PanResponder (which adds a great deal of code), or we can use something else to detect the direction of the swipe.

Thoughts?