webraptor / react-native-deck-swiper

tinder like react-native deck swiper
ISC License
137 stars 84 forks source link

Cards gets shifted to the right if a video was played in landscape #36

Closed arnaud9145 closed 4 years ago

arnaud9145 commented 4 years ago

Hello !

I have a bug on my app :

I render a deck of yellow cards, if I press on a card I go to another page (with react-native-navigation v5) where I see a video (youtube in a webview). I open it in fullscreen, and change the orientation of the device to landscape. I then leave the video, go back to portrait mode. I go back to the swiper. Cards are now shifted to the right by almost half a screen, and I see the blue background of the swiper.

before screen :

Capture d’écran 2020-10-11 à 18 49 20

after screen :

Capture d’écran 2020-10-11 à 18 49 08

Here is a video : https://drive.google.com/file/d/1WXwO6JGZke_YLonKWc7aoTs7g1XVOOzD/view?usp=sharing

Any idea on how to fix ? I tried to force update my component by triggering a change of state, but since I have a ref on the swiper, it does not change anything. I also tried with the ref to call "forceUpdate" function on swiper, but nothing happens.

webraptor commented 4 years ago

The swiper takes its size based on the device screen size, so rotating the device will result in what you're describing. You can fix this by re-initialising the swiper after a rotate has happened.