alexbrillant / react-native-deck-swiper

tinder like react-native deck swiper

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Last two cards in stack don't animate

2snEM6 opened this issue · 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!

Same issue over here!

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

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 You are a life saver!