[ BUG ] Select not scrollable on android but works in iOS

[huevosyitz]

Reproduction link: <link>

Describe the bug
Select scrollable is not scrolling in Android but works fine in iOS.
I'm using this exact example from the docs
https://reactnativereusables.com/docs/components/select#scrollable

Even the RNR showcase app (https://play.google.com/store/apps/details?id=com.reactnativereusables.android&hl=en) or in Expo Go snack also has this issue when i tried to download in real Android device.

Steps to reproduce the behavior:

1. copy example from https://reactnativereusables.com/docs/components/select#scrollable
2. run in android
3. open the select and try to scroll through the list

Expected behavior
Select content is scrollable

Actual behavior
Select content cannot scroll through the list.

Platform (please complete the following information):

• Type: [Device] Redmi Note 11 pro
• OS: Android version 13

[DebNation]

it seems I am not the only one facing the issue

[JvSe]

I fixed it based on this issue. Just remove any component that uses animation: #344

[SleepBeary]

I fixed it based on this issue. Just remove any component that uses animation: #344

Maybe a retarded question but ...
Just I question, I am new in react-native development. How do I know which components use animations?

[JvSe]

I fixed it based on this issue. Just remove any component that uses animation: #344

Maybe a retarded question but ... Just I question, I am new in react-native development. How do I know which components use animations?

In this package, they have a component called NativeOnlyAnimatedView, which is responsible for handling some of the animations provided by the react-native-reanimated package. This component is causing a conflict that prevents the scroll from working properly in the select component.

If any component isn’t working as expected, check if it’s using the NativeOnlyAnimatedView component. Try removing it, I believe that will solve the issue. So far, I’ve only encountered this problem with the select component.

[SleepBeary]

I fixed it based on this issue. Just remove any component that uses animation: #344

Maybe a retarded question but ... Just I question, I am new in react-native development. How do I know which components use animations?

In this package, they have a component called NativeOnlyAnimatedView, which is responsible for handling some of the animations provided by the react-native-reanimated package. This component is causing a conflict that prevents the scroll from working properly in the select component.

If any component isn’t working as expected, check if it’s using the NativeOnlyAnimatedView component. Try removing it, I believe that will solve the issue. So far, I’ve only encountered this problem with the select component.

Thanks a lot man, it's working now for android too :)

[serhii-fsi]

I fixed it based on this issue. Just remove any component that uses animation: #344

Same.

  // AnimatedWrapper: NativeOnlyAnimatedView caused scrolling to not work on
  // Android devices, so we skip the animated wrapper on Android and render
  // children directly. Other platforms still use the animated container.
  const AnimatedWrapper = ({ children }: { children: React.ReactNode }) => {
    return Platform.OS === 'android' ? (
      <>{children}</>
    ) : (
      <NativeOnlyAnimatedView className="z-50" entering={FadeIn} exiting={FadeOut}>
        {children}
      </NativeOnlyAnimatedView>
    );
  };