callstack / react-native-pager-view

React Native wrapper for the Android ViewPager and iOS UIPageViewController.
MIT License
2.72k stars 418 forks source link

[onPageScroll] nativeEvent.position is always 0 #314

Open KingAmo opened 3 years ago

KingAmo commented 3 years ago

Environment

"react-native-pager-view": "^5.1.2"

System:
    OS: macOS 11.2.3
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Memory: 458.95 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 12.19.0 - /usr/local/bin/node
    Yarn: 1.22.5 - ~/.yarn/bin/yarn
    npm: 7.7.5 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  Managers:
    CocoaPods: 1.10.1 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: iOS 14.4, DriverKit 20.2, macOS 11.1, tvOS 14.3, watchOS 7.2
    Android SDK:
      API Levels: 21, 23, 25, 26, 27, 28, 29
      Build Tools: 23.0.1, 26.0.1, 26.0.2, 27.0.3, 28.0.3, 29.0.2
      System Images: android-30 | Google APIs Intel x86 Atom
      Android NDK: Not Found
  IDEs:
    Android Studio: 4.1 AI-201.8743.12.41.7199119
    Xcode: 12.4/12D4e - /usr/bin/xcodebuild
  Languages:
    Java: 1.8.0_212 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: ^17.0.2 => 17.0.2
    react-native: ^0.64.0 => 0.64.0
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Description

the position value of onPageScroll never change when page scroll finished

image image

Reproducible Demo

troZee commented 3 years ago

What platform is affected ? Android or iOS ?

KingAmo commented 3 years ago

What platform is affected ? Android or iOS ?

I only test it on iOS

Deain commented 3 years ago

What platform is affected ? Android or iOS ?

same issue

<PagerView
          style={{flex: 1, backgroundColor: '#000'}}
          overdrag={true}
          orientation={'vertical'}
          {...{onPageScroll, onPageSelected}}
        >
          {
            new Array(10).fill(1).map((item, index) => {
              return (
                <View key={index} style={{flex: 1}}>
                  <VideoItem  index={index}  />
                </View>
              )
            })
          }
        </PagerView>

image