First scroll in vertical view does not follow motion

[msimon]

Environment

"react": "17.0.1", "react-native": "0.64.0", "react-native-pager-view": "^6.0.0-rc.0",

Testing on iPhone 8. Same problem on simulator.

Description

When having the pagerView in orientation="vertical", the first page is hard to scroll up. It seems like it ignores the motion speed, and requires the next page to be at least over 50% of the screen.

It works perfectly fine for subsequent pages.

Reproducible Demo

import { PagerView } from 'react-native-pager-view';


  pagerView: {
    flex: 1,
  },

  view11: {
    flex: 1,
    backgroundColor: "pink",
  },
  view12: {
    width: "100%",
    height: "100%",
    backgroundColor: "red",
  },
  view13: {
    width: "100%",
    height: "100%",
    backgroundColor: "purple",
  },
  view14: {
    width: "100%",
    height: "100%",
    backgroundColor: "blue",
  },
  view15: {
    width: "100%",
    height: "100%",
    backgroundColor: "green",
  },
  view16: {
    width: "100%",
    height: "100%",
    backgroundColor: "yellow"
  },
}

export const TestPagerView: React.FC = (props) => {
  return (
    <View style={{ flex: 1 }}>
      <PagerView orientation="vertical" style={styles.pagerView} initialPage={0}>
        <View key="12" style={styles.view12}>
          <Text>12 page</Text>
        </View>
        <View key="13" style={styles.view13}>
          <Text>13 page</Text>
        </View>
        <View key="14" style={styles.view14}>
          <Text>14 page</Text>
        </View>
        <View key="15" style={styles.view15}>
          <Text>15 page</Text>
        </View>
        <View key="16" style={styles.view16}>
          <Text>16 page</Text>
        </View>
       </PagerView>
    </View>
  )
}

Video of the issues here: https://drive.google.com/file/d/11S7RLlpUTIWk6S3wyEuQZYmzgrncq9a-/view?usp=sharing

[troZee]

Could you test stable version ? like eg. https://github.com/callstack/react-native-pager-view/releases/tag/v5.3.1

[Epothos333]

I'm experiencing the same issue with Version 6.0.0-rc.0. It's just the first item that has a really sticky scrolling issue. This was not an issue on the stable release. I've only encountered his after bumping to the rc version for LazyPagerView.

EDIT: Setting the property "overdrag"={true} resolves this issue for me. However, I technically need that to be false for my use case so hopefully this still gets solved.

[troZee]

https://github.com/callstack/react-native-pager-view/issues/673