search

lhandel / react-native-card-flip

Card flip animation for React Native
MIT License
252 stars 61 forks source link

Back of card with horizontal rotation shows mirrored and upside down. #4

Closed angelolucas closed 6 years ago

angelolucas commented 6 years ago

Back of card with flipDirection="x" shows mirrored and upside down.

Example: issue

TntManiak commented 6 years ago

Hello,

Did you found any solutions about this? I've a strange similar issue. I've a \<CardFlip> with inside 2 touchableOpacity. When I touch these, the card flip correctly. However, if I flip the card from a component outside of \<CardFlip>, it just mirror the actual card instead of showing his back card.

TntManiak commented 6 years ago

By digging into the code of CardFlip.js, I ended up to find what caused my issue. In flipY() and flipX() method, you need to call this._flipTo() BEFORE the setState as you need to flip before the states are updated.

Do you want me to do a PR?

lhandel commented 6 years ago

This problem should be fixed in the last update :)

ramuachala commented 6 years ago

i needed to flip based on props.. the below works but for some reason the animation is very slow

 componentDidMount() {
    if (this.props.global.side === "back") {

        this.card.flip();

    }

then when i try requestAnimationFrame, it flips and mirrors

 componentDidMount() {
    if (this.props.global.side === "back") {
         requestAnimationFrame(() => {
        this.card.flip();
      });
    }