Skip to content

[Android-Only] Snackbar visibility issue with RN New Architecture #4445

@bpeltonc

Description

@bpeltonc

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.

How to reproduce?

Please visit this repo and follow the readme.

Preview

Screen.Recording.2024-06-27.at.7.20.53.AM.mov

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

software version
ios N/A
android 14
react-native 0.74.2
react-native-paper 5.12.3
node 20.13.0
npm or yarn 10.5.2 (npm)
expo sdk 51.0.14

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions