[Android] Fix jumpy animation

oblador / react-native-lightbox

Images etc in Full Screen Lightbox Popovers for React Native

MIT License

2.82k stars 501 forks source link

[Android] Fix jumpy animation #92

Open ncuillery opened 7 years ago

ncuillery commented 7 years ago

Description

The y coordinate sent by the React Native measure seems to take the StatusBar height into account. There is no need to do the subtraction anymore.

Steps to reproduce

Run the Example on an Android device
Touch the pig with the hat
- Before the beginning of the opening animation, the image moves suddenly few pixels upward (very fast, hard to see)
- When the lightbox is open, touch/untouch the image makes it jump vertically of few pixels too
- At the end of the closing animation, the image moves suddendly few pixels downward to fit in its container again.

With that fix, the 3 issues disappear.

CC my teammate @philtrep

i8wu commented 6 years ago

+1 @oblador anything we can to to help get this merged quicker?

RossKinsella commented 6 years ago

@ncuillery I forked the repo and put your PR into it and I seem to be getting a flash of white at the end of the close animation for android now. Any ideas? Please see gif attached.

https://cl.ly/0E2k3f410x0n

jacklj commented 6 years ago

verzil commented 6 years ago

ncuillery commented 6 years ago

@RossKinsella I didn't really see a white flash on your gif. I guess the bitrate of your recording is too slow. But I'm pretty sure it's the Fresco splash screen.

Fresco (the lib used by RN to handle images on Android) displays the white rectangle while your image is loaded.

Maybe you change your image source when the lightbox is opened/closed (for replacing a small thumbnail by a full-res image for example) ? If so, you should leave the image untouched and use the renderContent props instead.

jhalborg commented 6 years ago

@ncuillery - I can confirm @RossKinsella's issue. I'm using a standard implementation, no new render in the lightbox. You don't see it when you try?

venkatmithun commented 6 years ago

waheedakhtar694 commented 5 years ago

I am also facing jumpy effect on close of image @RossKinsella i can share video for this as well.

nevaehph commented 5 years ago

The white flash seems to be due to a short time gap between the lightbox overlay's image hiding and the original image appearing. I did a dirty fix by running an animation in parallel to increase the lightbox's image's opacity to 1 alongside the lightbox overlay's image shrinking.

Anyone with a better alternative is greatly appreciated.