Note: this is ONLY reproducible on Android with RN New Architecture enabled
Current behaviour
When the Snackbar visible prop is set to true, the Snackbar is rendered onto the screen, but it's opacity remains as 0, making it invisible. When the visible prop is set back to false the Snackbar "flashes" before disappearing again.
Expected behaviour
When the Snackbar visible prop is true, the Snackbar should be rendered on the screen and visible.
I have spend a considerable amount of time modifying the show/hide logic and the animation logic for the Snackbar component. I have isolated the issue to either the RN Animated API itself, or your library's use of it. By adding react-native-reanimated to the project and migrating all animations to their APIs, the component behaves as expected.
Note: this is ONLY reproducible on Android with RN New Architecture enabled
Current behaviour
When the Snackbar
visible
prop is set totrue
, the Snackbar is rendered onto the screen, but it's opacity remains as0
, making it invisible. When thevisible
prop is set back tofalse
the Snackbar "flashes" before disappearing again.Expected behaviour
When the Snackbar
visible
prop istrue
, the Snackbar should be rendered on the screen and visible.How to reproduce?
Please visit this repo and follow the readme.
Preview
https://github.com/callstack/react-native-paper/assets/87504652/6cb3c56d-610b-4332-8104-90ea88894ca3
What have you tried so far?
I have spend a considerable amount of time modifying the show/hide logic and the animation logic for the Snackbar component. I have isolated the issue to either the RN Animated API itself, or your library's use of it. By adding
react-native-reanimated
to the project and migrating all animations to their APIs, the component behaves as expected.Your Environment