You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
When using the contentOffset prop on ScrollView, we've observed that this causes extra scroll events to fire when the component is mounted. Specifically, it sends an event with the contentOffset equal to the value passed to the prop, then sends a second one - if the contentOffset is positive, it's the same value again, and if it's negative, it's 0.
We're trying to use a negative contentOffset.y value in conjunction with a paddingTop style so that the scrollview content can be offset from the top a certain distance.
Expected behaviour: no scroll events are fired until the scrollview is actually scrolled
It appears to be iOS only, but I have only tried android on the emulator so I can't be completely certain
Steps to reproduce
Create a ScrollView that has an onScroll handler that logs contentOffset
Add a contentOffset of { x: 0, y: -100 }
Observe the logs look like this:
-100
0
React Native Version
0.74.5
Affected Platforms
Runtime - iOS
Output of npx react-native info
System:
OS: macOS 15.0
CPU: (8) arm64 Apple M1
Memory: 169.59 MB / 16.00 GB
Shell:
version: 3.7.1
path: /opt/homebrew/bin/fish
Binaries:
Node:
version: 22.5.1
path: /opt/homebrew/bin/node
Yarn:
version: 1.22.22
path: ~/.yarn/bin/yarn
npm:
version: 10.2.5
path: /opt/homebrew/bin/npm
Watchman:
version: 2024.07.29.00
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.15.2
path: /opt/homebrew/bin/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 24.0
- iOS 18.0
- macOS 15.0
- tvOS 18.0
- visionOS 2.0
- watchOS 11.0
Android SDK:
API Levels:
- "33"
- "34"
Build Tools:
- 30.0.3
- 33.0.0
- 33.0.1
- 34.0.0
System Images:
- android-34 | Google APIs ARM 64 v8a
- android-35 | Google Play ARM 64 v8a
Android NDK: Not Found
IDEs:
Android Studio: 2023.1 AI-231.9392.1.2311.11330709
Xcode:
version: 16.0/16A242d
path: /usr/bin/xcodebuild
Languages:
Java:
version: 11.0.24
path: /opt/homebrew/opt/openjdk@11/bin/javac
Ruby:
version: 2.6.10
path: /usr/bin/ruby
npmPackages:
"@react-native-community/cli": Not Found
react:
installed: 18.2.0
wanted: 18.2.0
react-native:
installed: 0.74.5
wanted: 0.74.5
react-native-macos: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: Not found
newArchEnabled: Not found
iOS:
hermesEnabled: Not found
newArchEnabled: Not found
Description
When using the
contentOffset
prop on ScrollView, we've observed that this causes extra scroll events to fire when the component is mounted. Specifically, it sends an event with thecontentOffset
equal to the value passed to the prop, then sends a second one - if the contentOffset is positive, it's the same value again, and if it's negative, it's 0.We're trying to use a negative
contentOffset.y
value in conjunction with a paddingTop style so that the scrollview content can be offset from the top a certain distance.Expected behaviour: no scroll events are fired until the scrollview is actually scrolled
It appears to be iOS only, but I have only tried android on the emulator so I can't be completely certain
Steps to reproduce
onScroll
handler that logscontentOffset
contentOffset
of{ x: 0, y: -100 }
React Native Version
0.74.5
Affected Platforms
Runtime - iOS
Output of
npx react-native info
Stacktrace or Logs
Reproducer
https://snack.expo.dev/@mozzius/contentoffset-causing-incorrect-scroll-events-repro
Screenshots and Videos
The text was updated successfully, but these errors were encountered: