Zooming in ScrollView causes incorrect offset of content

[Bram-dc]

Description

When using the zoom and pinchGestureEnabled on a ScrollView, the content shifts to the side after re-rendering the component when zoomed in.

Steps to reproduce

1. Toggle the ScrollView on
2. Zoom in
3. Toggle the ScrollView off
4. Toggle the ScrollView on

React Native Version

0.76.6

Affected Platforms

Runtime - iOS

Output of npx react-native info

System:
  OS: Windows 11 10.0.22631
  CPU: (12) x64 Intel(R) Core(TM) i7-10750H CPU @ 2.60GHz
  Memory: 3.26 GB / 15.78 GB
Binaries:
  Node:
    version: 22.8.0
    path: C:\Program Files\nodejs\node.EXE
  Yarn:
    version: 1.22.22
    path: C:\Program Files\nodejs\yarn.CMD
  npm:
    version: 10.8.2
    path: C:\Program Files\nodejs\npm.CMD
  Watchman: Not Found
SDKs:
  Android SDK: Not Found
  Windows SDK: Not Found
IDEs:
  Android Studio: Version     2021.1.0.0 AI-211.7628.21.2111.8193401
  Visual Studio:
    - 17.3.32804.467 (Visual Studio Community 2022)
Languages:
  Java:
    version: 17.0.8
    path: /c/Program Files/Common Files/Oracle/Java/javapath/javac
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli":
    installed: 15.1.3
    wanted: ^15.1.3
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.76.6
    wanted: 0.76.6
  react-native-windows: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: Not found
  newArchEnabled: Not found
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

Stacktrace or Logs

Visual bug

Reproducer

https://snack.expo.dev/@bram-dc/scrollview-zoom-offset

Screenshots and Videos

ScreenRecording_01-17-2025.23-20-45_1.MP4

[react-native-bot]

Warning

Could not parse version: We could not find or parse the version number of React Native in your issue report. Please use the template, and report your version including major, minor, and patch numbers - e.g. 0.76.2.

[react-native-bot]

Warning

Could not parse version: We could not find or parse the version number of React Native in your issue report. Please use the template, and report your version including major, minor, and patch numbers - e.g. 0.76.2.

[devanshsaini11]

I also tried reproducing this issue on latest version v0.76.6 it is happening on ios, looks like a valid issue

[Bram-dc]

For a hotfix, something like this worked for me:

const handleClose = useCallback(() => {
	scrollViewRef.current?.scrollResponderZoomTo({
		x: 0,
		y: 0,
		width: screen.width,
		height: screen.height,
		animated: false,
	})

	onClose()
}, [onClose, screen.height, screen.width])