react-native-date-picker icon indicating copy to clipboard operation
react-native-date-picker copied to clipboard

Horizontal ScrollView Not Scrolling When Swiping Over DatePicker on Android

Open dayze opened this issue 1 year ago • 2 comments

Describe the bug On Android, if a DatePicker is placed inside a horizontal ScrollView, swiping left or right over the DatePicker does not cause the ScrollView to scroll.

Expected behavior Like on iOS, on Android, when a DatePicker is placed inside a horizontal ScrollView, swiping left or right over the DatePicker should allow the ScrollView to scroll smoothly, while still enabling the DatePicker to function correctly.

To Reproduce Add example code that reproduces the behavior.

const width = Dimensions.get('window').width;
export const Component = () => {
  return (
    <ScrollView horizontal pagingEnabled>
      <View style={{ width }}>
        <DatePicker theme="light" mode="time" date={new Date()} />
      </View>
      <View style={{ width }}>
        <DatePicker theme="light" mode="time" date={new Date()} />
      </View>
    </ScrollView>
  );
};

Smartphone (please complete the following information):

  • OS: [Android]
  • React Native version [0.73.6]
  • react-native-date-picker version [5.0.4]

dayze avatar Aug 13 '24 10:08 dayze

Does it work as expected a vertical ScrollView?

henninghall avatar Aug 13 '24 10:08 henninghall

You will have to touch "outside" the DatePicker component to work in a vertical ScrollView.

To be more precise with the issue, using the following screenshoot : on iOS, all the blue zone can be used to "scroll" (left/right) on Android, in the red box, we can't use this zone to "scroll" (left/right)

I've attempted to use pointerEvents in the ScrollView, but on Android, either the DatePicker scrolling doesn't work or the swipe area is not correctly recognized.

Android Screenshot_20240813-133336_Combo_Staging iOS Simulator Screenshot - develop - 2024-08-13 at 13 31 49

dayze avatar Aug 13 '24 11:08 dayze