Skip to content

ScrollView with centerContent={true} is not working properly #50839

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
astrahov opened this issue Apr 22, 2025 · 3 comments · May be fixed by #51231
Open

ScrollView with centerContent={true} is not working properly #50839

astrahov opened this issue Apr 22, 2025 · 3 comments · May be fixed by #51231
Labels
Component: ScrollView Issue: Author Provided Repro This issue can be reproduced in Snack or an attached project. Resolution: PR Submitted A pull request with a fix has been provided. Type: New Architecture Issues and PRs related to new architecture (Fabric/Turbo Modules)

Comments

@astrahov
Copy link

Description

  • On ScreenViewScreen1, the contentCenter={true} property
  • On ScreenViewScreen2, the contentCenter={false} property
  • On ScreenViewScreen2, the content remains centered during ternary screen swapping

Testing was performed on 3 versions of React Native:

  • 0.79.1
  • 0.78.2
  • 0.77.2

Detailed problem result in README.md in the repository.

Steps to reproduce

  1. In the repository go to the desired version of React Native
  2. Install dependencies and run the project following the instructions in README.md of the project
  3. Try to change the parameters in src/App.tsx

React Native Version

0.79.1

Affected Platforms

Runtime - iOS

Output of npx @react-native-community/cli info

System:
  OS: macOS 15.4.1
  CPU: (8) arm64 Apple M1 Pro
  Memory: 117.52 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 22.14.0
    path: ~/.nvm/versions/node/v22.14.0/bin/node
  Yarn: Not Found
  npm:
    version: 11.2.0
    path: ~/.nvm/versions/node/v22.14.0/bin/npm
  Watchman:
    version: 2025.04.07.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods: Not Found
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.4
      - iOS 18.4
      - macOS 15.4
      - tvOS 18.4
      - visionOS 2.4
      - watchOS 11.4
  Android SDK: Not Found
IDEs:
  Android Studio: 2024.2 AI-242.23726.103.2422.13103373
  Xcode:
    version: 16.3/16E140
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.14
    path: /usr/bin/javac
  Ruby:
    version: 2.7.8
    path: /Users/alex/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 18.0.0
    wanted: 18.0.0
  react:
    installed: 19.0.0
    wanted: 19.0.0
  react-native:
    installed: 0.79.1
    wanted: 0.79.1
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: true
  newArchEnabled: true

Stacktrace or Logs

-

Reproducer

https://github.com/astrahov/React-Native-ScrollView-contentCenter-bug

Screenshots and Videos

Video.mov
@astrahov
Copy link
Author

The project has a React Navigaton library. It is only for comparison, because the problem is reproduced on clear React Native as well.

In the parameters, you can choose whether to test with or without the library.

@migueldaipre
Copy link
Collaborator

@astrahov Thanks for reporting this issue, does it occur in the old architecture as well?

@migueldaipre migueldaipre added Issue: Author Provided Repro This issue can be reproduced in Snack or an attached project. and removed Needs: Triage 🔍 labels Apr 22, 2025
@astrahov
Copy link
Author

astrahov commented Apr 23, 2025

@astrahov Thanks for reporting this issue, does it occur in the old architecture as well?

@migueldaipre I added more examples for each version with the old architecture.

Result: on the old architecture everything works as expected. There is no error!

It turns out the problem affects only the new architecture.

@migueldaipre migueldaipre added the Type: New Architecture Issues and PRs related to new architecture (Fabric/Turbo Modules) label Apr 23, 2025
@migueldaipre migueldaipre added the Resolution: PR Submitted A pull request with a fix has been provided. label May 12, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Component: ScrollView Issue: Author Provided Repro This issue can be reproduced in Snack or an attached project. Resolution: PR Submitted A pull request with a fix has been provided. Type: New Architecture Issues and PRs related to new architecture (Fabric/Turbo Modules)
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants