software-mansion / react-native-reanimated

React Native's Animated library reimplemented
https://docs.swmansion.com/react-native-reanimated/
MIT License
8.59k stars 1.26k forks source link

Animated View entering animation not working on Android #6141

Closed OscarMpy closed 1 week ago

OscarMpy commented 1 week ago

Description

Problem:

I am experiencing an issue with the Animated.View component from react-native-reanimated where the FadeInRight animation works perfectly on iOS and web platforms but does not work on Android. The animation should cause the view to fade in and slide in from the right, but on Android, there is no animation visible.

Steps to reproduce

  1. Use the provided Expo Snack link to run the code on an Android device or emulator.
  2. Click on the "Add" button to add a new item to the list.
  3. Observe that the new item animates in correctly on iOS and web but does not animate on Android.

Snack or a link to a repository

https://snack.expo.dev/@oscar3812/animated-list

Reanimated version

~3.10.1

React Native version

0.74

Platforms

Android

JavaScript runtime

None

Workflow

None

Architecture

None

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

piaskowyk commented 1 week ago

Maybe you have reduced motion enabled on your device 🤔

OscarMpy commented 1 week ago

I would assume the snack from expo doesn't have it on by default? Not sure if that's how it works, but on the settings it seems to be off.

szydlovsky commented 1 week ago

Hey @OscarMpy I played with your snack a bit and found out that removing removeClippedSubviews flag (or setting it to false) fixes the issue. Btw, this flag also needs overflow: 'hidden' style on the mentioned subviews to make it work: https://reactnative.dev/docs/view#removeclippedsubviews