Unexpected Vertical Movement in Animated.ScrollView with Horizontal Scrolling

[Sairamyasri2024]

Description

When using an Animated.ScrollView component in a React Native application, there is unexpected behavior observed where horizontal scrolling triggers unintended vertical movement, causing carousels to move in the wrong direction.

Steps to reproduce

1. Implement an Animated.ScrollView component in a React Native application.
2. Include horizontally-scrollable carousels within the Animated.ScrollView.
3. Attempt to horizontally scroll through the carousels.

Expected Behavior:

Horizontal scrolling should only affect the carousels within the Animated.ScrollView, moving them left or right as intended.

Actual Behavior:

Horizontal scrolling also triggers vertical movement, causing the carousels within the Animated.ScrollView to move vertically in addition to horizontally. This behavior is unexpected and disrupts the user experience.

Snack or a link to a repository

na

Reanimated version

3.5.4

React Native version

0.71.14

Platforms

Android, iOS

JavaScript runtime

None

Workflow

None

Architecture

None

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

[github-actions]

Hey! 👋

The issue doesn't seem to contain a minimal reproduction.

Could you provide a snack or a link to a GitHub repository under your username that reproduces the problem?

[github-actions]

Hey! 👋

It looks like you've omitted a few important sections from the issue template.

Please complete Snack or a link to a repository section.

[szydlovsky]

Hi @Sairamyasri2024 it would be great if You included a minimal repro - so that we can check wheter the problem persists on the newer versions or not.