react-native-deck-swiper icon indicating copy to clipboard operation
react-native-deck-swiper copied to clipboard

Last two cards in stack don't animate

Open 2snEM6 opened this issue 4 years ago • 4 comments

When swiping a card a slight zoom in animation of the next card is executed. However this does not happen on the last two cards of the stack.

Does anyone know how to solve this issue?

Thank you!

2snEM6 avatar Apr 11 '20 12:04 2snEM6

Same issue over here!

NicolasM99 avatar Nov 12 '20 16:11 NicolasM99

Please open the issue on the current repo and it might get some support / PR and a fix merged.

webraptor avatar Dec 02 '20 18:12 webraptor

It worked for me by adding this function to the Swiper class in Swiper.js

rebuildStackValues = () => {
    const stackPositionsAndScales = {}
    const { stackSize, stackSeparation, stackScale } = this.props
    for (let position = 0; position < stackSize; position++) {
      stackPositionsAndScales[`stackPosition${position}`] = new Animated.Value(stackSeparation * position)
      stackPositionsAndScales[`stackScale${position}`] = new Animated.Value((100 - stackScale * position) * 0.01)
    }
    return stackPositionsAndScales
  }

and then setting the new state inside onSwipedCallbacks function

onSwipedCallbacks = (swipeDirectionCallback) => {
this.setState(this.rebuildStackValues)  //<-- add this line

grapefruitlips avatar Oct 15 '21 07:10 grapefruitlips

@grapefruitlips You are a life saver!

brocodedude avatar Oct 29 '21 20:10 brocodedude